/* SaborPOS only: fit the browser viewport, including scaled 1920 x 1080 panels. */
html { -webkit-text-size-adjust:100%; text-size-adjust:100%; }
@media (min-width:700px) {
 .app-shell { height:100vh; height:100dvh; }
 .topbar { flex:0 0 auto; height:auto; min-height:60px; padding:8px 12px; gap:6px 8px; flex-wrap:wrap; }
 .brand { width:172px; min-width:0; flex:0 0 172px; gap:6px; }
 .brand-mark { width:52px; height:38px; }
 .brand div { min-width:0; }
 .brand strong { font-size:13px; letter-spacing:.015em; }
 .brand small { margin-top:4px; font-size:7px; line-height:1.2; letter-spacing:.04em; }
 .admin-caret { margin-left:0; font-size:16px; }
 .location-pill { min-width:0; max-width:96px; min-height:40px; padding:7px; gap:7px; font-size:10px; flex:0 0 96px; }
 .status-dot { flex-shrink:0; }
 .menu-mode-switcher { min-width:0; gap:5px; }
 .menu-mode-button { min-width:0; width:88px; height:44px; padding:4px 7px; font-size:11px; line-height:1.15; }
 .top-actions { min-width:0; margin-left:auto; gap:6px; }
 .employee-switch-button { min-width:0; width:134px; height:44px; padding:4px 6px; gap:6px; flex:0 0 134px; }
 .employee-switch-button .employee-avatar { flex:0 0 28px; width:28px; height:28px; font-size:10px; }
 .employee-switch-button strong { font-size:11px; }
 .employee-switch-button small { font-size:7px; }
 .employee-switch-button i { flex-shrink:0; }
 .top-button { height:44px; padding:4px 7px; gap:5px; justify-content:center; font-size:11px; line-height:1.15; flex-shrink:0; }
 .top-button span { display:inline; font-size:15px; flex-shrink:0; }
 #openChecksButton { width:116px; }
 #storeCheckButton { width:110px; }
 .store-check-top strong { display:block; font-size:11px; }
 .top-button b { flex-shrink:0; min-width:20px; height:20px; padding:0 4px; font-size:10px; }
 .station-preference-controls { gap:5px; }
 .preference-button { width:40px; height:44px; flex:0 0 40px; }
 .clock { display:block; min-width:88px; width:88px; min-height:44px; margin:0; padding:4px; }
 .clock strong { font-size:13px; white-space:nowrap; }
 .clock small { font-size:8px; letter-spacing:.03em; }
 .register-layout { grid-template-columns:clamp(230px,22vw,310px) minmax(0,1fr); }
 .catalog-toolbar { flex:0 0 auto; min-height:60px; padding:8px 14px; gap:10px; }
 .search-wrap { min-width:0; }
 .scale-status { min-width:190px; padding:0 9px; gap:6px; }
 .catalog-control-strip { flex:0 0 auto; padding:6px 14px; gap:6px; }

 .order-touch-controls { gap:6px; }
 .touch-selector { padding-left:8px; padding-right:22px; gap:5px; }
 .touch-selector i { right:7px; }
 .catalog-heading { flex:0 0 auto; padding:8px 14px; }
 .catalog-heading h2 { margin-top:4px; font-size:18px; }
 .product-grid { padding:6px 14px 12px; grid-template-columns:repeat(auto-fill,minmax(94px,1fr)); grid-auto-rows:minmax(54px,auto); gap:6px; }
 .product-card { width:100%; height:auto; min-height:54px; padding:5px 5px; gap:2px; }
 .product-card h3 { font-size:12px; line-height:1.12; }
 .product-card .variant { margin-top:3px; font-size:10px; }
 .product-card footer { min-height:18px; }
 .product-card .price { font-size:11px; }
 .product-card .add { right:6px; bottom:6px; width:18px; height:18px; font-size:14px; }
 .register-footer { flex:0 0 auto; padding-inline:14px; }
 .check-head { min-height:66px; padding:10px 14px; }
 .check-head h1 { font-size:17px; }
 .customer-strip { min-height:54px; margin:8px 10px 6px; padding:7px; grid-template-columns:32px minmax(0,1fr) auto; gap:7px; }
 .customer-avatar { width:32px; height:32px; }
 .check-actions { margin:0 10px 10px; grid-template-columns:minmax(100px,.72fr) minmax(0,1fr); gap:6px; }
 .guest-check-button { padding-inline:8px; }
 .pay-button { padding-inline:10px; gap:6px; }
 .pay-button span { font-size:12px; }
 .pay-button strong { font-size:17px; }
}
/* Keep every control reachable when Android density produces a narrower CSS viewport. */
@media (min-width:700px) and (max-width:1239px) {
 .menu-mode-switcher { margin-left:auto; }
 .top-actions { width:100%; justify-content:flex-end; }
 .employee-switch-button { margin-right:auto; }
}
@media (min-width:700px) and (max-height:800px) {
 .line-items { min-height:55px; }
 .check-note { min-height:34px; margin:0 10px 5px; padding:6px 8px; }
 .totals { padding:6px 13px; }
 .totals>div { margin:3px 0; }
 .totals .grand-total { margin-top:5px; padding-top:5px; }
 .totals .payment-total-row { margin-top:5px; padding-top:5px; }
 .totals .balance-total-row { margin-top:5px; padding:6px 8px; }
 .check-actions,.guest-check-button { min-height:48px; }
 .pay-button { height:48px; }
 .register-footer { min-height:28px; font-size:9px; }
}
/* Phone browser fallback; the large POS keeps the side-by-side register. */
@media (max-width:699px) {
 .topbar { height:auto; min-height:64px; flex-wrap:wrap; padding-block:7px; }
 .menu-mode-switcher { margin-left:auto; }
 .top-actions { width:100%; margin-left:0; flex-wrap:wrap; gap:5px; }
 .employee-switch-button { min-width:0; width:130px; margin-right:auto; }
 .employee-switch-button .employee-avatar { flex-shrink:0; }
 .station-preference-controls { gap:4px; }
 .catalog-control-strip { min-width:0; }
}

