/* Cheye Bethak · Unified Design System 2026
   Shared by Staff, Customer, QR & Inventory. Visual only: business/payment logic untouched.
   All brand accents resolve to the administrator's Theme > Primary Color. */
:root {
  --cb-modern-ink:#14233b;
  --cb-modern-muted:#64748b;
  --cb-modern-stroke:#e7eaf1;
  --cb-modern-bg:#f5f7fb;
  --cb-modern-white:#fff;
  --cb-brand-tint:color-mix(in srgb,var(--cb-primary) 9%,white);
  --cb-brand-border:color-mix(in srgb,var(--cb-primary) 26%,white);
  --cb-modern-radius:19px;
  --cb-modern-lift:0 10px 38px rgba(23,39,65,.055);
  --cb-modern-hover:0 16px 42px rgba(23,39,65,.09);
}
body.cb-modern {background:var(--cb-modern-bg);color:var(--cb-modern-ink);font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;-webkit-font-smoothing:antialiased;}
body.cb-modern .cb-shell {background:var(--cb-modern-bg)}
body.cb-modern .cb-sidebar {background:#fff;border-right:1px solid var(--cb-modern-stroke)}
body.cb-modern .cb-brand {min-height:88px;height:auto;padding:17px 19px;gap:11px;background:linear-gradient(145deg,#fff 50%,var(--cb-brand-tint))}
body.cb-modern .cb-brand-logo-image,body.cb-modern .cb-mobile-brand-logo{width:46px;max-width:46px;max-height:49px;object-fit:contain;border-radius:11px;flex:0 0 auto}
body.cb-modern .cb-brand-copy {min-width:0;flex:1}
body.cb-modern .cb-brand-name{font-size:1rem;font-weight:850;line-height:1.14;overflow-wrap:anywhere;letter-spacing:-.025em}
body.cb-modern .cb-brand-sub {font-size:.69rem;letter-spacing:.01em}
body.cb-modern .cb-logo,body.cb-modern .login-mark,body.cb-modern .customer-brand-mark {background:linear-gradient(145deg,var(--cb-primary),var(--cb-primary-dark));color:var(--cb-on-primary,#fff);box-shadow:var(--cb-brand-shadow)}
body.cb-modern .cb-sidebar-scroll{padding:14px 13px 22px}
body.cb-modern .cb-nav-title{color:#98a4b5;letter-spacing:.14em;margin:20px 12px 8px;font-size:.65rem}
body.cb-modern .cb-nav a{border-radius:12px;height:43px;color:#58677e;margin-bottom:1px;font-size:.82rem}
body.cb-modern .cb-nav a>span:first-child{font-size:1.02rem;color:#8894aa}
body.cb-modern .cb-nav a:hover{background:var(--cb-brand-tint);color:var(--cb-primary-dark);transform:translateX(1px)}
body.cb-modern .cb-nav a.active{background:var(--cb-brand-tint);color:var(--cb-primary-dark);font-weight:850;box-shadow:inset 0 0 0 1px var(--cb-brand-border)}
body.cb-modern .cb-nav a.active>span:first-child{background:white;color:var(--cb-primary)}
body.cb-modern .cb-nav a.active:after{background:var(--cb-primary);height:27px;right:-13px}
body.cb-modern .cb-sidebar-foot{border-color:var(--cb-modern-stroke)}
body.cb-modern .cb-role-card{background:#f7f9fc;border-color:var(--cb-modern-stroke)}
body.cb-modern .cb-topbar{background:rgba(255,255,255,.95);border-color:var(--cb-modern-stroke);box-shadow:0 3px 16px rgba(19,36,66,.025)}
body.cb-modern .cb-top-title{font-size:.97rem;letter-spacing:-.015em}
body.cb-modern .cb-content{padding-top:25px}
body.cb-modern .cb-pagehead h1{font-size:clamp(1.45rem,2.1vw,1.83rem);letter-spacing:-.045em}
body.cb-modern .cb-card,body.cb-modern .panel,body.cb-modern .table-card{border:1px solid var(--cb-modern-stroke);border-radius:var(--cb-modern-radius);box-shadow:var(--cb-modern-lift);background:#fff}
body.cb-modern .panel-head,body.cb-modern .ci-panel-head{background:linear-gradient(180deg,#fff,#fdfdff)}
body.cb-modern .panel-head h3{letter-spacing:-.025em}
body.cb-modern .metric,body.cb-modern .metric-pink,body.cb-modern .metric-purple,body.cb-modern .metric-violet,body.cb-modern .metric-blue,body.cb-modern .metric-orange,body.cb-modern .metric-green{background:linear-gradient(120deg,var(--cb-primary),color-mix(in srgb,var(--cb-primary) 73%,#243a66))!important;box-shadow:0 10px 27px rgba(var(--cb-primary-rgb),.13);border-radius:18px}
body.cb-modern .metric-icon{background:#fff!important;color:var(--cb-primary-dark)!important}
body.cb-modern .metric-value{font-variant-numeric:tabular-nums}
body.cb-modern .btn-success,body.cb-modern button.btn-success,body.cb-modern a.btn-success,body.cb-modern .btn-primary{background:var(--cb-primary)!important;border-color:var(--cb-primary)!important;color:var(--cb-on-primary,#fff)!important;box-shadow:0 4px 13px rgba(var(--cb-primary-rgb),.10)}
body.cb-modern .btn-success:hover,body.cb-modern button.btn-success:hover,body.cb-modern .btn-primary:hover{background:var(--cb-primary-dark)!important;border-color:var(--cb-primary-dark)!important;color:#fff!important;transform:translateY(-1px)}
body.cb-modern .btn-outline-success{color:var(--cb-primary-dark)!important;border-color:var(--cb-brand-border)!important;background:#fff}
body.cb-modern .btn-outline-success:hover{color:var(--cb-on-primary,#fff)!important;background:var(--cb-primary)!important;border-color:var(--cb-primary)!important}
body.cb-modern :is(.btn,.form-control,.form-select,.input-group-text,.top-icon,.user-chip){border-radius:11px}
body.cb-modern :is(.form-control,.form-select){border-color:#dce3ee;min-height:40px}
body.cb-modern :is(.form-control,.form-select):focus{border-color:var(--cb-primary);box-shadow:0 0 0 .2rem rgba(var(--cb-primary-rgb),.12)}
body.cb-modern .form-check-input:checked{background-color:var(--cb-primary);border-color:var(--cb-primary)}
body.cb-modern .form-check-input:focus{box-shadow:0 0 0 .2rem rgba(var(--cb-primary-rgb),.12)}
body.cb-modern .top-icon:hover,body.cb-modern .user-chip:hover{border-color:var(--cb-brand-border);background:var(--cb-brand-tint)}
body.cb-modern .cb-customer-picker .cb-customer-choice:hover,body.cb-modern .cb-customer-picker .cb-customer-choice.is-active{background:var(--cb-brand-tint);color:var(--cb-primary-dark)}
body.cb-modern .pos-order-toolbar{border-color:var(--cb-modern-stroke);border-radius:20px;box-shadow:var(--cb-modern-lift)}
body.cb-modern .pos-order-toolbar-mark{background:var(--cb-brand-tint);color:var(--cb-primary)}
body.cb-modern .pos-order-field{background:#f8fafc;border-color:var(--cb-modern-stroke)}
body.cb-modern .pos-order-field .form-label i{color:var(--cb-primary)}
body.cb-modern .pos-category-heading{border-left-color:var(--cb-primary);background:var(--cb-brand-tint)}
body.cb-modern .pos-category-buttons .category-chip.active,body.cb-modern .category-chip.active{background:var(--cb-primary)!important;border-color:var(--cb-primary)!important;color:var(--cb-on-primary,#fff)!important}
body.cb-modern .pos-category-buttons .category-chip:hover,body.cb-modern .category-chip:hover{border-color:var(--cb-brand-border);box-shadow:0 3px 13px rgba(var(--cb-primary-rgb),.12)}
body.cb-modern .item-card{border:1px solid var(--cb-modern-stroke);border-radius:15px;box-shadow:0 6px 22px rgba(27,46,79,.055);transition:box-shadow .2s ease,transform .2s ease}
@media(hover:hover){body.cb-modern .item-card:hover{transform:translateY(-3px);box-shadow:var(--cb-modern-hover)}}
body.cb-modern .item-card :is(.btn,.pos-item-add){border-radius:11px}
body.cb-modern .table :is(th,td){vertical-align:middle}
body.cb-modern .table thead th{background:#f8fafc;color:#8793a7;font-size:.69rem;letter-spacing:.04em;border-color:var(--cb-modern-stroke)}
body.cb-modern .table tbody td{border-color:#edf1f5}
body.cb-modern .table tbody tr:hover{background:color-mix(in srgb,var(--cb-primary) 3%,white)}
body.cb-modern .settings-panel-title h2{font-weight:850;letter-spacing:-.025em}
body.cb-modern .settings-subnav a.active{background:var(--cb-brand-tint);color:var(--cb-primary-dark)}
body.cb-modern .theme-preview{background:#f8fafc;border-color:var(--cb-modern-stroke)}
body.cb-modern .theme-preset:focus-visible{outline:3px solid var(--cb-primary);outline-offset:4px}
/* Theme settings: admin sees what customers and staff will see after save. */
.brand-settings-preview{display:flex;align-items:center;gap:16px;padding:19px;background:linear-gradient(115deg,#f8fafc,var(--cb-brand-tint));border:1px solid var(--cb-brand-border);border-radius:17px}
.brand-settings-mark{width:62px;height:62px;display:grid;place-items:center;flex:0 0 62px;border-radius:16px;background:#fff;box-shadow:var(--cb-modern-lift);overflow:hidden;color:var(--cb-primary-dark);font-weight:900}
.brand-settings-mark img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;padding:5px}
.brand-settings-preview>div{display:flex;flex-direction:column;min-width:0;gap:3px}
.brand-settings-preview strong{font-size:1rem;letter-spacing:-.02em}
.brand-settings-preview small{font-size:.73rem;color:var(--cb-modern-muted);line-height:1.45}
.brand-settings-swatch{width:42px;height:42px;flex:0 0 42px;border-radius:13px;margin-left:auto;background:var(--cb-primary);box-shadow:inset 0 0 0 3px #ffffff80,0 4px 16px rgba(var(--cb-primary-rgb),.2)}
.brand-settings-help{background:var(--cb-brand-tint);color:var(--cb-primary-dark);padding:13px 16px;border-radius:13px;border:1px solid var(--cb-brand-border);font-size:.8rem;line-height:1.55;margin-top:18px}
/* Unified public experiences without changing navigation, cart or QR interactions. */
body.cb-modern.customer-portal-body,body.cb-modern.qr-order-body{background:linear-gradient(135deg,var(--cb-brand-tint),#f7f9fc 46%,#f5f7fb)}
body.cb-modern .customer-portal-top,body.cb-modern .qr-menu-top{background:rgba(255,255,255,.97);border-bottom:1px solid var(--cb-modern-stroke);box-shadow:0 4px 25px rgba(23,39,65,.045)}
body.cb-modern .customer-brand-logo,body.cb-modern .qr-brand-logo{object-fit:contain;max-height:64px}
body.cb-modern .customer-brand-logo.sm,body.cb-modern .qr-brand-logo.sm{max-width:60px;max-height:46px}
body.cb-modern :is(.customer-login-card,.qr-public-card,.qr-current-bill){border:1px solid var(--cb-modern-stroke);border-radius:21px;box-shadow:var(--cb-modern-lift)}
body.cb-modern .qr-prior-total{background:var(--cb-brand-tint);border-color:var(--cb-brand-border)}
body.cb-modern .qr-prior-total .qr-prior-amount{color:var(--cb-primary-dark)}
body.cb-modern .qr-bill-total{color:var(--cb-primary-dark)}
/* Inventory owns its own component CSS: share the same brand tokens. */
body.cb-modern .ci{--ci-green:var(--cb-primary);--ci-ink:var(--cb-modern-ink);--ci-line:var(--cb-modern-stroke)}
body.cb-modern .ci .ci-hero{background:linear-gradient(120deg,var(--cb-primary-dark),color-mix(in srgb,var(--cb-primary-dark) 58%,#112b36))}
body.cb-modern .ci :is(.ci-panel,.ci-stat,.ci-period){border-color:var(--cb-modern-stroke);box-shadow:var(--cb-modern-lift)}
body.cb-modern .ci .ci-tabs a.active{background:var(--cb-primary)!important;color:var(--cb-on-primary,#fff)!important}
body.cb-modern .ci .ci-note{background:var(--cb-brand-tint);border-color:var(--cb-brand-border);color:var(--cb-primary-dark)}
/* Keep error/warning/paid/unpaid semantic signals distinguishable regardless of theme. */
body.cb-modern .text-danger{color:#c72b45!important}
body.cb-modern .text-warning{color:#a25c00!important}
body.cb-modern .alert-danger{background:#fff1f3;border-color:#ffd3db;color:#872537}
body.cb-modern .alert-warning{background:#fffaee;border-color:#ffe8a6;color:#775014}
@media(max-width:991.98px){body.cb-modern .cb-topbar{padding-inline:15px}body.cb-modern .cb-content{padding:15px 13px 30px}body.cb-modern .cb-brand{min-height:74px}}
@media(max-width:575.98px){body.cb-modern .metric{padding:15px;min-height:110px}body.cb-modern .metric-value{font-size:1.22rem}body.cb-modern .cb-card,body.cb-modern .panel{border-radius:16px}.brand-settings-preview{padding:13px;gap:11px}.brand-settings-mark{width:48px;height:48px;flex-basis:48px}.brand-settings-swatch{width:30px;height:30px;flex-basis:30px}}
@media(prefers-reduced-motion:reduce){body.cb-modern .item-card,body.cb-modern .btn,body.cb-modern .cb-nav a{transition:none!important}body.cb-modern .item-card:hover{transform:none}}
@media print{body.cb-modern{background:#fff!important}body.cb-modern .cb-card,body.cb-modern .panel{box-shadow:none!important}body.cb-modern .metric{print-color-adjust:exact}}
/* The login and closed-hours splash screens share the selected brand hue. */
body.cb-modern .login-visual,body.cb-modern .login-offer-visual{background:linear-gradient(135deg,color-mix(in srgb,var(--cb-primary-dark) 70%,#092d37),color-mix(in srgb,var(--cb-primary) 35%,#0b2234))!important}
body.cb-modern .login-brand-logo{max-width:90px;max-height:70px;object-fit:contain}
body.cb-modern .login-form-logo{max-width:180px;max-height:90px;object-fit:contain}
body.cb-modern .login-card{border-radius:22px}
body.cb-modern.shop-closed-body{background:linear-gradient(145deg,color-mix(in srgb,var(--cb-primary-dark) 60%,#092e2e),color-mix(in srgb,var(--cb-primary) 20%,#061f2b));color:#fff}
body.cb-modern .shop-closed-icon,body.cb-modern .shop-closed-next{border-color:rgba(255,255,255,.16)}
body.cb-modern .qr-success-bill-row.qr-final-total{background:var(--cb-brand-tint);border-color:var(--cb-brand-border)}
body.cb-modern .qr-success-bill-row.qr-final-total :is(strong,.qr-row-label){color:var(--cb-primary-dark)}
body.cb-modern .customer-bottom-nav a.active{color:var(--cb-primary-dark);background:var(--cb-brand-tint)}
body.cb-modern .customer-featured-offers .card-add-btn,body.cb-modern .qr-public-grid .card-add-btn{color:var(--cb-primary-dark)!important;background:var(--cb-brand-tint)!important;border-color:var(--cb-brand-border)!important}
body.cb-modern .customer-featured-offers .card-add-btn:hover,body.cb-modern .qr-public-grid .card-add-btn:hover{color:var(--cb-on-primary,#fff)!important;background:var(--cb-primary)!important}

.receipt-footer-brand{display:block;width:auto;height:auto;max-width:150px;max-height:50px;object-fit:contain;margin:8px auto 2px}

/* Brand Studio · solid and gradients share one safe, validated palette. */
body.cb-modern .btn-success,
body.cb-modern button.btn-success,
body.cb-modern a.btn-success,
body.cb-modern .btn-primary,
body.cb-modern .pos-category-buttons .category-chip.active,
body.cb-modern .category-chip.active,
body.cb-modern .ci .ci-tabs a.active,
body.cb-modern .ci .ci-btn-primary,
body.cb-modern .theme-studio-demo-button {
  background:var(--cb-brand-fill,var(--cb-primary))!important;
  border-color:transparent!important;
  color:var(--cb-on-primary,#fff)!important;
  background-clip:padding-box;
}
body.cb-modern .btn-success:hover,
body.cb-modern button.btn-success:hover,
body.cb-modern .btn-primary:hover,
body.cb-modern .ci .ci-btn-primary:hover {
  background:var(--cb-brand-fill-hover,var(--cb-primary-dark))!important;
  color:var(--cb-on-primary,#fff)!important;
}
body.cb-modern .metric,
body.cb-modern .metric-pink,
body.cb-modern .metric-purple,
body.cb-modern .metric-violet,
body.cb-modern .metric-blue,
body.cb-modern .metric-orange,
body.cb-modern .metric-green {
  background:var(--cb-brand-fill,var(--cb-primary))!important;
  color:var(--cb-on-primary,#fff)!important;
}
body.cb-modern .metric :is(.metric-label,.metric-value,.metric-desc){color:inherit!important}
body.cb-modern .cb-logo,
body.cb-modern .login-mark,
body.cb-modern .customer-brand-mark,
body.cb-modern .ci .ci-tabs a.active {
  background:var(--cb-brand-fill,var(--cb-primary))!important;
  color:var(--cb-on-primary,#fff)!important;
}
body.cb-modern .ci .ci-hero,
body.cb-modern .login-visual,
body.cb-modern .login-offer-visual,
body.cb-modern.shop-closed-body {background:var(--cb-brand-hero,var(--cb-primary-dark))!important}
body.cb-modern .cb-brand,
body.cb-modern .brand-settings-preview,
body.cb-modern .pos-category-heading,
body.cb-modern .qr-prior-total,
body.cb-modern .qr-success-bill-row.qr-final-total {
  background:var(--cb-brand-soft-fill,var(--cb-brand-tint))!important;
}
body.cb-modern .cb-nav a.active,
body.cb-modern .settings-subnav a.active,
body.cb-modern .ci .ci-note {background:var(--cb-brand-soft-fill,var(--cb-brand-tint))!important}
body.cb-modern .cb-nav a.active:after {background:var(--cb-brand-fill,var(--cb-primary))!important}

/* A compact, accessible Theme Studio. */
body.cb-modern .theme-studio{padding:0!important;overflow:hidden;border:1px solid #e2e8f0}
.theme-studio *{box-sizing:border-box}
.theme-studio-heading{padding:29px clamp(18px,3vw,36px) 24px;background:linear-gradient(116deg,#101f34,#1b2840);color:#fff}
.theme-studio-heading-label{font-size:.66rem;letter-spacing:.17em;color:#b3dbff;font-weight:850;display:flex;align-items:center;gap:8px}
.theme-studio-heading h2{font-size:clamp(1.6rem,2.4vw,2.3rem);font-weight:900;letter-spacing:-.045em;margin:10px 0 6px;color:#fff}
.theme-studio-heading p{max-width:640px;color:#bac8d8;font-size:.84rem;line-height:1.65;margin:0}
.theme-studio-layout{padding:clamp(16px,2.3vw,29px);display:grid;grid-template-columns:minmax(0,1.12fr) minmax(290px,.88fr);align-items:start;gap:25px}
.theme-studio-editor{min-width:0}
.theme-studio-section-title{display:flex;align-items:center;gap:11px;margin-bottom:14px}
.theme-studio-section-title>div{display:flex;flex-direction:column;gap:2px}
.theme-studio-section-title strong{font-size:.94rem;color:#1b2b43}
.theme-studio-section-title small{color:#76859b;font-size:.73rem;line-height:1.45}
.theme-studio-step{width:32px;height:32px;flex:0 0 32px;border-radius:10px;display:grid;place-items:center;background:#eaf1f9;color:#365577;font-size:.73rem;font-weight:850}
.theme-mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:11px}
.theme-mode-option{position:relative;display:flex;align-items:center;gap:12px;border:1.5px solid #e1e7ef;background:#f9fbff;border-radius:15px;padding:12px;cursor:pointer;transition:border-color .2s,box-shadow .2s}
.theme-mode-option input{position:absolute;opacity:0;width:1px;height:1px}
.theme-mode-option:has(input:checked){border-color:var(--cb-primary);box-shadow:0 0 0 3px var(--cb-brand-border);background:#fff}
.theme-mode-option:has(input:focus-visible){outline:3px solid var(--cb-primary);outline-offset:2px}
.theme-mode-option>i{margin-left:auto;color:var(--cb-primary);opacity:0}
.theme-mode-option:has(input:checked)>i{opacity:1}
.theme-mode-icon{width:40px;height:40px;flex:0 0 40px;border-radius:12px;box-shadow:inset 0 0 0 1px #fff9}
.theme-mode-solid{background:#246BFE}
.theme-mode-gradient{background:linear-gradient(135deg,#12A566,#1D93DE,#7853E8)}
.theme-mode-copy{display:flex;flex-direction:column;gap:3px;min-width:0}
.theme-mode-copy strong{font-size:.78rem;color:#1b2b43}
.theme-mode-copy small{font-size:.67rem;color:#748299}
.theme-studio-preset-list{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:9px}
.theme-studio-preset{display:flex;flex-direction:column;gap:6px;padding:6px;border:1px solid #e7eaf0;border-radius:13px;background:#fff;color:#617089;font-size:.65rem;font-weight:750;cursor:pointer;transition:box-shadow .2s,border-color .2s}
.theme-studio-preset-swatch{height:36px;width:100%;border-radius:9px;background:var(--preset-fill)}
.theme-studio-preset.is-selected,.theme-studio-preset:hover{border-color:var(--cb-primary);box-shadow:0 0 0 2px var(--cb-brand-border)}
.theme-studio-preset:focus-visible{outline:3px solid var(--cb-primary);outline-offset:2px}
.theme-color-stop-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}
.theme-color-stop{min-width:0}
.theme-color-stop label{font-size:.73rem;font-weight:750;color:#344862;display:block;margin-bottom:7px}
.theme-color-stop-input{display:flex;align-items:center;gap:10px;padding:5px;border:1px solid #dfe6ee;border-radius:12px;background:#fff}
.theme-color-stop-input input[type=color]{appearance:none;-webkit-appearance:none;flex:0 0 42px;width:42px;height:39px;padding:0;border:0;background:none;cursor:pointer}
.theme-color-stop-input input[type=color]::-webkit-color-swatch-wrapper{padding:0}
.theme-color-stop-input input[type=color]::-webkit-color-swatch{border:0;border-radius:8px}
.theme-color-stop-input input[type=color]::-moz-color-swatch{border:0;border-radius:8px}
.theme-color-stop-input .form-control{min-width:0;border:0!important;box-shadow:none!important;font-size:.78rem;font-weight:750;font-variant-numeric:tabular-nums;padding:6px}
.theme-gradient-options{background:#f7f9fc;border:1px solid #e7ecf3;padding:14px;border-radius:15px;margin-top:15px}
.theme-gradient-option-row,.theme-angle-row{display:flex;justify-content:space-between;align-items:center;gap:12px}
.theme-gradient-option-row>span,.theme-angle-row>label{display:flex;flex-direction:column;gap:3px}
.theme-gradient-option-row strong,.theme-angle-row strong{font-size:.74rem;color:#283e56}
.theme-gradient-option-row small,.theme-angle-row small{font-size:.67rem;color:#77869c}
.theme-stops-switch{display:flex;padding:3px;background:#eaf0f7;border-radius:9px}
.theme-stops-switch label{position:relative;cursor:pointer}
.theme-stops-switch input{position:absolute;opacity:0}
.theme-stops-switch span{display:block;padding:7px 10px;font-size:.7rem;font-weight:800;color:#6d7d94;border-radius:7px}
.theme-stops-switch input:checked+span{background:#fff;color:#183047;box-shadow:0 2px 8px #20364c13}
.theme-stops-switch input:focus-visible+span{outline:2px solid var(--cb-primary)}
.theme-angle-row{margin-top:17px}
#themeAngleValue{font-size:.78rem;background:#fff;border:1px solid #e3eaf1;border-radius:8px;padding:5px 10px;font-weight:900;font-variant-numeric:tabular-nums}
.theme-angle-slider{width:100%;margin:15px 0 9px;accent-color:var(--cb-primary)}
.theme-angle-presets{display:flex;gap:7px;flex-wrap:wrap}
.theme-angle-presets button{border:1px solid #dce4ee;background:#fff;border-radius:9px;padding:6px 9px;font-size:.66rem;color:#4b5c73}
.theme-angle-presets button:hover{background:var(--cb-brand-tint);border-color:var(--cb-brand-border)}
.theme-studio-contrast{margin-top:12px;padding:11px;background:#fff8e8;color:#965909;border:1px solid #ffe5a8;border-radius:11px;font-size:.73rem}
.theme-studio [hidden]{display:none!important}
.theme-studio-preview-column{position:sticky;top:20px;min-width:0;border:1px solid #e0e7f0;background:#f9fbff;border-radius:19px;padding:13px}
.theme-studio-preview-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:4px 4px 13px;font-size:.74rem;color:#1f314e}
.theme-studio-preview-head>div{display:flex;align-items:center;gap:8px}
.theme-studio-preview-head>span{font-size:.66rem;color:#8290a3}
.theme-studio-live-dot{width:9px;height:9px;border-radius:50%;background:#18b777;box-shadow:0 0 0 4px #18b77719}
.theme-studio-preview-window{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 15px 40px #12243f13}
.theme-studio-preview-top{display:flex;align-items:center;gap:9px;padding:12px;background:var(--cb-brand-soft-fill);min-height:63px}
.theme-preview-mark{width:35px;height:35px;display:grid;place-items:center;flex:0 0 35px;border-radius:10px;background:var(--cb-brand-fill);color:var(--cb-on-primary,#fff);font-size:.69rem;font-weight:900;overflow:hidden}
.theme-preview-mark img{width:100%;height:100%;object-fit:contain;background:#fff}
.theme-studio-preview-brand{display:flex;flex-direction:column;min-width:0;gap:2px}
.theme-studio-preview-brand strong{font-size:.72rem;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}
.theme-studio-preview-brand small{font-size:.61rem;color:#66768e}
.theme-studio-preview-top>i{margin-left:auto;color:#8796ab}
.theme-studio-preview-content{padding:14px}
.theme-studio-preview-intro{display:flex;flex-direction:column;gap:4px;margin-bottom:14px}
.theme-studio-preview-intro small{font-size:.55rem;letter-spacing:.14em;color:var(--cb-primary);font-weight:850}
.theme-studio-preview-intro strong{font-size:1.13rem;color:#20324b}
.theme-studio-preview-intro span{font-size:.67rem;color:#8693a6}
.theme-studio-preview-metrics{display:grid;grid-template-columns:1.35fr .65fr;gap:8px}
.theme-preview-metric-primary,.theme-preview-metric-white{border-radius:12px;padding:12px;display:flex;flex-direction:column;gap:7px;min-width:0}
.theme-preview-metric-primary{background:var(--cb-brand-fill);color:var(--cb-on-primary,#fff)}
.theme-preview-metric-primary small,.theme-preview-metric-white small{font-size:.63rem;opacity:.85}
.theme-preview-metric-primary strong,.theme-preview-metric-white strong{font-size:1.05rem;font-weight:900}
.theme-preview-metric-primary span,.theme-preview-metric-white span{font-size:.57rem;opacity:.85}
.theme-preview-metric-white{border:1px solid #e8edf4;background:#f9fafc;color:#293955}
.theme-studio-preview-nav{display:flex;gap:7px;margin:13px 0}
.theme-studio-preview-nav span{font-size:.64rem;color:#708096;display:flex;gap:5px;align-items:center;padding:8px;border-radius:8px}
.theme-studio-preview-nav span.active{background:var(--cb-brand-soft-fill);color:var(--cb-primary-dark);font-weight:800}
.theme-studio-demo-button{width:100%;border:0;border-radius:10px;padding:11px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:.76rem;font-weight:800;color:var(--cb-on-primary,#fff);background:var(--cb-brand-fill)}
.theme-studio-preview-footer{display:flex;align-items:center;gap:11px;padding:13px 4px 3px}
.theme-preview-swatch{width:40px;height:40px;flex:0 0 40px;border-radius:11px;background:var(--cb-brand-fill)}
.theme-studio-preview-footer>div{display:flex;flex-direction:column;min-width:0;gap:3px}
.theme-studio-preview-footer strong{font-size:.73rem;color:#273b53;overflow-wrap:anywhere}
.theme-studio-preview-footer small{font-size:.67rem;color:#8793a4}
.theme-studio-guide{font-size:.71rem;color:#72829b;line-height:1.55;margin-top:14px;padding:10px 6px 2px}
.theme-studio-guide>i{color:var(--cb-primary);margin-right:5px}
.theme-studio-assets{padding:22px clamp(16px,2.3vw,29px);border-top:1px solid #e7edf5}
.theme-studio-asset-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:11px}
.theme-studio-asset{border:1px solid #e4eaf2;border-radius:15px;padding:12px;display:flex;align-items:center;flex-wrap:wrap;gap:9px;background:#f9fbfe;cursor:pointer}
.theme-studio-asset-image{width:53px;height:53px;flex:0 0 53px;display:grid;place-items:center;border-radius:12px;background:#fff;border:1px solid #e7edf4;color:#8b99a9;font-size:1.3rem;overflow:hidden}
.theme-studio-asset-image img{height:100%;width:100%;object-fit:contain}
.theme-studio-asset>span:nth-child(2){min-width:0;display:flex;flex-direction:column;gap:4px;flex:1}
.theme-studio-asset strong{font-size:.76rem;color:#263954}
.theme-studio-asset small{font-size:.65rem;color:#8491a5}
.theme-studio-asset .form-control{font-size:.68rem;min-width:0;flex:1 0 100%;background:#fff}
.theme-studio-actions{display:flex;justify-content:space-between;align-items:center;gap:13px;padding:17px clamp(16px,2.3vw,29px);border-top:1px solid #e7edf5;background:#f8fbff}
.theme-studio-actions>span{font-size:.71rem;color:#698099}
.theme-studio-actions .btn{font-weight:800;padding:11px 20px}
@media(max-width:1050px){.theme-studio-layout{grid-template-columns:1fr}.theme-studio-preview-column{position:static;max-width:580px}.theme-studio-preset-list{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:767.98px){.theme-studio-asset-grid{grid-template-columns:1fr}.theme-studio-heading{padding:23px 18px}.theme-studio-actions{flex-direction:column;align-items:stretch}.theme-studio-actions .btn{width:100%}}
@media(max-width:480px){.theme-studio-preset-list{grid-template-columns:repeat(3,minmax(0,1fr))}.theme-mode-grid{gap:6px}.theme-mode-option{padding:8px;gap:6px}.theme-mode-icon{width:30px;height:30px;flex-basis:30px}.theme-mode-copy strong{font-size:.69rem}.theme-studio-section-title small{font-size:.67rem}.theme-color-stop-grid{grid-template-columns:1fr}.theme-stops-switch span{padding:6px 8px}}
/* Customer, QR, PWA-facing menu affordances also use the saved palette. */
body.cb-modern .bottom-nav a.active,
body.cb-modern .portal-tabs a.active,
body.cb-modern .qr-table-pill,
body.cb-modern .qr-menu-hero {
  background:var(--cb-brand-soft-fill,var(--cb-brand-tint))!important;
  border-color:var(--cb-brand-border)!important;
}
body.cb-modern .qr-cart-fab,
body.cb-modern .offer-plus {
  background:var(--cb-brand-fill,var(--cb-primary))!important;
  color:var(--cb-on-primary,#fff)!important;
}
body.cb-modern .qr-cart-fab b {
  background:rgba(255,255,255,.22)!important;
  color:inherit!important;
}
body.cb-modern .theme-studio :is(button,input,select):focus-visible {outline:3px solid var(--cb-primary);outline-offset:2px}