/* Customer surfaces only. No typography, dimensions, tenant settings or staff theme changes. */
body.customer-app {
  --platform-forest:#153F36;
  --platform-lime:#C5ED78;
  --platform-ivory:#F7F6F0;
  --platform-coral:#FF865E;
  --brand:var(--platform-forest);
  --accent:var(--platform-lime);
  --bg:var(--platform-ivory);
  --ink:var(--platform-forest);
  --muted:#52655c;
  --line:#d9e1d8;
  --amber:var(--platform-coral);
  color:var(--ink);
  background:var(--bg);
}
/* Keep the restaurant's validated color and logo in its existing context/hero. */
.customer-app #context-label {color:var(--tenant-brand,var(--brand))}
.customer-app .customer-menu-hero {background:var(--tenant-brand,var(--brand))}
.customer-app .hero .eyebrow,.customer-app .hero .muted {color:#fff}
.customer-app .topbar {background:#fff;border-color:var(--line)}
.customer-app .secondary {background:var(--bg);color:var(--brand);border-color:#76877e}
.customer-app .floating-cart {background:var(--platform-lime);color:var(--platform-forest)}
.customer-app .cart-badge {background:var(--platform-forest);color:#fff}
.customer-app .cart-icon {filter:brightness(0)}
.customer-app .field input,.customer-app .field select,.customer-app .field textarea {background:#fff;border-color:#76877e}
.customer-app .field [aria-invalid=true] {border-color:var(--danger)}
.customer-app :focus-visible {outline-color:var(--platform-forest)}
.customer-app .app-modal {border-color:var(--line)}
.customer-app .app-modal::backdrop {background:#153f36b3}
.customer-app .modal-symbol {background:var(--platform-coral);color:var(--platform-forest)}
.customer-app .pickup .modal-symbol {background:#d9f6e4;color:#145b38}
.customer-app .cart-modal .modal-actions button {border-color:#76877e}
.customer-app .cart-remove {background:#fff;color:var(--danger)}
.customer-app .cart-remove:hover {background:#fff1ef;color:var(--danger)}
/* Disabled remains readable; not confused with destructive/error states. */
.customer-app button:disabled {opacity:1;background:#e5e9e2;color:#52655c}

/* Approved tenant heading: independent of hero and platform theme variables. */
.customer-app .topbar{display:grid;grid-template-columns:minmax(0,1fr) auto;row-gap:20px;padding-top:18px;padding-bottom:20px}
.customer-app .topbar .brand{grid-column:1;grid-row:1}
.customer-app .topbar #session-nav{grid-column:2;grid-row:1;align-self:start}
.customer-app .topbar #context-label{grid-column:1/-1;grid-row:2;display:flex;align-items:center;gap:24px;padding-top:4px;max-width:none;min-width:0;color:var(--company-heading-color,var(--platform-forest));font-size:24px;font-weight:800;line-height:1.25;letter-spacing:-.025em}
.customer-app .tenant-context-logo{display:block;width:44px;height:44px;object-fit:contain;object-position:center;flex:0 0 44px}
.customer-app #context-label>span{min-width:0;overflow-wrap:anywhere}
.customer-app .platform-brand-icon>img{object-fit:contain}
.customer-app .auth>.eyebrow{line-height:1.7}