/* Tab2Kit Go — Material You theme layer (Bootstrap 3 compatible) */
:root {
  --md-background: #fffbfe;
  --md-on-surface: #1c1b1f;
  --md-primary: #00382c;
  --md-on-primary: #ffffff;
  --md-primary-container: #b6f1dc;
  --md-on-primary-container: #002019;
  --md-secondary-container: #e8def8;
  --md-on-secondary-container: #1d192b;
  --md-tertiary: #7d5260;
  --md-tertiary-container: #ffd8e4;
  --md-surface-container: #f3edf7;
  --md-surface-container-low: #e7e0ec;
  --md-outline: #79747e;
  --md-on-surface-variant: #49454f;
  --md-ease: cubic-bezier(.2, 0, 0, 1);
  --t2k-forest: var(--md-primary);
  --t2k-mint: var(--md-primary-container);
  --t2k-orange: var(--md-tertiary);
  --t2k-orange-dark: #633b48;
  --t2k-orange-soft: var(--md-tertiary-container);
  --t2k-canvas: var(--md-background);
  --t2k-surface: var(--md-surface-container);
  --t2k-line: var(--md-outline);
  --t2k-ink: var(--md-on-surface);
  --t2k-muted: var(--md-on-surface-variant);
}

html { background: var(--md-background); }
body.customer-app {
  isolation: isolate;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 92% 8%, rgba(232, 222, 248, .7), transparent 29rem),
    radial-gradient(circle at 5% 54%, rgba(182, 241, 220, .42), transparent 32rem),
    var(--md-background);
  color: var(--md-on-surface);
}
body.customer-app::before,
body.customer-app::after {
  position: fixed;
  z-index: -1;
  width: 28rem;
  height: 28rem;
  border-radius: 55% 45% 62% 38% / 45% 58% 42% 55%;
  filter: blur(72px);
  opacity: .2;
  pointer-events: none;
  content: "";
}
body.customer-app::before { top: 18%; right: -15rem; background: var(--md-tertiary-container); }
body.customer-app::after { bottom: 3%; left: -15rem; background: var(--md-secondary-container); }

.customer-app a,
.customer-app button,
.customer-app .btn,
.customer-app .menu-item,
.customer-app input {
  transition: color .2s var(--md-ease), background-color .2s var(--md-ease), box-shadow .3s var(--md-ease), transform .3s var(--md-ease), opacity .2s var(--md-ease);
}
.customer-app button:active,
.customer-app .btn:active,
.customer-app a[role="button"]:active { transform: scale(.95); }
.customer-app a:focus-visible,
.customer-app button:focus-visible,
.customer-app input:focus-visible {
  outline: 2px solid var(--md-primary);
  outline-offset: 2px;
}

