/* =========================================================================
   Restó360 · Sumaq — pantallas de estación (cocina y barra)
   Diseñado por Operaria

   Esta hoja existe por una razón sola: estas dos pantallas se leen de pie,
   con las manos ocupadas y a tres metros. Todo lo demás del sistema se lee
   a medio metro. Así que acá la tipografía sube de escala, el contraste
   sube con ella y las zonas de toque nunca bajan de 52 píxeles, porque el
   dedo que las aprieta viene con guante o con harina.

   El suelo es --navy-cocina (#0F2140), un peldaño más claro que el navy de
   la carta: en una pantalla montada bajo la campana, con vapor y luz dura
   encima, el navy más profundo se lee como negro y pierde los bordes.
   ========================================================================= */

.app--kds .app__barra h1{font-size:26px}

.kds__alto{
  display:flex;align-items:center;justify-content:space-between;gap:14px 24px;flex-wrap:wrap;
  margin-bottom:12px;
}

.marcadores{display:flex;gap:10px;flex-wrap:wrap}
.marcador{
  display:flex;align-items:baseline;gap:8px;
  padding:9px 15px;border-radius:12px;
  background:var(--navy-2);border:1px solid var(--linea);
}
.marcador b{font-family:var(--mono);font-weight:500;font-size:26px;line-height:1;font-variant-numeric:tabular-nums}
.marcador span{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--tenue-2)}
.marcador.es-brasa{border-color:rgba(237,94,34,.5)}
.marcador.es-brasa b{color:var(--brasa)}
.marcador.es-nuevo{border-color:rgba(123,196,188,.45)}
.marcador.es-nuevo b{color:var(--teal-cl)}

.semaforo-leyenda{display:flex;gap:8px 18px;flex-wrap:wrap}
.semaforo-leyenda b{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--mono);font-weight:400;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--tenue);
}

.kds__nota{font-family:var(--mono);font-size:11.5px;letter-spacing:.04em;color:var(--tenue-2);margin-bottom:16px}

.kds__filtros{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;margin-bottom:18px;padding-bottom:4px}
.kds__filtros::-webkit-scrollbar{display:none}
.chip--kds{
  flex:none;min-height:46px;padding:0 18px;gap:10px;
  font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;
}
.chip__n{
  font-family:var(--sans);font-weight:700;font-size:13px;letter-spacing:0;
  padding:1px 8px;border-radius:999px;background:rgba(237,234,227,.1);
}
.chip--kds[aria-pressed="true"] .chip__n{background:rgba(8,33,31,.22)}

/* ---------- el ticket, a escala de cocina ---------- */

.app--kds .ticket{background:var(--navy-4);border-color:rgba(237,234,227,.18)}
.app--kds .ticket__alto{background:rgba(10,20,40,.4);padding:13px 16px}
.app--kds .ticket__mesa{font-size:26px}
.app--kds .ticket__mesa small{font-size:10.5px;letter-spacing:.16em}
.app--kds .ticket__sla{font-size:28px}
.app--kds .ticket ul{padding:14px 16px;gap:13px}
.app--kds .ticket li{font-size:20px;line-height:1.22}
.app--kds .ticket li .q{font-size:20px;min-width:2.2em}
.app--kds .ticket li .nota{font-size:14px;margin-top:5px}
.app--kds .ticket__acciones{padding:0 16px 16px;gap:10px}
.app--kds .ticket__acciones .boton{min-height:54px;font-size:15px;letter-spacing:.02em}

/* El ticket vencido no parpadea: en una cocina el parpadeo se vuelve ruido
   de fondo en diez minutos. Se declara con borde, con halo y con el reloj
   en brasa, que son tres señales quietas y suficientes. */
.app--kds .ticket--brasa{box-shadow:0 0 0 2px rgba(237,94,34,.35),0 10px 30px rgba(237,94,34,.10)}

@container pantalla (min-width:1500px){
  .app--kds .ticket__mesa{font-size:29px}
  .app--kds .ticket__sla{font-size:32px}
  .app--kds .ticket li{font-size:22px}
}