/* Tafel · restaurant.css — the kitchen iPad. Dark, large targets, glanceable at a metre. */
[data-surface="kitchen"] body { background: #0F1114; }
.k-alert { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-3) var(--s-4); border-radius: var(--r-lg); background: var(--paprika); color: var(--on-paprika); font-weight: 700; animation: tf-drop .4s var(--ease-spring); }
.k-alert .ico { animation: tf-pulse 1.2s infinite; }
.k-alert .btn { margin-left: auto; }
.board { height: 100%; display: flex; flex-direction: column; gap: var(--s-3); }
.board .kanban { flex: 1; }
.board-filters { display: flex; gap: var(--s-2); align-items: center; }
.kcard { font-size: var(--t-14); }
.kcard .kcard-id { font-size: var(--t-14); }
.kcard-name { font-size: var(--t-15); }
.kcard .chip { height: 24px; }
.od { display: grid; grid-template-columns: 1.4fr 1fr; gap: var(--s-4); height: 100%; }
.od-main { display: flex; flex-direction: column; gap: var(--s-3); overflow: auto; }
.od-side { display: flex; flex-direction: column; gap: var(--s-3); overflow: auto; }
.od-head { display: flex; align-items: center; gap: var(--s-3); flex-wrap: wrap; }
.od-head h1 { font-family: var(--font-mono); font-size: var(--t-24); font-weight: 500; letter-spacing: -0.01em; }
.od .order-item { font-size: var(--t-16); padding: var(--s-2) 0; border-bottom: 1px solid var(--line-faint); }
.od .order-item .qty { font-size: var(--t-18); min-width: 36px; }
.od .order-item:last-child { border-bottom: 0; }
.big-actions { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-3); }
.big-actions .btn { min-height: 60px; font-size: var(--t-16); border-radius: var(--r-lg); }
.big-actions .btn.span { grid-column: 1 / -1; }
.prep-picker { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s-2); }
.prep-picker button { min-height: 56px; border-radius: var(--r-md); border: 1.5px solid var(--line); font-size: var(--t-18); font-weight: 700; background: var(--surface); color: var(--ink); font-variant-numeric: tabular-nums; }
.prep-picker button.is-on { border-color: var(--paprika); background: var(--paprika-soft); color: var(--paprika); }
.driver-pick { display: flex; flex-direction: column; gap: var(--s-2); }
.driver-row { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-3); border-radius: var(--r-md); background: var(--surface); border: 1px solid var(--line); min-height: 60px; }
.driver-row.is-on { border-color: var(--basil); background: var(--basil-soft); }
.driver-row .status { margin-left: auto; }
.chat-pane { display: grid; grid-template-columns: 300px 1fr; height: 100%; gap: 0; border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; background: var(--surface); }
.chat-list { border-right: 1px solid var(--line); overflow: auto; }
.chat-thread { display: flex; flex-direction: column; min-width: 0; }
.chat-thread .chat { flex: 1; overflow: auto; padding: var(--s-4); }
.thread-row { display: flex; gap: var(--s-3); padding: var(--s-3) var(--s-4); border-bottom: 1px solid var(--line-faint); cursor: pointer; align-items: flex-start; }
.thread-row:hover, .thread-row.is-on { background: var(--surface-2); }
.thread-row.is-closed { opacity: .55; }
.thread-row .kcard-id { font-family: var(--font-mono); font-size: var(--t-13); }
.menu-cat { margin-bottom: var(--s-4); }
.menu-cat h2 { font-family: var(--font-display); font-size: var(--t-20); font-weight: 600; font-variation-settings: 'opsz' 32, 'SOFT' 50; margin-bottom: var(--s-2); display: flex; align-items: center; gap: var(--s-2); }
.menu-item-row { display: flex; align-items: center; gap: var(--s-4); padding: var(--s-3) var(--s-4); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-md); margin-bottom: var(--s-2); min-height: 72px; }
.menu-item-row .food { width: 48px; height: 48px; }
.menu-item-row .food .glyph { width: 28px; height: 28px; }
.menu-item-row.is-off { opacity: .6; }
.menu-item-row .name { font-weight: 600; font-size: var(--t-15); }
.menu-item-row .tr-state { display: inline-flex; align-items: center; gap: 4px; font-size: var(--t-12); }
.editor { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-4); }
.editor .field-full { grid-column: 1 / -1; }
.tr-pair { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-3); align-items: start; }
.tr-pair .field .label { display: flex; align-items: center; gap: var(--s-2); }
.settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-4); }
.settings-grid .span { grid-column: 1 / -1; }
.hours { display: flex; flex-direction: column; }
.hours-row { display: grid; grid-template-columns: 90px 1fr 1fr 60px; gap: var(--s-2); align-items: center; padding: var(--s-2) 0; border-bottom: 1px solid var(--line-faint); font-size: var(--t-14); }
.radius-map { height: 300px; }
.wallet-tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--s-3); }
.wallet-tiles .kpi-value { font-size: var(--t-28); }
.wallet-tiles .kpi.hi { background: var(--basil-soft); border-color: var(--basil-line); }
.wallet-tiles .kpi.hi .kpi-value { color: var(--basil-ink); }
.promo-card { display: flex; gap: var(--s-4); align-items: center; padding: var(--s-4); background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-lg); }
.promo-card .grow { min-width: 0; }
.promo-card .toggle { margin-left: auto; }
.pin-pad { display: grid; grid-template-columns: repeat(3, 72px); gap: var(--s-3); justify-content: center; }
.pin-pad button { height: 72px; border-radius: 50%; background: var(--surface-2); font-size: var(--t-24); font-weight: 600; color: var(--ink); }
.pin-pad button:hover { background: var(--surface-3); }
.pin-dots { display: flex; gap: var(--s-3); justify-content: center; }
.pin-dots span { width: 14px; height: 14px; border-radius: 50%; border: 2px solid var(--line-control); }
.pin-dots span.on { background: var(--paprika); border-color: var(--paprika); }
.plan-card { padding: var(--s-5); border-radius: var(--r-lg); border: 1.5px solid var(--line); background: var(--surface); }
.plan-card.is-on { border-color: var(--paprika); }
.plan-price { font-family: var(--font-display); font-size: var(--t-36); font-weight: 500; letter-spacing: -0.02em; font-variation-settings: 'opsz' 48, 'SOFT' 40; }
.plan-price small { font-size: var(--t-14); font-family: var(--font-ui); color: var(--ink-3); font-weight: 500; letter-spacing: 0; }
.sound-toggle { display: inline-flex; align-items: center; gap: var(--s-2); }
@media (max-width: 900px) { .od, .chat-pane, .editor, .settings-grid { grid-template-columns: 1fr; } .wallet-tiles { grid-template-columns: 1fr 1fr; } }