/* Kitchen board. Everything is scoped to #yk-wrap.yk2 so theme and menu styles cannot leak in. */
#yk-wrap.yk2{
  --yk-fs:16px;--yk-bg:#f1f4f8;--yk-surface:#fff;--yk-ink:#101828;--yk-muted:#5b6678;--yk-line:#dfe4ec;
  --yk-new:#f59e0b;--yk-prep:#2563eb;--yk-ready:#059669;--yk-late:#dc2626;--yk-soon:#d97706;
  box-sizing:border-box;margin:0;padding:14px;background:var(--yk-bg);color:var(--yk-ink);
  font:400 var(--yk-fs)/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;border-radius:16px;
}
#yk-wrap.yk2 *,#yk-wrap.yk2 *::before,#yk-wrap.yk2 *::after{box-sizing:border-box}
#yk-wrap.yk2.yk-size-lg{--yk-fs:18px}
#yk-wrap.yk2.yk-size-xl{--yk-fs:21px}

/* Header */
#yk-wrap.yk2 .yk-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;margin-bottom:12px}
#yk-wrap.yk2 .yk-brand{display:flex;align-items:baseline;gap:12px}
#yk-wrap.yk2 .yk-kicker{font-size:.75em;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--yk-muted)}
#yk-wrap.yk2 .yk-clock{font-size:1.9em;font-weight:800;font-variant-numeric:tabular-nums;letter-spacing:-.02em}
#yk-wrap.yk2 .yk-tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
#yk-wrap.yk2 .yk-sync{font-size:.8em;color:var(--yk-muted);padding:6px 12px;background:var(--yk-surface);border-radius:999px;border:1px solid var(--yk-line)}
#yk-wrap.yk2 .yk-sync::before{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--yk-ready);margin-right:8px;vertical-align:middle}
#yk-wrap.yk2 .yk-sync.is-error{color:#b42318;border-color:#fda29b;background:#fff4f2}
#yk-wrap.yk2 .yk-sync.is-error::before{background:var(--yk-late)}
#yk-wrap.yk2 .yk-tool,#yk-wrap.yk2 .yk-toggle{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px;border:1px solid var(--yk-line);border-radius:12px;background:var(--yk-surface);color:var(--yk-ink);font:600 .85em/1 inherit;font-family:inherit;text-decoration:none;cursor:pointer}
#yk-wrap.yk2 .yk-tool:hover,#yk-wrap.yk2 .yk-toggle:hover{border-color:#b9c2d0}
#yk-wrap.yk2 .yk-tool.is-off{color:#b42318;background:#fff4f2;border-color:#fda29b}
#yk-wrap.yk2 .yk-tool-ico{font-size:1.1em;line-height:1}
#yk-wrap.yk2 .yk-toggle input{width:18px;height:18px;margin:0;accent-color:var(--yk-prep)}
#yk-wrap.yk2 .yk-awake{font-size:.75em;font-weight:700;color:#067647;background:#ecfdf3;border-radius:999px;padding:6px 10px}
#yk-wrap.yk2 .yk-tool:focus-visible,#yk-wrap.yk2 .yk-btn:focus-visible,#yk-wrap.yk2 .yk-more-btn:focus-visible,#yk-wrap.yk2 .yk-menu-item:focus-visible{outline:3px solid #1d4ed8;outline-offset:2px}

/* Lanes */
#yk-wrap.yk2 .yk-lanes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;align-items:start}
#yk-wrap.yk2 .yk-lane{background:#e7ecf3;border-radius:16px;padding:10px;min-width:0}
#yk-wrap.yk2 .yk-lane>h2{font-family:inherit;text-transform:none;display:flex;align-items:center;justify-content:space-between;margin:0 0 10px;padding:12px 16px;border-radius:12px;color:#fff;font-size:1.05em;font-weight:800;letter-spacing:.02em;line-height:1.2}
#yk-wrap.yk2 .yk-lane>h2 strong{display:inline-grid;place-items:center;min-width:2em;height:2em;padding:0 .4em;border-radius:999px;background:rgba(255,255,255,.28);font-size:1em}
#yk-wrap.yk2 .yk-lane-new>h2{background:var(--yk-new);color:#2b1700}
#yk-wrap.yk2 .yk-lane-preparing>h2{background:var(--yk-prep)}
#yk-wrap.yk2 .yk-lane-ready>h2{background:var(--yk-ready)}
#yk-wrap.yk2 .yk-col{display:flex;flex-direction:column;gap:10px}
#yk-wrap.yk2 .yk-empty{padding:28px 12px;text-align:center;color:var(--yk-muted);font-size:.9em;border:2px dashed #c9d2e0;border-radius:12px}