html[data-theme="light"] .empty-check strong { color:#4f5b60; }
html[data-theme="light"] .active-table-number { color:#24463e; }
@media (min-width:700px) and (max-height:620px) {
 .check-panel { overflow-y:auto; }
 .check-head { min-height:58px; padding:6px 10px; flex-shrink:0; }
 .check-head h1 { margin-top:4px; font-size:15px; line-height:1.15; }
 .active-table-number { min-width:54px; height:42px; margin-right:6px; }
 .check-head .icon-button { width:40px; height:42px; flex-shrink:0; }
 .customer-strip { min-height:46px; margin:5px 8px; padding:5px 7px; grid-template-columns:28px minmax(0,1fr) auto; flex-shrink:0; }
 .customer-avatar { width:28px; height:28px; }
 .line-items { min-height:0; }
 .check-note { min-height:32px; margin:0 8px 4px; padding:5px 7px; flex-shrink:0; }
 .totals { padding:4px 10px; flex-shrink:0; }
 .totals>div { margin:2px 0; }
 .totals .grand-total { margin-top:4px; padding-top:4px; }
 .totals .payment-total-row { margin-top:3px; padding-top:3px; }
 .totals .balance-total-row { margin-top:4px; padding:4px 8px; }
 .check-actions { margin:0 8px 8px; flex-shrink:0; }
 .catalog-heading { padding-block:6px; }
 .catalog-heading h2 { font-size:16px; }
}

/* The full category set wraps into rows. Never create off-screen columns. */
.category-tabs { display:grid; width:100%; min-width:0; min-height:0; height:auto; grid-template-columns:repeat(auto-fit,minmax(78px,1fr)); grid-template-rows:none; grid-auto-flow:row; grid-auto-columns:auto; grid-auto-rows:minmax(38px,auto); gap:4px; padding:0; overflow:visible; justify-content:stretch; align-content:start; }
.category-tab { width:100%; min-width:0; height:100%; min-height:38px; padding:4px; font-size:10.5px; line-height:1.12; border-radius:7px; text-align:center; overflow-wrap:normal; }
/* Compact choices apply at every viewport, including density-scaled Android. */
.product-grid { grid-template-columns:repeat(auto-fill,minmax(94px,1fr)); grid-auto-rows:minmax(54px,auto); gap:5px; }
.product-card { width:100%; height:auto; min-height:54px; padding:5px; gap:2px; border-radius:8px; }
.product-card h3 { font-size:12px; line-height:1.12; }
.product-card .variant { font-size:9px; margin-top:2px; }
.product-card footer { min-height:15px; padding-inline:13px; }
.product-card .price { font-size:11px; }
.product-card .unit { display:none; }
.product-card .add { right:4px; bottom:4px; width:16px; height:16px; font-size:12px; }
.sabor-board .sb-options { grid-template-columns:repeat(auto-fill,minmax(100px,1fr)); gap:4px; align-content:start; }
.sabor-board .sb-group { padding:3px 0; }
.sabor-board .sb-group>header { min-height:28px; gap:4px; }
.sabor-board .sb-group h3 { font-size:12px; line-height:1.12; }
.sabor-board .sb-rule { font-size:10px; }
.sabor-board .sb-clear { min-height:30px; height:30px; width:30px; padding:0; font-size:17px; flex-shrink:0; }
.sabor-board .sb-option { min-height:34px; }
.sabor-board .sb-group .sb-option>span { padding:4px; border-radius:7px; }
.sabor-board .sb-option strong { font-size:11px; line-height:1.12; }
.sabor-board .sb-option small { font-size:9px; }
.sabor-board .sb-repeat { border-radius:7px; }
.sabor-board .sb-repeat-title { min-height:27px; padding:3px 4px; gap:1px; }
.sabor-board .sb-repeat .sb-stepper { padding:0 2px 2px; gap:3px; }
.sabor-board .sb-group .sb-stepper button { min-height:32px; height:32px; min-width:28px; padding:0; font-size:16px; border-radius:6px; }
.sabor-board-head { min-height:38px; padding:3px 10px; }
.sabor-board-head h2 { font-size:17px; line-height:1.15; }
.sabor-board .sb-close { width:34px; height:34px; min-height:34px; font-size:24px; }
.sabor-board .sb-controls { padding:0 10px 4px; }
.sabor-board .sb-search input { min-height:34px; height:34px; padding:6px 9px; font-size:12px; }
.sabor-board .sb-section-actions .sb-tabs button,.sabor-board .sb-add-top { min-height:38px; height:38px; font-size:12px; padding:5px; }
.sabor-board .sb-scroll { padding:0 10px 6px; }
.sabor-board .sb-footer { padding:5px 10px; }
.sabor-board .sb-footer .sb-notes { height:38px; min-height:38px; max-height:38px; padding:7px; font-size:12px; }
.sabor-board .sb-footer .sb-add { min-height:38px; height:38px; padding:5px 14px; font-size:13px; }
/* Put group names beside choices to remove repeated empty vertical space. */
@media (min-width:900px) {
 .sabor-board .sb-group:not([hidden]) { display:grid; grid-template-columns:126px minmax(0,1fr); gap:8px; align-items:start; }
 .sabor-board .sb-group>header { align-items:flex-start; padding-top:3px; }
 .sabor-board .sb-group>header>div { display:block; }
 .sabor-board .sb-rule { display:block; margin-top:3px; }
}
@media (min-width:700px) {
 body { overflow:hidden; }
 .app-shell { min-height:0; overflow:hidden; }
 .topbar { position:relative; }
 .brand div { display:block; }
 .top-button strong { display:block; }
 .register-layout { display:grid; }
 .check-panel,.catalog-panel { min-height:0; }
 .catalog-toolbar { min-height:44px; height:44px; padding:5px 10px; }
 .search-wrap input { height:34px; min-height:34px; font-size:12px; }
 .scale-status { min-width:0; width:160px; min-height:34px; height:34px; font-size:10px; }
 .catalog-control-strip { padding:5px 10px; gap:5px; }
 .order-touch-controls { grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-rows:34px; padding:0; border:0; gap:4px; }
 .touch-selector,.touch-selector.order-type-selector,.touch-selector.prep-route-selector { min-height:34px; height:34px; padding:3px 16px 3px 6px; }
 .touch-selector small { font-size:8px; }
 .touch-selector strong { font-size:10px; }
 .catalog-heading { padding:5px 10px; align-items:center; }
 .catalog-heading .eyebrow { display:none; }
 .catalog-heading h2 { margin:0; font-size:15px; line-height:1.15; }
 .product-grid { padding:5px 10px 8px; }
 .register-footer { min-height:22px; padding-inline:10px; font-size:9px; }
}
@media (min-width:700px) and (max-width:1000px) {
 .topbar { min-height:0; padding:5px 8px; gap:4px 6px; }
 .brand { flex-basis:144px; width:144px; }
 .brand strong { font-size:11px; }
 .brand small { font-size:6px; }
 .brand-mark { width:44px; height:32px; }
 .menu-mode-button { width:78px; height:36px; }
 .location-pill { min-height:34px; flex-basis:82px; max-width:82px; font-size:9px; }
 .employee-switch-button,.top-button,.preference-button { height:36px; }
 .clock { min-height:36px; }
 .top-actions { gap:4px; }
 .preference-button { width:34px; flex-basis:34px; }
 #openChecksButton { width:99px; }
 #storeCheckButton { width:92px; }
}
@media (min-width:700px) and (max-height:620px) {
 .empty-check { padding:12px 8px; }
 .empty-check>span { font-size:24px; margin-bottom:5px; }
 .empty-check strong { font-size:12px; }
 .empty-check p { font-size:10px; }
 .line-items { overflow-y:auto; }
 .totals { font-size:10px; }
 .totals .grand-total strong,.totals .balance-total-row strong { font-size:16px; }
}

/* Keep branding and settlement labels from colliding in a narrow register. */
@media (min-width:700px) {
 .brand strong,.brand small { display:block; }
 .brand small { max-width:100%; white-space:normal; line-height:1.15; }
 .pay-button { grid-template-columns:minmax(0,1fr) auto; grid-template-rows:auto auto; align-content:center; justify-items:start; gap:1px 5px; padding:4px 9px; }
 .pay-button>span:first-child { grid-column:1 / -1; font-size:11px; line-height:1.1; white-space:nowrap; }
 .pay-button strong { grid-column:1; font-size:16px; line-height:1.1; }
 .pay-button>span:last-child { grid-column:2; grid-row:2; justify-self:end; font-size:18px; }
 .guest-check-button strong { font-size:10px; line-height:1.1; }
 .guest-check-button small { font-size:8px; line-height:1.1; }
}

@media (min-width:700px) and (max-height:620px) {
 .check-head>.eyebrow,.check-head>div>.eyebrow { font-size:8px; letter-spacing:.08em; white-space:nowrap; }
 .check-head>div { min-width:0; }
 .check-head h1 { font-size:14px; line-height:1.1; margin-top:3px; }
 #activeTableNumber[hidden],#markDeliveredButton[hidden] { display:none; }
 .customer-strip strong { font-size:12px; line-height:1.1; }
 .customer-strip small { font-size:9px; line-height:1.1; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
 .customer-strip>span:nth-child(2) { min-width:0; }
 .line-items { padding-top:0; padding-bottom:0; }
 .open-payment-list:empty { display:none; }
}

/* Keep the two related menu buttons in one column at every grid width. */
.category-pair { display:grid; grid-template-rows:repeat(2,minmax(38px,1fr)); grid-row:span 2; gap:4px; min-width:0; }
.category-pair .category-tab { width:100%; height:100%; }

/* Register categories: ten across, two rows; Nachos stays under Loaded Fries. */
@media (min-width:700px) {
 .category-tabs { grid-template-columns:repeat(10,minmax(0,1fr)); grid-auto-rows:minmax(38px,1fr); }
 .category-tab { overflow-wrap:anywhere; }
}