/* Schermo Cucina e Bar: ticket per reparto, leggibili da lontano, un tocco per segnare pronto. */
.kds-top { flex-wrap: wrap; row-gap: 8px; }
.kds-top h1 { flex: 0 1 auto; min-width: 120px; }
.reparti { display: flex; gap: 6px; flex: 1; overflow-x: auto; scrollbar-width: none; }
.reparti::-webkit-scrollbar { display: none; }
.orologio { font: 700 1.25rem var(--mono); }
@media (max-width: 700px) {
  .kds-top h1 { flex: 1 1 0; min-width: 0; }
  .kds-top .ico { width: 40px; height: 40px; }
  .reparti { order: 9; flex-basis: 100%; }
  .orologio { display: none; }
}

.somme { display: flex; gap: 8px; flex-wrap: wrap; padding: 10px max(12px, env(safe-area-inset-left, 0px)); background: var(--surface-2); border-bottom: 1px solid var(--line); }
.somme span { font-weight: 800; padding: 6px 10px; border-radius: 10px; background: var(--surface); border: 1px solid var(--line); }
.somme span b { font-family: var(--mono); color: var(--accent); margin-right: 4px; }

.kds { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 12px; padding: 12px max(12px, env(safe-area-inset-right, 0px)) 40px max(12px, env(safe-area-inset-left, 0px)); align-items: start; }
.kds-vuoto { display: grid; place-items: center; gap: 6px; text-align: center; padding: 18vh 20px; color: var(--muted); }
.kds-vuoto b { font-size: 2rem; color: var(--ink); }

.tk { background: var(--surface); border: 1.5px solid var(--line); border-top: 8px solid var(--ok); border-radius: 16px; display: flex; flex-direction: column; overflow: hidden; }
.tk.giallo { border-top-color: var(--warn); }
.tk.rosso { border-top-color: var(--bad); }
.tk.dopo, .tk.solo-attesa { opacity: 0.62; border-top-color: var(--line); }
.tk.nuovo { box-shadow: 0 0 0 3px var(--accent); }
@media (prefers-reduced-motion: no-preference) { .tk.nuovo { animation: lampo 1s ease-in-out 3; } }
@keyframes lampo { 50% { box-shadow: 0 0 0 6px var(--accent); } }
.tk-testa { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding: 10px 14px 2px; }
.tk-testa b { font-size: 1.4rem; font-weight: 800; line-height: 1.15; }
.tk-testa .n { font: 700 0.9rem var(--mono); color: var(--muted); margin-left: 6px; }
.tk-tempo { font: 700 1.35rem var(--mono); white-space: nowrap; }
.tk.rosso .tk-tempo { color: var(--bad); }
.tk.giallo .tk-tempo { color: var(--warn); }
.tk-sotto { padding: 0 14px 6px; font-size: 0.88rem; color: var(--muted); font-weight: 600; }
.tk-nota, .tk-avviso { margin: 4px 12px 6px; padding: 7px 10px; border-radius: 10px; font-weight: 800; font-size: 0.98rem; }
.tk-nota { background: var(--warn-soft); color: var(--ink); }
.tk-avviso { background: var(--bad-soft); color: var(--bad); }
.tk ul { list-style: none; margin: 0; padding: 0; }
.tk li button { width: 100%; display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; gap: 2px 10px; align-items: baseline; padding: 11px 14px; border: 0; border-top: 1px solid var(--line); background: transparent; color: var(--ink); text-align: left; cursor: pointer; font: inherit; -webkit-user-select: none; user-select: none; touch-action: manipulation; }
.tk li button:active { background: var(--surface-2); }
.tk li .q { font: 800 1.45rem var(--mono); }
.tk li .nome { font-weight: 800; font-size: 1.18rem; line-height: 1.2; }
.tk li .nome small { display: block; font-weight: 600; font-size: 0.92rem; color: var(--muted); }
.tk li .nome em { display: block; font-style: normal; font-weight: 800; font-size: 0.95rem; color: var(--bad); }
.tk li .tag { font-size: 0.72rem; font-weight: 800; padding: 2px 7px; border-radius: 6px; background: var(--surface-2); color: var(--muted); white-space: nowrap; }
.tk li.pronto button { opacity: 0.45; }
.tk li.pronto .nome, .tk li.pronto .q { text-decoration: line-through; }
.tk li.pronto .tag { background: var(--ok-soft); color: var(--ok); }
.tk li.attesa button { opacity: 0.5; cursor: default; }
.tk li.attesa .tag { background: var(--info-soft); color: var(--info); }
.tk-piede { padding: 10px 12px 12px; border-top: 1px solid var(--line); }
.tk-piede .b { width: 100%; min-height: 54px; font-size: 1.08rem; }

.avvio { position: fixed; inset: 0; z-index: 80; background: rgba(10, 6, 12, .82); display: grid; place-content: center; gap: 14px; padding: 24px; text-align: center; color: #FFFFFF; }
.avvio .b { min-width: 280px; }

/* ingredienti tolti: in negativo, come sulla comanda stampata */
.tk li .nome .senza { display: block; width: fit-content; margin-top: 4px; padding: 2px 8px; border-radius: 6px; background: var(--bad); color: var(--surface); font-weight: 900; font-size: 1rem; letter-spacing: 0.02em; }
.tk li.pronto .nome .senza { background: var(--muted); }