/* Ticket */
#yk-wrap.yk2 .yk-ticket{position:relative;background:var(--yk-surface);border-radius:14px;border:1px solid var(--yk-line);border-left:8px solid var(--yk-new);padding:14px 14px 12px;box-shadow:0 1px 2px rgba(16,24,40,.06)}
#yk-wrap.yk2 .yk-ticket-preparing{border-left-color:var(--yk-prep)}
#yk-wrap.yk2 .yk-ticket-ready{border-left-color:var(--yk-ready)}
#yk-wrap.yk2 .yk-ticket.is-soon{box-shadow:0 0 0 2px #fcd34d}
#yk-wrap.yk2 .yk-ticket.is-late{border-color:var(--yk-late);border-left-color:var(--yk-late);box-shadow:0 0 0 2px #fecaca}
#yk-wrap.yk2 .yk-ticket.is-waiting{animation:yk-pulse 1.8s ease-in-out infinite}
#yk-wrap.yk2 .yk-ticket.is-fresh::after{content:attr(data-new);position:absolute;top:-8px;right:12px;padding:2px 10px;border-radius:999px;background:#7c3aed;color:#fff;font-size:.7em;font-weight:800;letter-spacing:.08em}
#yk-wrap.yk2 .yk-ticket.is-fresh{box-shadow:0 0 0 3px #c4b5fd}
@keyframes yk-pulse{50%{box-shadow:0 0 0 6px #fde68a}}
@media (prefers-reduced-motion:reduce){#yk-wrap.yk2 .yk-ticket.is-waiting{animation:none;box-shadow:0 0 0 3px #f59e0b}}

#yk-wrap.yk2 .yk-t-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
#yk-wrap.yk2 .yk-t-id{display:flex;flex-direction:column;align-items:flex-start;gap:6px;min-width:0}
#yk-wrap.yk2 .yk-t-num{font-size:1.6em;font-weight:900;line-height:1;letter-spacing:-.02em}
#yk-wrap.yk2 .yk-t-due{text-align:right;display:flex;flex-direction:column;gap:2px}
#yk-wrap.yk2 .yk-t-count{font-size:1.25em;font-weight:900;line-height:1.1;font-variant-numeric:tabular-nums}
#yk-wrap.yk2 .yk-t-duetime{font-size:.85em;font-weight:700;color:var(--yk-muted)}
#yk-wrap.yk2 .yk-ticket.is-soon .yk-t-count{color:var(--yk-soon)}
#yk-wrap.yk2 .yk-ticket.is-late .yk-t-count{color:var(--yk-late)}

#yk-wrap.yk2 .yk-chip{display:inline-block;padding:3px 10px;border-radius:999px;font-size:.75em;font-weight:800;line-height:1.4;letter-spacing:.03em;text-transform:uppercase;background:#eef1f6;color:#344054}
#yk-wrap.yk2 .yk-type-pickup{background:#e0ecff;color:#1d4ed8}
#yk-wrap.yk2 .yk-type-delivery{background:#fde7f3;color:#a3166b}
#yk-wrap.yk2 .yk-type-dinein{background:#e1f5ea;color:#067647}
#yk-wrap.yk2 .yk-pay.is-paid{background:#dcfae6;color:#067647}
#yk-wrap.yk2 .yk-pay.is-unpaid{background:#fef0c7;color:#93370d}

#yk-wrap.yk2 .yk-t-who{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;margin:10px 0 2px}
#yk-wrap.yk2 .yk-t-who strong{font-size:1.05em;font-weight:700}
#yk-wrap.yk2 .yk-t-where{font-weight:800;color:#344054}
#yk-wrap.yk2 .yk-t-age{flex-basis:100%;color:var(--yk-muted);font-size:.78em}

#yk-wrap.yk2 .yk-items{list-style:none;margin:10px 0 0;padding:0;border-top:1px solid var(--yk-line)}
#yk-wrap.yk2 .yk-item{display:flex;gap:12px;align-items:flex-start;padding:10px 0;border-bottom:1px solid #eef1f6}
#yk-wrap.yk2 .yk-qty{flex:0 0 auto;display:inline-grid;place-items:center;min-width:2em;height:2em;border-radius:10px;background:var(--yk-ink);color:#fff;font-size:1.05em;font-weight:900}
#yk-wrap.yk2 .yk-item-body{display:flex;flex-direction:column;gap:3px;min-width:0}
#yk-wrap.yk2 .yk-item-name{font-size:1.1em;font-weight:800;line-height:1.25;overflow-wrap:anywhere}
#yk-wrap.yk2 .yk-item-mod{font-size:.9em;color:#475467}
#yk-wrap.yk2 .yk-alert{display:block;margin-top:2px;padding:6px 10px;border-radius:8px;background:#fef3c7;border-left:5px solid #d97706;color:#7a2e0e;font-weight:800;overflow-wrap:anywhere}
#yk-wrap.yk2 .yk-alert::before{content:"\26A0\FE0F  "}
#yk-wrap.yk2 .yk-note{margin:10px 0 0;padding:8px 12px;border-radius:10px;background:#fff7d6;border:1px solid #fde68a;font-weight:700;overflow-wrap:anywhere}
#yk-wrap.yk2 .yk-note::before{content:"\1F4DD  "}
#yk-wrap.yk2 .yk-review{margin:10px 0 0;padding:8px 12px;border-radius:10px;background:#fef3f2;color:#b42318;font-weight:700;font-size:.9em}

#yk-wrap.yk2 .yk-t-meta{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:10px}
#yk-wrap.yk2 .yk-t-total{font-size:.85em;font-weight:700;color:var(--yk-muted);font-variant-numeric:tabular-nums}

/* Actions: one big primary button, everything else tucked behind "more". */
#yk-wrap.yk2 .yk-t-foot{display:flex;gap:8px;margin-top:12px;align-items:stretch}
#yk-wrap.yk2 .yk-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:56px;padding:0 18px;border:0;border-radius:12px;font:800 1em/1.2 inherit;font-family:inherit;cursor:pointer;text-align:center;transition:filter .12s,transform .06s}
#yk-wrap.yk2 .yk-btn:active{transform:translateY(1px)}
#yk-wrap.yk2 .yk-btn:disabled{opacity:.55;cursor:wait}
#yk-wrap.yk2 .yk-btn-primary{flex:1;background:var(--yk-prep);color:#fff}
#yk-wrap.yk2 .yk-ticket-new .yk-btn-primary{background:var(--yk-new);color:#2b1700}
#yk-wrap.yk2 .yk-ticket-ready .yk-btn-primary{background:var(--yk-ready)}
#yk-wrap.yk2 .yk-btn-primary:hover{filter:brightness(.95)}
#yk-wrap.yk2 .yk-btn-ghost{min-height:44px}
#yk-wrap#yk-wrap.yk2 .yk-btn-ghost{background:#fff;color:#101828;border:1px solid #d0d5dd}
#yk-wrap.yk2 .yk-btn-ghost:disabled{opacity:.4}
#yk-wrap.yk2 .yk-more{position:relative;flex:0 0 auto}
#yk-wrap.yk2 .yk-more-btn{list-style:none;display:grid;place-items:center;width:56px;height:56px;border-radius:12px;border:1px solid var(--yk-line);background:#f8fafc;color:#344054;font-size:1.5em;font-weight:900;line-height:1;cursor:pointer;user-select:none}
#yk-wrap.yk2 .yk-more-btn::-webkit-details-marker{display:none}
#yk-wrap.yk2 .yk-more[open] .yk-more-btn{background:#eef2f7}
#yk-wrap.yk2 .yk-more-menu{position:absolute;right:0;bottom:calc(100% + 6px);z-index:20;min-width:230px;padding:6px;border-radius:12px;background:#fff;border:1px solid var(--yk-line);box-shadow:0 12px 30px rgba(16,24,40,.18);display:flex;flex-direction:column}
#yk-wrap.yk2 .yk-menu-item{display:block;width:100%;min-height:48px;padding:12px 14px;border:0;border-radius:8px;background:transparent;color:var(--yk-ink);font:600 .95em/1.2 inherit;font-family:inherit;text-align:left;text-decoration:none;cursor:pointer}
#yk-wrap.yk2 .yk-menu-item:hover{background:#f2f5f9}
#yk-wrap.yk2 .yk-menu-danger{color:#b42318}
#yk-wrap.yk2 .yk-menu-danger.is-armed{background:#b42318;color:#fff}
#yk-wrap.yk2 .yk-pagination{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:12px;font-size:.85em;color:var(--yk-muted)}

/* Narrow screens: lanes stack. */
@media (max-width:960px){#yk-wrap.yk2 .yk-lanes{grid-template-columns:1fr}#yk-wrap.yk2 .yk-tool-txt{display:none}#yk-wrap.yk2 .yk-tool{padding:0 12px}}

/* Theme-free kitchen screen: the board fills the display and each lane scrolls on its own. */
body.yatoon-kds-screen{margin:0;background:#f1f4f8;min-height:100vh;display:flex;flex-direction:column}
body.yatoon-kds-screen .yatoon-connection-bar{margin:0;border-radius:0;border-width:0 0 1px;border-left-width:4px;padding:6px 14px;font-size:12px;gap:8px}
body.yatoon-kds-screen .yatoon-connection-bar details,body.yatoon-kds-screen .yatoon-connection-bar .yatoon-audio-state{display:none}
body.yatoon-kds-screen .yatoon-connection-bar button{min-height:32px;font-size:12px;padding:0 10px}
body.yatoon-kds-screen .yatoon-operations-bar{margin:0;border-radius:0}
body.yatoon-kds-screen #yk-wrap.yk2{flex:1;display:flex;flex-direction:column;border-radius:0;min-height:0}
body.yatoon-kds-screen #yk-wrap.yk2 .yk-lanes{flex:1;min-height:0;align-items:stretch}
body.yatoon-kds-screen #yk-wrap.yk2 .yk-lane{display:flex;flex-direction:column;min-height:0;max-height:calc(100vh - 150px)}
body.yatoon-kds-screen #yk-wrap.yk2 .yk-col{overflow-y:auto;padding:2px 2px 90px;-webkit-overflow-scrolling:touch}
@media (max-width:960px){body.yatoon-kds-screen #yk-wrap.yk2 .yk-lane{max-height:none}}

#yk-wrap.yk2 .yk-pagination .yk-btn{flex:0 0 auto;width:auto;min-height:40px;padding:0 16px}
#yk-wrap.yk2 .yk-pagination .yk-btn[hidden]{display:none}

#yk-wrap .yk-language{position:relative}#yk-wrap .yk-language summary{display:flex;align-items:center;gap:6px;cursor:pointer;list-style:none;padding:8px;border-radius:10px}#yk-wrap .yk-language summary::-webkit-details-marker{display:none}#yk-wrap .yk-language .yatoon-language-flag img{width:24px;height:24px;border-radius:50%;object-fit:cover}#yk-wrap .yk-language-panel{position:absolute;right:0;top:100%;z-index:100;min-width:200px;padding:6px;border:1px solid #e5e7eb;border-radius:12px;background:#fff;box-shadow:0 8px 24px #0002}#yk-wrap .yk-language-panel button{display:flex;align-items:center;gap:9px;width:100%;border:0;border-radius:8px;background:#fff;padding:9px;text-align:left;color:#101828;cursor:pointer}#yk-wrap .yk-language-panel button:hover,#yk-wrap .yk-language-panel button[aria-current]{background:#f1f4f8}#yk-wrap .yk-language-panel button span:nth-child(2){flex:1}