/* GRAP Golden — colours drawn from the restaurant's original logo. */
html[data-theme="grap"] {
  --ink:#24211c; --forest:#30291f; --forest-dark:#201e19;
  --sage:#80672d; --mint:#fff1c9; --cream:#faf7f0; --paper:#fff;
  --line:#e8e0d2; --muted:#736b5e; --amber:#986600; --danger:#bb302b;
  --grap-gold:#f4b400; --grap-gold-hover:#e9a800; --grap-olive:#687329;
  --surface-raised:#fff; --surface-soft:#f6f0e5; --outline-soft:#e8e0d2;
  --shadow-sm:0 2px 8px #30291f08; --shadow-md:0 12px 30px #30291f0c;
  --shadow-lg:0 24px 65px #201e1920;
  color-scheme:light;
}
html[data-theme="grap"] body {background:var(--cream)}
html[data-theme="grap"] :is(h1,h2,h3,h4,.brand strong,.grand strong,.queue-card-bottom>strong) {
  font-family:'DM Sans',system-ui,sans-serif; font-weight:800; letter-spacing:-.035em;
}
html[data-theme="grap"] :is(button,input,select,textarea,a):focus-visible {outline:3px solid #b87900;outline-offset:3px}
html[data-theme="grap"] .sidebar {
  background:#24211c; color:#fff8e6; border-color:#363127; box-shadow:none;
}
html[data-theme="grap"] .sidebar:after {display:none}
html[data-theme="grap"] .brand {
  display:flex;flex-direction:column;align-items:center;gap:10px;padding:2px 8px 24px;
  margin:0;text-align:center;border-bottom:1px solid #ffffff17;
}
html[data-theme="grap"] .brand .brand-mark {
  width:104px;height:104px;flex:0 0 104px;margin:0;border-radius:22px;
  background:#fff;box-shadow:none;letter-spacing:0;color:#24211c;
}
html[data-theme="grap"] .brand-mark img {width:100%;height:100%;padding:0;object-fit:contain;transform:scale(1.18)}
html[data-theme="grap"] .brand strong {color:#fff8e6;font-size:21px;letter-spacing:.12em}
html[data-theme="grap"] .brand small {color:#c7baa0}
html[data-theme="grap"] .nav-label {color:#b9ad97}
html[data-theme="grap"] .side-nav {padding-top:16px;min-height:0;overflow-y:auto;scrollbar-width:thin}
html[data-theme="grap"] .nav {color:#e5dac5;border-radius:10px}
html[data-theme="grap"] .nav:hover {background:#ffffff0c;color:#fff}
html[data-theme="grap"] .nav-icon {background:transparent;color:inherit}
html[data-theme="grap"] .nav.active {background:var(--grap-gold);color:#24211c;box-shadow:none;font-weight:800}
html[data-theme="grap"] .nav.active:before {display:none}
html[data-theme="grap"] .logout {color:#d2c6af}
html[data-theme="grap"] .store-status {background:#ffffff08;border-color:#ffffff12;color:#eee2c9}
html[data-theme="grap"] .store-status small {color:#c7baa0}
html[data-theme="grap"] .topbar {background:#fffdf9;border-color:var(--line);box-shadow:none}
html[data-theme="grap"] :is(.page-intro h1,.cashier-catalog-head h2,.cart-head h2) {color:var(--ink)}
html[data-theme="grap"] :is(.avatar,.user-menu .avatar) {background:#fff0bc;color:#654600}
html[data-theme="grap"] :is(#view-pos,#view-pos .menu-pane) {background:var(--cream)}
html[data-theme="grap"] :is(.product,.product-shell>.product) {border-color:var(--line);box-shadow:0 3px 10px #30291f06}
html[data-theme="grap"] .product-shell>.product:hover:not(:disabled) {border-color:#d8a736;box-shadow:0 8px 20px #8d65151a}
html[data-theme="grap"] .product .price {color:#44331b;font-weight:800}
html[data-theme="grap"] .add-dot {background:var(--grap-gold);border-color:var(--grap-gold);color:#24211c;box-shadow:none}
html[data-theme="grap"] .category-chip {background:#fffdf9;border-color:var(--line);color:var(--ink)}
html[data-theme="grap"] .category-chip.active {background:#29251e;border-color:#29251e;color:#fff8e6;box-shadow:none}
html[data-theme="grap"] .product-pagination button.active {background:var(--grap-gold);border-color:var(--grap-gold);color:#24211c}
html[data-theme="grap"] .cart {background:#fff;border-color:var(--line)}
html[data-theme="grap"] .cart-head {background:#fff9e9;color:var(--ink);border-bottom:1px solid var(--line)}
html[data-theme="grap"] body[data-role="cashier"] .cart-head {background:transparent;border-bottom:0}
html[data-theme="grap"] .cart-head :is(.eyebrow,.pill) {color:#745516}
html[data-theme="grap"] .cart-head-actions>button {color:#493f2e;background:#f7f2e8;border-color:var(--line)}
html[data-theme="grap"] .order-types {background:#f7f3eb;border-color:var(--line)}
html[data-theme="grap"] .otype {color:#72634e}
html[data-theme="grap"] .otype.active {background:var(--grap-gold);color:#24211c;box-shadow:none}
html[data-theme="grap"] .payment-method {border-color:var(--line);color:var(--muted)}
html[data-theme="grap"] .payment-method.active {background:#fff5d6;border-color:#c99b27;color:#5b400a;box-shadow:none}
html[data-theme="grap"] .grand strong {color:#2a251c}
html[data-theme="grap"] :is(.pay,.primary-button,.customize-add,.complete-queue,.login-button) {
  background:var(--grap-gold);color:#24211c;border-color:var(--grap-gold);box-shadow:none;font-weight:800;
}
html[data-theme="grap"] :is(.pay,.primary-button,.customize-add,.complete-queue,.login-button):hover:not(:disabled) {background:var(--grap-gold-hover)}
html[data-theme="grap"] .queue-button {background:#fff;border-color:#bca77d;color:#554329}
html[data-theme="grap"] .kitchen-send-button {background:#fff6da;border-color:#d7b86b;color:#634a15}
html[data-theme="grap"] .queue-board {background:#29251e;border-color:#29251e;color:#fff6dc;box-shadow:none}
html[data-theme="grap"] .queue-card {background:#fffdf7;border-color:#e5dac2;color:var(--ink)}
html[data-theme="grap"] .queue-head p {color:#dbceb3}
html[data-theme="grap"] .queue-board .soft-badge {background:#f4b40022;border-color:#f4b40033;color:#ffe4a0}
html[data-theme="grap"] .queue-empty {background:#ffffff08;border-color:#ffffff2b;color:#e5d9be}
html[data-theme="grap"] :is(.status-label.ok,.stock-badge,.toast.success>span) {background:#edf0dc;color:#596722}
html[data-theme="grap"] :is(.table-action.delete,.remove-line,.text-danger) {color:#b62c27}
html[data-theme="grap"] .inventory-tabs button.active {background:#29251e;color:#ffdc7c}
html[data-theme="grap"] .stat.revenue {background:#29251e;color:#fff5d4}
html[data-theme="grap"] .stat.revenue .stat-value {color:#ffd66b}
html[data-theme="grap"] .customize-hero {background:#fff1c9}
html[data-theme="grap"] .variant-option input:checked+label {background:#fff5d6;border-color:#d4a22c;box-shadow:inset 0 0 0 1px #d4a22c}
html[data-theme="grap"] .addon-option.selected {background:#fff8e4;border-color:#d4a22c}
html[data-theme="grap"] .modal-backdrop {background:#211d16a6}
html[data-theme="grap"] .theme-choice:has(input:checked) .theme-preview {border-color:#bd8b05}
.preview-grap {background:#faf7f0}
.preview-grap i {background:#24211c}
.preview-grap b {background:#f4b400}
.preview-grap em {background:#fff0be}
html[data-theme="grap"] .login-wrap {background:#faf7f0}
html[data-theme="grap"] .login-visual:not(.has-custom-background) {
  background:radial-gradient(ellipse at 95% 10%,#f4b40024,transparent 48%),linear-gradient(145deg,#30291d,#1e1c18);
}
html[data-theme="grap"] .login-visual:after {border-color:#f4b40035;box-shadow:0 0 0 75px #f4b40006,0 0 0 150px #f4b40004}
html[data-theme="grap"] .login-hero-logo {position:relative;width:min(310px,100%);height:auto;aspect-ratio:1;border-radius:0;box-shadow:none;margin-bottom:24px;background:transparent;overflow:visible}
html[data-theme="grap"] :is(.login-hero-logo,.login-form-brand) img {object-fit:contain;transform:none}
html[data-theme="grap"] .login-hero-logo img.grap-symbol-source {display:block;width:100%;height:100%;padding:0;object-fit:contain;object-position:left center;transform:none}
html[data-theme="grap"] .visual-content h1 {font-size:clamp(40px,4.3vw,70px);font-weight:800;letter-spacing:-.05em;color:#fff6df}
html[data-theme="grap"] .visual-content>.eyebrow {color:#f4b400}
/* The complete hero image already includes the GRAP wordmark. */
html[data-theme="grap"] .visual-content>.grap-wordmark {display:none}
html[data-theme="grap"] .visual-content>p:not(.eyebrow) {color:#d8cbb1}
html[data-theme="grap"] .visual-stats {border-color:#ffffff20}
html[data-theme="grap"] .visual-stats strong {color:#ffda74}
html[data-theme="grap"] .visual-stats span {color:#c1b59d}
html[data-theme="grap"] .login-panel {background:#faf7f0}
html[data-theme="grap"] .login-card {background:#fff;border-color:var(--line);box-shadow:0 18px 55px #30291f0a}
html[data-theme="grap"] .login-card h2 {color:var(--ink)}
html[data-theme="grap"] .login-card label {color:#514634}
html[data-theme="grap"] .input-shell {border-color:var(--line)}
html[data-theme="grap"] .input-shell:focus-within {border-color:#c99b27;box-shadow:0 0 0 3px #f4b40020}
html[data-theme="grap"] .field-icon {color:#9a845b}
@media(max-width:900px){html[data-theme="grap"] .brand {flex-direction:row;text-align:left;padding-bottom:18px}html[data-theme="grap"] .brand .brand-mark{width:72px;height:72px;flex-basis:72px;border-radius:16px}}
html[data-theme="grap"] .upload-hint {display:block;margin:-2px 0 10px;color:var(--muted);font-size:10px;line-height:1.45}
@media(max-width:680px){html[data-theme="grap"] .login-hero-logo{width:min(220px,100%);height:auto;margin-bottom:20px}html[data-theme="grap"] .visual-content h1{font-size:36px}html[data-theme="grap"] .login-visual{padding:30px;min-height:340px}}
html[data-theme="grap"] .queue-card p,html[data-theme="grap"] .queue-card .queue-age {color:#73654d}
html[data-theme="grap"] .queue-card .table-action {background:#f6f0e5;border-color:#ded0b6;color:#4f4028}
html[data-theme="grap"] .queue-card .table-action.delete {background:#fff0ec;border-color:#efd1c6;color:#ad3029}
html[data-theme="grap"] .login-form-logo {background:#fff3cf;color:#654600}
html[data-theme="grap"] .login-form-brand>span {color:#75603d}

html[data-theme="grap"] .queue-head #queueCount{background:transparent;border:0;color:#dbceb3}

html[data-theme="grap"] .queue-card .queue-card-bottom .table-action{background:transparent;border:0;color:#73654d}
html[data-theme="grap"] .queue-card .queue-card-bottom .table-action.delete{color:#b62c27}
html[data-theme="grap"] .queue-card .queue-card-bottom .table-action:hover{background:#f3ecdf}
html[data-theme="grap"] .queue-kitchen-button,html[data-theme="grap"] .queue-retry-button{background:#f6f0e5;border-color:#e5dac2;color:#554329}
html[data-theme="grap"] .queue-kitchen-button:hover,html[data-theme="grap"] .queue-retry-button:hover{background:#eee4d2}

/* Keep both workspaces on the same sidebar layout with quiet scroll affordances. */
html[data-theme="grap"] .sidebar>.brand,html[data-theme="grap"] .sidebar-foot{flex-shrink:0}
html[data-theme="grap"] .side-nav{scrollbar-width:thin;scrollbar-color:transparent transparent;overscroll-behavior:contain}
html[data-theme="grap"] .side-nav:hover,html[data-theme="grap"] .side-nav:focus-within{scrollbar-color:#756c5b transparent}
html[data-theme="grap"] .side-nav::-webkit-scrollbar{width:5px}
html[data-theme="grap"] .side-nav::-webkit-scrollbar-track{background:transparent}
html[data-theme="grap"] .side-nav::-webkit-scrollbar-thumb{background:transparent;border-radius:10px}
html[data-theme="grap"] .side-nav:hover::-webkit-scrollbar-thumb,html[data-theme="grap"] .side-nav:focus-within::-webkit-scrollbar-thumb{background:#756c5b}
html[data-theme="grap"] .side-nav{justify-content:stretch;align-content:start}
html[data-theme="grap"] .side-nav .nav{width:100%}
