/* frontend/estilos/componentes.css */
.tarjeta {
  background: var(--superficie);
  border: 1px solid var(--borde-tarjeta);
  border-radius: var(--radio-tarjeta);
  box-shadow: var(--sombra-tarjeta);
  padding: 16px 18px;
  margin-bottom: 14px;
}
.tabla {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  margin-top: 12px;
}
.tabla th {
  text-align: left;
  font-size: 11px;
  font-weight: 600;
  color: var(--texto-3);
  padding: 6px 8px;
  border-bottom: 1px solid var(--borde);
}
.tabla td {
  padding: 9px 8px;
  border-bottom: 1px solid #eee;
}
.tabla tr:last-child td {
  border-bottom: 0;
}
.btn {
  font-size: 12px;
  color: #555;
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  padding: 6px 10px;
  background: var(--superficie);
  cursor: pointer;
}
.btn:hover {
  background: var(--superficie-2);
}
.btn--chico {
  padding: 4px 8px;
  font-size: 11px;
}
.btn--primario {
  background: var(--negro);
  color: #fff;
  border-color: var(--negro);
  font-weight: 500;
}
.bchip {
  color: #ccc;
  font-size: 11px;
  border: 1px solid #444;
  border-radius: 6px;
  padding: 3px 9px;
  cursor: pointer;
}
.bchip--on {
  color: var(--negro);
  background: #fff;
  border-color: #fff;
  font-weight: 600;
}
.pastilla {
  border-radius: 6px;
  padding: 3px 8px;
  font-weight: 600;
  font-size: 12px;
}
.pastilla--ok {
  background: var(--ok-fondo);
  color: var(--ok-texto);
}
.pastilla--bajo {
  background: var(--avi-fondo);
  color: var(--avi-texto);
}
.pastilla--sin {
  background: var(--mal-fondo);
  color: var(--mal-texto);
}
.etiqueta {
  background: var(--superficie-2);
  color: var(--texto-2);
  border-radius: 5px;
  padding: 1px 7px;
  font-size: 11px;
}
.lista-modulos {
  list-style: none;
  margin-top: 12px;
  font-size: 13px;
}
.lista-modulos li {
  padding: 5px 0;
  border-bottom: 1px solid var(--borde);
}
.sesion {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}
.sesion__caja {
  background: var(--superficie);
  border: 1px solid var(--borde-tarjeta);
  border-radius: var(--radio-tarjeta);
  box-shadow: var(--sombra-tarjeta);
  padding: 26px 26px 22px;
  width: 100%;
  max-width: 330px;
  display: grid;
  gap: 14px;
}
.sesion__marca {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 4px;
}
.sesion__nombre {
  font-size: 15px;
  font-weight: 600;
  line-height: 1.2;
}
.sesion__campo {
  display: grid;
  gap: 5px;
}
.sesion__campo span {
  font-size: 12px;
  color: var(--texto-2);
  font-weight: 500;
}
.sesion__campo input {
  font-size: 15px;
  padding: 9px 11px;
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  background: var(--superficie);
  font-family: inherit;
}
.sesion__campo input:focus {
  outline: 2px solid var(--negro);
  outline-offset: -1px;
  border-color: var(--negro);
}
.sesion__boton {
  padding: 10px;
  font-size: 14px;
}
.sesion__boton:disabled {
  opacity: .6;
  cursor: default;
}
.sesion__error {
  background: var(--mal-fondo);
  color: var(--mal-texto);
  border-radius: var(--radio);
  padding: 8px 11px;
  font-size: 13px;
}
.avisos {
  position: fixed;
  right: 16px;
  bottom: 16px;
  display: grid;
  gap: 8px;
}
.aviso {
  background: var(--negro);
  color: #fff;
  padding: 10px 14px;
  border-radius: var(--radio);
  font-size: 13px;
}
.aviso--error {
  background: var(--mal-texto);
}
.aviso--ok {
  background: var(--ok-texto);
}
.m-productos .prod-form {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 26px;
}
.m-productos .prod-form__col {
  display: grid;
  gap: 14px;
  align-content: start;
}
.m-productos .campo {
  display: grid;
  gap: 5px;
}
.m-productos .campo__lbl {
  font-size: 12px;
  color: var(--texto-2);
  font-weight: 500;
}
.m-productos .campo__in {
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  padding: 9px 11px;
  font-size: 14px;
  font-family: inherit;
  background: var(--superficie);
  width: 100%;
}
.m-productos .campo__in:focus {
  outline: 2px solid var(--enlace);
  outline-offset: -1px;
}
.m-productos .fila-selects {
  display: flex;
  gap: 10px;
}
.m-productos .fila-selects > * {
  flex: 1;
}
.m-productos .prod-form__enlace {
  font-size: 12px;
}
.m-productos .prod-cats {
  background: var(--superficie-3);
  border: 1px solid var(--borde);
  border-radius: var(--radio);
  padding: 11px 13px;
  font-size: 13px;
}
.m-productos .prod-cats__cab {
  display: flex;
  justify-content: space-between;
  margin-bottom: 6px;
  font-weight: 600;
}
.m-productos .prod-fotos {
  display: flex;
  gap: 10px;
}
.m-productos .prod-foto {
  width: 92px;
  height: 92px;
  border-radius: var(--radio);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  color: var(--texto-3);
}
.m-productos .prod-foto--vacia {
  background: var(--superficie-2);
  align-items: flex-end;
  padding-bottom: 6px;
}
.m-productos .prod-foto--mas {
  border: 1px dashed var(--borde-fuerte);
  font-size: 20px;
  color: var(--texto-3);
}
.m-productos .prod-swatches,
.m-productos .prod-tallas {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}
.m-productos .swatch {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  cursor: pointer;
  background: var(--sw);
  border: 2px solid transparent;
  box-shadow: 0 0 0 1px var(--borde-fuerte);
}
.m-productos .swatch--on {
  border-color: var(--superficie);
  box-shadow: 0 0 0 2px var(--negro);
}
.m-productos .chip-talla {
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  padding: 6px 14px;
  font-size: 13px;
  cursor: pointer;
  background: var(--superficie);
  font-family: inherit;
}
.m-productos .chip-talla--on {
  background: var(--negro);
  color: #fff;
  border-color: var(--negro);
}
.m-productos .prod-var__cab {
  display: flex;
  align-items: baseline;
  gap: 8px;
}
.m-productos .punto,
.m-productos .swatch {
  display: inline-block;
  vertical-align: middle;
}
.m-productos .punto {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--sw);
  margin-right: 6px;
}
@media (max-width: 760px) {
  .m-productos .prod-form {
    grid-template-columns: 1fr;
  }
}
.m-historial .hi-kpis {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
  margin-bottom: 14px;
}
.m-historial .hi-kpi {
  background: var(--superficie);
  border: 1px solid var(--borde-tarjeta);
  border-radius: var(--radio-tarjeta);
  padding: 13px 15px;
  box-shadow: var(--sombra-tarjeta);
  display: grid;
  gap: 2px;
}
.m-historial .hi-kpi__t {
  font-size: 11px;
  color: var(--texto-2);
}
.m-historial .hi-kpi__v {
  font-size: 22px;
  font-weight: 700;
}
.m-historial .hi-kpi__d {
  font-size: 11px;
  color: var(--texto-3);
}
.m-historial .hi-kpi--mal .hi-kpi__v {
  color: var(--mal-texto);
}
.m-historial .hi-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.m-historial .hi-tab {
  border: 1px solid var(--borde-fuerte);
  border-radius: 999px;
  padding: 6px 14px;
  font-size: 12px;
  background: var(--superficie);
  cursor: pointer;
  font-family: inherit;
}
.m-historial .hi-tab.on {
  background: var(--negro);
  color: #fff;
  border-color: var(--negro);
  font-weight: 600;
}
.m-historial .hi-filtros {
  display: grid;
  grid-template-columns: repeat(4, 1fr) 1.4fr;
  gap: 10px;
  margin-bottom: 6px;
}
.m-historial .hi-filtros .campo__in {
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  padding: 8px 11px;
  font-size: 13px;
  background: var(--superficie);
  font-family: inherit;
  width: 100%;
}
.m-historial .hi-badges {
  display: flex;
  gap: 6px;
  margin-top: 3px;
  flex-wrap: wrap;
}
.m-historial .hi-badge {
  font-size: 10.5px;
  padding: 1px 7px;
  border-radius: 5px;
  background: var(--superficie-2);
  color: var(--texto-2);
}
.m-historial .hi-badge--boleta {
  background: #e7effb;
  color: #1c5cab;
}
.m-historial .hi-badge--factura {
  background: #ece7fb;
  color: #5a3aa8;
}
.m-historial .hi-badge--cambio {
  background: var(--avi-fondo);
  color: var(--avi-texto);
}
.m-historial .hi-badge--anul {
  background: var(--mal-fondo);
  color: var(--mal-texto);
}
.m-historial .hi-fila--anul td {
  color: var(--texto-3);
}
.m-historial .hi-mas {
  border: 1px solid var(--borde-fuerte);
  background: var(--superficie);
  border-radius: var(--radio);
  padding: 2px 9px;
  cursor: pointer;
  letter-spacing: 1px;
}
.m-historial .hi-pie {
  margin-top: 10px;
  font-size: 12px;
}
.hi-menu {
  position: absolute;
  z-index: 40;
  background: #fff;
  border: 1px solid var(--borde-fuerte);
  border-radius: 12px;
  box-shadow: 0 12px 34px rgba(0, 0, 0, .16);
  padding: 6px;
  min-width: 220px;
  display: grid;
  gap: 1px;
}
.hi-op {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  text-align: left;
  border: none;
  background: none;
  padding: 9px 11px;
  border-radius: 8px;
  font-size: 13px;
  cursor: pointer;
  font-family: inherit;
  color: var(--texto);
}
.hi-op:hover {
  background: var(--superficie-2);
}
.hi-op--peligro {
  color: var(--mal-texto);
}
.hi-op__admin {
  font-size: 10px;
  color: var(--texto-3);
}
@media (max-width: 900px) {
  .m-historial .hi-kpis {
    grid-template-columns: repeat(2, 1fr);
  }
  .m-historial .hi-filtros {
    grid-template-columns: 1fr 1fr;
  }
}
.m-etiquetas .et-form {
  display: grid;
  grid-template-columns: 1.15fr 1fr;
  gap: 26px;
}
.m-etiquetas .et-col {
  display: grid;
  gap: 12px;
  align-content: start;
}
.m-etiquetas .campo__lbl {
  font-size: 12px;
  color: var(--texto-2);
  font-weight: 500;
}
.m-etiquetas .et-formatos {
  display: flex;
  gap: 8px;
}
.m-etiquetas .et-fmt {
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  padding: 8px 14px;
  font-size: 13px;
  background: var(--superficie);
  cursor: pointer;
  font-family: inherit;
}
.m-etiquetas .et-fmt.on {
  background: var(--negro);
  color: #fff;
  border-color: var(--negro);
  font-weight: 600;
}
.m-etiquetas .et-checks {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 14px;
}
.m-etiquetas .et-check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  cursor: pointer;
  color: var(--texto-3);
}
.m-etiquetas .et-check.on {
  color: var(--texto);
}
.m-etiquetas .et-cant {
  width: 60px;
  text-align: center;
  padding: 5px;
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  font-family: inherit;
}
.m-etiquetas .et-total {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-top: 8px;
}
.m-etiquetas .et-total strong {
  font-size: 20px;
}
.m-etiquetas .et-previa {
  display: flex;
  justify-content: center;
  padding: 14px;
  background: var(--superficie-3);
  border-radius: var(--radio);
}
.m-etiquetas .et-label {
  background: #fff;
  border: 1px solid var(--borde);
  border-radius: 6px;
  padding: 10px 12px;
  color: #111;
  font-size: 11px;
}
.m-etiquetas .et-label--adhesiva {
  width: 250px;
}
.m-etiquetas .et-label--colgante {
  width: 150px;
  text-align: center;
  display: grid;
  gap: 5px;
  justify-items: center;
}
.m-etiquetas .et-marca {
  font-size: 9px;
  letter-spacing: .18em;
  color: #444;
  font-weight: 700;
}
.m-etiquetas .et-prod {
  font-weight: 700;
  font-size: 13px;
  margin-top: 2px;
}
.m-etiquetas .et-col2 {
  color: #555;
  font-size: 11px;
}
.m-etiquetas .et-ct {
  font-size: 12px;
}
.m-etiquetas .et-codigos {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: 6px;
}
.m-etiquetas .et-codigos__izq {
  flex: 1;
}
.m-etiquetas .et-bar {
  width: 100%;
  height: 34px;
  display: block;
}
.m-etiquetas .et-label--colgante .et-bar {
  width: 110px;
  height: 30px;
}
.m-etiquetas .et-bar rect {
  fill: #111;
}
.m-etiquetas .et-qr {
  width: 54px;
  height: 54px;
  flex: none;
}
.m-etiquetas .et-qr rect {
  fill: #111;
}
.m-etiquetas .et-sku {
  font-family: ui-monospace, monospace;
  font-size: 10px;
  margin-top: 2px;
  letter-spacing: .02em;
}
.m-etiquetas .et-pie {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 6px;
}
.m-etiquetas .et-precio {
  font-weight: 800;
  font-size: 15px;
}
.m-etiquetas .et-hole {
  width: 14px;
  height: 14px;
  border: 2px solid #bbb;
  border-radius: 50%;
  margin-top: 2px;
}
.m-etiquetas .et-nota {
  margin-top: 14px;
}
@media (max-width: 780px) {
  .m-etiquetas .et-form {
    grid-template-columns: 1fr;
  }
}
.m-ingresos .ing-top {
  display: grid;
  grid-template-columns: 1.3fr 1fr;
  gap: 20px;
  margin-bottom: 16px;
}
.m-ingresos .ing-destinos {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.m-ingresos .ing-dest {
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  padding: 8px 14px;
  font-size: 13px;
  background: var(--superficie);
  cursor: pointer;
  font-family: inherit;
}
.m-ingresos .ing-dest.on {
  background: var(--negro);
  color: #fff;
  border-color: var(--negro);
  font-weight: 600;
}
.m-ingresos .ing-ref {
  display: grid;
  gap: 5px;
}
.m-ingresos .campo__lbl {
  font-size: 12px;
  color: var(--texto-2);
  font-weight: 500;
}
.m-ingresos .campo__in {
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  padding: 10px 12px;
  font-size: 14px;
  background: var(--superficie);
  font-family: inherit;
  width: 100%;
}
.m-ingresos .ing-buscar {
  position: relative;
  margin-bottom: 6px;
}
.m-ingresos .ing-buscar__ico {
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--texto-3);
  letter-spacing: 2px;
}
.m-ingresos .ing-cant {
  width: 62px;
  text-align: center;
  padding: 6px;
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  font-family: inherit;
}
.m-ingresos .ing-stock {
  font-size: 12px;
  color: var(--texto-2);
}
.m-ingresos .inv-punto {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--sw);
  margin-right: 7px;
  vertical-align: middle;
  box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--borde);
}
.m-ingresos .ing-quitar {
  border: none;
  background: none;
  color: var(--texto-3);
  cursor: pointer;
  font-size: 14px;
}
.m-ingresos .ing-quitar:hover {
  color: var(--mal-texto);
}
.m-ingresos .ing-sugerencias {
  margin-top: 12px;
}
.m-ingresos .ing-sug {
  margin-right: 12px;
  font-size: 12px;
}
.m-ingresos .ing-resumen {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}
.m-ingresos .ing-tot {
  display: flex;
  gap: 30px;
}
.m-ingresos .ing-tot > div {
  display: grid;
  gap: 2px;
}
.m-ingresos .ing-tot strong {
  font-size: 20px;
}
.m-ingresos .ing-registrar {
  padding: 12px 26px;
  font-size: 14px;
  border-radius: var(--radio);
}
.m-ingresos .ing-nota {
  margin-top: 10px;
}
@media (max-width: 760px) {
  .m-ingresos .ing-top {
    grid-template-columns: 1fr;
  }
  .m-ingresos .ing-resumen {
    flex-direction: column;
    align-items: stretch;
  }
}
.m-ubicaciones .campo {
  display: grid;
  gap: 5px;
}
.m-ubicaciones .campo__lbl {
  font-size: 12px;
  color: var(--texto-2);
  font-weight: 500;
}
.m-ubicaciones .campo__in {
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  padding: 9px 11px;
  font-size: 14px;
  font-family: inherit;
  background: var(--superficie);
  width: 100%;
}
.m-ubicaciones .campo__in:disabled {
  background: var(--superficie-2);
  color: var(--texto-3);
}
.m-ubicaciones .ubi-form__campos {
  display: grid;
  grid-template-columns: 1fr 200px;
  gap: 12px;
  margin: 12px 0 16px;
}
.m-ubicaciones .ubi-form__ancho {
  grid-column: 1 / -1;
}
.m-ubicaciones .ubi-form__pie {
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}
.m-ubicaciones .ubi-check {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--texto-2);
  cursor: pointer;
  white-space: nowrap;
}
.m-ubicaciones .ubi-cab {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.m-ubicaciones .ubi-acciones {
  display: flex;
  gap: 6px;
  justify-content: flex-end;
}
.m-ubicaciones .ubi-fila--off td {
  color: var(--texto-3);
}
@media (max-width: 700px) {
  .m-ubicaciones .ubi-form__campos {
    grid-template-columns: 1fr;
  }
  .m-ubicaciones .ubi-cab {
    flex-direction: column;
    align-items: flex-start;
  }
}
.m-pos .pos-grid {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: 16px;
  align-items: start;
}
.m-pos .pos-col {
  display: grid;
  gap: 14px;
}
.m-pos .campo {
  display: grid;
  gap: 5px;
}
.m-pos .campo__lbl {
  font-size: 12px;
  color: var(--texto-2);
  font-weight: 500;
}
.m-pos .campo__in {
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  padding: 9px 11px;
  font-size: 14px;
  font-family: inherit;
  background: var(--superficie);
  width: 100%;
}
.m-pos .pos-buscar {
  font-size: 16px;
  padding: 12px 14px;
}
.m-pos .pos-buscar:focus {
  outline: 2px solid var(--negro);
  outline-offset: -1px;
}
.m-pos .pos-resultados {
  display: grid;
  gap: 4px;
  margin-top: 10px;
}
.m-pos .pos-res {
  display: grid;
  grid-template-columns: 14px 1fr auto auto auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  text-align: left;
  border: 1px solid var(--borde);
  border-radius: var(--radio);
  padding: 8px 11px;
  background: var(--superficie);
  cursor: pointer;
  font-family: inherit;
  font-size: 13px;
  color: var(--texto);
}
.m-pos .pos-res:hover {
  background: var(--superficie-2);
}
.m-pos .pos-res--sin {
  opacity: .5;
  cursor: not-allowed;
}
.m-pos .pos-res__pt {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--sw);
}
.m-pos .pos-res__sku {
  font-size: 11px;
  color: var(--texto-2);
}
.m-pos .pos-res__stock {
  font-size: 11px;
  color: var(--texto-3);
}
.m-pos .pos-res__p {
  font-weight: 600;
}
.m-pos .pos-cant {
  width: 58px;
  text-align: center;
  padding: 5px;
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  font-family: inherit;
}
.m-pos .pos-quitar {
  border: none;
  background: none;
  color: var(--texto-3);
  cursor: pointer;
  font-size: 17px;
  line-height: 1;
  padding: 0 4px;
}
.m-pos .pos-quitar:hover {
  color: var(--mal-texto);
}
.m-pos .pos-cliente__cab {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.m-pos .pos-cliente {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}
.m-pos .fila-selects {
  display: flex;
  gap: 8px;
}
.m-pos .fila-selects > *:first-child {
  flex: 0 0 96px;
}
.m-pos .fila-selects > *:last-child {
  flex: 1;
}
.m-pos .pos-medios {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 8px;
}
.m-pos .pos-medio {
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  padding: 7px 13px;
  font-size: 13px;
  background: var(--superficie);
  cursor: pointer;
  font-family: inherit;
}
.m-pos .pos-medio:hover {
  background: var(--superficie-2);
}
.m-pos .pos-pagos {
  display: grid;
  gap: 8px;
  margin-top: 10px;
}
.m-pos .pos-pago {
  display: grid;
  grid-template-columns: 1fr 92px auto;
  gap: 8px;
  align-items: center;
}
.m-pos .pos-pago:has(.pos-pago__r) {
  grid-template-columns: 1fr 92px 1fr auto;
}
.m-pos .pos-pago__n {
  font-size: 13px;
}
.m-pos .pos-pago__m {
  text-align: right;
}
.m-pos .pos-totales {
  display: grid;
  gap: 7px;
}
.m-pos .pos-tot {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  color: var(--texto-2);
}
.m-pos .pos-tot--grande {
  font-size: 15px;
  color: var(--texto);
  padding-top: 7px;
  border-top: 1px solid var(--borde);
}
.m-pos .pos-tot--grande strong {
  font-size: 26px;
  letter-spacing: -.5px;
}
.m-pos .pos-tot--vuelto strong {
  color: var(--ok-texto);
  font-size: 18px;
}
.m-pos .pos-tot--falta strong {
  color: var(--mal-texto);
  font-size: 18px;
}
@media (max-width: 980px) {
  .m-pos .pos-grid {
    grid-template-columns: 1fr;
  }
}
.m-comprobantes .comp-aviso {
  border-left: 3px solid var(--avi-texto);
}
.m-comprobantes .comp-falta {
  margin: 8px 0 8px 18px;
  font-size: 13px;
}
.m-comprobantes .comp-falta li {
  margin-bottom: 4px;
}
.m-usuarios .us-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 14px;
}
.m-usuarios .us-tab {
  border: 1px solid var(--borde-fuerte);
  border-radius: 999px;
  padding: 6px 14px;
  font-size: 12px;
  background: var(--superficie);
  cursor: pointer;
  font-family: inherit;
}
.m-usuarios .us-tab.on {
  background: var(--negro);
  color: #fff;
  border-color: var(--negro);
  font-weight: 600;
}
.m-usuarios .us-fila--off {
  opacity: .5;
}
.m-usuarios .us-form__campos,
.m-empresa .emp-campos {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  margin-top: 12px;
}
.m-empresa .emp-campo--ancho {
  grid-column: 1 / -1;
}
.m-usuarios .campo,
.m-empresa .campo {
  display: grid;
  gap: 5px;
}
.m-usuarios .campo__lbl,
.m-empresa .campo__lbl {
  font-size: 12px;
  color: var(--texto-2);
  font-weight: 500;
}
.m-usuarios .campo__in,
.m-empresa .campo__in {
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  padding: 9px 11px;
  font-size: 14px;
  font-family: inherit;
  background: var(--superficie);
  width: 100%;
}
.m-usuarios .us-form__pie {
  display: flex;
  gap: 8px;
  margin-top: 14px;
}
.m-empresa .emp-aviso {
  margin-top: 12px;
}
.m-catalogos .cat-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.m-catalogos .cat-tab {
  border: 1px solid var(--borde-fuerte);
  border-radius: 999px;
  padding: 6px 14px;
  font-size: 12px;
  background: var(--superficie);
  cursor: pointer;
  font-family: inherit;
}
.m-catalogos .cat-tab.on {
  background: var(--negro);
  color: #fff;
  border-color: var(--negro);
  font-weight: 600;
}
.m-catalogos .cat-muestra {
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: var(--sw);
  margin-right: 8px;
  vertical-align: middle;
  box-shadow: 0 0 0 1px var(--borde-fuerte);
}
.m-catalogos .cat-form__campos {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
  margin-top: 10px;
}
.m-catalogos .campo {
  display: grid;
  gap: 5px;
}
.m-catalogos .campo__lbl {
  font-size: 12px;
  color: var(--texto-2);
  font-weight: 500;
}
.m-catalogos .campo__in {
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  padding: 9px 11px;
  font-size: 14px;
  font-family: inherit;
  background: var(--superficie);
  width: 100%;
}
.m-catalogos .cat-form__pie {
  display: flex;
  gap: 8px;
  margin-top: 14px;
}
.m-caja .caja-grid {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 16px;
  align-items: start;
}
.m-caja .caja-col {
  display: grid;
  gap: 14px;
}
.m-caja .campo {
  display: grid;
  gap: 5px;
  margin-top: 10px;
}
.m-caja .campo__lbl {
  font-size: 12px;
  color: var(--texto-2);
  font-weight: 500;
}
.m-caja .campo__in {
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  padding: 9px 11px;
  font-size: 14px;
  font-family: inherit;
  background: var(--superficie);
  width: 100%;
}
.m-caja .caja-fila {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding: 7px 0;
  font-size: 13px;
  border-bottom: 1px solid #f0f0ee;
}
.m-caja .caja-fila:last-of-type {
  border-bottom: 0;
}
.m-caja .caja-fila--total {
  border-top: 1px solid var(--borde);
  border-bottom: 0;
  margin-top: 6px;
  padding-top: 11px;
  font-size: 15px;
}
.m-caja .caja-fila--total strong {
  font-size: 24px;
  letter-spacing: -.5px;
}
.m-caja .caja-fila--ojo strong {
  color: var(--mal-texto);
}
.m-caja .caja-mov {
  display: grid;
  grid-template-columns: 88px 1fr auto;
  gap: 10px;
  align-items: baseline;
  padding: 6px 0;
  font-size: 13px;
  border-bottom: 1px solid #f0f0ee;
}
.m-caja .caja-mov__t {
  font-weight: 600;
  color: var(--ok-texto);
}
.m-caja .caja-mov__t--out {
  color: var(--mal-texto);
}
.m-caja .caja-nuevo-mov {
  display: grid;
  grid-template-columns: 130px 100px 1fr auto;
  gap: 8px;
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--borde);
}
.m-caja .caja-nuevo-mov .campo__in {
  margin: 0;
}
.m-caja .caja-abrir {
  max-width: 340px;
  margin-top: 12px;
  display: grid;
  gap: 4px;
}
.m-caja .btn--primario {
  margin-top: 12px;
  padding: 10px;
}
@media (max-width: 900px) {
  .m-caja .caja-grid {
    grid-template-columns: 1fr;
  }
  .m-caja .caja-nuevo-mov {
    grid-template-columns: 1fr 1fr;
  }
}
.et-hoja {
  display: none;
}
@media print {
  .barra,
  .avisos,
  .et-form,
  .contenido > *:not(.m-etiquetas) {
    display: none !important;
  }
  .m-etiquetas > *:not(.et-hoja) {
    display: none !important;
  }
  body {
    background: #fff;
  }
  .contenido {
    padding: 0;
    max-width: none;
  }
  .et-hoja {
    display: flex;
    flex-wrap: wrap;
    gap: 4mm;
    align-content: flex-start;
  }
  .et-hoja .et-label {
    box-sizing: border-box;
    border: none;
    border-radius: 0;
    page-break-inside: avoid;
    break-inside: avoid;
  }
  .et-hoja .et-label--adhesiva {
    width: 50mm;
    height: 30mm;
    padding: 2mm 3mm;
  }
  .et-hoja .et-label--colgante {
    width: 40mm;
    height: 70mm;
    padding: 3mm 2mm;
  }
  @page {
    size: A4;
    margin: 8mm;
  }
}
.m-inventario .barra__sel {
  padding: 5px 10px;
  font-size: 12px;
  border-radius: var(--radio);
  border: 1px solid var(--borde-fuerte);
  background: var(--superficie);
}
.m-inventario .inv-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 14px;
}
.m-inventario .inv-kpi {
  background: var(--superficie);
  border: 1px solid var(--borde-tarjeta);
  border-radius: var(--radio-tarjeta);
  padding: 14px 16px;
  box-shadow: var(--sombra-tarjeta);
  display: grid;
  gap: 3px;
}
.m-inventario .inv-kpi__t {
  font-size: 12px;
  color: var(--texto-2);
}
.m-inventario .inv-kpi__v {
  font-size: 24px;
  font-weight: 700;
}
.m-inventario .inv-kpi__p {
  font-size: 11px;
  color: var(--texto-3);
}
.m-inventario .inv-kpi--alerta .inv-kpi__v {
  color: var(--mal-texto);
}
.m-inventario .inv-alerta {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  background: var(--avi-fondo);
  color: var(--avi-texto);
  border-radius: var(--radio);
  padding: 10px 14px;
  margin-bottom: 14px;
  font-size: 13px;
}
.m-inventario .inv-alerta__cta {
  color: var(--avi-texto);
  font-weight: 700;
  white-space: nowrap;
}
.m-inventario .inv-filtros {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr 1fr;
  gap: 10px;
  margin-bottom: 4px;
}
.m-inventario .inv-filtros .campo__in {
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  padding: 8px 11px;
  font-size: 13px;
  background: var(--superficie);
  font-family: inherit;
}
.m-inventario .inv-punto {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--sw);
  margin-right: 7px;
  vertical-align: middle;
  box-shadow: 0 0 0 2px #fff, 0 0 0 3px var(--borde);
}
.m-inventario .inv-alc {
  font-size: 12px;
  font-weight: 500;
}
.m-inventario .inv-alc--ok {
  color: var(--texto-2);
}
.m-inventario .inv-alc--bajo {
  color: var(--avi-texto);
  font-weight: 700;
}
.m-inventario .inv-alc--sin {
  color: var(--mal-texto);
  font-weight: 700;
}
.m-inventario .inv-alc--quieto {
  color: var(--texto-3);
}
.m-inventario .inv-chevron {
  color: var(--texto-3);
  font-size: 18px;
  cursor: pointer;
}
.m-inventario .inv-pie {
  margin-top: 10px;
  font-size: 12px;
}
@media (max-width: 820px) {
  .m-inventario .inv-kpis {
    grid-template-columns: repeat(2, 1fr);
  }
  .m-inventario .inv-filtros {
    grid-template-columns: 1fr 1fr;
  }
}
.m-reportes .barra__sel {
  padding: 5px 10px;
  font-size: 12px;
  border-radius: var(--radio);
  border: 1px solid var(--borde-fuerte);
  background: var(--superficie);
}
.m-reportes .rep-kpis {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-bottom: 14px;
}
.m-reportes .rep-kpi {
  background: var(--superficie);
  border: 1px solid var(--borde-tarjeta);
  border-radius: var(--radio-tarjeta);
  padding: 14px 16px;
  box-shadow: var(--sombra-tarjeta);
  display: grid;
  gap: 3px;
  align-content: start;
}
.m-reportes .rep-kpi__t {
  font-size: 12px;
  color: var(--texto-2);
}
.m-reportes .rep-kpi__v {
  font-size: 24px;
  font-weight: 700;
}
.m-reportes .rep-kpi__d {
  font-size: 11px;
}
.m-reportes .rep-sube {
  color: var(--sube);
}
.m-reportes .rep-baja {
  color: var(--baja);
}
.m-reportes .rep-kpi--meta {
  grid-auto-flow: column;
  justify-content: space-between;
  align-items: center;
}
.m-reportes .rep-anillo {
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: conic-gradient(var(--negro) calc(var(--pct) * 1%), var(--superficie-2) 0);
  display: grid;
  place-items: center;
  flex: none;
}
.m-reportes .rep-anillo span {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: var(--superficie);
  display: grid;
  place-items: center;
  font-size: 12px;
  font-weight: 700;
}
.m-reportes .rep-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 14px;
  margin-bottom: 14px;
}
.m-reportes .tarjeta {
  margin-bottom: 0;
}
.m-reportes .rep-cab {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin-bottom: 14px;
}
.m-reportes .rep-barras {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  height: 200px;
  padding-top: 8px;
}
.m-reportes .rep-col {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  justify-content: flex-end;
}
.m-reportes .rep-col__barra {
  width: 70%;
  max-width: 46px;
  border-radius: 6px 6px 0 0;
  overflow: hidden;
  display: flex;
  flex-direction: column-reverse;
  min-height: 3px;
}
.m-reportes .rep-seg {
  width: 100%;
  display: block;
}
.m-reportes .rep-col__lbl {
  font-size: 11px;
  color: var(--texto-3);
  margin-top: 6px;
}
.m-reportes .rep-col__lbl--hoy {
  color: var(--texto);
  font-weight: 700;
}
.m-reportes .rep-donut-wrap {
  display: flex;
  align-items: center;
  gap: 18px;
}
.m-reportes .rep-donut {
  width: 130px;
  height: 130px;
  border-radius: 50%;
  flex: none;
  display: grid;
  place-items: center;
}
.m-reportes .rep-donut__centro {
  width: 82px;
  height: 82px;
  border-radius: 50%;
  background: var(--superficie);
  display: grid;
  place-items: center;
  text-align: center;
  line-height: 1.1;
}
.m-reportes .rep-donut__centro strong {
  font-size: 17px;
}
.m-reportes .rep-donut__centro span {
  font-size: 10px;
  color: var(--texto-3);
}
.m-reportes .rep-leyenda {
  display: grid;
  gap: 8px;
  flex: 1;
}
.m-reportes .rep-leg {
  display: grid;
  grid-template-columns: 14px 1fr auto auto;
  gap: 8px;
  align-items: center;
  font-size: 12px;
}
.m-reportes .rep-leg__pt {
  width: 11px;
  height: 11px;
  border-radius: 3px;
}
.m-reportes .rep-leg__m {
  font-weight: 700;
}
.m-reportes .rep-alerta {
  margin-top: 16px;
  margin-bottom: 0;
}
.m-reportes .rep-top-fila {
  display: grid;
  grid-template-columns: 18px 1.4fr 1fr 30px;
  gap: 10px;
  align-items: center;
  padding: 9px 0;
  border-bottom: 1px solid var(--borde);
}
.m-reportes .rep-top-fila:last-child {
  border-bottom: 0;
}
.m-reportes .rep-top__n {
  color: var(--texto-3);
  font-size: 12px;
}
.m-reportes .rep-top__nom {
  font-size: 13px;
}
.m-reportes .rep-top__barra {
  display: flex;
  height: 10px;
  border-radius: 5px;
  overflow: hidden;
}
.m-reportes .rep-top__barra span {
  display: block;
  height: 100%;
}
.m-reportes .rep-top__t {
  text-align: right;
  font-size: 13px;
}
.m-reportes .rep-vend-fila {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 10px;
  border-radius: 12px;
}
.m-reportes .rep-vend-fila--top {
  background: var(--superficie-2);
}
.m-reportes .rep-vend__av {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--negro);
  color: #fff;
  display: grid;
  place-items: center;
  font-weight: 700;
  font-size: 13px;
  flex: none;
}
.m-reportes .rep-vend__info {
  flex: 1;
  line-height: 1.25;
}
.m-reportes .rep-vend__info small {
  display: block;
}
.m-reportes .rep-vend__m {
  font-size: 15px;
}
@media (max-width: 820px) {
  .m-reportes .rep-kpis {
    grid-template-columns: repeat(2, 1fr);
  }
  .m-reportes .rep-grid {
    grid-template-columns: 1fr;
  }
}
.m-devoluciones .dev-buscar {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: end;
}
.m-devoluciones .campo__lbl {
  font-size: 12px;
  color: var(--texto-2);
  font-weight: 500;
}
.m-devoluciones .campo {
  display: grid;
  gap: 5px;
}
.m-devoluciones .campo__in {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  font-family: inherit;
  font-size: 13px;
}
.m-devoluciones .dev-ayuda {
  margin: 12px 0 0;
}
.m-devoluciones .dev-cab {
  display: flex;
  flex-wrap: wrap;
  gap: 28px;
  margin-bottom: 16px;
}
.m-devoluciones .dev-cab > div {
  display: grid;
  gap: 2px;
}
.m-devoluciones .dev-chips {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.m-devoluciones .dev-chip {
  padding: 8px 14px;
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  background: none;
  font-family: inherit;
  font-size: 13px;
  color: var(--texto);
  cursor: pointer;
}
.m-devoluciones .dev-chip.on {
  background: var(--negro);
  color: #fff;
  border-color: var(--negro);
  font-weight: 600;
}
.m-devoluciones .dev-chips--estado .dev-chip {
  padding: 5px 10px;
  font-size: 12px;
}
.m-devoluciones .dev-cant {
  width: 66px;
  text-align: center;
  padding: 6px;
}
.m-devoluciones .dev-fila--agotada {
  opacity: .5;
}
.m-devoluciones .dev-fila--anul td {
  text-decoration: line-through;
  opacity: .6;
}
.m-devoluciones .dev-tipo {
  margin-bottom: 16px;
}
.m-devoluciones .dev-pie {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-top: 16px;
}
.m-devoluciones .dev-tot {
  display: flex;
  gap: 30px;
}
.m-devoluciones .dev-tot > div {
  display: grid;
  gap: 2px;
}
.m-devoluciones .dev-nota {
  margin: 12px 0 0;
}
@media (max-width: 820px) {
  .m-devoluciones .dev-buscar {
    grid-template-columns: 1fr;
  }
  .m-devoluciones .dev-pie {
    flex-direction: column;
    align-items: stretch;
  }
}
.m-transferencias .tr-top {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 20px;
  margin-bottom: 16px;
}
.m-transferencias .campo {
  display: grid;
  gap: 5px;
}
.m-transferencias .campo__lbl {
  font-size: 12px;
  color: var(--texto-2);
  font-weight: 500;
}
.m-transferencias .campo__in {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  font-family: inherit;
  font-size: 13px;
}
.m-transferencias .tr-chips {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.m-transferencias .tr-chip {
  padding: 8px 14px;
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  background: none;
  font-family: inherit;
  font-size: 13px;
  color: var(--texto);
  cursor: pointer;
}
.m-transferencias .tr-chip.on {
  background: var(--negro);
  color: #fff;
  border-color: var(--negro);
  font-weight: 600;
}
.m-transferencias .tr-buscar {
  margin: 14px 0 6px;
}
.m-transferencias .tr-cant,
.m-transferencias .tr-rec {
  width: 66px;
  text-align: center;
  padding: 6px;
}
.m-transferencias .tr-quitar {
  border: none;
  background: none;
  color: var(--texto-3);
  cursor: pointer;
  font-size: 14px;
}
.m-transferencias .tr-quitar:hover {
  color: var(--mal-texto);
}
.m-transferencias .tr-sugerencias {
  margin-top: 12px;
}
.m-transferencias .tr-sug {
  border: none;
  background: none;
  font-family: inherit;
  font-size: 12px;
  color: var(--texto-2);
  cursor: pointer;
  margin-right: 12px;
  text-decoration: underline;
}
.m-transferencias .tr-pie {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-top: 16px;
}
.m-transferencias .tr-tot {
  display: flex;
  gap: 30px;
}
.m-transferencias .tr-tot > div {
  display: grid;
  gap: 2px;
}
.m-transferencias .tr-nota {
  margin: 12px 0 0;
}
.m-transferencias .tr-fila--anul td {
  text-decoration: line-through;
  opacity: .6;
}
.m-transferencias .tr-fondo {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .45);
  display: grid;
  place-items: center;
  z-index: 50;
  padding: 20px;
}
.m-transferencias .tr-dialogo {
  max-width: 620px;
  width: 100%;
  max-height: 85vh;
  overflow: auto;
}
.m-transferencias .tr-dlg-pie {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 16px;
}
@media (max-width: 900px) {
  .m-transferencias .tr-top {
    grid-template-columns: 1fr;
  }
  .m-transferencias .tr-pie {
    flex-direction: column;
    align-items: stretch;
  }
}
.m-conteos .co-top {
  display: grid;
  grid-template-columns: 1.2fr 1fr 1fr;
  gap: 20px;
}
.m-conteos .campo {
  display: grid;
  gap: 5px;
}
.m-conteos .campo__lbl {
  font-size: 12px;
  color: var(--texto-2);
  font-weight: 500;
}
.m-conteos .campo__in {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  font-family: inherit;
  font-size: 13px;
}
.m-conteos .co-chips {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.m-conteos .co-chip {
  padding: 8px 14px;
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  background: none;
  font-family: inherit;
  font-size: 13px;
  color: var(--texto);
  cursor: pointer;
}
.m-conteos .co-chip.on {
  background: var(--negro);
  color: #fff;
  border-color: var(--negro);
  font-weight: 600;
}
.m-conteos .co-pie {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 20px;
  margin-top: 16px;
}
.m-conteos .co-nota {
  margin: 0;
  max-width: 62ch;
}
.m-conteos .co-cab {
  display: flex;
  flex-wrap: wrap;
  gap: 28px;
  margin-bottom: 14px;
}
.m-conteos .co-cab > div {
  display: grid;
  gap: 2px;
}
.m-conteos .co-avance {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}
.m-conteos .co-barra {
  flex: 1;
  height: 8px;
  border-radius: 4px;
  background: var(--superficie-2);
  overflow: hidden;
}
.m-conteos .co-barra span {
  display: block;
  height: 100%;
  width: 0;
  background: var(--negro);
  transition: width .2s;
}
.m-conteos .co-escaneo {
  display: grid;
  grid-template-columns: 1fr 110px auto;
  gap: 10px;
}
.m-conteos .co-cant {
  text-align: center;
}
.m-conteos .co-filtros {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 12px;
  align-items: center;
  margin-bottom: 12px;
}
.m-conteos .co-fila--pend {
  opacity: .55;
}
.m-conteos .co-fila--anul td {
  text-decoration: line-through;
  opacity: .6;
}
.m-conteos .co-dif {
  font-weight: 700;
}
.m-conteos .co-dif--menos {
  color: var(--mal-texto);
}
.m-conteos .co-dif--mas {
  color: var(--texto);
}
.m-conteos .co-cierre .co-acciones {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 14px;
}
.m-conteos .co-cierre .co-nota {
  margin-top: 12px;
}
@media (max-width: 900px) {
  .m-conteos .co-top {
    grid-template-columns: 1fr;
  }
  .m-conteos .co-escaneo {
    grid-template-columns: 1fr;
  }
  .m-conteos .co-pie {
    flex-direction: column;
    align-items: stretch;
  }
}
.m-consignacion .cn-top {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
  margin-bottom: 16px;
}
.m-consignacion .cn-datos {
  display: grid;
  grid-template-columns: 1.4fr 1fr 0.7fr;
  gap: 16px;
}
.m-consignacion .campo {
  display: grid;
  gap: 5px;
}
.m-consignacion .campo__lbl {
  font-size: 12px;
  color: var(--texto-2);
  font-weight: 500;
}
.m-consignacion .campo__in {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  font-family: inherit;
  font-size: 13px;
}
.m-consignacion .cn-chips {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.m-consignacion .cn-chip {
  padding: 8px 14px;
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  background: none;
  font-family: inherit;
  font-size: 13px;
  color: var(--texto);
  cursor: pointer;
}
.m-consignacion .cn-chip.on {
  background: var(--negro);
  color: #fff;
  border-color: var(--negro);
  font-weight: 600;
}
.m-consignacion .cn-buscar {
  margin: 16px 0 6px;
}
.m-consignacion .cn-cant {
  width: 66px;
  text-align: center;
  padding: 6px;
}
.m-consignacion .cn-precio {
  width: 90px;
  text-align: right;
  padding: 6px;
}
.m-consignacion .cn-vend,
.m-consignacion .cn-ret {
  width: 66px;
  text-align: center;
  padding: 6px;
}
.m-consignacion .cn-quitar {
  border: none;
  background: none;
  color: var(--texto-3);
  cursor: pointer;
  font-size: 14px;
}
.m-consignacion .cn-quitar:hover {
  color: var(--mal-texto);
}
.m-consignacion .cn-pie {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  margin-top: 16px;
}
.m-consignacion .cn-tot {
  display: flex;
  gap: 30px;
}
.m-consignacion .cn-tot > div {
  display: grid;
  gap: 2px;
}
.m-consignacion .cn-nota {
  margin: 12px 0 0;
}
.m-consignacion .cn-fila--anul td {
  text-decoration: line-through;
  opacity: .6;
}
.m-consignacion .cn-fondo {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .45);
  display: grid;
  place-items: center;
  z-index: 50;
  padding: 20px;
}
.m-consignacion .cn-dialogo {
  max-width: 760px;
  width: 100%;
  max-height: 85vh;
  overflow: auto;
}
.m-consignacion .cn-dlg-pie {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 16px;
}
.m-consignacion .cn-dlg-pie > div {
  display: flex;
  gap: 10px;
}
@media (max-width: 900px) {
  .m-consignacion .cn-top,
  .m-consignacion .cn-datos {
    grid-template-columns: 1fr;
  }
  .m-consignacion .cn-pie {
    flex-direction: column;
    align-items: stretch;
  }
}
.m-shopify .sh-form {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}
.m-shopify .campo {
  display: grid;
  gap: 5px;
}
.m-shopify .campo__lbl {
  font-size: 12px;
  color: var(--texto-2);
  font-weight: 500;
}
.m-shopify .campo__in {
  width: 100%;
  padding: 9px 12px;
  border: 1px solid var(--borde-fuerte);
  border-radius: var(--radio);
  font-family: inherit;
  font-size: 13px;
}
.m-shopify .sh-interruptores {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin: 18px 0;
}
.m-shopify .sh-sw {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
}
.m-shopify .sh-acciones {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
}
.m-shopify .sh-nota {
  margin-top: 14px;
}
.m-shopify .sh-falta {
  margin: 8px 0 8px 18px;
}
.m-shopify .sh-kpis {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin: 16px 0;
}
.m-shopify .sh-kpi {
  display: grid;
  gap: 3px;
  padding: 14px;
  border: 1px solid var(--borde);
  border-radius: var(--radio);
}
.m-shopify .sh-kpi strong {
  font-size: 22px;
}
.m-shopify .sh-kpi--mal {
  border-color: var(--mal-texto);
}
.m-shopify .sh-fila--mal {
  background: var(--superficie-2);
}
.m-shopify .sh-detalle {
  margin-top: 12px;
  font-size: 13px;
}
.m-shopify .sh-detalle summary {
  cursor: pointer;
  font-weight: 600;
}
.m-shopify .sh-detalle ul {
  margin: 8px 0 0 18px;
  color: var(--texto-2);
}
@media (max-width: 900px) {
  .m-shopify .sh-form {
    grid-template-columns: 1fr;
  }
  .m-shopify .sh-kpis {
    grid-template-columns: 1fr;
  }
}
.m-historial .hi-op[disabled] {
  opacity: .4;
  cursor: not-allowed;
}
.hi-fondo {
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, .45);
  display: grid;
  place-items: center;
  z-index: 60;
  padding: 20px;
}
.hi-dialogo {
  max-width: 640px;
  width: 100%;
  max-height: 85vh;
  overflow: auto;
}
.hi-dlg-cab {
  display: flex;
  flex-wrap: wrap;
  gap: 28px;
  margin-bottom: 14px;
}
.hi-dlg-cab > div {
  display: grid;
  gap: 2px;
}
.hi-dlg-pagos {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  margin-top: 14px;
  font-size: 13px;
}
.hi-dlg-pie {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 16px;
}
@media print {
  body * {
    visibility: hidden;
  }
  .hi-fondo,
  .hi-fondo * {
    visibility: visible;
  }
  .hi-fondo {
    position: absolute;
    inset: 0;
    background: none;
    padding: 0;
    display: block;
  }
  .hi-dialogo {
    max-width: none;
    max-height: none;
    box-shadow: none;
    border: 0;
    overflow: visible;
  }
  .no-imprimir {
    display: none !important;
  }
}
.side .nav-item--sub {
  padding-left: 30px;
  position: relative;
}
.side .nav-item--sub::before {
  content: "";
  position: absolute;
  left: 17px;
  top: 8px;
  bottom: 8px;
  width: 1px;
  background: currentColor;
  opacity: .25;
}
.side .nav-item--sub .lbl {
  font-size: 12.5px;
}
.m-error .err-caja {
  max-width: 620px;
}
.m-error .err-acciones {
  margin-top: 18px;
}
.m-inventario .inv-filtros > * {
  min-width: 0;
}
.m-reportes .rep-leg > * {
  min-width: 0;
}
.m-reportes .rep-leg__nom {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@media (max-width: 560px) {
  .m-inventario .inv-filtros {
    grid-template-columns: 1fr;
  }
  .m-inventario .inv-kpis {
    grid-template-columns: 1fr 1fr;
  }
  .m-reportes .rep-kpis {
    grid-template-columns: 1fr 1fr;
  }
  .m-historial .hi-filtros {
    grid-template-columns: 1fr;
  }
  .m-historial .hi-kpis {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 400px) {
  .m-reportes .rep-kpis,
  .m-inventario .inv-kpis,
  .m-historial .hi-kpis {
    grid-template-columns: 1fr;
  }
}
code {
  overflow-wrap: anywhere;
  word-break: break-word;
}
@media (max-width: 400px) {
  .m-pos .pos-busca__fila {
    flex-wrap: wrap;
  }
  .m-pos .pos-busca__campo {
    flex: 1 1 100%;
  }
  .m-reportes .rep-cab {
    flex-wrap: wrap;
    gap: 6px;
  }
  .tarjeta {
    min-width: 0;
  }
}