/* POS web: estilos del módulo Tickets cobrados (tablas compactas de una o dos líneas, papel claro, botones de 36 px). Todo con prefijo tk- */
.ventana.tk-ventana { width: min(1040px, 100%); height: min(660px, 100%); }
.tk-ventana > .cuerpo-v { display: flex; flex-direction: column; overflow: hidden; padding: 8px 10px 10px; }
.tk { display: flex; flex-direction: column; flex: 1; min-height: 0; }
.tk .btn { min-height: 36px; padding: 0 12px; font-size: 13px; }
.tk .campo { min-height: 36px; font-size: 13px; }

.tk-barra { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.tk-barra .btn.tk-nav { width: 36px; padding: 0; }
.tk-barra .tk-dia { min-width: 104px; }
.tk-barra .tk-num { width: 160px; flex: 0 1 160px; }
.tk-filtros { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 0 10px; background: var(--superficie2); border-radius: 8px; padding: 2px 12px 10px; margin-top: 6px; }
.tk-filtros .amplio { grid-column: 1 / -1; }
.tk-filtros label.et { margin: 8px 0 3px; }
.tk-chk { display: flex; align-items: center; gap: 8px; font-size: 13px; margin-top: 10px; }
.tk-fil-bot { display: flex; gap: 6px; margin-top: 10px; }
.tk-msg { font-size: 12px; color: var(--suave); padding: 4px 2px 3px; min-height: 18px; }

.tk-cuerpo { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(250px, 1fr) minmax(300px, 340px); gap: 10px; }
.tk-izq { overflow-y: auto; min-height: 0; border-top: 1px solid var(--borde); }
.tk-der { display: flex; flex-direction: column; min-height: 0; gap: 8px; min-width: 0; }
.tk-volver { display: none; align-self: flex-start; }
.tk-papel { flex: 1; min-height: 0; overflow: auto; background: #f6f7f4; border-radius: 6px; padding: 12px 14px; display: flex; }
.tk-papel .papel { background: transparent; color: #1b1e19; padding: 0; margin: 0 auto; font-size: 12.5px; line-height: 1.32; width: fit-content; max-width: none; overflow: visible; align-self: flex-start; }
.tk-acciones { display: flex; flex-wrap: wrap; gap: 6px; }

/* renglón de ticket: plano, dos líneas apretadas, total a la derecha */
.tk-fila { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: auto auto; column-gap: 10px; width: 100%; text-align: left; background: none; border: 0; border-bottom: 1px solid var(--borde); padding: 5px 10px; color: var(--texto); }
.tk-fila:hover { background: var(--superficie2); }
.tk-fila.sel { background: var(--exito-suave); }
.tk-fila .t { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tk-fila .t b { font-weight: 700; }
.tk-fila .h { color: var(--suave); font-weight: 400; }
.tk-fila .et { font-size: 11px; font-weight: 800; letter-spacing: .3px; }
.tk-fila .et.mal { color: var(--peligro); } .tk-fila .et.ok { color: var(--exito); } .tk-fila .et.med { color: var(--aviso); }
.tk-fila .d { font-size: 11.5px; color: var(--suave); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tk-fila .m { grid-column: 2; grid-row: 1 / span 2; align-self: center; font-size: 14.5px; font-weight: 700; }
.tk-fila .m.mal { color: var(--peligro); text-decoration: line-through; }
.tk-mas { width: 100%; margin: 8px 0; }

/* ventana de devolución */
.tk-dev { max-height: 46vh; overflow-y: auto; border-top: 1px solid var(--borde); }
.tk-dev-f { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 5px 4px; border-bottom: 1px solid var(--borde); }
.tk-dev-f.on { background: var(--exito-suave); }
.tk-dev-f .n { min-width: 0; display: flex; flex-direction: column; }
.tk-dev-f .n b { font-size: 13.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tk-dev-f .n small { color: var(--suave); font-size: 11.5px; }
.tk-dev-f .q { display: flex; align-items: center; gap: 4px; }
.tk-dev-f .q .campo { width: 62px; text-align: center; min-height: 36px; padding: 0 4px; }
.tk-dev-f .q .redondo { width: 36px; height: 36px; font-size: 18px; }
.tk-dev-tot { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; margin: 8px 0 2px; }
.tk-dev-tot b { font-size: 18px; }
.tk-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.tk-chips .btn { min-height: 32px; font-size: 12.5px; font-weight: 500; }

/* factura lista y firma */
.tk-par { display: flex; justify-content: space-between; gap: 12px; padding: 4px 0; border-bottom: 1px solid var(--borde); font-size: 14px; }
.tk-par span { color: var(--suave); }
.tk-uuid { margin-top: 10px; display: flex; flex-direction: column; gap: 2px; }
.tk-uuid span { font-size: 12px; font-weight: 700; color: var(--suave); }
.tk-uuid code { font-family: var(--mono); font-size: 12.5px; word-break: break-all; background: var(--superficie2); border-radius: 6px; padding: 6px 8px; }
.tk-firma { background: #fff; border-radius: 6px; padding: 8px; text-align: center; }
.tk-firma img { max-width: 100%; max-height: 40vh; }

/* celular (reglas de Android): lista a pantalla completa y, al tocar un ticket, el ticket con sus acciones */
.celular .tk-capa { padding: 0; }
.celular .ventana.tk-ventana { width: 100%; height: 100%; border-radius: 0; border: 0; }
.celular .tk-cuerpo { grid-template-columns: minmax(0, 1fr); }
.celular .tk-der { display: none; }
.celular .tk .ver .tk-izq, .celular .tk.ver .tk-izq { display: none; }
.celular .tk.ver .tk-der { display: flex; }
.celular .tk.ver .tk-barra, .celular .tk.ver .tk-filtros, .celular .tk.ver .tk-msg { display: none; }
.celular .tk-volver { display: inline-flex; align-items: center; }
.celular .tk-barra .tk-num { flex: 1 1 120px; width: auto; min-width: 0; }
.celular .tk-acciones { display: grid; grid-template-columns: 1fr 1fr; max-height: 38vh; overflow-y: auto; }
.celular .tk-acciones .btn { padding: 0 6px; min-height: 40px; }
.celular .tk-papel { padding: 10px 6px; }
.celular .tk-dev { max-height: 40vh; }
@media (max-width: 300px) {
  .tk-barra .btn { padding: 0 8px; }
  .tk-papel .papel { font-size: 10.5px; }
  .tk-fila .t { font-size: 12.5px; }
}

/* impresión del papel: solo el ticket (o el vale), sin lista, barras ni botones */
@media print {
  .tk-imprime .capa:not(.tk-imprimible) { display: none !important; }
  .tk-imprime .tk-barra, .tk-imprime .tk-filtros, .tk-imprime .tk-msg, .tk-imprime .tk-izq, .tk-imprime .tk-acciones, .tk-imprime .tk-volver { display: none !important; }
  .tk-imprime .ventana.tk-ventana { height: auto !important; width: auto !important; }
  .tk-imprime .tk-ventana > .cuerpo-v { display: block; overflow: visible; padding: 0; }
  .tk-imprime .tk, .tk-imprime .tk-cuerpo, .tk-imprime .tk-der { display: block !important; }
  .tk-imprime .tk-papel { display: block; background: #fff; padding: 0; overflow: visible; }
  .tk-imprime .tk-papel .papel { margin: 0; font-size: 12px; }
}
