/* La Caja con la distribución de la maqueta (revisión 03, pos.css), 2-nov-2026. Va después de diseno.css.
   Venta: escáner y tabla de líneas a la izquierda; columna de cobro con clienta, vendedora, totales, total grande, Cobrar,
   «Cobrar con» y el teclado. Cobro: formas de pago, distribución del pago y la columna con el total y el cierre.
   Cobalto, aguamarina, rosa apagado y blanco; botones en cápsula; sin ocre ni crema. */
.modo-caja{--cm-cob:#255bd6;--cm-sky:#eaf0ff;--cm-aqua:#0d7c79;--cm-mint:#e4f4f0;--cm-rosa:#f5e6ed;--cm-vino:#88395a;--cm-ink:#051328;--cm-gris:#5d6b7d}
.cx-oculto{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.modo-caja .cx-dcto,.modo-caja .cx-linea-info small.cx-dcto{color:var(--cm-vino)}
/* Botones en cápsula (interfaz.css los deja en 9 px); las tarjetas que son botones (prenda, clienta, opciones) no. */
.erp-interfaz.modo-caja #v-caja button:not(.cx-tile):not(.cx-clienta):not(.opcion):not(.renglon):not(.cx-dev-fac):not(.cx-op-num){border-radius:999px}

/* ---------- Venta ---------- */
.modo-caja .cx-mesa{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:18px;align-items:start}
.modo-caja .cx-venta{background:#fff;border-radius:16px;padding:18px;min-width:0;display:flex;flex-direction:column;gap:12px}
.cx-escaner{display:flex;gap:9px;align-items:flex-end}
.cx-escaner .cx-busca{flex:1;display:flex;gap:9px;align-items:flex-end;min-width:0}
.cx-escaner-campo{flex:1;display:flex;flex-direction:column;gap:7px;font-size:11px;font-weight:700;color:var(--cm-gris);min-width:0}
.modo-caja .cx-escaner input{height:50px;min-height:50px;background:#edf2fc;border:0;border-radius:25px;font-size:16px;padding:0 20px;max-width:none;margin:0;width:100%}
.cx-escaner button{min-height:50px;white-space:nowrap;padding:12px 22px}
.cx-escaner .cx-agregar{background:var(--cm-cob);color:#fff}
.cx-ver-catalogo{background:var(--cm-sky);color:#1c4da7}
.modo-caja #cx-msg,.modo-caja #cx-carrito-msg{margin:0}
.cx-tabla{min-height:305px;overflow:auto}
.cx-filas-t{margin:0;font-size:13px;white-space:normal}
.cx-filas-t th{background:#f1f4f9;font-size:11px;font-weight:700;color:#4a5a70;padding:11px 10px}
.cx-filas-t th:first-child{border-radius:10px 0 0 10px}.cx-filas-t th:last-child{border-radius:0 10px 10px 0}
.cx-filas-t td{padding:10px;vertical-align:middle;border-top:1px solid #edf0f5}
.cx-filas-t tr.cx-linea{cursor:pointer;background:transparent;border-radius:0}
.cx-filas-t tr.cx-linea.sel{background:#e9f0ff}
.cx-filas-t tr.cx-linea.sel td:first-child{box-shadow:inset 4px 0 0 var(--cm-cob)}
.cx-filas-t tr.cx-linea:focus-visible{outline:3px solid var(--cm-cob);outline-offset:-3px}
.cx-ref b{display:block;font-weight:900;color:var(--cm-ink)}.cx-ref small{display:block;font-size:11px}
.cx-desc .cx-linea-info b{font-weight:700}.cx-desc small{font-size:11px;line-height:1.4}
.cx-tyc b{display:block}.cx-tyc small{display:block;font-size:11px}
.cx-cant-c .paso{display:inline-flex;background:transparent;gap:4px}
.cx-cant-c .paso-b{width:48px;height:48px;background:#eef2f8;font-size:20px}
.cx-cant{width:52px;height:48px;min-height:48px;margin:0;padding:0;text-align:center;font-weight:900;font-size:17px;border:0;border-radius:24px;background:#fff;box-shadow:inset 0 0 0 1px #d5dce8;max-width:none}
.cx-cant:focus{box-shadow:inset 0 0 0 2px var(--cm-cob);outline:0}
.cx-precio-c b,.cx-precio-c small{display:block}
.cx-dct-b{min-height:48px;padding:8px 14px;font-size:13px;background:var(--cm-sky);color:#1c4da7;white-space:nowrap}
.cx-dct-b.con{background:var(--cm-rosa);color:var(--cm-vino)}
.cx-filas-t tr.sel .cx-dct-b:not(.con),.cx-filas-t tr.sel .cx-cant-c .paso-b{background:#fff}
.cx-tot .cx-linea-der{align-items:flex-end}
.cx-quitar-c{width:56px;text-align:center}
.cx-quitar{width:48px;height:48px;padding:0;font-size:22px;background:var(--cm-rosa);color:var(--cm-vino)}
.cx-servicio .cx-linea-pie{justify-content:space-between;margin-top:6px}
.cx-tabla.vacia thead{opacity:.75}
.modo-caja #cx-vacio{text-align:center;padding:70px 10px;margin:0}
.cx-pie-venta{display:flex;gap:20px;justify-content:space-between;font-size:11px;color:var(--cm-gris);flex-wrap:wrap}
.modo-caja .cx-catalogo{background:transparent;padding:0;min-height:305px;border-radius:0}
.modo-caja .cx-catalogo .cabeza{justify-content:space-between;align-items:center;gap:12px}
.modo-caja .cx-catalogo h2{margin:0}
.modo-caja #cx-cerrar-catalogo{min-height:48px;background:var(--cm-sky);color:#1c4da7}

/* Columna de cobro */
.modo-caja .cx-mesa .cx-carrito{position:static;background:#fff;border-radius:16px;padding:20px;gap:12px;max-height:none;overflow:visible}
.modo-caja .cx-mesa .cx-clienta{background:var(--cm-sky);border-radius:14px;min-height:56px}
.cx-vende{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px;font-weight:700;color:var(--cm-gris)}
.modo-caja .cx-vende select{flex:1;min-height:48px;margin:0;max-width:none;border-radius:24px}
.modo-caja .cx-mesa .cx-totales:not(:empty),.modo-caja .cx-mesa-cobro .cx-totales:not(:empty){background:transparent;padding:0;margin:0;font-size:13px}
.modo-caja .cx-totales dt.cx-total{grid-column:1/-1;background:var(--cm-mint);border-radius:12px 12px 0 0;padding:14px 14px 0;margin-top:6px;font-size:12px;color:#256059}
.modo-caja .cx-totales dd.cx-total{grid-column:1/-1;background:var(--cm-mint);border-radius:0 0 12px 12px;padding:4px 14px 14px;margin:-4px 0 0;text-align:left;font-size:36px;letter-spacing:-1px;color:#086b63;line-height:1.1}
.modo-caja .cx-mesa .cx-cobrar{min-height:67px;border-radius:34px;background:var(--cm-cob);font-size:20px;padding:16px 24px}
.modo-caja .cx-mesa .cx-cobrar #cx-cobrar-total{display:none}
.modo-caja .cx-mesa .cx-cobrar kbd{font:11px Lato,sans-serif;color:#d8e4ff;background:transparent;border:0}
.modo-caja .cx-mesa .cx-cobrar:disabled{background:#e1e6ee;color:#6b778a;opacity:1}
.cx-rapidos{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.cx-rapidos .cx-rot{grid-column:1/-1;margin:0}
.cx-rapido{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1px;min-height:52px;padding:4px 6px;background:var(--cm-mint);color:#136a60;font-size:12px;line-height:1.15;text-align:center}
.cx-rapido kbd{font:9px Lato,sans-serif;background:transparent;border:0;color:#3d7f77;padding:0}
.cx-ver-teclado{display:none}
.cx-tv{display:flex;flex-direction:column;gap:8px}
.cx-tv-pantalla{display:flex;justify-content:space-between;align-items:center;gap:10px;background:#f3f6fb;border-radius:24px;padding:8px 18px;min-height:48px}
.cx-tv-pantalla small{font-size:11px;color:var(--cm-gris);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cx-tv-pantalla b{font-size:22px;font-variant-numeric:tabular-nums;color:var(--cm-ink)}
.cx-tv-modos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.cx-tv-modo{min-height:48px;padding:6px 8px;background:var(--cm-sky);color:#1c4da7;font-size:14px;display:flex;justify-content:center;align-items:center;gap:6px}
.cx-tv-modo kbd{font:10px Lato,sans-serif;background:transparent;border:0;color:#506178}
.cx-tv-teclas{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}
.cx-tv-tecla{min-height:48px;padding:0;font-size:19px;background:#eff3fa;color:var(--cm-ink)}
.cx-tv-tecla.suave{background:var(--cm-rosa);color:var(--cm-vino);font-size:16px}
.cx-tv-tecla.enter{grid-column:4;grid-row:3/span 2;background:var(--cm-cob);color:#fff;font-size:15px}
.cx-tv-teclas .cx-tv-tecla:nth-child(13){grid-column:1/span 2}

/* Botonera: los 28 botones reales, siete por fila, con los tonos de la maqueta */
.modo-caja .cx-mesa~.cx-botonera,.modo-caja #cx-botonera{position:static;background:transparent;grid-template-columns:repeat(7,minmax(0,1fr));gap:9px;padding:16px 0}
.modo-caja .cx-bot{min-height:70px;border-radius:35px;font-size:12px;font-weight:700;background:#fff;color:#344f72;padding:10px 12px;line-height:1.2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px}
.modo-caja .cx-bot[data-simbolo]::before{content:attr(data-simbolo);font-size:18px;font-weight:400;line-height:1}
.modo-caja .cx-bot:hover:not(:disabled){background:#e6edfa}
.modo-caja .cx-bot[data-tono=verde]{background:#dff0eb;color:#08665e}
.modo-caja .cx-bot[data-tono=rosa]{background:var(--cm-rosa);color:var(--cm-vino)}
.modo-caja .cx-bot[data-tono=azul]{background:#e3ebff;color:#204ba3}

/* ---------- Cobro ---------- */
.modo-caja .cx-mesa-cobro{grid-template-columns:250px minmax(0,1fr) 340px;gap:18px}
.modo-caja .cx-mesa-cobro>*{background:#fff;border-radius:16px;padding:20px;min-width:0}
.modo-caja .cx-mesa-cobro .cx-cobro-venta{grid-column:auto;order:0}
.modo-caja .cx-mesa-cobro h2{font-size:18px;margin:0}
.modo-caja .cx-mesa-cobro .cx-medios{grid-template-columns:1fr;gap:9px;margin:12px 0 0}
.modo-caja .cx-mesa-cobro .cx-medio{min-height:56px;border-radius:28px;padding:10px 54px 10px 20px;background:var(--cm-mint);color:#136a60}
.modo-caja .cx-mesa-cobro .cx-medio b{font-size:14px;color:#136a60}.modo-caja .cx-mesa-cobro .cx-medio small{font-size:11px}
.modo-caja .cx-mesa-cobro .cx-medio kbd{top:50%;transform:translateY(-50%);right:18px;font:10px Lato,sans-serif;background:transparent;border:0}
.modo-caja .cx-mesa-cobro .cx-medio.g-credito,.modo-caja .cx-mesa-cobro .cx-medio.g-vale{background:#f3edf6}
.modo-caja .cx-cobro-centro{display:flex;flex-direction:column;gap:12px}
.modo-caja .cx-mesa-cobro .cx-saldo{border-radius:14px;padding:16px 18px}
.modo-caja .cx-mesa-cobro .cx-saldo.falta{background:#eef3ff;color:#214eaf}
.modo-caja .cx-mesa-cobro .cx-saldo.cubierto{background:var(--cm-mint);color:#086b63}
.modo-caja .cx-mesa-cobro .cx-saldo>b{font-size:34px}
.modo-caja .cx-mesa-cobro .cx-pagos{margin:0}
.modo-caja .cx-mesa-cobro .cx-pagos li{background:#f3f6fb;border-radius:24px;min-height:52px}
.modo-caja .cx-mesa-cobro .cx-teclas{gap:18px}
.modo-caja .cx-mesa-cobro .cx-tecla{min-height:50px;border-radius:25px;background:#eff3fa}
.modo-caja .cx-mesa-cobro .cx-billete{min-height:50px;border-radius:25px;background:#edf2f9;color:var(--cm-ink)}
.modo-caja .cx-mesa-cobro .cx-billete.exacto{background:var(--cm-sky);color:#1c4da7}
.modo-caja .cx-mesa-cobro .cx-cobro-venta{display:flex;flex-direction:column;gap:8px}
.modo-caja .cx-mesa-cobro .cx-cobro-venta .cx-rot{margin:8px 0 0}
.modo-caja .cx-mesa-cobro .cx-clienta{background:var(--cm-sky);border-radius:14px;min-height:56px}
.modo-caja .cx-mesa-cobro .cx-resumen{font-size:12px;margin:4px 0}
.modo-caja .cx-mesa-cobro .cx-formatos .opcion{border-radius:16px;min-height:48px}
.modo-caja .cx-mesa-cobro #cx-cerrar{min-height:60px;border-radius:30px;background:var(--cm-cob);font-size:17px;margin-top:6px}
.modo-caja .cx-mesa-cobro #cx-cerrar:disabled{background:#e1e6ee;color:#6b778a;opacity:1}
.modo-caja .cx-mesa-cobro .cx-canal select{min-height:48px;border-radius:24px}

@media(min-width:1600px){.modo-caja .cx-mesa{grid-template-columns:minmax(0,1fr) 390px}.cx-tabla{min-height:375px}.modo-caja .cx-bot{min-height:80px}}
@media(max-width:1150px){
  .modo-caja .cx-mesa{grid-template-columns:minmax(0,1fr) 300px;gap:14px}
  .modo-caja .cx-venta{padding:14px}.modo-caja .cx-mesa .cx-carrito{padding:16px}
  .cx-filas-t th,.cx-filas-t td{padding:8px 6px}
  .cx-cant-c .paso-b{width:44px;height:48px}.cx-cant{width:44px}
  .cx-filas-t .cx-ref small{display:none}
  .modo-caja .cx-totales dd.cx-total{font-size:30px}
  .modo-caja .cx-mesa-cobro{grid-template-columns:190px minmax(0,1fr) 270px;gap:14px}
  .modo-caja .cx-mesa-cobro>*{padding:16px}
  .modo-caja .cx-mesa-cobro .cx-teclas{grid-template-columns:1fr}
  .modo-caja #cx-botonera{grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
  .modo-caja .cx-bot{font-size:11px;padding:8px 6px;min-height:66px}
}
@media(max-width:900px){.cx-filas-t .cx-ref{display:none}.cx-filas-t th:first-child{display:none}.modo-caja #cx-botonera{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:720px){
  .modo-caja .cx-mesa{grid-template-columns:1fr}
  .cx-escaner{flex-wrap:wrap}.cx-escaner .cx-busca{flex-basis:100%}.cx-ver-catalogo{flex:1}
  .cx-tabla{min-height:0}
  .cx-filas-t thead{display:none}
  .cx-filas-t,.cx-filas-t tbody{display:block}
  .cx-filas-t tr.cx-linea{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;padding:12px;margin-bottom:10px;border-radius:14px;background:#f6f8fb}
  .cx-filas-t tr.cx-linea.sel{background:#e9f0ff;box-shadow:inset 4px 0 0 var(--cm-cob)}
  .cx-filas-t tr.cx-linea.sel td:first-child{box-shadow:none}
  .cx-filas-t td{display:block;border:0;padding:0;text-align:left}
  .cx-filas-t td[data-rot]::before{content:attr(data-rot);display:block;font-size:10px;font-weight:700;color:var(--cm-gris);margin-bottom:2px}
  .cx-filas-t .cx-ref{display:block}.cx-filas-t .cx-ref small{display:block}
  .cx-filas-t .cx-desc,.cx-filas-t .cx-servicio,.cx-filas-t .cx-cant-c{grid-column:1/-1}
  .cx-filas-t .cx-quitar-c{grid-column:2;grid-row:1;justify-self:end;width:auto}
  .cx-filas-t .cx-ref{grid-column:1;grid-row:1}
  .cx-tot .cx-linea-der{align-items:flex-start}
  .modo-caja #cx-vacio{padding:30px 10px}
  .cx-ver-teclado{display:block;min-height:48px;background:var(--cm-sky);color:#1c4da7}
  .cx-tv{display:none}
  .cx-tv.abierto{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:25;background:#fff;padding:14px 14px 18px;border-radius:22px 22px 0 0;box-shadow:0 -8px 30px rgba(5,19,40,.18)}
  .modo-caja #cx-botonera{grid-template-columns:repeat(3,minmax(0,1fr))}
  .modo-caja .cx-bot{min-height:56px;font-size:12px}
  .modo-caja .cx-mesa-cobro{grid-template-columns:1fr}
  .modo-caja .cx-mesa-cobro .cx-medios{grid-template-columns:repeat(2,minmax(0,1fr))}
  .modo-caja .cx-totales dd.cx-total{font-size:29px}
}
.modo-caja .cx-catalogo .cx-grilla{grid-template-columns:repeat(auto-fill,minmax(150px,190px));gap:16px 14px}
.modo-caja .cx-catalogo .cx-foto b{font-size:22px}
.modo-caja .cx-mesa-cobro .cx-pagos .enlace{min-height:44px;padding:8px 10px}
/* 076: venta sugerida debajo de la tabla */
.cx-sugeridas{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;padding:8px 12px;border-top:1px solid var(--linea,#ddd)}
.cx-sugerida{display:flex;flex-wrap:wrap;gap:6px;align-items:center}

/* Pasaporte ANCORA bajo la clienta (078): texto con jerarquía, sin cajas ni líneas; el crédito en vino como todo descuento */
.cx-pasaporte{display:flex;flex-direction:column;gap:4px;padding:2px 4px}
.cx-pasaporte[hidden]{display:none!important}
.cx-ps-rot{margin:0;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--cm-aqua)}
.cx-ps-nivel{margin:0;display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.cx-ps-nivel b{font-size:20px;font-weight:900;color:var(--cm-ink)}
.cx-ps-cifras{margin:0;display:flex;align-items:baseline;justify-content:space-between;gap:10px;font-size:13px}
.cx-ps-cifras b{font-size:16px;font-weight:900;color:var(--cm-ink)}
.cx-pasaporte small{font-size:11px}
.modo-caja #v-caja .cx-ps-b{align-self:flex-start;min-height:44px;padding:8px 18px;margin-top:4px;background:var(--cm-mint);color:#256059;font-weight:700}
.modo-caja #v-caja .cx-ps-b.suave{background:var(--cm-rosa);color:var(--cm-vino)}
.cx-ps-reglas{margin:6px 0 14px;padding-left:18px;display:flex;flex-direction:column;gap:6px;font-size:14px}
.cx-ps-casilla{display:flex;gap:10px;align-items:flex-start;font-size:14px;margin:6px 0 12px}
.cx-ps-casilla input{width:24px;height:24px;flex:none;margin:0}
.cx-ps-tq{margin:4px 0 0;color:var(--cm-aqua);font-weight:700}

/* Familiaridad con ICG FrontRetail (3-nov-2026): solo disposición. En ICG el nombre de la vendedora en sesión va en la
   esquina de arriba a la derecha y tocarlo cambia de vendedora con clave. Aquí también: va al final de la barra y
   tocarlo abre la pantalla de fichas y PIN (la misma de «Bloquear»), que conserva la venta. */
.modo-caja .cx-barra>.cx-yo{order:20;margin-left:auto;cursor:pointer;border-radius:999px;padding:4px 14px 4px 4px}
.modo-caja .cx-barra>.cx-yo:hover{background:#e6edfa}
.modo-caja .cx-barra>.cx-yo:focus-visible{outline:3px solid var(--cm-cob);outline-offset:2px}