.customer-topbar {
  height: 76px;
  border: 0;
  border-radius: 0 0 28px 28px;
  background: rgba(243, 237, 247, .88);
  box-shadow: 0 3px 14px rgba(28, 27, 31, .06);
  backdrop-filter: blur(18px);
}
.brand-orb {
  width: 44px;
  height: 44px;
  border-radius: 16px;
  background: var(--md-primary-container);
  color: var(--md-on-primary-container);
}
.t2k-wordmark { color: var(--md-on-surface); font-size: 18px; }
.t2k-wordmark em {
  border: 0;
  border-radius: 999px;
  background: var(--md-tertiary-container);
  color: #633b48;
  padding: 5px 10px;
}
.customer-top-actions a {
  border-radius: 999px;
  color: var(--md-primary);
  padding: 10px 14px;
}
.customer-top-actions a:hover { background: rgba(0, 56, 44, .1); text-decoration: none; }
.customer-top-actions .customer-order-tracker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  border: 0;
  border-radius: 999px;
  background: var(--md-primary-container);
  color: var(--md-on-primary-container);
  box-shadow: 0 3px 10px rgba(0, 56, 44, .1);
}
.customer-top-actions .customer-order-tracker.hidden { display: none; }
.customer-order-tracker strong {
  border-left: 1px solid rgba(0, 32, 25, .2);
  padding-left: 7px;
}
.customer-order-tracker .glyphicon { font-size: 13px; }
.customer-orders-modal .modal-dialog { max-width: 620px; }
.customer-orders-modal .modal-content { overflow: hidden; border: 0; border-radius: 28px; background: var(--md-background); box-shadow: 0 24px 70px rgba(28, 27, 31, .24); }
.customer-orders-modal .modal-header { border: 0; background: var(--md-primary); color: var(--md-on-primary); padding: 24px 28px; }
.customer-orders-modal .modal-header h2 { margin: 2px 0 5px; font-size: 28px; }
.customer-orders-modal .modal-header p { margin: 0; color: rgba(255,255,255,.72); }
.customer-orders-modal .modal-header .close { color: #fff; opacity: .9; }
.customer-orders-modal .modal-body { max-height: min(62vh, 590px); overflow-y: auto; padding: 20px; }
.customer-orders-modal .modal-footer { border: 0; padding: 0 20px 20px; }
.customer-orders-list { display: grid; gap: 10px; }
.customer-order-card { display: flex; align-items: center; justify-content: space-between; gap: 18px; border-radius: 20px; background: var(--md-surface-container); color: var(--md-on-surface); padding: 17px 18px; text-decoration: none; }
.customer-order-card.is-active { background: var(--md-primary-container); box-shadow: inset 4px 0 var(--md-primary); }
.customer-order-card:hover,.customer-order-card:focus { color: var(--md-on-surface); text-decoration: none; box-shadow: 0 6px 18px rgba(28,27,31,.12); transform: translateY(-1px); }
.customer-order-card-main,.customer-order-card-side { display: flex; align-items: flex-start; }
.customer-order-card-main { min-width: 0; flex-direction: column; }
.customer-order-card-main small { color: var(--md-tertiary); font-size: 10px; font-weight: 800; letter-spacing: .08em; }
.customer-order-card-main strong { margin: 3px 0; font-size: 18px; }
.customer-order-card-main em { overflow: hidden; max-width: 100%; color: var(--md-on-surface-variant); font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.customer-order-card-side { flex: 0 0 auto; align-items: flex-end; flex-direction: column; gap: 5px; }
.customer-order-card-side .glyphicon { position: absolute; opacity: 0; }
.customer-order-state { border-radius: 999px; background: var(--md-secondary-container); color: var(--md-on-secondary-container); padding: 5px 9px; font-size: 10px; }
.customer-order-state.state-ready,.customer-order-state.state-collected { background: var(--md-primary-container); color: var(--md-on-primary-container); }
.customer-order-state.state-cancelled { background: #ffdad6; color: #93000a; }
.customer-orders-state { min-height: 18px; margin: 14px 4px 0; color: var(--md-on-surface-variant); font-size: 12px; }
.customer-orders-state.error { color: #ba1a1a; }

.shop-banner {
  position: relative;
  width: calc(100% - 48px);
  max-width: 1120px;
  overflow: hidden;
  margin: 24px auto 0;
  border: 0;
  border-radius: 48px;
  background:
    radial-gradient(circle at 92% 18%, rgba(232, 222, 248, .3), transparent 31%),
    radial-gradient(circle at 12% 120%, rgba(255, 216, 228, .24), transparent 38%),
    var(--md-primary);
  box-shadow: 0 14px 35px rgba(0, 56, 44, .18);
  padding: 44px 0;
}
.shop-banner::after {
  position: absolute;
  right: -4rem;
  bottom: -7rem;
  width: 18rem;
  height: 18rem;
  border-radius: 48% 52% 38% 62%;
  background: rgba(232, 222, 248, .16);
  transform: rotate(24deg);
  content: "";
}
.shop-banner .customer-container { position: relative; z-index: 1; }
.shop-banner .section-kicker { color: #e8def8; }
.shop-banner h1 { font-size: clamp(34px, 5vw, 48px); letter-spacing: -.025em; }
.shop-banner p { color: rgba(255, 255, 255, .76); font-size: 15px; }
.shop-mode {
  min-width: 270px;
  border: 1px solid rgba(255, 255, 255, .16);
  border-radius: 24px;
  background: rgba(255, 255, 255, .11);
  box-shadow: inset 0 1px rgba(255, 255, 255, .12);
  padding: 18px 20px;
  backdrop-filter: blur(10px);
}

.menu-toolbar-wrap {
  top: 10px;
  width: calc(100% - 48px);
  max-width: 1120px;
  margin: 16px auto 0;
  border: 0;
  border-radius: 28px;
  background: rgba(243, 237, 247, .88);
  box-shadow: 0 5px 22px rgba(28, 27, 31, .08);
  backdrop-filter: blur(18px);
}
.menu-toolbar { min-height: 78px; padding: 10px 18px; }
.t2k-search input {
  height: 56px;
  border: 0;
  border-bottom: 2px solid var(--md-outline);
  border-radius: 12px 12px 0 0;
  background: var(--md-surface-container-low);
  color: var(--md-on-surface);
  padding-left: 44px;
}
.t2k-search .glyphicon { top: 20px; left: 16px; color: var(--md-on-surface-variant); }
.t2k-search input:focus {
  border-color: var(--md-primary);
  box-shadow: none;
  outline: none;
}
.category-tabs { gap: 8px; padding: 2px; }
.category-tabs button {
  flex: 0 0 auto;
  min-width: max-content;
  min-height: 44px;
  border-radius: 999px;
  background: var(--md-secondary-container);
  color: var(--md-on-secondary-container);
  padding: 10px 18px;
}
.category-tabs button:hover { background: rgba(232, 222, 248, .8); box-shadow: 0 3px 10px rgba(28, 27, 31, .09); }
.category-tabs button.active {
  background: var(--md-primary);
  box-shadow: 0 5px 14px rgba(0, 56, 44, .2);
  color: var(--md-on-primary);
}

.menu-content { padding-top: 38px; }
.section-title { margin-bottom: 22px; }
.section-title .section-kicker { color: var(--md-tertiary); }
.section-title h2 { font-size: 28px; letter-spacing: -.02em; }
.menu-grid { gap: 24px; }
.menu-item {
  min-height: 410px;
  border: 0;
  border-radius: 24px;
  background: var(--md-surface-container);
  box-shadow: 0 2px 8px rgba(28, 27, 31, .08);
  padding: 16px;
}
.menu-item:hover {
  transform: translateY(-3px) scale(1.012);
  box-shadow: 0 12px 28px rgba(28, 27, 31, .14);
}
.menu-item.sold-out { border: 0; background: var(--md-surface-container-low); }
.menu-item-image {
  height: 176px;
  border-radius: 18px 18px 10px 10px;
  background: var(--md-surface-container-low);
}
.menu-item:hover .menu-item-image img { transform: scale(1.045); }
.item-index { color: var(--md-on-surface-variant); }
.item-state {
  border-radius: 999px;
  background: var(--md-primary-container);
  color: var(--md-on-primary-container);
  padding: 5px 8px;
}
.item-state.low { background: var(--md-tertiary-container); color: #633b48; }
.menu-item h3 { font-size: 19px; letter-spacing: -.012em; }
.menu-item p { color: var(--md-on-surface-variant); }
.menu-item-footer strong { color: var(--md-on-surface); font-size: 18px; }
.add-product {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  background: var(--md-tertiary);
  box-shadow: 0 4px 12px rgba(125, 82, 96, .2);
  font-size: 17px;
}
.add-product:hover { background: var(--md-tertiary); box-shadow: 0 9px 20px rgba(125, 82, 96, .28); transform: translateY(-2px); }

.order-dock {
  right: 16px;
  bottom: 12px;
  left: 16px;
  border: 0;
  border-radius: 28px;
  background: rgba(243, 237, 247, .95);
  box-shadow: 0 9px 30px rgba(28, 27, 31, .16);
  backdrop-filter: blur(18px);
}
.btn-t2k {
  min-height: 48px;
  border: 0;
  border-radius: 999px;
  background: var(--md-primary);
  box-shadow: none;
  color: var(--md-on-primary);
  padding-right: 24px;
  padding-left: 24px;
}
.btn-t2k:hover,
.btn-t2k:focus { background: rgba(0, 56, 44, .9); box-shadow: 0 6px 16px rgba(0, 56, 44, .22); color: var(--md-on-primary); }

@media (max-width: 600px) {
  .customer-topbar { height: 64px; border-radius: 0 0 20px 20px; }
  .brand-orb { width: 40px; height: 40px; border-radius: 14px; }
  .shop-banner { width: calc(100% - 24px); margin-top: 12px; border-radius: 24px; padding: 30px 0; }
  .shop-banner h1 { font-size: 32px; }
  .menu-toolbar-wrap { top: 6px; width: calc(100% - 24px); margin-top: 10px; border-radius: 24px; }
  .menu-toolbar { padding: 12px; }
  .menu-item { min-height: 172px; border-radius: 24px; }
  .menu-item-image { border-radius: 20px 8px 8px 20px; }
  .add-product { width: 44px; height: 44px; border-radius: 15px; }
  .order-dock { right: 8px; bottom: 8px; left: 8px; border-radius: 24px; }
}

.payment-order-lines {
  margin: 18px 0;
  padding: 14px 0;
  border-top: 1px solid rgba(121, 116, 126, .25);
  border-bottom: 1px solid rgba(121, 116, 126, .25);
}

/* Fulfilment choice and table-service handoff cues. */
.service-fieldset {
  position: relative;
  margin-top: 30px !important;
  border: 0;
  border-radius: 28px;
  background: var(--md-surface-container-low);
  box-shadow: inset 0 0 0 1px rgba(121, 116, 126, .16);
  padding: 22px;
}
.service-fieldset > h2 { width: 100%; margin: 0 0 7px; color: var(--md-on-surface); font-size: 19px; font-weight: 800; line-height: 1.35; }
.service-context-row { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-bottom: 16px; }
.service-prompt { display: inline-flex; min-height: 32px; align-items: center; gap: 6px; border-radius: 999px; background: var(--md-primary-container); color: var(--md-on-primary-container); padding: 6px 11px; font-size: 12px; font-weight: 900; letter-spacing: .03em; white-space: nowrap; }
.service-helper { margin: 0; color: var(--md-on-surface-variant); line-height: 1.45; }
.service-choice { display: flex; align-items: center; gap: 13px; border: 1px solid transparent; }
.service-choice > span { flex: 1; }
.service-choice > span strong,
.service-choice > span small { display: block; }
.service-choice > span small { margin-top: 3px; color: var(--md-on-surface-variant); }
.service-choice-icon { display: inline-grid; width: 48px; height: 48px; flex: 0 0 48px; place-items: center; border-radius: 16px; background: var(--md-secondary-container); color: var(--md-on-secondary-container) !important; font-size: 20px; }
.table-service-choice { background: var(--md-secondary-container); }
.table-service-choice.active { background: var(--md-primary-container); box-shadow: 0 5px 16px rgba(0, 56, 44, .14); }
.table-service-choice.active .service-choice-icon { background: var(--md-primary); color: var(--md-on-primary) !important; }
.table-service-details { display: flex; align-items: flex-start; gap: 14px; margin-top: 12px; border-radius: 22px; background: var(--md-primary-container); box-shadow: inset 0 0 0 1px rgba(0, 56, 44, .16); padding: 18px; }
.table-service-details.hidden { display: none; }
.table-number-icon { display: inline-grid; width: 48px; height: 48px; flex: 0 0 48px; place-items: center; border-radius: 16px; background: var(--md-primary); color: var(--md-on-primary); font-size: 20px; }
.table-service-details .form-group { width: 100%; margin: 0; }
.table-service-details label { display: block; color: var(--md-on-primary-container); font-size: 16px; font-weight: 800; }
.table-service-details .form-control { background: rgba(255, 251, 254, .82); border-bottom-color: var(--md-primary); font-weight: 800; }
.table-service-details small { display: block; margin-top: 7px; color: var(--md-on-surface-variant); }
.table-service-alert { display: flex; align-items: center; gap: 13px; margin: 14px 0; border-radius: 18px; background: #ffe2c7; box-shadow: inset 5px 0 0 var(--t2k-orange-dark); color: #672800; padding: 13px 16px; }
.table-service-alert-icon { display: inline-grid; width: 46px; height: 46px; flex: 0 0 46px; place-items: center; border-radius: 15px; background: var(--t2k-orange-dark); color: #fff; font-size: 19px; }
.table-service-alert > span:last-child { display: flex; flex-direction: column; }
.table-service-alert small { font-size: 11px; font-weight: 900; letter-spacing: .08em; }
.table-service-alert strong { font-size: 21px; line-height: 1.15; }
.table-service-alert em { font-size: 13px; font-style: normal; }
.kds-ticket .table-service-alert { margin: 0; }
.table-service-ticket > header { box-shadow: inset 6px 0 0 var(--t2k-orange-dark); }
.batch-table { width: max-content; max-width: 100%; border-radius: 999px; background: #ffe2c7; color: #672800 !important; padding: 5px 9px; font-size: 12px !important; font-weight: 900; }
.ready-order-link.table-ready,
.order-list-row.table-order-row { box-shadow: inset 4px 0 0 var(--t2k-orange-dark); }
.ready-order-link small b,
.order-list-row small b { color: var(--t2k-orange-dark); font-weight: 900; }

@media (max-width: 767px) {
  .customer-top-actions { gap: 4px; }
  .customer-top-actions a { padding: 9px 10px; }
  .customer-order-tracker strong { display: none; }
  .customer-staff-link { font-size: 0; }
  .customer-staff-link .glyphicon { font-size: 14px; }
  .customer-orders-modal .modal-dialog { position: fixed; right: 8px; bottom: 8px; left: 8px; margin: 0; }
  .customer-orders-modal .modal-content { border-radius: 28px; }
  .customer-orders-modal .modal-header { padding: 20px; }
  .customer-orders-modal .modal-body { max-height: 58vh; padding: 14px; }
  .customer-order-card { border-radius: 18px; padding: 15px; }
  .service-fieldset { margin-right: -4px; margin-left: -4px; border-radius: 24px; padding: 18px 14px; }
  .service-context-row { align-items: flex-start; flex-direction: column; gap: 9px; }
  .service-choice { padding: 14px; }
  .table-service-details { padding: 15px; }
  .table-service-alert strong { font-size: 19px; }
}

@media (max-width: 767px) {
  /* Keep every customer checkout column and its content inside the visual viewport. */
  .customer-flow,
  .customer-flow .customer-container,
  .customer-flow .flow-grid,
  .customer-flow .flow-grid > section,
  .customer-flow .flow-grid > aside { width: 100%; max-width: 100%; }
  .customer-flow .flow-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
    padding-top: 24px;
  }
  .customer-flow .flow-heading h1 {
    font-size: clamp(27px, 8.5vw, 34px);
    overflow-wrap: anywhere;
  }
  .customer-flow input,
  .customer-flow select,
  .customer-flow textarea { font-size: 16px; }
  .customer-flow .form-panel,
  .customer-flow .order-summary { width: 100%; padding: 20px 16px; }
  .customer-flow .service-fieldset { width: auto; }
  .customer-flow .selection-card {
    width: 100%;
    align-items: center;
    padding: 14px 12px;
  }
  .customer-flow .selection-card > span strong,
  .customer-flow .selection-card > span small,
  .customer-flow .selection-card > b { overflow-wrap: anywhere; white-space: normal; }
  .customer-flow .selection-card > b:last-child { flex: 0 0 auto; text-align: right; }
  .customer-flow .payment-option {
    width: 100%;
    align-items: flex-start;
    padding: 16px 14px;
  }
  .customer-flow .payment-icon { flex: 0 0 40px; }
  .customer-flow .mini-line { align-items: flex-start; gap: 12px; }
  .customer-flow .mini-line small {
    overflow: visible;
    overflow-wrap: anywhere;
    text-overflow: clip;
    white-space: normal;
  }
  .customer-flow .mini-line > strong { flex: 0 0 auto; }
  .customer-flow .summary-row { min-width: 0; gap: 12px; }
  /* iOS Safari: 16px fields prevent focus zoom; the visual-viewport height is applied by JS. */
  #item-modal input,
  #item-modal textarea,
  #item-modal select { font-size: 16px; }
  #item-modal .modal-dialog { max-width: 100vw; max-height: 100%; overflow: hidden; }
  #item-modal .modal-content { min-height: 0; max-width: 100vw; }
  #item-modal .modal-body { min-height: 0; scroll-padding-top: 18px; scroll-padding-bottom: 96px; }
  #item-modal .item-note-group { scroll-margin-top: 18px; scroll-margin-bottom: 110px; }
  #item-modal .modal-footer { position: relative; flex-shrink: 0; }
  #item-modal .modal-footer .btn { min-height: 52px; font-size: 16px; }
}

.manage-tabs { display: inline-flex; gap: 6px; border-radius: 999px; background: var(--md-secondary-container); margin-bottom: 24px; padding: 5px; }
.manage-tabs a { display: inline-flex; min-height: 44px; align-items: center; gap: 8px; border-radius: 999px; color: var(--md-on-secondary-container); padding: 10px 20px; font-weight: 750; text-decoration: none; }
.manage-tabs a:hover { background: rgba(0,56,44,.08); }
.manage-tabs a.active { background: var(--md-primary); box-shadow: 0 5px 14px rgba(0,56,44,.2); color: var(--md-on-primary); }
.setup-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; padding-bottom: 90px; }
.setup-card { border-radius: 28px; background: var(--md-surface-container); box-shadow: 0 3px 12px rgba(28,27,31,.07); padding: 24px; }
.setup-card-wide { grid-column: 1/-1; }
.setup-card-heading { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; }
.setup-card-heading h2,.menu-item-editor h3 { margin: 0 0 4px; font-size: 21px; font-weight: 850; }
.setup-card-heading p,.editor-section-heading p { margin: 0; color: var(--md-on-surface-variant); }
.station-output-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.station-output-card { position: relative; min-width: 0; overflow: hidden; border-radius: 26px; background: var(--md-surface-container-low); box-shadow: 0 3px 14px rgba(28,27,31,.06); }
.station-output-card::before { position: absolute; top: 0; right: 0; left: 0; height: 4px; background: var(--md-primary); content: ""; }
.station-output-card.bar-output-card::before { background: var(--md-secondary); }
.station-output-header { display: flex; align-items: center; gap: 12px; padding: 18px 20px 15px; }
.station-output-header>span:last-child,.station-output-header strong,.station-output-header small { display: block; }
.station-output-header strong { font-size: 19px; }
.station-output-header small,.setup-help { color: var(--md-on-surface-variant); }
.station-output-symbol { display: grid; flex: 0 0 42px; width: 42px; height: 42px; place-items: center; border-radius: 15px; background: var(--md-primary-container); color: var(--md-primary); font-size: 17px; }
.bar-output-card .station-output-symbol { background: var(--md-secondary-container); color: var(--md-secondary); }
.station-output-card>section { padding: 15px 20px 18px; border-top: 1px solid rgba(121,116,126,.18); }
.station-output-card>section h3 { margin: 0 0 11px; color: var(--md-on-surface-variant); font-size: 12px; font-weight: 850; letter-spacing: .045em; text-transform: uppercase; }
.station-output-fields { display: grid; align-items: start; gap: 14px; }
.station-output-fields.routing-fields { grid-template-columns: repeat(3,minmax(0,1fr)); }
.station-output-fields.printer-fields { grid-template-columns: minmax(150px,.9fr) minmax(210px,1.45fr) minmax(76px,.4fr); }
.station-output-fields label { min-width: 0; margin: 0; }
.station-output-fields label>small { color: var(--md-on-surface-variant); font-weight: 500; }
.station-output-fields .form-control { width: 100%; min-width: 0; }
.station-output-fields select.form-control { padding-right: 34px; text-overflow: ellipsis; }
.setup-help { margin: 16px 2px 0; }
.setup-help.error { color: #ba1a1a; font-weight: 700; }
.print-summary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; margin-bottom: 18px; }
.print-summary>div { display: flex; min-height: 104px; flex-direction: column; justify-content: center; border-radius: 24px; background: var(--md-surface-container); box-shadow: 0 3px 12px rgba(28,27,31,.07); padding: 20px; }
.print-summary span { color: var(--md-on-surface-variant); font-size: 11px; font-weight: 800; letter-spacing: .07em; }
.print-summary strong { font-size: 30px; }
.print-toolbar { display: flex; justify-content: space-between; gap: 14px; margin-bottom: 18px; }
.print-job-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.print-existing-order { max-width: 680px; margin: 18px 0 24px; padding: 20px; border-radius: 24px; background: var(--md-surface-container); box-shadow: var(--md-shadow-1); }
.print-existing-order>label { display: block; margin-bottom: 8px; font-size: 16px; }
.print-existing-order>small { display: block; margin-top: 8px; color: var(--md-on-surface-variant); }
.setup-help.warning { color: #8a3d00; font-weight: 700; }
.print-job-card { overflow: hidden; border-radius: 24px; background: var(--md-surface-container); box-shadow: 0 3px 12px rgba(28,27,31,.08); }
.print-job-card>header,.print-job-card>footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 14px 18px; }
.print-job-card>header { background: var(--md-secondary-container); }
.print-job-card.status-pending>header { box-shadow: inset 5px 0 var(--md-tertiary); }
.print-station,.print-job-status { border-radius: 999px; font-size: 11px; font-weight: 900; letter-spacing: .05em; }
.print-job-status { background: var(--md-surface); padding: 6px 10px; }
.print-job-main { display: flex; min-height: 132px; justify-content: space-between; gap: 18px; padding: 20px; }
.print-job-main h2 { margin: 4px 0 8px; font-size: 24px; font-weight: 900; }
.print-job-main p { margin: 0; color: var(--md-on-surface-variant); }
.print-job-main>strong { white-space: nowrap; }
.print-job-card>footer { border-top: 1px solid rgba(121,116,126,.2); }
.print-job-card>footer>div { display: flex; gap: 8px; }
.print-error { margin: 0 18px 12px; border-radius: 12px; background: #ffdad6; color: #93000a; padding: 10px; }
.setup-icon { display: inline-grid; width: 50px; height: 50px; flex: 0 0 50px; place-items: center; border-radius: 18px; background: var(--md-primary-container); color: var(--md-on-primary-container); font-size: 18px; }
.setup-icon.orange { background: #ffdbc7; color: #7c2e00; }.setup-icon.blue { background: #d9e2ff; color: #12336d; }.setup-icon.rose { background: var(--md-tertiary-container); color: #633b48; }
.setup-fields { display: grid; gap: 16px; }.setup-fields.two-column { grid-template-columns: repeat(2,minmax(0,1fr)); }.setup-fields .three-column,.three-column { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 12px; }.setup-fields label { margin: 0; color: var(--md-on-surface); font-weight: 750; }.setup-fields label>small,.setup-fields label>span { color: var(--md-on-surface-variant); font-size: 11px; font-weight: 500; }.setup-fields .form-control { margin-top: 7px; }.setup-fields .full-field { grid-column: 1/-1; }
.setup-switches { display: grid; gap: 10px; margin-bottom: 20px; }.setup-switches>label { display: flex; min-height: 72px; align-items: center; justify-content: space-between; border-radius: 22px; background: var(--md-surface-container-low); margin: 0; padding: 14px 16px; cursor: pointer; }.setup-switches span { display: flex; flex-direction: column; }.setup-switches small { color: var(--md-on-surface-variant); font-weight: 450; }.setup-switches input { position: absolute; opacity: 0; }.setup-switches i { position: relative; width: 52px; height: 32px; border: 2px solid var(--md-outline); border-radius: 999px; background: transparent; }.setup-switches i:after { position: absolute; top: 5px; left: 5px; width: 18px; height: 18px; border-radius: 50%; background: var(--md-outline); content:""; transition: transform .2s var(--md-ease); }.setup-switches input:checked+i { border-color: var(--md-primary); background: var(--md-primary); }.setup-switches input:checked+i:after { background: #fff; transform: translateX(20px); }
.brand-colour-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }.brand-colour-fields label { display: flex; align-items: center; gap: 14px; border-radius: 22px; background: var(--md-surface-container-low); margin: 0; padding: 14px; }.brand-colour-fields input { width: 58px; height: 48px; border: 0; border-radius: 14px; background: transparent; padding: 0; }.brand-colour-fields span { display: flex; flex-direction: column; }.brand-colour-fields small { color: var(--md-on-surface-variant); font-weight: 450; }
.setup-save-bar { position: fixed; z-index: 15; right: 28px; bottom: 18px; left: 132px; display: flex; min-height: 68px; align-items: center; justify-content: space-between; gap: 16px; border: 1px solid rgba(121,116,126,.2); border-radius: 28px; background: rgba(243,237,247,.94); box-shadow: 0 12px 34px rgba(28,27,31,.18); padding: 10px 12px 10px 22px; backdrop-filter: blur(18px); }.setup-save-bar>span,.modal-footer>span { color: var(--md-on-surface-variant); }.setup-save-bar .error,.modal-footer .error { color: #ba1a1a; font-weight: 700; }
.menu-manage-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 20px; }.menu-manage-search { position: relative; width: min(560px,100%); margin: 0; }.menu-manage-search .glyphicon { position: absolute; z-index: 1; top: 20px; left: 19px; color: var(--md-on-surface-variant); }.menu-manage-search input { padding-left: 50px; }.menu-manage-summary { display: flex; gap: 8px; }.menu-manage-summary span { border-radius: 999px; background: var(--md-secondary-container); padding: 10px 16px; white-space: nowrap; }
.category-manager { margin-bottom: 24px; border-radius: 28px; background: var(--md-surface-container); box-shadow: 0 4px 18px rgba(28,27,31,.07); padding: 22px; }
.category-manager>header { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 16px; }
.category-manager>header h2 { margin: 3px 0 4px; font-size: 24px; font-weight: 850; }
.category-manager>header p { margin: 0; color: var(--md-on-surface-variant); }
.category-management-list { display: grid; gap: 9px; }
.category-management-row { display: grid; grid-template-columns: 60px minmax(160px,1fr) 130px 130px 100px; align-items: center; gap: 12px; border-radius: 20px; background: var(--md-surface-container-low); padding: 12px 14px; transition: transform .2s var(--md-ease),box-shadow .2s var(--md-ease); }
.category-management-row:hover { transform: translateY(-1px); box-shadow: 0 5px 15px rgba(28,27,31,.08); }
.category-order-pill { display: inline-grid; min-width: 46px; height: 38px; place-items: center; border-radius: 999px; background: var(--md-secondary-container); color: var(--md-on-secondary-container); font-weight: 850; }
.category-management-row h3 { margin: 0 0 2px; font-size: 18px; font-weight: 850; }
.category-management-row small { color: var(--md-on-surface-variant); }
.category-item-count { font-weight: 750; }
.category-visibility { display: inline-flex; min-height: 34px; align-items: center; justify-content: center; border-radius: 999px; background: #b5f4df; color: #00382d; padding: 7px 12px; font-size: 11px; font-weight: 850; text-transform: uppercase; }
.category-visibility.hidden-category { background: var(--md-surface-container); color: var(--md-on-surface-variant); }
.category-management-row .edit-menu-category { display: inline-flex; min-height: 42px; align-items: center; justify-content: center; gap: 6px; }
.category-dialog { width: min(560px,calc(100% - 30px)); }
.category-dialog .modal-content { overflow: hidden; border: 0; border-radius: 30px; background: var(--md-background); box-shadow: 0 24px 70px rgba(28,27,31,.28); }
.category-dialog .modal-header { border: 0; background: var(--md-primary); color: var(--md-on-primary); padding: 24px 28px; }
.category-dialog .modal-header .section-kicker,.category-dialog .modal-header p { color: rgba(255,255,255,.75); }
.category-dialog .modal-header h2 { margin: 3px 0 4px; font-size: 28px; font-weight: 850; }
.category-dialog .close { color: #fff; font-size: 32px; opacity: .9; }
.category-dialog .modal-body { display: grid; gap: 18px; padding: 24px 28px; }
.category-dialog .modal-body label { margin: 0; }
.category-dialog .modal-body label>small { display: block; margin-top: 7px; color: var(--md-on-surface-variant); }
.category-visibility-control { display: flex; align-items: center; gap: 12px; border-radius: 20px; background: var(--md-secondary-container); padding: 15px 17px; }
.category-visibility-control input { width: 23px; height: 23px; margin: 0; flex: 0 0 auto; }
.category-visibility-control span { display: flex; flex-direction: column; gap: 2px; }
.category-visibility-control small { color: var(--md-on-surface-variant); font-weight: 450; }
.category-dialog .modal-footer { display: flex; align-items: center; gap: 9px; border: 0; background: var(--md-surface-container); padding: 14px 22px; }
.category-dialog .modal-footer>span { margin-right: auto; }
.category-delete-note { margin: 0; border-radius: 16px; background: #fff0c7; color: #684900; padding: 12px 15px; font-weight: 650; line-height: 1.45; }
.category-delete-confirm { border-radius: 20px; background: #ffdad6; color: #410002; padding: 16px 18px; }
.category-delete-confirm strong { display: block; margin-bottom: 4px; font-size: 16px; }
.category-delete-confirm p { margin: 0 0 13px; color: #690005; }
.category-delete-confirm>div { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.category-delete-action { margin-right: 0; }
.menu-management-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 15px; }.menu-manage-card { position: relative; display: grid; grid-template-columns: 150px 1fr; min-height: 190px; overflow: hidden; border-radius: 26px; background: var(--md-surface-container); box-shadow: 0 3px 12px rgba(28,27,31,.07); }.menu-manage-image { position: relative; min-height: 190px; }.menu-manage-image img { width: 100%; height: 100%; object-fit: cover; }.menu-manage-image>span { position: absolute; bottom: 10px; left: 10px; border-radius: 999px; background: rgba(0,56,44,.9); color: #fff; padding: 5px 9px; font-size: 9px; font-weight: 850; }.menu-manage-copy { display: flex; min-width: 0; flex-direction: column; padding: 20px 20px 58px; }.menu-manage-copy>small { color: var(--md-tertiary); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }.menu-manage-copy h2 { margin: 5px 0 7px; font-size: 20px; font-weight: 850; }.menu-manage-copy p { display: -webkit-box; overflow: hidden; color: var(--md-on-surface-variant); -webkit-box-orient: vertical; -webkit-line-clamp: 2; }.menu-manage-copy>div { display: flex; align-items: center; gap: 10px; margin-top: auto; }.menu-manage-copy>div strong { font-size: 18px; }.menu-manage-copy>div span { color: var(--md-on-surface-variant); font-size: 11px; }.menu-manage-copy>div b { border-radius: 999px; background: var(--md-tertiary-container); color: #633b48; padding: 4px 8px; font-size: 9px; }.menu-manage-card>.edit-menu-item { position: absolute; right: 14px; bottom: 12px; }
.menu-item-dialog { width: min(1120px,calc(100% - 30px)); }.menu-item-dialog .modal-content { overflow: hidden; border: 0; border-radius: 30px; background: var(--md-background); box-shadow: 0 24px 70px rgba(28,27,31,.28); }.menu-item-dialog .modal-header { border: 0; background: var(--md-primary); color: var(--md-on-primary); padding: 24px 28px; }.menu-item-dialog .modal-header .section-kicker,.menu-item-dialog .modal-header p { color: rgba(255,255,255,.75); }.menu-item-dialog .modal-header h2 { margin: 3px 0 4px; font-size: 28px; font-weight: 850; }.menu-item-dialog .close { color: #fff; font-size: 32px; opacity: .9; }.menu-item-editor { display: grid; grid-template-columns: minmax(0,2fr) minmax(250px,1fr); gap: 20px; max-height: 68vh; overflow: auto; padding: 24px 28px; }.menu-item-editor-main { display: grid; gap: 24px; }.menu-item-editor-main>section,.menu-image-editor { border-radius: 24px; background: var(--md-surface-container); padding: 20px; }.popular-check { display: flex; align-items: center; gap: 10px; padding-top: 26px; }.popular-check input { width: 22px; height: 22px; }.popular-check span { display: flex; flex-direction: column; }.editor-section-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 15px; margin-bottom: 14px; }.menu-option-groups { display: grid; gap: 12px; }.option-group-editor { border-radius: 20px; background: var(--md-surface-container-low); padding: 15px; }.option-group-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }.remove-option-group { width: 40px; height: 40px; border: 0; border-radius: 999px; background: #ffdad6; color: #93000a; }.option-group-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 12px; }.option-group-grid label { margin: 0; }.option-group-grid .option-values { grid-column: 1/-1; }.option-required { display: flex; align-items: center; gap: 8px; padding-top: 25px; }.option-required input { width: 20px; height: 20px; }.menu-image-editor { align-self: start; }.menu-image-editor h3 { margin-bottom: 14px; }.menu-image-preview { display: grid; overflow: hidden; width: 100%; aspect-ratio: 4/3; place-items: center; border-radius: 22px; background: var(--md-surface-container-low); color: var(--md-outline); font-size: 44px; }.menu-image-preview img { width: 100%; height: 100%; object-fit: cover; }.menu-image-editor label { display: block; margin-top: 18px; }.menu-image-editor small { display: block; margin-top: 10px; color: var(--md-on-surface-variant); }.menu-item-dialog .modal-footer { display: flex; align-items: center; gap: 9px; border: 0; background: var(--md-surface-container); padding: 14px 22px; }.menu-item-dialog .modal-footer>span { margin-right: auto; }
@media(max-width:1350px){.station-output-grid{grid-template-columns:1fr}}
@media(max-width:1100px){.station-output-fields.routing-fields{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1000px){.menu-management-grid{grid-template-columns:1fr}.setup-form{grid-template-columns:1fr}.setup-card-wide{grid-column:auto}.menu-item-editor{grid-template-columns:1fr}.menu-image-editor{display:grid;grid-template-columns:180px 1fr;gap:16px}.menu-image-editor h3{grid-column:1/-1}.menu-image-editor label{margin-top:0}.print-job-list{grid-template-columns:1fr}}
@media(max-width:820px){.staff-nav a{width:12.5%}.staff-nav a em{font-size:8px}.setup-save-bar{right:10px;bottom:76px;left:10px}.setup-save-bar>span{display:none}.manage-tabs{display:grid;grid-template-columns:1fr 1fr;width:100%}.manage-tabs a{justify-content:center;padding:9px 12px}.setup-fields.two-column,.setup-fields .three-column,.three-column,.brand-colour-fields{grid-template-columns:1fr}.category-manager{padding:18px 14px}.category-manager>header{align-items:stretch;flex-direction:column}.category-manager>header .btn{width:100%}.category-management-row{grid-template-columns:52px minmax(0,1fr) 86px}.category-item-count{grid-column:2}.category-visibility{grid-column:3;grid-row:1}.category-management-row .edit-menu-category{grid-column:3;grid-row:2}.menu-manage-toolbar{align-items:stretch;flex-direction:column}.menu-manage-summary{justify-content:space-between}.menu-manage-summary span{flex:1;text-align:center}.menu-manage-card{grid-template-columns:112px 1fr}.menu-manage-image{min-height:180px}.menu-manage-copy{padding:16px 14px 56px}.menu-manage-copy>div{align-items:flex-start;flex-direction:column;gap:3px}.menu-item-dialog,.category-dialog{position:fixed;top:max(6px,env(safe-area-inset-top));right:6px;bottom:0;left:6px;width:auto;height:auto;margin:0}.menu-item-dialog .modal-content,.category-dialog .modal-content{display:flex;height:100%;flex-direction:column;border-radius:26px 26px 0 0}.menu-item-editor{min-height:0;max-height:none;flex:1;padding:16px}.menu-image-editor{display:block}.option-group-grid{grid-template-columns:1fr}.option-required{padding-top:0}.menu-item-dialog .modal-footer,.category-dialog .modal-footer{padding-bottom:calc(12px + env(safe-area-inset-bottom))}.menu-item-dialog .modal-footer>span,.category-dialog .modal-footer>span{display:none}.menu-item-dialog .modal-footer .btn,.category-dialog .modal-footer .btn{flex:1}}

.platform-app { min-height: 100vh; background: var(--md-background); color: var(--md-on-surface); }
.platform-app::before,
.platform-app::after { position: fixed; z-index: -1; width: 360px; height: 360px; border-radius: 50%; content: ''; filter: blur(80px); opacity: .3; }
.platform-app::before { top: -120px; left: -80px; background: #a9ead9; }
.platform-app::after { right: -100px; bottom: -120px; background: #eadcf8; }
.platform-topbar { display: flex; min-height: 88px; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(121,116,126,.16); padding: 14px clamp(20px,5vw,72px); background: rgba(255,251,254,.86); box-shadow: 0 8px 30px rgba(28,27,31,.05); backdrop-filter: blur(18px); }
.platform-topbar > div { display: flex; align-items: center; gap: 18px; color: var(--md-on-surface-variant); }
.platform-main { width: min(1460px,calc(100% - 40px)); margin: 0 auto; padding: 42px 0 80px; }
.platform-heading { margin-bottom: 24px; }
.platform-summary { display: flex; align-items: center; justify-content: space-between; margin-bottom: 24px; padding: 22px 28px; }
.platform-summary strong { display: block; font-size: 34px; line-height: 1; }
.platform-summary p { margin: 0; color: var(--md-on-surface-variant); }
.shop-management-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 22px; }
.shop-card { overflow: hidden; border-radius: 28px; padding: 26px; background: var(--md-surface-container); box-shadow: 0 5px 18px rgba(28,27,31,.07); transition: transform 220ms var(--md-ease),box-shadow 220ms var(--md-ease); }
.shop-card:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(28,27,31,.11); }
.shop-card-head { display: flex; align-items: flex-start; gap: 18px; }
.shop-card-head .brand-orb { flex: 0 0 58px; }
.shop-card h2 { margin: 3px 0 7px; font-size: 25px; }
.shop-card p { margin: 0; color: var(--md-on-surface-variant); }
.shop-card dl { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 24px 0; }
.shop-card dl div { min-width: 0; border-radius: 18px; padding: 14px 16px; background: var(--md-surface-container-low); }
.shop-card dt { margin-bottom: 3px; color: var(--md-on-surface-variant); font-size: 11px; letter-spacing: .08em; text-transform: uppercase; }
.shop-card dd { overflow: hidden; margin: 0; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.shop-card-actions { display: flex; flex-wrap: wrap; gap: 10px; }
#shop-modal .modal-dialog { width: min(920px,calc(100% - 32px)); }
#shop-modal .modal-content { overflow: hidden; border: 0; border-radius: 28px; background: var(--md-background); }
#shop-modal .modal-header { padding: 24px 28px 20px; }
#shop-modal .modal-header h2 { margin: 4px 0 7px; }
#shop-modal .modal-header p { margin: 0; color: var(--md-on-surface-variant); }
#shop-modal .setup-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px 18px; padding: 24px 28px; }
#shop-modal .setup-form-grid label { display: block; min-width: 0; margin: 0; }
#shop-modal .setup-form-grid label.wide,
#shop-modal .setup-form-grid p.wide { grid-column: 1 / -1; }
#shop-modal .setup-form-grid input { width: 100%; margin-top: 7px; }
#shop-modal .setup-form-grid label small { display: block; margin-top: 7px; color: var(--md-on-surface-variant); font-weight: 400; }
#shop-modal .modal-footer { padding: 16px 28px 22px; }
.menu-import-dialog { width: min(820px,calc(100% - 32px)); margin: 6vh auto 28px; }
.menu-import-dialog .modal-content { overflow: hidden; border: 0; border-radius: 30px; background: var(--md-background); box-shadow: 0 24px 70px rgba(28,27,31,.28); }
.menu-import-dialog .modal-header { border: 0; background: var(--md-primary); color: var(--md-on-primary); padding: 24px 28px; }
.menu-import-dialog .modal-header .section-kicker,.menu-import-dialog .modal-header p { color: rgba(255,255,255,.76); }
.menu-import-dialog .modal-header h2 { margin: 3px 0 5px; font-size: 30px; font-weight: 850; }
.menu-import-dialog .modal-header p { margin: 0; }
.menu-import-dialog .modal-header .close { color: #fff; opacity: .9; }
.menu-import-dialog .modal-body { display: grid; gap: 14px; padding: 22px 28px; }
.menu-import-step { display: grid; grid-template-columns: 44px minmax(0,1fr); gap: 14px; border-radius: 22px; background: var(--md-surface-container); padding: 18px; }
.menu-import-step h3 { margin: 1px 0 4px; font-size: 18px; }
.menu-import-step p { margin: 0 0 12px; color: var(--md-on-surface-variant); }
.menu-import-number { display: grid; width: 40px; height: 40px; place-items: center; border-radius: 999px; background: var(--md-primary); color: var(--md-on-primary); font-weight: 850; }
.menu-import-file { display: block; margin: 0; }
.menu-import-file input { margin-top: 8px; }
.menu-import-preview { display: grid; grid-template-columns: repeat(4,1fr); gap: 10px; border-radius: 22px; background: #e8def8; padding: 14px; }
.menu-import-preview[hidden] { display: none; }
.menu-import-preview>div { border-radius: 16px; background: rgba(255,255,255,.48); padding: 12px; }
.menu-import-preview span { display: block; color: var(--md-on-surface-variant); font-size: 11px; font-weight: 750; text-transform: uppercase; }
.menu-import-preview strong { display: block; margin-top: 3px; font-size: 25px; }
.menu-import-preview p { grid-column: 1/-1; margin: 0; color: var(--md-primary); font-weight: 700; }
.menu-import-errors:empty { display: none; }
.menu-import-errors { max-height: 180px; overflow: auto; border-radius: 18px; background: #ffdad6; color: #93000a; padding: 14px 16px; }
.menu-import-errors ul { margin: 8px 0 0; padding-left: 20px; }
.menu-import-safety { margin: 0; color: var(--md-on-surface-variant); font-size: 12px; }
.menu-import-dialog .modal-footer { display: flex; gap: 9px; border: 0; background: var(--md-surface-container); padding: 14px 22px; }
.platform-app.platform-locked > :not(#platform-auth-gate) { visibility: hidden; }
.platform-app.platform-locked { overflow: hidden; }
.platform-app.platform-locked #platform-auth-gate { display: grid; visibility: visible; }
.platform-app:not(.platform-locked) #platform-auth-gate { display: none; }

@media (max-width: 760px) {
  .platform-topbar { min-height: 72px; padding: 10px 16px; }
  .platform-topbar > div > span { display: none; }
  .platform-main { width: min(100% - 28px,620px); padding-top: 24px; }
  .platform-heading { align-items: stretch; flex-direction: column; gap: 18px; }
  .platform-heading .btn { width: 100%; }
  .platform-summary { align-items: flex-start; flex-direction: column; gap: 8px; border-radius: 24px; }
  .shop-management-grid { grid-template-columns: 1fr; }
  .shop-card { border-radius: 24px; padding: 20px; }
  .shop-card dl { grid-template-columns: 1fr; }
  .shop-card-actions .btn { width: 100%; }
  #shop-modal .modal-dialog { margin: 8px; }
  #shop-modal .modal-content { border-radius: 24px; }
  #shop-modal .setup-form-grid { grid-template-columns: 1fr; }
  #shop-modal .setup-form-grid .wide { grid-column: auto; }
  .menu-import-dialog { width: auto; margin: 8px; }
  .menu-import-dialog .modal-content { border-radius: 24px; }
  .menu-import-dialog .modal-body { padding: 16px; }
  .menu-import-preview { grid-template-columns: repeat(2,1fr); }
  .menu-import-dialog .modal-footer { flex-wrap: wrap; }
  .menu-import-dialog .modal-footer .btn { flex: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .customer-app *,
  .customer-app *::before,
  .customer-app *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .customer-app .menu-item:hover,
  .customer-app .add-product:hover { transform: none; }
}

/* Shared MD3 components and precise control alignment */
body { background: var(--md-background); color: var(--md-on-surface); }
button, input, select, textarea { font-family: Roboto, Arial, sans-serif; }
.btn,
.category-tabs button,
.filter-tabs button,
.availability-control button,
.qty-control button,
.add-product {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  line-height: 1.2;
  vertical-align: middle;
}
.btn { border-radius: 999px; padding: 10px 20px; }
.btn-sm { min-height: 36px; padding: 7px 15px; }
.btn-lg { min-height: 52px; padding: 13px 26px; }
.btn-block { display: flex; width: 100%; }
.btn-default {
  border-color: var(--md-outline);
  background: transparent;
  color: var(--md-primary);
}
.btn-default:hover,
.btn-default:focus {
  border-color: var(--md-outline);
  background: rgba(0, 56, 44, .1);
  color: var(--md-primary);
}
.btn-danger { border: 0; background: #ba1a1a; color: #fff; }
.btn-danger:hover,
.btn-danger:focus { background: rgba(186, 26, 26, .9); color: #fff; }
.btn:active,
button:active { box-shadow: none; transform: scale(.95); }
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--md-primary);
  outline-offset: 2px;
}
.form-control,
.staff-search input {
  min-height: 56px;
  border: 0;
  border-bottom: 2px solid var(--md-outline);
  border-radius: 12px 12px 0 0;
  background: var(--md-surface-container-low);
  box-shadow: none;
  color: var(--md-on-surface);
}
textarea.form-control { padding-top: 14px; }
.form-control:focus,
.staff-search input:focus {
  border-color: var(--md-primary);
  box-shadow: none;
  outline: none;
}
.input-group-addon {
  border: 0;
  border-bottom: 2px solid var(--md-outline);
  border-radius: 12px 0 0 0;
  background: var(--md-surface-container-low);
  color: var(--md-on-surface-variant);
}
.input-group .form-control { border-radius: 0; }
.input-group-btn .btn { min-height: 56px; }
.t2k-panel {
  border: 0;
  border-radius: 24px;
  background: var(--md-surface-container);
  box-shadow: 0 2px 8px rgba(28, 27, 31, .08);
}
.status-label,
.attention-pill {
  display: inline-flex;
  min-height: 28px;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  padding: 6px 11px;
  line-height: 1.1;
}
.status-label { background: var(--md-surface-container-low); color: var(--md-on-surface-variant); }
.status-label.paid,
.status-label.ready,
.status-label.collected,
.status-label.available { background: var(--md-primary-container); color: var(--md-on-primary-container); }
.status-label.unpaid,
.status-label.low { background: var(--md-tertiary-container); color: #633b48; }
.status-label.preparing,
.status-label.received { background: var(--md-secondary-container); color: var(--md-on-secondary-container); }
.t2k-toast {
  right: 20px;
  bottom: 20px;
  border: 0;
  border-radius: 18px;
  background: var(--md-on-surface);
  box-shadow: 0 8px 28px rgba(28, 27, 31, .22);
  padding: 14px 18px;
}
.summary-total,
.mini-line,
.detail-pair,
.cart-line,
.detail-lines,
.close-row { border-color: rgba(121, 116, 126, .24); }
.section-kicker { color: var(--md-tertiary); }

/* Customer checkout, payment, status and counter */
.flow-top {
  border: 0;
  border-radius: 0 0 24px 24px;
  background: rgba(243, 237, 247, .9);
  box-shadow: 0 3px 14px rgba(28, 27, 31, .06);
  backdrop-filter: blur(16px);
}
.flow-top::after,
.page-bar::after { display: none; }
.flow-top a {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  gap: 6px;
  border-radius: 999px;
  padding: 0 12px;
}
.flow-top a:hover { background: rgba(0, 56, 44, .1); text-decoration: none; }
.flow-grid { gap: 24px; }
.flow-grid,
.flow-grid > section,
.flow-grid > aside,
.form-panel,
.order-summary,
.payment-options,
.payment-option,
.selection-card,
.selection-card > span,
.payment-option > span:nth-child(2),
.mini-line > span { min-width: 0; }
.flow-heading h1 { letter-spacing: -.025em; }
.order-lines,
.form-panel,
.order-summary,
.payment-options,
.mock-card,
.status-grid > .t2k-panel {
  border: 0;
  border-radius: 24px;
  background: var(--md-surface-container);
  box-shadow: 0 2px 8px rgba(28, 27, 31, .08);
}
.order-summary { padding: 24px; }
.qty-control button:not(.remove-line) {
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 999px;
  background: var(--md-secondary-container);
  color: var(--md-on-secondary-container);
}
.qty-control .remove-line { min-height: 44px; border-radius: 999px; padding: 0 12px; }
.selection-card {
  min-height: 76px;
  margin-bottom: 10px;
  border: 0;
  border-radius: 20px;
  background: var(--md-surface-container-low);
  padding: 16px;
}
.selection-card:last-child { border: 0; }
.selection-card.active {
  border: 0;
  background: var(--md-primary-container);
  box-shadow: 0 4px 12px rgba(0, 56, 44, .1);
}
.selection-card.disabled { cursor: not-allowed; opacity: .55; }
.pickup-time-details {
  margin: 12px 0 4px;
  border-radius: 24px;
  background: var(--md-secondary-container);
  padding: 20px;
}
.pickup-time-details > label { display: block; margin-bottom: 9px; color: var(--md-on-secondary-container); }
.pickup-time-details .form-control { width: 100%; background: rgba(255, 251, 254, .72); font-weight: 600; }
.pickup-time-details > small { display: block; margin-top: 9px; color: var(--md-on-surface-variant); line-height: 1.4; }
.allergy-fieldset { margin-top: 32px !important; }
.allergy-choice-icon { color: #ba1a1a !important; font-size: 18px; }
.allergy-details {
  margin-top: 12px;
  border-radius: 24px;
  background: rgba(255, 218, 214, .48);
  padding: 20px;
}
.allergy-details > label { display: block; margin-bottom: 10px; }
.allergy-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.allergy-chip {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--md-outline);
  border-radius: 999px;
  background: transparent;
  color: var(--md-on-surface);
  padding: 9px 15px;
  font-weight: 600;
}
.allergy-chip:hover { background: rgba(186, 26, 26, .08); }
.allergy-chip.active { border-color: #ba1a1a; background: #ba1a1a; color: #fff; }
.allergy-guidance {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 4px 0 0;
  border-radius: 16px;
  background: #fff0c7;
  color: #5b4300;
  padding: 13px 14px;
  font-size: 12px;
  line-height: 1.45;
}
.allergy-alert {
  margin: 14px 0;
  border-radius: 16px;
  background: #ffdad6;
  color: #93000a;
  padding: 13px 15px;
}
.allergy-alert-content { display: flex; align-items: flex-start; gap: 9px; }
.allergy-alert-content > span:last-child { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.allergy-alert-content strong { font-size: 12px; letter-spacing: .02em; }
.allergy-alert-content small { color: #690005; line-height: 1.35; }
.line-note,
.prep-note {
  display: block !important;
  overflow: visible !important;
  margin-top: 7px !important;
  border-radius: 10px;
  background: #fff0c7;
  color: #5b4300 !important;
  padding: 7px 9px;
  font-weight: 700;
  line-height: 1.35;
  text-overflow: clip !important;
  white-space: normal !important;
}
.prep-note { font-size: 11px !important; }
.allergen .allergy-alert-content strong,
.allergen .allergy-alert-content small { color: #93000a; }
.kds-ticket footer { gap: 10px; flex-wrap: wrap; }
.allergy-acknowledge {
  margin-left: auto;
  border: 0;
  border-radius: 999px;
  background: #ba1a1a;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
}
.allergy-acknowledge:hover,
.allergy-acknowledge:focus { background: rgba(186, 26, 26, .9); color: #fff; }
.payment-options { display: grid; gap: 10px; background: transparent; box-shadow: none; }
.payment-option {
  min-height: 82px;
  border: 0;
  border-radius: 24px;
  background: var(--md-surface-container);
  box-shadow: 0 2px 8px rgba(28, 27, 31, .07);
  padding: 16px 18px;
}
.payment-option > span:nth-child(2) strong,
.payment-option > span:nth-child(2) small,
.payment-unavailable { overflow-wrap: anywhere; white-space: normal; }
.payment-option:last-child { border: 0; }
.payment-option:hover { box-shadow: 0 7px 18px rgba(28, 27, 31, .12); transform: translateY(-2px); }
.payment-option.active {
  background: var(--md-primary-container);
  box-shadow: 0 5px 14px rgba(0, 56, 44, .12);
}
.payment-option[disabled] { cursor: not-allowed; opacity: .58; box-shadow: none; transform: none; }
.payment-option[disabled]:hover { box-shadow: none; transform: none; }
.payment-option[disabled] .payment-icon { background: var(--md-surface-container-low); color: var(--md-outline); }
.payment-option[disabled]>b { display: none; }
.payment-unavailable { display: none; margin-top: 5px; color: #8c3b22; font-size: 12px; font-style: normal; font-weight: 750; }
.payment-option[disabled] .payment-unavailable { display: block; }
.payment-icon { border: 0; background: var(--md-secondary-container); color: var(--md-on-secondary-container); }
.fake-card-field { border: 0; border-bottom: 2px solid var(--md-outline); border-radius: 12px 12px 0 0; background: var(--md-surface-container-low); }
.status-primary {
  position: relative;
  overflow: hidden;
  margin: 24px 0;
  border: 0;
  border-radius: 48px;
  background:
    radial-gradient(circle at 90% 5%, rgba(232, 222, 248, .9), transparent 34%),
    var(--md-surface-container);
  box-shadow: 0 8px 24px rgba(28, 27, 31, .08);
  padding: 48px 28px;
}
.customer-order-number,
.counter-number-callout {
  display: flex;
  max-width: 100%;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  border-radius: 24px;
  background: linear-gradient(135deg, var(--t2k-orange-soft), rgba(232, 222, 248, .82));
  box-shadow: inset 0 0 0 2px rgba(184, 73, 0, .28), 0 8px 20px rgba(184, 73, 0, .09);
  padding: 17px 30px 16px;
  text-align: center;
}
.customer-order-number {
  width: max-content;
  min-width: 300px;
  margin: 0 auto 24px;
}
.customer-order-number span,
.counter-number-callout span {
  color: var(--t2k-orange-dark);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .13em;
}
.customer-order-number strong,
.counter-number-callout strong {
  margin: 5px 0 4px;
  color: var(--t2k-orange-dark);
  font-size: clamp(44px, 7vw, 62px);
  font-weight: 900;
  letter-spacing: .035em;
  line-height: 1;
}
.customer-order-number small,
.counter-number-callout small {
  color: var(--md-on-surface-variant);
  font-size: 13px;
  font-weight: 600;
}
.status-primary > h1 { margin-top: 0; }
.status-qr-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 24px;
  margin: 24px 0;
  border-radius: 28px;
  background: var(--md-surface-container);
  box-shadow: 0 4px 14px rgba(28, 27, 31, .08);
  padding: 22px 24px;
}
.status-qr-card .section-kicker { color: var(--t2k-orange-dark); }
.status-qr-card h2 { margin: 0 0 7px; font-size: 24px; font-weight: 750; }
.status-qr-card p { max-width: 390px; margin: 0; color: var(--md-on-surface-variant); line-height: 1.45; }
.customer-status-qr { display: grid; width: 232px; height: 232px; overflow: hidden; place-items: center; border-radius: 18px; background: #fff; }
.customer-status-qr canvas { display: block; width: 232px; height: 232px; image-rendering: pixelated; }
.customer-status-qr .qr-fallback { font-size: 30px; font-weight: 900; }
.order-progress i { border-color: var(--md-outline); background: var(--md-surface-container-low); }
.order-progress > div::before { background: var(--md-outline); }
.order-progress .complete i { border-color: var(--md-primary); background: var(--md-primary); }
.order-progress .active i { border-color: var(--md-primary); background: var(--md-primary-container); }
.counter-ticket {
  border: 0;
  border-radius: 32px;
  background: var(--md-surface-container);
  box-shadow: 0 12px 34px rgba(28, 27, 31, .13);
}
.counter-ticket-top { border: 0; background: var(--md-primary); padding: 20px 22px; }
.counter-number-callout { margin: 24px 24px 0; }
.counter-head .counter-order-number,
.counter-steps .counter-order-number { font-size: 1.18em; font-weight: 900; }
.qr-code {
  width: 264px;
  height: 264px;
  margin-top: 24px;
  border: 0;
  outline: 0;
  background: #fff;
  padding: 16px;
}
.qr-code canvas { display: block; width: 232px; height: 232px; max-width: 100%; image-rendering: pixelated; }
.qr-code.is-rendered .qr-fallback,
.customer-status-qr.is-rendered .qr-fallback { display: none; }
.counter-steps { background: var(--md-secondary-container); padding: 20px 22px; }
.counter-payment-note { border: 0; background: var(--md-tertiary-container); color: #633b48; padding: 16px 22px; }
.qr-code { border-radius: 18px; }
.t2k-modal .modal-content {
  display: flex;
  max-height: calc(100vh - 60px);
  max-height: calc(100dvh - 60px);
  overflow: hidden;
  flex-direction: column;
  border: 0;
  border-radius: 28px;
  background: var(--md-background);
  box-shadow: 0 20px 50px rgba(28, 27, 31, .24);
}
.t2k-modal-header {
  position: relative;
  flex: 0 0 auto;
  border: 0;
  background: var(--md-primary);
  padding: 24px 72px 24px 24px;
}
.t2k-modal-header .close {
  position: absolute;
  top: 14px;
  right: 14px;
  display: inline-flex;
  width: 44px;
  height: 44px;
  align-items: center;
  justify-content: center;
  float: none;
  border-radius: 50%;
  color: #fff;
  font-size: 30px;
  line-height: 1;
  opacity: .9;
  text-shadow: none;
}
.t2k-modal-header .close:hover,
.t2k-modal-header .close:focus { background: rgba(255, 255, 255, .12); color: #fff; opacity: 1; }
.t2k-modal .modal-body {
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  flex: 1 1 auto;
  overscroll-behavior: contain;
  touch-action: pan-y;
  -webkit-overflow-scrolling: touch;
}
.t2k-modal .modal-footer {
  z-index: 2;
  flex: 0 0 auto;
  background: var(--md-background);
  box-shadow: 0 -5px 18px rgba(28, 27, 31, .08);
}
.option-group { display: grid; gap: 8px; }
.option-row {
  min-height: 52px;
  border: 0;
  border-radius: 16px;
  background: var(--md-surface-container);
  padding: 12px 14px;
}
.option-row:last-child { border: 0; }
.option-row.active { border: 0; background: var(--md-primary-container); }
.option-row.active .radio-mark,
.option-row.active .check-mark { border-color: var(--md-primary); }

/* Staff shell */
.staff-app {
  background:
    radial-gradient(circle at 92% 8%, rgba(232, 222, 248, .7), transparent 30rem),
    radial-gradient(circle at 18% 92%, rgba(182, 241, 220, .38), transparent 34rem),
    var(--md-background);
}
.staff-auth-gate { display: none; }
.staff-locked { overflow: hidden; }
.staff-locked .staff-auth-gate,
.platform-locked .staff-auth-gate {
  position: fixed;
  z-index: 2000;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow-y: auto;
  background:
    radial-gradient(circle at 16% 18%, rgba(182, 241, 220, .7), transparent 23rem),
    radial-gradient(circle at 84% 82%, rgba(232, 222, 248, .9), transparent 27rem),
    rgba(255, 251, 254, .94);
  padding: 24px;
  backdrop-filter: blur(18px);
}
.staff-locked .staff-sidebar,
.staff-locked .staff-shell { filter: blur(8px); pointer-events: none; user-select: none; }
.staff-auth-card {
  width: min(100%, 430px);
  border-top: 5px solid var(--t2k-orange);
  border-radius: 32px;
  background: var(--md-surface-container);
  box-shadow: 0 24px 70px rgba(28, 27, 31, .22);
  padding: 34px;
}
.staff-auth-brand { display: flex; align-items: center; gap: 12px; margin-bottom: 30px; }
.staff-auth-brand .brand-orb { display: inline-grid; width: 58px; height: 58px; place-items: center; border-radius: 20px; background: var(--md-primary); color: var(--md-on-primary); font-size: 20px; }
.staff-auth-brand > span:last-child { display: flex; flex-direction: column; }
.staff-auth-brand strong { font-size: 22px; }
.staff-auth-brand small { width: max-content; margin-top: 2px; border-radius: 999px; background: var(--md-tertiary-container); color: #633b48; padding: 2px 8px; font-size: 9px; font-weight: 800; }
.staff-auth-card h1 { margin: 8px 0; font-size: 31px; font-weight: 800; letter-spacing: -.025em; }
.staff-auth-card > p { margin-bottom: 24px; color: var(--md-on-surface-variant); }
.staff-passcode-field { position: relative; }
.staff-passcode-field label { display: block; margin-bottom: 8px; }
.staff-passcode-field input { padding-right: 58px; font-size: 24px; font-weight: 800; letter-spacing: .18em; }
.staff-passcode-field button { position: absolute; right: 6px; bottom: 6px; width: 44px; height: 44px; border: 0; border-radius: 999px; background: transparent; color: var(--md-on-surface-variant); }
.staff-passcode-field button:hover { background: rgba(0, 56, 44, .1); color: var(--md-primary); }
.staff-auth-error { min-height: 22px; margin: 8px 0 10px; color: #ba1a1a; font-size: 13px; font-weight: 700; }
.staff-auth-card .btn { min-height: 52px; }
.staff-auth-card > small { display: block; margin-top: 18px; color: var(--md-on-surface-variant); text-align: center; }
.staff-lock-now { display: inline-grid; width: 44px; height: 44px; place-items: center; border: 0; border-radius: 999px; background: var(--md-secondary-container); color: var(--md-on-secondary-container); }
.staff-lock-now:hover { background: var(--md-primary-container); color: var(--md-on-primary-container); }
.staff-sidebar {
  width: 104px;
  border-radius: 0 32px 32px 0;
  background: var(--md-primary);
  box-shadow: 8px 0 28px rgba(0, 56, 44, .15);
}
.staff-logo { height: 132px; }
.staff-home-link {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  border-radius: 9999px;
  color: var(--md-on-surface);
  padding: 0 12px;
  text-decoration: none;
  transition: background-color 200ms cubic-bezier(.2, 0, 0, 1), color 200ms cubic-bezier(.2, 0, 0, 1), transform 200ms cubic-bezier(.2, 0, 0, 1);
}
.staff-home-link:hover,
.staff-home-link:focus {
  background: rgba(0, 56, 44, .1);
  color: var(--md-primary);
  text-decoration: none;
}
.staff-home-link:focus-visible {
  outline: 2px solid var(--md-primary);
  outline-offset: 2px;
}
.staff-home-link:active { transform: scale(.95); }
.staff-logo .brand-orb { border-radius: 18px; }
.staff-logo small {
  border-radius: 999px;
  background: var(--md-tertiary-container);
  color: #633b48;
  padding: 3px 8px;
}
.staff-nav { gap: 4px; padding: 0 10px; }
.staff-nav a {
  height: 70px;
  border: 0;
  border-radius: 20px;
  color: rgba(255, 255, 255, .72);
}
.staff-nav a:hover { border: 0; background: rgba(255, 255, 255, .1); color: #fff; transform: translateX(2px); }
.staff-nav a.active {
  border: 0;
  background: var(--md-primary-container);
  box-shadow: 0 5px 14px rgba(0, 0, 0, .14);
  color: var(--md-on-primary-container);
}
.staff-nav .admin-portal-link {
  position: relative;
  margin-top: 8px;
  background: rgba(255, 255, 255, .07);
  box-shadow: 0 -1px rgba(255, 255, 255, .18);
}
.staff-nav .admin-portal-link:hover { background: var(--md-tertiary-container); color: #633b48; }
.staff-nav .admin-portal-link > i {
  position: absolute;
  top: 10px;
  right: 10px;
  font-size: 9px;
  font-style: normal;
  opacity: .75;
}
.staff-shell { margin-left: 104px; }
.staff-topbar {
  height: 82px;
  border: 0;
  border-radius: 0 0 0 28px;
  background: rgba(243, 237, 247, .88);
  box-shadow: 0 3px 14px rgba(28, 27, 31, .06);
  backdrop-filter: blur(18px);
}
.staff-search input { height: 56px; padding-left: 46px; }
.staff-search-submit { position: absolute; z-index: 2; top: 6px; left: 3px; width: 42px; height: 44px; border: 0; border-radius: 999px; background: transparent; color: var(--md-on-surface-variant); }
.staff-search .staff-search-submit .glyphicon { position: static; font-size: 16px; }
.staff-search-submit:hover { background: rgba(0, 56, 44, .1); color: var(--md-primary); }
.order-search-hit {
  position: relative;
  z-index: 3;
  outline: 4px solid var(--t2k-orange) !important;
  outline-offset: 3px;
  box-shadow: 0 0 0 9px rgba(191, 74, 0, .16), 0 12px 30px rgba(28, 27, 31, .2) !important;
}
.staff-main { padding: 32px 34px 56px; }
.page-bar { margin-bottom: 26px; padding: 0; }
.page-bar h1 { font-size: 34px; letter-spacing: -.025em; }
.page-bar-actions { flex-wrap: wrap; }
.metric-row {
  gap: 14px;
  overflow: visible;
  border: 0;
  background: transparent;
  margin-bottom: 22px;
}
.metric-row > div {
  border: 0;
  border-radius: 22px;
  background: var(--md-surface-container);
  box-shadow: 0 2px 8px rgba(28, 27, 31, .07);
  padding: 18px;
}
.metric-row > div:hover { box-shadow: 0 8px 20px rgba(28, 27, 31, .11); transform: translateY(-2px); }
.kds-control-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 22px;
  border-radius: 28px;
  background: var(--md-surface-container);
  box-shadow: 0 3px 12px rgba(28, 27, 31, .08);
  padding: 14px 16px;
}
.kds-control-group { display: flex; min-width: 0; align-items: center; gap: 12px; }
.kds-control-actions { display: flex; min-width: 0; align-items: center; justify-content: flex-end; gap: 18px; }
.kds-control-group > span { color: var(--md-on-surface-variant); font-size: 10px; font-weight: 800; letter-spacing: .09em; white-space: nowrap; }
.kds-segmented { display: inline-flex; gap: 4px; border-radius: 999px; background: var(--md-secondary-container); padding: 4px; }
.kds-segmented button {
  display: inline-flex;
  min-height: 46px;
  align-items: center;
  justify-content: center;
  gap: 7px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--md-on-secondary-container);
  padding: 9px 17px;
  font-weight: 700;
  white-space: nowrap;
}
.kds-segmented button:hover { background: rgba(0, 56, 44, .08); }
.kds-segmented button.active { background: var(--md-primary); color: var(--md-on-primary); box-shadow: 0 4px 10px rgba(0, 56, 44, .2); }
.kds-segmented button b { display: inline-grid; min-width: 24px; height: 24px; place-items: center; border-radius: 999px; background: rgba(255, 255, 255, .18); font-size: 11px; }
.kds-segmented button:not(.active) b { background: rgba(29, 25, 43, .09); }
.kds-metrics strong { font-variant-numeric: tabular-nums; }
.kds-grid { gap: 18px; }
.kds-ticket {
  overflow: hidden;
  border: 0;
  border-radius: 24px;
  background: var(--md-surface-container);
  box-shadow: 0 3px 11px rgba(28, 27, 31, .09);
}
.kds-ticket:hover { box-shadow: 0 10px 25px rgba(28, 27, 31, .14); transform: translateY(-2px); }
.kds-ticket > header { border: 0; background: var(--md-secondary-container); padding: 18px; }
.kds-ticket footer { border: 0; background: rgba(231, 224, 236, .55); padding: 14px 18px; }
.allergen { border: 0; border-radius: 14px; background: #ffdad6; color: #93000a; padding: 11px; }

/* Kitchen distance-reading hierarchy: prioritise order identity, alerts and food items. */
.kds-ticket > header { padding: 20px 22px; }
.kds-ticket header strong {
  font-size: clamp(17px, 1.05vw, 20px);
  line-height: 1.25;
  letter-spacing: .01em;
}
.kds-ticket header span {
  margin-top: 4px;
  color: var(--md-on-surface-variant);
  font-size: clamp(14px, .85vw, 16px);
  line-height: 1.3;
}
.kds-ticket time {
  font-size: clamp(17px, 1.05vw, 20px);
  line-height: 1.25;
  white-space: nowrap;
}
.kds-ticket time.overdue,
.batch-line time.overdue { color: #ba1a1a; }
.ticket-item-progress { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: rgba(231, 224, 236, .58); padding: 9px 22px; }
.ticket-item-progress span { color: var(--md-on-surface-variant); font-size: 11px; font-weight: 900; letter-spacing: .08em; }
.ticket-item-progress strong { color: var(--md-primary); font-size: 16px; font-variant-numeric: tabular-nums; }
.ticket-body {
  gap: 22px;
  padding: 20px 22px 24px;
}
.ticket-line { gap: 7px; border-radius: 18px; padding: 12px; transition: background .2s var(--md-ease), box-shadow .2s var(--md-ease); }
.ticket-line.item-is-ready {
  background: rgba(231, 224, 236, .42);
  box-shadow: inset 3px 0 rgba(121, 116, 126, .48);
}
.ticket-line.item-is-ready strong,
.ticket-line.item-is-ready > span:not(.prep-note) { color: var(--md-on-surface-variant); }
.ticket-line-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.ticket-line-heading > strong { min-width: 0; }
.ticket-line-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; flex: 0 0 auto; }
.kds-stock-cycle {
  display: inline-flex;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex: 0 0 auto;
  border: 1px solid transparent;
  border-radius: 999px;
  padding: 8px 12px;
  font-size: 11px;
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: .025em;
  white-space: nowrap;
  transition: transform .2s var(--md-ease), box-shadow .2s var(--md-ease), opacity .2s var(--md-ease);
}
.kds-stock-cycle:hover { transform: translateY(-1px); box-shadow: 0 4px 10px rgba(28, 27, 31, .12); }
.kds-stock-cycle:active { transform: scale(.95); }
.kds-stock-cycle.stock-available { border-color: rgba(0, 84, 66, .18); background: #c8f5e5; color: #00382c; }
.kds-stock-cycle.stock-low { border-color: rgba(132, 62, 0, .18); background: #ffdcc2; color: #6f3500; }
.kds-stock-cycle.stock-sold-out { border-color: rgba(147, 0, 10, .16); background: #ffdad6; color: #93000a; }
.kds-stock-cycle.is-saving { cursor: wait; opacity: .55; }
.kds-item-ready-toggle,
.batch-ready-toggle { display: inline-flex; min-height: 42px; align-items: center; justify-content: center; gap: 6px; flex: 0 0 auto; border: 0; border-radius: 999px; background: var(--md-secondary-container); color: var(--md-on-secondary-container); padding: 8px 13px; font-size: 12px; font-weight: 900; line-height: 1.2; white-space: nowrap; }
.kds-item-ready-toggle:hover,
.batch-ready-toggle:hover { background: rgba(0, 56, 44, .12); }
.kds-item-ready-toggle.active,
.batch-ready-toggle.active {
  border: 1px solid rgba(121, 116, 126, .28);
  background: rgba(231, 224, 236, .82);
  color: var(--md-on-surface-variant);
  box-shadow: none;
}
.kds-item-ready-toggle:disabled { cursor: not-allowed; opacity: .45; }
.ticket-line strong {
  color: var(--md-on-surface);
  font-size: clamp(18px, 1.15vw, 22px);
  line-height: 1.28;
  letter-spacing: .005em;
}
.ticket-line > span:not(.prep-note) {
  color: var(--md-on-surface-variant);
  font-size: clamp(15px, .92vw, 18px);
  line-height: 1.4;
}
.kds-ticket .allergen { padding: 14px 16px; }
.kds-ticket .allergy-alert { margin: 0; padding: 0; }
.kds-ticket .allergy-alert-content strong {
  font-size: clamp(15px, .95vw, 18px);
  line-height: 1.3;
}
.kds-ticket .allergy-alert-content small {
  margin-top: 3px;
  font-size: clamp(14px, .85vw, 16px);
  line-height: 1.4;
}
.kds-ticket .prep-note {
  margin-top: 4px !important;
  padding: 10px 12px;
  font-size: clamp(14px, .85vw, 16px) !important;
  line-height: 1.4;
}
.kds-ticket footer { min-height: 76px; padding: 13px 18px; }
.kds-ticket footer .status-label {
  padding: 9px 14px;
  font-size: 13px;
  line-height: 1.2;
}
.kds-ticket .ready-order,
.kds-ticket .allergy-acknowledge {
  display: inline-flex;
  min-height: 50px;
  align-items: center;
  justify-content: center;
  padding: 11px 22px;
  font-size: 16px;
  line-height: 1.2;
}
.kds-batch-card {
  display: flex;
  min-height: 330px;
  overflow: hidden;
  flex-direction: column;
  border-radius: 24px;
  background: var(--md-surface-container);
  box-shadow: 0 3px 11px rgba(28, 27, 31, .09);
}
.kds-batch-card > header { display: flex; align-items: center; gap: 15px; background: var(--md-secondary-container); padding: 18px 20px; }
.batch-quantity { display: inline-grid; min-width: 64px; height: 64px; place-items: center; border-radius: 20px; background: var(--md-primary); color: var(--md-on-primary); font-size: 25px; font-weight: 900; }
.kds-batch-card header > div { display: flex; min-width: 0; flex-direction: column; gap: 3px; }
.kds-batch-card header > .batch-title { flex: 1 1 auto; }
.kds-batch-card > header .kds-stock-cycle { margin-left: auto; }
.kds-batch-card header strong { font-size: clamp(18px, 1.15vw, 22px); line-height: 1.25; }
.kds-batch-card header span:not(.batch-quantity) { color: var(--md-on-surface-variant); font-size: 14px; }
.batch-lines { display: grid; gap: 0; padding: 5px 20px 12px; }
.batch-line { display: flex; flex-direction: column; gap: 6px; border-bottom: 1px solid rgba(121, 116, 126, .22); padding: 15px 0; }
.batch-line.item-is-ready {
  margin: 0 -10px;
  border-bottom-color: transparent;
  border-radius: 16px;
  background: rgba(231, 224, 236, .42);
  box-shadow: inset 3px 0 rgba(121, 116, 126, .48);
  padding: 15px 10px;
}
.batch-line.item-is-ready > div strong,
.batch-line.item-is-ready > span:not(.prep-note):not(.batch-allergy) { color: var(--md-on-surface-variant); }
.batch-line:last-child { border-bottom: 0; }
.batch-line > div { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.batch-line > div strong { font-size: 16px; line-height: 1.3; }
.batch-line time { color: var(--t2k-orange-dark); font-size: 15px; font-weight: 800; white-space: nowrap; }
.batch-line > span:not(.prep-note):not(.batch-allergy) { color: var(--md-on-surface-variant); font-size: 15px; line-height: 1.4; }
.batch-allergy { width: max-content; max-width: 100%; border-radius: 999px; background: #ffdad6; color: #93000a; padding: 5px 9px; font-size: 12px; font-weight: 800; }
.batch-prep-state { display: inline-flex; width: max-content; max-width: 100%; align-items: center; gap: 5px; border-radius: 999px; padding: 5px 9px; font-size: 11px !important; font-weight: 900; letter-spacing: .04em; }
.batch-prep-state.preparing { background: var(--md-secondary-container); color: var(--md-on-secondary-container) !important; }
.batch-prep-state.ready {
  background: rgba(231, 224, 236, .9);
  color: var(--md-on-surface-variant) !important;
}
.batch-line .batch-item-ready { width: 100%; margin-top: 7px; border: 1px solid rgba(0, 56, 44, .22); }
.batch-line .batch-item-ready:not(.active) { background: var(--md-primary-container); color: var(--md-on-primary-container); }
.kds-batch-card > footer { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; background: rgba(231, 224, 236, .55); padding: 15px 20px; }
.kds-batch-card > footer span { font-weight: 700; }
.kds-batch-card > footer small { color: var(--md-on-surface-variant); text-align: right; }
.kds-batch-card > footer .batch-ready-toggle { min-height: 48px; padding: 10px 17px; }
.kds-page-bar #kds-recall:disabled { opacity: .45; }
.scanner-stage,
.pickup-workspace,
.order-workspace { gap: 20px; }
.scanner-card { border: 0; border-radius: 32px; background: var(--md-surface-container); }
.scanner-icon { border: 0; border-radius: 24px; background: var(--md-secondary-container); color: var(--md-on-secondary-container); }
.camera-scan-button { display: inline-flex; min-height: 54px; align-items: center; justify-content: center; gap: 9px; margin-top: 20px; padding: 12px 24px; }
.scanner-divider { display: flex; max-width: 560px; align-items: center; gap: 12px; margin: 26px auto 0; color: var(--md-on-surface-variant); font-size: 10px; font-weight: 800; letter-spacing: .08em; }
.scanner-divider::before,
.scanner-divider::after { height: 1px; flex: 1; background: rgba(121, 116, 126, .32); content: ""; }
.camera-modal .modal-dialog { width: min(560px, calc(100% - 28px)); margin: 28px auto; }
.camera-modal .modal-content { overflow: hidden; border: 0; border-radius: 28px; background: var(--md-background); box-shadow: 0 22px 60px rgba(28, 27, 31, .3); }
.receipt-printer-modal .modal-dialog { width: min(560px, calc(100% - 28px)); margin: 9vh auto 28px; }
.receipt-printer-modal .modal-content { overflow: hidden; border: 0; border-radius: 28px; background: var(--md-background); box-shadow: 0 22px 60px rgba(28,27,31,.3); }
.receipt-printer-modal .modal-header { border: 0; background: var(--md-primary); color: var(--md-on-primary); padding: 24px 28px; }
.receipt-printer-modal .modal-header .close { color: #fff; opacity: .85; }
.receipt-printer-modal .modal-header .section-kicker,.receipt-printer-modal .modal-header p { color: rgba(255,255,255,.78); }
.receipt-printer-modal .modal-header h2 { margin: 3px 0 4px; font-size: 28px; font-weight: 850; }
.receipt-printer-modal .modal-header p { margin: 0; }
.receipt-printer-modal .modal-body { padding: 22px; }
.receipt-printer-options { display: grid; gap: 12px; }
.receipt-printer-option { display: grid; grid-template-columns: 52px minmax(0,1fr) 20px; align-items: center; width: 100%; min-height: 84px; gap: 14px; border: 0; border-radius: 24px; background: var(--md-surface-container); color: var(--md-on-surface); padding: 14px 18px; text-align: left; transition: transform 180ms var(--md-ease),box-shadow 220ms var(--md-ease),background-color 220ms var(--md-ease); }
.receipt-printer-option:hover,.receipt-printer-option:focus { outline: 0; background: var(--md-secondary-container); box-shadow: 0 8px 24px rgba(28,27,31,.12); transform: translateY(-1px); }
.receipt-printer-option:active { transform: scale(.98); }
.receipt-printer-option:disabled { opacity: .55; cursor: not-allowed; transform: none; box-shadow: none; }
.receipt-printer-option strong,.receipt-printer-option small { display: block; }
.receipt-printer-option strong { font-size: 17px; }
.receipt-printer-option small { margin-top: 4px; color: var(--md-on-surface-variant); font-size: 13px; line-height: 1.35; }
.receipt-printer-icon { display: grid; width: 50px; height: 50px; place-items: center; border-radius: 18px; background: var(--md-secondary-container); color: var(--md-on-secondary-container); font-size: 20px; }
.receipt-printer-icon.automatic { background: var(--md-primary); color: var(--md-on-primary); }
.receipt-printer-state { min-height: 20px; margin: 14px 4px 0; color: var(--md-primary); font-weight: 700; }
.receipt-printer-state.error { color: #ba1a1a; }
.receipt-printer-modal .modal-footer { border: 0; padding: 0 22px 22px; }
.camera-modal .modal-header { border: 0; background: var(--md-primary); color: var(--md-on-primary); padding: 19px 22px; }
.camera-modal .modal-header .section-kicker { color: rgba(255, 255, 255, .72); }
.camera-modal .modal-title { font-size: 24px; font-weight: 700; }
.camera-modal .close { min-width: 44px; min-height: 44px; margin-top: -8px; color: #fff; font-size: 30px; opacity: .9; }
.camera-modal .modal-body { padding: 18px; }
.camera-viewport { position: relative; overflow: hidden; border-radius: 24px; background: #101412; aspect-ratio: 4 / 3; }
.camera-viewport video { display: block; width: 100%; height: 100%; object-fit: cover; }
.camera-target { position: absolute; top: 50%; left: 50%; width: min(64%, 280px); aspect-ratio: 1; transform: translate(-50%, -50%); }
.camera-target i { position: absolute; width: 42px; height: 42px; border-color: #ff8a3d; border-style: solid; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .45)); }
.camera-target i:nth-child(1) { top: 0; left: 0; border-width: 4px 0 0 4px; border-radius: 14px 0 0; }
.camera-target i:nth-child(2) { top: 0; right: 0; border-width: 4px 4px 0 0; border-radius: 0 14px 0 0; }
.camera-target i:nth-child(3) { right: 0; bottom: 0; border-width: 0 4px 4px 0; border-radius: 0 0 14px; }
.camera-target i:nth-child(4) { bottom: 0; left: 0; border-width: 0 0 4px 4px; border-radius: 0 0 0 14px; }
.camera-status { min-height: 42px; margin: 15px 2px 12px; border-radius: 14px; background: var(--md-secondary-container); color: var(--md-on-secondary-container); padding: 11px 13px; text-align: center; }
.camera-status.success { background: var(--md-primary-container); color: var(--md-on-primary-container); }
.camera-status.error { background: #ffdad6; color: #93000a; }
.camera-modal #pickup-camera-manual { margin-bottom: 10px; }
.ready-list,
.pickup-order,
.payment-terminal,
.order-list-panel,
.detail-drawer,
.availability-panel,
.close-card,
.completion-card,
.chart-panel,
.insight-grid > .t2k-panel,
.report-metrics > .t2k-panel { border: 0; border-radius: 24px; background: var(--md-surface-container); }
.ready-order-link,
.order-list-row {
  min-height: 68px;
  margin: 5px 0;
  border: 0;
  border-radius: 16px;
  background: transparent;
  padding: 13px 14px;
}
.ready-order-link:hover,
.order-list-row:hover { background: rgba(0, 56, 44, .08); }
.order-list-row.active { background: var(--md-primary-container); box-shadow: none; }
.pickup-prep-summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 18px; border-radius: 18px; background: var(--md-secondary-container); color: var(--md-on-secondary-container); padding: 13px 16px; }
.pickup-prep-summary > span { display: inline-flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 900; letter-spacing: .07em; }
.pickup-prep-summary > strong { color: var(--md-primary); font-size: 14px; font-variant-numeric: tabular-nums; }
.pickup-prep-lines { margin-top: 10px; }
.order-prep-summary { margin-top: 16px; }
.order-prep-lines { max-height: min(48vh, 620px); overflow-y: auto; overscroll-behavior: contain; padding-right: 4px; }
.pickup-prep-line { align-items: center; border-radius: 16px; padding: 13px 12px; }
.pickup-prep-line.item-is-ready { background: rgba(182, 241, 220, .28); box-shadow: inset 4px 0 var(--md-primary); }
.pickup-line-meta { display: flex; min-width: 156px; align-items: flex-end; flex-direction: column; gap: 8px; }
.pickup-item-prep-state { display: inline-flex; min-width: 140px; align-items: center; gap: 8px; border-radius: 14px; padding: 7px 10px; }
.pickup-item-prep-state > .glyphicon { font-size: 15px; }
.pickup-item-prep-state > span:last-child { display: flex; flex-direction: column; line-height: 1.15; }
.pickup-item-prep-state b { font-size: 11px; letter-spacing: .04em; }
.pickup-item-prep-state small { margin-top: 2px; color: inherit; font-size: 9px; font-weight: 700; letter-spacing: .04em; }
.pickup-item-prep-state.ready { background: var(--md-primary); color: var(--md-on-primary); }
.pickup-item-prep-state.not-ready { background: var(--md-secondary-container); color: var(--md-on-secondary-container); }
.order-toolbar { margin-bottom: 18px; }
.orders-page-bar { align-items: flex-end; }
.order-date-toolbar { display: flex; align-items: flex-end; gap: 10px; margin: 0; }
.order-date-field { display: flex; min-width: 220px; flex-direction: column; gap: 5px; margin: 0; color: var(--md-on-surface-variant); font-size: 11px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; }
.order-date-field input { width: 220px; height: 48px; border: 0; border-bottom: 2px solid var(--md-outline); border-radius: 12px 12px 0 0; background: var(--md-surface-container-low); color: var(--md-on-surface); padding: 10px 14px; font-size: 15px; font-weight: 650; }
.order-date-field input:focus { border-bottom-color: var(--md-primary); outline: 0; box-shadow: none; }
.order-date-step { width: 48px; min-width: 48px; padding-right: 0; padding-left: 0; }
.order-date-toolbar .btn:disabled { opacity: .38; }
.order-status-toolbar { justify-content: flex-end; }
.order-filter-label { color: var(--md-on-surface-variant); font-size: 11px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; }
.filter-tabs,
.availability-control {
  gap: 4px;
  overflow: visible;
  border: 0;
  border-radius: 999px;
  background: var(--md-secondary-container);
  padding: 4px;
}
.filter-tabs button,
.availability-control button {
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--md-on-secondary-container);
  padding: 10px 16px;
}
.filter-tabs button.active,
.availability-control button.active {
  background: var(--md-primary);
  box-shadow: 0 4px 10px rgba(0, 56, 44, .18);
  color: var(--md-on-primary);
}
.availability-control button.active.danger { background: #ba1a1a; }
.panel-caption { border-color: rgba(121, 116, 126, .2); padding: 16px 18px; }
.availability-row {
  margin: 7px 10px;
  border: 0;
  border-radius: 18px;
  background: rgba(231, 224, 236, .5);
  padding: 15px 16px;
}
.availability-item {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 14px;
}
.availability-item img {
  width: 64px;
  height: 64px;
  flex: 0 0 64px;
  border-radius: 18px;
  background: var(--md-surface-container-low);
  box-shadow: 0 3px 10px rgba(28, 27, 31, .1);
  object-fit: cover;
}
.availability-item > span {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 3px;
}
.availability-item strong,
.availability-item small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.availability-item small { color: var(--md-on-surface-variant); }
.status-label.low {
  background: #ffdf87;
  color: #5b4300;
}
.availability-control button.active[data-state="LOW"] {
  background: #c44f00;
  box-shadow: 0 4px 12px rgba(196, 79, 0, .24);
  color: #fff;
}
.variance-row { border: 0; border-radius: 16px; background: #ffdad6; }
.variance-row.balanced { background: var(--md-primary-container); }
.report-metrics { gap: 16px; }
.report-metrics > div,
.insight-grid > div { transition: box-shadow .3s var(--md-ease), transform .3s var(--md-ease); }
.report-metrics > div:hover,
.insight-grid > div:hover { box-shadow: 0 9px 22px rgba(28, 27, 31, .12); transform: translateY(-3px); }
.chart-panel { padding: 26px; }
.sales-chart { border-color: rgba(121, 116, 126, .25); gap: 10px; }
.sales-chart i { border-radius: 999px 999px 8px 8px; background: var(--md-primary); }
.sales-chart > div:nth-child(3n+1) i { background: var(--md-tertiary); }
.sales-chart > div:nth-child(3n+2) i { background: #6750a4; }
.sales-chart > div:nth-child(3n+3) i { background: var(--md-primary); }
.modal-backdrop.in { opacity: .42; }

/* Ripple layer created by jQuery */
.md-ripple-host { position: relative; overflow: hidden; }
.md-ripple {
  position: absolute;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: currentColor;
  opacity: .16;
  pointer-events: none;
  transform: translate(-50%, -50%) scale(0);
  animation: md-ripple .45s var(--md-ease) forwards;
}
@keyframes md-ripple { to { opacity: 0; transform: translate(-50%, -50%) scale(18); } }

@media (max-width: 820px) {
  .staff-sidebar {
    top: auto;
    right: 8px;
    bottom: 8px;
    left: 8px;
    width: auto;
    height: 72px;
    border-radius: 28px;
  }
  .staff-nav { display: flex; height: 100%; align-items: center; padding: 6px; }
  .staff-nav a { width: 11.111%; height: 58px; border: 0; border-radius: 19px; }
  .staff-nav .admin-portal-link { margin-top: 0; box-shadow: inset 1px 0 rgba(255, 255, 255, .18); }
  .staff-nav .admin-portal-link > i { display: none; }
  .staff-nav a.active,
  .staff-nav a:hover { border: 0; }
  .staff-shell { margin-left: 0; padding-bottom: 88px; }
  .staff-topbar { border-radius: 0 0 24px 24px; }
  .staff-tools .staff-search { display: block; }
  .staff-search input { width: min(44vw, 220px); height: 50px; min-height: 50px; padding-right: 10px; }
  .staff-search-submit { top: 3px; }
  .staff-tools { gap: 10px; }
  .staff-main { padding: 24px 20px 42px; }
  .metric-row { overflow-x: auto; }
  .kds-control-bar { align-items: stretch; flex-direction: column; }
  .kds-control-group { justify-content: space-between; }
  .kds-control-actions { align-items: stretch; flex-direction: column; gap: 12px; }
}

@media (max-width: 620px) {
  .staff-auth-card { border-radius: 26px; padding: 26px 20px; }
  .staff-auth-card h1 { font-size: 27px; }
  .staff-tools > strong { display: none; }
  .staff-search input { width: min(52vw, 210px); }
  .page-bar h1 { font-size: 30px; }
  .station-output-grid,.print-summary { grid-template-columns: 1fr; }
  .station-output-fields.routing-fields,.station-output-fields.printer-fields { grid-template-columns: 1fr; }
  .print-toolbar { align-items: stretch; flex-direction: column; }
  .print-toolbar .filter-tabs { overflow-x: auto; }
  .print-job-main { display: block; }
  .print-job-card>footer { align-items: stretch; flex-direction: column; }
  .print-job-card>footer>div { display: grid; grid-template-columns: 1fr 1fr; }
  .kds-ticket { min-height: 400px; }
  .kds-ticket > header { padding: 19px 20px; }
  .kds-ticket header strong,
  .kds-ticket time { font-size: 19px; }
  .kds-ticket header span { font-size: 15px; }
  .ticket-body { gap: 24px; padding: 20px 20px 26px; }
  .ticket-line-heading { align-items: stretch; flex-direction: column; }
  .ticket-line-actions { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .kds-stock-cycle { min-height: 48px; }
  .kds-item-ready-toggle { width: 100%; min-height: 48px; }
  .ticket-line strong { font-size: 20px; }
  .ticket-line > span:not(.prep-note) { font-size: 16px; }
  .kds-ticket .allergy-alert-content strong { font-size: 16px; }
  .kds-ticket .allergy-alert-content small,
  .kds-ticket .prep-note { font-size: 15px !important; }
  .kds-ticket footer { min-height: 78px; padding: 14px 18px; }
  .kds-ticket .ready-order,
  .kds-ticket .allergy-acknowledge { min-height: 52px; font-size: 17px; }
  .kds-control-bar { margin-right: -4px; margin-left: -4px; border-radius: 24px; padding: 13px; }
  .kds-control-group { align-items: stretch; flex-direction: column; gap: 7px; }
  .kds-control-actions { gap: 13px; }
  .kds-segmented { display: grid; grid-template-columns: 1fr 1fr; width: 100%; }
  .kds-segmented button { min-width: 0; padding: 9px 10px; }
  .kds-batch-card { min-height: 300px; }
  .batch-quantity { min-width: 58px; height: 58px; font-size: 23px; }
  .kds-batch-card header strong { font-size: 20px; }
  .kds-batch-card > header { align-items: stretch; flex-wrap: wrap; }
  .kds-batch-card > header .kds-stock-cycle { width: 100%; margin-left: 0; }
  .batch-line > div strong { font-size: 17px; }
  .batch-line > span:not(.prep-note):not(.batch-allergy) { font-size: 16px; }
  .kds-batch-card > footer { align-items: flex-start; flex-direction: column; }
  .kds-batch-card > footer .batch-ready-toggle { width: 100%; }
  .kds-batch-card > footer small { text-align: left; }
  .pickup-prep-summary { align-items: flex-start; flex-direction: column; gap: 6px; }
  .pickup-prep-line { align-items: stretch; flex-direction: column; }
  .pickup-line-meta { width: 100%; min-width: 0; align-items: center; flex-direction: row; justify-content: space-between; }
  .status-primary { border-radius: 24px; padding: 28px 16px 36px; }
  .customer-order-number { width: 100%; min-width: 0; margin-bottom: 22px; padding: 15px 18px; }
  .customer-order-number strong { font-size: 48px; }
  .status-qr-card { grid-template-columns: 1fr; justify-items: center; padding: 20px 16px; text-align: center; }
  .status-qr-card p { max-width: 320px; }
  .counter-ticket { border-radius: 24px; }
  .counter-number-callout { margin: 18px 16px 0; padding: 14px 16px; }
  .counter-number-callout strong { font-size: 44px; }
  .scanner-card { padding: 28px 16px; }
  .camera-scan-button { width: 100%; }
  .camera-modal .modal-dialog { position: fixed; top: max(8px, env(safe-area-inset-top)); right: 8px; bottom: max(8px, env(safe-area-inset-bottom)); left: 8px; width: auto; margin: 0; }
  .camera-modal .modal-content { display: flex; max-height: 100%; flex-direction: column; border-radius: 24px; }
  .camera-modal .modal-body { display: flex; min-height: 0; flex: 1; flex-direction: column; }
  .camera-viewport { min-height: 0; flex: 1; aspect-ratio: auto; }
  .t2k-modal { overflow: hidden; padding: 0 !important; }
  .t2k-modal .modal-dialog {
    position: fixed;
    top: max(8px, env(safe-area-inset-top));
    right: 0;
    bottom: 0;
    left: 0;
    width: auto;
    max-width: none;
    height: auto;
    margin: 0;
  }
  .t2k-modal .modal-content {
    width: 100%;
    height: 100%;
    max-height: none;
    border-radius: 28px 28px 0 0;
  }
  .t2k-modal-header { padding: 20px 68px 18px 20px; }
  .t2k-modal-header .close { top: 10px; right: 12px; }
  .t2k-modal .modal-body { padding: 20px; }
  .t2k-modal .modal-footer { padding: 14px 20px calc(14px + env(safe-area-inset-bottom)); }
  .availability-row { margin-right: 0; margin-left: 0; }
  .availability-item img { width: 54px; height: 54px; flex-basis: 54px; border-radius: 15px; }
  .filter-tabs button,
  .availability-control button { min-height: 44px; padding: 9px 12px; }
  .orders-page-bar { display: flex; align-items: stretch; flex-direction: column; gap: 18px; }
  .order-date-toolbar { align-items: flex-end; flex-wrap: wrap; }
  .order-date-field { min-width: 0; flex: 1 1 190px; }
  .order-date-field input { width: 100%; }
  #orders-today { flex: 1 1 auto; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .menu-item:hover,
  .metric-row > div:hover,
  .kds-ticket:hover,
  .report-metrics > div:hover,
  .insight-grid > div:hover,
  .payment-option:hover { transform: none; }
}
