/* El Pescador · Caja — identidad de la marca. Va DESPUÉS de tema.css y ANTES de oscuro.css.
   Azul noche (#0F1B3D): textos fuertes y botón principal. Azul mar (#1B6CB5): color de marca, en detalles.
   Ámbar (#F2A33A): acento escaso (avisos y el sello); nunca como fondo grande ni como texto sobre blanco.
   Contraste AA comprobado: #0F1B3D 16:1, #4E5869 7,2:1 y #5F6878 5,6:1 sobre blanco; blanco sobre #1B6CB5 5,4:1. */

:root{--pz-noche:#0F1B3D;--pz-mar:#1B6CB5;--pz-ambar:#F2A33A}

/* ---------- modo día: blanco con grises fríos ---------- */
:root:not([data-tema="oscuro"]){
  --fondo:#FFFFFF; --sup:#FFFFFF; --sup2:#F3F6FA; --sup3:#EAEFF5;
  --linea:#E5EAF1; --linea2:#D6DDE7; --campo:#7A8394;
  --texto:#0F1B3D; --texto2:#4E5869; --texto3:#5F6878;
  --tinta-btn:#0F1B3D;
}
:root:not([data-tema="oscuro"]) .btn.pri{background:var(--pz-noche);border-color:var(--pz-noche);color:#fff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 10px 24px -14px rgba(15,27,61,.55)}
@media (hover:hover) and (pointer:fine){:root:not([data-tema="oscuro"]) .btn.pri:hover{background:#16264F}}
:root:not([data-tema="oscuro"]) :is(button,[role=button],input,select,textarea):focus-visible{outline-color:var(--pz-noche)!important}

/* punto de venta: el elegido en azul noche, bien visible */
:root:not([data-tema="oscuro"]) .seg-punto button.on{background:var(--pz-noche);color:#fff;box-shadow:none}
.seg-punto button{font-weight:600}

/* precio de los cevichifles en «pastilla» azul noche */
.prod[data-cat="Cevichifles"] .p{display:inline-block;align-self:flex-start;width:auto;padding:3px 10px;border-radius:999px;
  background:var(--pz-noche);color:#fff;font-weight:600;letter-spacing:.01em}
/* noche: pastilla blanca con cifra negra (elegida por Harold el 10-nov, tras descartar el azul y el ámbar) */
:root[data-tema="oscuro"] .prod[data-cat="Cevichifles"] .p{background:var(--texto);color:#000}

/* línea de ola: separador marino, fino y sobrio */
.ola{height:10px;margin:10px 0 4px;opacity:.6;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 10'%3E%3Cpath d='M0 5 Q10 0.5 20 5 T40 5' fill='none' stroke='%231B6CB5' stroke-width='1.3'/%3E%3C/svg%3E") repeat-x left center/40px 10px}
:root[data-tema="oscuro"] .ola{filter:brightness(1.8);opacity:.5}

/* sello del negocio (redondo) en el encabezado y la barra lateral */
.logo-img{border-radius:50%;object-fit:contain;background:transparent}
.nube-sello{width:72px;height:72px;align-self:center}

/* número de factura: abre la factura de prueba */
.ver-fact{background:none;border:0;padding:2px 0;margin:0;font:inherit;color:var(--acento-tono);text-decoration:underline;text-underline-offset:3px;cursor:pointer}

/* cobrar: un solo botón, a lo ancho */
.carrito > .btn.pri.full{margin-top:var(--e-grupo)}

/* avisos «Por vencer»: un punto ámbar a la izquierda (el texto sigue en el tono legible de --warn) */
.est.warn::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--pz-ambar);margin-right:6px;vertical-align:.1em}

/* apertura: el sello aparece bajo la firma de FaroTech */
#apertura .ap-sello{width:64px;height:64px;opacity:0;animation:apertura-aparece .6s ease-out 1.5s forwards}
@media (prefers-reduced-motion:reduce){#apertura .ap-sello{opacity:1}}

/* ---------- carreta: teclas grandes (al sol, con una mano) ---------- */
.prods.teclas{grid-template-columns:1fr;gap:10px}
.prods.teclas .prod{min-height:104px;flex-direction:row;align-items:center;gap:14px;padding:14px 16px;border-width:1.5px;border-color:var(--linea2)}
.prods.teclas .prod .em{margin:0;flex:none}
.prods.teclas .prod .n{flex:1;font-size:1.45rem;font-weight:650;letter-spacing:-.02em;line-height:1.1}
.prods.teclas .prod .p{align-self:center!important;margin:0;font-family:var(--f-texto);font-size:1.5rem!important;font-weight:700;padding:8px 16px!important}
.prods.teclas .prod .badge{top:8px;right:auto;left:8px}
@media (min-width:560px){.prods.teclas{grid-template-columns:repeat(3,1fr)}.prods.teclas .prod{flex-direction:column;align-items:flex-start}}

/* producto bloqueado (lote vencido o agotado): se ve, pero no se vende */
.prod.bloqueado{background:var(--sup2);border-style:dashed;cursor:not-allowed;opacity:.92}
.prod.bloqueado .n{color:var(--texto2);text-decoration:line-through;text-decoration-thickness:1px}
.prod.bloqueado .motivo{margin-top:auto;font-size:.76rem;font-weight:600;color:var(--mal)}
.prod.peso .p small{font-size:.72em;font-weight:500;margin-left:1px}

/* cobro: billetes y vuelto bien grandes */
.billetes button{min-height:52px;font-size:1.05rem}
.hoja .vuelto{font-size:2.2rem;color:var(--texto)}

/* ---------- venta por peso ---------- */
.peso-vista{display:flex;align-items:baseline;justify-content:center;gap:8px;padding:14px 0 4px;border-bottom:1px solid var(--linea)}
.peso-lb{font-family:var(--f-texto);font-size:3rem;font-weight:650;letter-spacing:-.04em;line-height:1;color:var(--texto)}
.peso-u{font-size:1.2rem;color:var(--texto2)}
.peso-total{margin:6px 0 10px}
.peso-rapido{margin-bottom:10px}
.peso-rapido button{min-height:48px}
.teclado{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}
.teclado button{min-height:56px;border:1px solid var(--linea2);border-radius:14px;background:var(--sup);color:var(--texto);font:600 1.5rem/1 var(--f-texto);font-variant-numeric:tabular-nums;cursor:pointer}
.teclado button:active{background:var(--sup3)}
.teclado button[data-t="⌫"]{font-size:1.2rem;color:var(--texto2)}

/* ---------- lotes, etiqueta, «Hoy hay» y vedas ---------- */
.lote-item{display:flex;align-items:center;gap:8px;padding:10px 0;border-top:1px solid var(--linea)}
.lote-item:first-of-type{border-top:0}
.lote-item .grow{flex:1;min-width:0}
.lote-item .btn{flex:none;min-height:44px;padding:8px 12px}
.marca-hoy{font-size:.8rem;color:var(--texto2);letter-spacing:.02em;margin:2px 0 0}
.marca-hoy b{color:var(--texto);font-weight:600}
.texto-hoy{white-space:pre-wrap;font:400 .9rem/1.45 var(--f-texto);background:var(--sup2);border:1px solid var(--linea);border-radius:14px;padding:12px;margin:8px 0;max-height:46vh;overflow:auto;overflow-wrap:anywhere}
.veda{border-left:3px solid var(--pz-ambar)}
.veda p{margin:2px 0}
.veda p:not(.chica){font-size:.9rem;line-height:1.4}
.tabla-vedas{display:grid;grid-template-columns:minmax(0,1fr) 62px 62px 44px;gap:6px;align-items:center}
.tabla-vedas input{min-width:0;padding:8px;font-size:.9rem}
.tabla-vedas .cab{font-size:.72rem;color:var(--texto3);font-weight:600}
.tabla-vedas .mini{width:44px;height:44px;min-width:0;padding:0}
.tabla-vedas input{width:100%}

.etiqueta{width:62mm;max-width:100%;margin:8px auto;padding:3mm 3.5mm;border:1px solid #0F1B3D;border-radius:2mm;background:#fff;color:#0F1B3D;font:400 8.5pt/1.25 var(--f-texto,system-ui);box-sizing:border-box}
.etiqueta .et-cab{display:flex;align-items:center;gap:2.5mm;border-bottom:.3mm solid #0F1B3D;padding-bottom:1.5mm;margin-bottom:1.5mm}
.etiqueta .et-cab img{width:11mm;height:11mm}
.etiqueta .et-cab b{display:block;font-size:9.5pt;letter-spacing:.02em}
.etiqueta .et-cab span{font-size:7pt;color:#4E5869}
.etiqueta .et-prod{font-size:10pt;font-weight:700;margin:0 0 1mm}
.etiqueta .et-fila{display:flex;justify-content:space-between;gap:2mm;font-variant-numeric:tabular-nums}
.etiqueta .et-cons{margin-top:1.5mm;padding:1mm 1.5mm;border:.3mm solid #0F1B3D;font-weight:700;text-align:center;font-size:8pt}
.etiqueta .et-pie{margin-top:1.2mm;font-size:7pt;color:#4E5869;text-align:center}
@media print{
  body.imprimiendo > :not(.velo){display:none!important}
  body.imprimiendo .velo{position:static!important;background:none!important;backdrop-filter:none!important;padding:0!important}
  body.imprimiendo .hoja{position:static!important;box-shadow:none!important;border:0!important;padding:0!important;max-height:none!important;transform:none!important;animation:none!important;background:#fff!important}
  body.imprimiendo .hoja > :not(.etiqueta){display:none!important}
  body.imprimiendo .etiqueta{margin:0;-webkit-print-color-adjust:exact;print-color-adjust:exact}
}
/* Categorías de la tienda: las cuatro caben en una sola fila también en celulares de 360 px. */
@media (max-width:400px){.seg:has(> [data-a="cat"]){flex-wrap:nowrap}.seg:has(> [data-a="cat"]) button{padding-inline:4px;min-width:0;flex:1 1 auto}}
/* Cifras grandes del panel: en 360 px «$345,08» llenaba la columna; un poco más chicas para que quepan con holgura. */
@media (max-width:380px){.kpi .v{font-size:1.7rem}}


/* ── Tipografía moderna y futurista (10-nov-2026) ─────────────────────────────
   Oxanium en títulos y cifras; Exo 2 en el texto. Las etiquetas pequeñas siguen en Geist Mono.
   La firma «farotech» conserva su letra propia (Unbounded). Para volver atrás, borre este bloque
   y la línea de fuentes de index.html. */
:root{
  --f-display:"Oxanium","Exo 2",system-ui,sans-serif;
  --f-texto:"Exo 2",-apple-system,"SF Pro Text",system-ui,sans-serif;
}
html,body{font-feature-settings:normal;letter-spacing:0}
h1,h2,h3,.tit,.card h2{letter-spacing:-.005em}
.titulo-vista h1{font-weight:600;letter-spacing:-.01em}
.total,.vuelto,.kpi .v{font-weight:500;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.hoja > h2,.hoja > .fila > h2,.hoja > .sep > h2,.nube-caja h2{font-weight:600;letter-spacing:-.005em}
header .nombre{font-family:var(--f-display);font-weight:700;letter-spacing:.01em}
.btn.pri{font-weight:600;letter-spacing:.02em}
.prods.teclas .prod .n{font-family:var(--f-display);letter-spacing:.005em}
.prods.teclas .prod .p,.peso-lb,.teclado button{font-family:var(--f-display)}
body .cp-grande,body .lc .lc-tit{font-family:var(--f-display)}
body .lc{font-family:var(--f-texto)}
