/* SnapOS customer/staff channels UX layer — presentation only. */
:root{--channel-touch:48px;--channel-radius:16px;--channel-focus:#4f46e5}
button,a,input,select,textarea{font-family:inherit}
button,a,[role="button"],input,select,textarea{-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid color-mix(in srgb,var(--channel-focus) 30%,transparent);outline-offset:2px}
.btn{min-height:var(--channel-touch)}
.networkBanner{padding-bottom:max(10px,env(safe-area-inset-bottom))}
.kioskDialog .dialogFoot{padding-bottom:max(16px,env(safe-area-inset-bottom))}
.kioskDialog .dialogClose{min-width:44px;min-height:44px}
.kioskDialog input,.kioskDialog select,.kioskDialog textarea{font-size:16px}
.handControls{background:rgba(255,255,255,.96);backdrop-filter:blur(10px)}
#sync{display:inline-flex;align-items:center;min-height:30px;padding:4px 9px;border-radius:999px;background:#f8fafc;border:1px solid #e2e8f0;font-weight:700;font-size:12px}
.kdsTop .topActions{flex-wrap:wrap}.kdsTop .btn{min-height:44px}.kdsContent{min-width:0}.ordersGrid{min-width:0}
.ticket{min-width:0}.ticket .orderNo{overflow-wrap:anywhere}
.paymentResultCard .actions,.orderActionCard .actions{gap:10px}
@media(max-width:720px){
  .kioskDialog{max-height:100dvh}.kioskDialog .dialogFoot{gap:8px}.kioskDialog .dialogFoot .btn{flex:1;min-width:0}
  .handheldOrderToolbar{align-items:stretch}.handheldOrderToolbar>.btn{width:100%}.handTop{min-height:64px}
  .kdsTop{align-items:flex-start}.kdsTop .topActions{width:100%}.kdsTop .topActions .btn{flex:1}
  .paymentResultCard,.orderActionCard{border-radius:22px!important;padding:22px!important}.paymentResultCard .actions,.orderActionCard .actions{display:grid!important;grid-template-columns:1fr!important}.paymentResultCard .btn,.orderActionCard .btn{width:100%}
}
@media(max-width:420px){
  .kioskWelcome h1{font-size:clamp(24px,8vw,34px)}
  .reviewSteps small{font-size:11px}
  .orderNumber,.orderNo{font-size:clamp(22px,8vw,30px)!important}
}

/* 20.9.85 — Smooth customer-channel experience */
:root{--cx-ease:cubic-bezier(.2,.8,.2,1);--cx-fast:140ms;--cx-normal:220ms}
button,.btn,.product,.menuCard,.orderCard,.cartItem{transition:transform var(--cx-fast) var(--cx-ease),box-shadow var(--cx-fast) ease,border-color var(--cx-fast) ease,background-color var(--cx-fast) ease}
button:active,.btn:active{transform:scale(.985)}
.products,.productGrid,.menuGrid,.orders,.ordersBoard{content-visibility:auto;contain-intrinsic-size:1px 620px}
img{content-visibility:auto}
[aria-busy="true"]{pointer-events:none;opacity:.72}
.customerLoading,.loadingState,.emptyState{min-height:96px}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
@media(max-width:700px){button,.btn,[role="button"]{min-height:46px}.actions,.footerActions,.checkoutActions{padding-bottom:max(8px,env(safe-area-inset-bottom))}input,select,textarea{font-size:16px}}

/* Tenant-controlled order-channel identity — shared presentation path. */
html[data-order-theme] body.kioskV2{background-color:var(--tenant-channel-bg,var(--bg));color:var(--tenant-channel-text,var(--text));background-image:linear-gradient(rgba(0,0,0,var(--tenant-channel-overlay,0)),rgba(0,0,0,var(--tenant-channel-overlay,0))),var(--tenant-channel-background-image,none);background-size:cover;background-position:center;background-attachment:fixed}
html[data-order-theme] .kioskTopV2{background:var(--tenant-channel-header,var(--surface));border-color:var(--tenant-channel-line,var(--line));color:var(--tenant-channel-text,var(--text))}
html[data-order-theme] .kioskTopV2 .brand small,html[data-order-theme] .productInfo p,html[data-order-theme] .cartItemV2 small,html[data-order-theme] .emptyState,html[data-order-theme] .reviewDataIntro span{color:var(--tenant-channel-muted,var(--muted))}
html[data-order-theme] .productV2,html[data-order-theme] .kioskWelcome,html[data-order-theme] .reviewCard,html[data-order-theme] .confirmCard{background:var(--tenant-channel-surface,var(--surface));border-color:var(--tenant-channel-line,var(--line));border-radius:var(--tenant-channel-radius,var(--r));color:var(--tenant-channel-text,var(--text))}
html[data-order-theme] .kioskCartV2,html[data-order-theme] .kioskDialog{background:var(--tenant-channel-cart,var(--surface));border-color:var(--tenant-channel-line,var(--line));color:var(--tenant-channel-text,var(--text))}
html[data-order-theme] .cartItemV2,html[data-order-theme] .reviewSummary,html[data-order-theme] .branchPill,html[data-order-theme] .segmented{border-color:var(--tenant-channel-line,var(--line));border-radius:calc(var(--tenant-channel-radius,var(--r)) - 4px)}
html[data-order-theme] .chip{background:var(--tenant-channel-surface,var(--surface));border-color:var(--tenant-channel-line,var(--line));color:var(--tenant-channel-text,var(--text))}
html[data-order-theme] .chip.active,html[data-order-theme] .segmented button.active{background:var(--tenant-channel-primary,var(--primary));color:var(--tenant-channel-button-text,#fff);border-color:var(--tenant-channel-primary,var(--primary))}
html[data-order-theme] .btn-primary,html[data-order-theme] .payBtn{background:linear-gradient(135deg,var(--tenant-channel-primary,var(--primary)),var(--tenant-channel-accent,var(--accent)));color:var(--tenant-channel-button-text,#fff)}
html[data-order-theme] input,html[data-order-theme] select,html[data-order-theme] textarea{border-color:var(--tenant-channel-line,var(--line));color:var(--tenant-channel-text,var(--text));background:var(--tenant-channel-surface,var(--surface))}
.deliveryLocationTabs{display:flex;gap:7px;margin-bottom:10px}.deliveryLocationTabs button{flex:1;min-height:42px;border:1px solid var(--tenant-channel-line,var(--line));border-radius:12px;background:var(--tenant-channel-surface,#fff);color:var(--tenant-channel-text,var(--text));font-weight:850}.deliveryLocationTabs button.active{background:var(--tenant-channel-primary,var(--primary));border-color:var(--tenant-channel-primary,var(--primary));color:var(--tenant-channel-button-text,#fff)}.deliveryMapRow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center}.deliveryMapRow .btn{white-space:nowrap}@media(max-width:520px){.deliveryMapRow{grid-template-columns:1fr}.deliveryMapRow .btn{width:100%}}