/* Presentation only. Existing markup, controls, hidden states and commerce own
   the flow. An installation without a template stays on the unchanged legacy CSS. */
html:is([data-storefront-design="signature"], [data-storefront-design="direct"], [data-storefront-design="noir"]) {
  --sf-heading-font: Georgia, "Times New Roman", serif;
  --sf-radius: 5px;
  --sf-control-line: var(--line);
  --sf-success-text: #365c3c;
  --sf-success-bg: #edf3e7;
  --sf-warning-text: #754611;
  --sf-warning-bg: #fff1db;
  --sf-error-text: #8a3026;
  --sf-error-bg: #ffefeb;
}
html[data-storefront-design="direct"] { --sf-heading-font: var(--font); --sf-radius: 12px; }
html[data-storefront-design="noir"] {
  --sf-radius: 12px;
  --sf-control-line: #7d8d7f;
  --sf-success-text: #a4d8ad;
  --sf-success-bg: #243d2b;
  --sf-warning-text: #efbb87;
  --sf-warning-bg: #3c2d20;
  --sf-error-text: #f4ad9e;
  --sf-error-bg: #402c28;
  color-scheme: dark;
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) body {
  background: var(--brand-bg); color: var(--brand-text); caret-color: var(--sf-brand-readable);
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) ::selection {
  background: var(--brand-primary); color: var(--sf-action-ink);
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) .topbar {
  background: var(--brand-bg); backdrop-filter: none; box-shadow: none;
  min-height: 72px; padding-block: 12px; gap: 14px;
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) .brand-logo { filter: none; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .brand strong { font-size: 21px; font-weight: 650; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .shop-shell { max-width: 1400px; gap: 28px; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .status-band {
  background: transparent; border-radius: 0; color: var(--brand-text);
  border-bottom: 1px solid var(--line); padding: 8px 0 24px; overflow: visible;
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) .status-band:has(.storefront-hero-image[hidden]) { grid-template-columns: minmax(0, 1fr); }
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.status-band h1, .cart-head h2, .customize-head h2, .account-center-head h2, .order-status-head h3) {
  font-family: var(--sf-heading-font); font-weight: 500; letter-spacing: -.02em; line-height: 1.2; text-wrap: balance;
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) .status-band h1 { font-size: clamp(30px, 3.5vw, 48px); }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .storefront-subheading { color: var(--brand-muted); font-size: 15px; font-weight: 450; line-height: 1.65; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .storefront-hero-image { border: 0; box-shadow: none; border-radius: var(--sf-radius); }
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.delivery-promise, .service-summary-button) {
  background: var(--brand-surface); color: var(--brand-text); border: 1px solid var(--sf-control-line);
  box-shadow: none; border-radius: var(--sf-radius); font-size: 14px; font-weight: 600;
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) .search-box {
  background: var(--brand-surface); border-color: var(--sf-control-line); border-radius: var(--sf-radius); color: var(--brand-muted);
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) .category-strip { background: var(--brand-bg); }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .category-strip button {
  background: var(--brand-surface); color: var(--brand-muted); border-color: var(--line);
  border-radius: var(--sf-radius); min-height: 44px; font-weight: 600; box-shadow: none;
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) .category-strip button.is-active {
  background: var(--brand-primary); color: var(--sf-action-ink); border-color: var(--brand-primary);
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) .product-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .product-card {
  background: transparent; border: 0; border-bottom: 1px solid var(--line); border-radius: 0;
  box-shadow: none; grid-template-columns: 92px minmax(0, 1fr) 44px; gap: 18px; padding: 20px 0;
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) .product-card.is-image-free { grid-template-columns: minmax(0, 1fr) 44px; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .food-visual { border-radius: var(--sf-radius); }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .product-copy h3 {
  font-family: var(--sf-heading-font); font-size: 22px; font-weight: 500; letter-spacing: -.015em; line-height: 1.3;
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) .product-copy > p { font-size: 14px; font-weight: 450; line-height: 1.6; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .product-meta { gap: 10px; padding-block-start: 10px; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.product-offer, .product-offer-line) { font-size: 12px; line-height: 1.6; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .product-price { font-size: 18px; font-variant-numeric: tabular-nums; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .price-current { font-weight: 700; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .product-card-badges .product-badge { font-size: 12px; font-weight: 600; border-radius: 5px; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .product-card button:not(:disabled) {
  background: var(--brand-surface); border: 1px solid var(--sf-control-line); color: var(--sf-brand-readable);
  border-radius: var(--sf-radius); box-shadow: none;
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) .product-card button:not(:disabled):hover { background: var(--brand-primary); color: var(--sf-action-ink); }
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.cart-panel, .entry-intake-card, .customize-sheet, .account-center-sheet) {
  background: var(--brand-surface); color: var(--brand-text); border-radius: var(--sf-radius); box-shadow: none;
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.cart-head h2, .customize-head h2, .account-center-head h2) { font-size: 26px; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.cart-line, .checkout-form, .customize-actions, .account-center-head, .customize-head) { border-color: var(--line); }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .customize-actions { background: var(--brand-surface); color: var(--brand-text); }
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.primary-action, .campaign-card-cta) {
  background: var(--brand-primary); border-color: var(--brand-primary); color: var(--sf-action-ink); border-radius: var(--sf-radius);
  font-weight: 650; min-height: 44px; box-shadow: none;
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) .cart-drawer-toggle { background: var(--brand-primary); color: var(--sf-action-ink); }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .cart-overlay-close { background: var(--brand-surface); color: var(--brand-text); }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .site-footer a { background: var(--brand-surface); color: var(--brand-text); border-color: var(--sf-control-line); }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .primary-action:disabled { opacity: .6; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.secondary-action, .account-center-button, .reservation-nav-link, .language-current, .language-option, .entry-intake-close, .cart-line-remove) {
  background: var(--brand-surface); color: var(--brand-text); border-color: var(--sf-control-line); border-radius: var(--sf-radius); min-height: 44px;
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.language-menu, .entry-intake-actions, .account-center-tabs, .option-choice, .service-switch label, .entry-service-switch label, .payment-option, .order-status-card, .order-status-estimate, .loyalty-card, .loyalty-reward-card, .coupon-panel, .notification-permission-card) {
  background: var(--brand-surface); color: var(--brand-text); border-color: var(--sf-control-line); border-radius: var(--sf-radius);
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.checkout-form input, .checkout-form select, .checkout-form textarea, .account-center-login input, .account-center-form input:not([type="checkbox"]), .account-center-form select, .entry-intake-card input:not([type="radio"]), .coupon-panel input) {
  background: var(--brand-surface); color: var(--brand-text); border-color: var(--sf-control-line); border-radius: var(--sf-radius); min-height: 44px;
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(input, textarea)::placeholder { color: var(--brand-muted); opacity: 1; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.option-choice, .payment-option):has(input:checked) {
  background: color-mix(in srgb, var(--sf-brand-readable) 12%, var(--brand-surface)); border-color: var(--sf-brand-readable);
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.service-switch label, .entry-service-switch label):has(input:checked) {
  background: color-mix(in srgb, var(--sf-brand-readable) 12%, var(--brand-surface)); border-color: var(--sf-brand-readable);
}
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.option-choice, .payment-option, .checkbox-line) { min-height: 44px; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.checkout-form-head p, .account-center-head p:last-child, .account-center-note, .cart-line-options, .cart-line-note, .payment-option small) { color: var(--brand-muted); }
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.account-center-auth-link, .cart-line-price.is-special, .product-price.is-special, .order-status-estimate strong, .campaign-card-disclosure summary) { color: var(--sf-brand-readable); }
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(button, a, input, select, textarea, summary):focus-visible { outline: 3px solid var(--sf-focus); outline-offset: 3px; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) .search-box:focus-within { outline: 3px solid var(--sf-focus); outline-offset: 3px; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.campaign-card-description-full, .campaign-card-terms, .campaign-card-disclosure summary) { font-size: 12px; line-height: 1.55; }
html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.campaign-showcase, .campaign-card) { background: var(--brand-surface); color: var(--brand-text); border-color: var(--line); }
html[data-storefront-design="direct"] :is(.status-band h1, .cart-head h2, .customize-head h2, .account-center-head h2, .order-status-head h3, .product-copy h3) { font-weight: 700; }
html[data-storefront-design="direct"] .status-band { background: color-mix(in srgb, var(--brand-primary) 7%, var(--brand-bg)); border: 0; border-radius: 12px; padding: 22px; }
html[data-storefront-design="direct"] .product-grid { gap: 14px; }
html[data-storefront-design="direct"] .product-card { background: var(--brand-surface); border: 1px solid var(--line); border-radius: 12px; padding: 18px; }
html[data-storefront-design="direct"] .product-copy h3 { font-size: 21px; }
html[data-storefront-design="direct"] .product-card button:not(:disabled) { background: var(--brand-primary); color: var(--sf-action-ink); border-color: var(--brand-primary); }
html[data-storefront-design="noir"] :is(.order-status-connection, .checkout-message.is-ok, .account-center-message.is-success) { background: var(--sf-success-bg); color: var(--sf-success-text); border-color: var(--sf-success-text); }
html[data-storefront-design="noir"] :is(.order-status-connection.is-waiting, .order-status-connection.is-offline, .order-status-connection.is-unavailable, .storefront-notice, .test-mode-banner) { background: var(--sf-warning-bg); color: var(--sf-warning-text); border-color: var(--sf-warning-text); }
html[data-storefront-design="noir"] :is(.checkout-message.is-error, .customize-message.is-error, .account-center-message.is-error, .service-closure-notice) { background: var(--sf-error-bg); color: var(--sf-error-text); border-color: var(--sf-error-text); }
html[data-storefront-design="noir"] :is(.storefront-notice, .order-status-connection) { border-inline-start-width: 1px; }
html[data-storefront-design="noir"] .status-pill { background: var(--sf-success-bg); color: var(--sf-success-text); }
html[data-storefront-design="noir"] .account-center-button.is-logged-in { background: var(--sf-success-bg); color: var(--sf-success-text); }
html[data-storefront-design="noir"] .order-status-marker { background: var(--brand-surface); color: var(--brand-muted); }
html[data-storefront-design="noir"] .order-status-step:is(.is-current, .is-done) .order-status-marker { background: var(--sf-success-bg); color: var(--sf-success-text); }
html[data-storefront-design="noir"] .campaign-card-marker { background: var(--soft-line); color: var(--sf-brand-readable); }
html[data-storefront-design="noir"] :is(.option-choice strong, .eyebrow) { color: var(--sf-brand-readable); }
html[data-storefront-design="noir"] :is(.account-mode button, .loyalty-checkout-box, .entry-delivery-fields, .delivery-precheck) {
  background: var(--brand-surface); color: var(--brand-text); border-color: var(--sf-control-line);
}
html[data-storefront-design="noir"] :is(.account-center-tabs button[aria-selected="true"], .account-mode button[aria-pressed="true"], .town-choice-list button[aria-pressed="true"]) {
  background: var(--brand-primary); color: var(--sf-action-ink); border-color: var(--brand-primary);
}
html[data-storefront-design="noir"] :is(.loyalty-checkout-box select, .account-form input:not([type="checkbox"]), .delivery-precheck input, .promotion-box input, .item-note textarea) {
  background: var(--brand-surface); color: var(--brand-text); border-color: var(--sf-control-line);
}
html[data-storefront-design="noir"] :is(.loyalty-checkout-box label, .loyalty-checkout-box p, .entry-delivery-fields label, .entry-delivery-status) { color: var(--brand-muted); }
html[data-storefront-design="noir"] :is(.entry-delivery-fields.ok, .delivery-precheck.ok) { background: var(--sf-success-bg); color: var(--sf-success-text); }
html[data-storefront-design="noir"] :is(.entry-delivery-fields.is-error, .delivery-precheck.is-error) { background: var(--sf-error-bg); color: var(--sf-error-text); }
html[data-storefront-design="noir"] :is(.entry-delivery-fields.ok .entry-delivery-status, .delivery-precheck.ok p) { color: var(--sf-success-text); }
html[data-storefront-design="noir"] :is(.entry-delivery-fields.is-error .entry-delivery-status, .delivery-precheck.is-error p) { color: var(--sf-error-text); }
html[data-storefront-design="noir"] .site-footer { background: var(--brand-bg); color: var(--brand-muted); }
html[data-storefront-design][dir="rtl"]:not([data-storefront-design="legacy"]) :is(h1, h2, h3, .product-copy h3) { font-family: var(--font); letter-spacing: normal; }
@media (max-width: 1024px) {
  html[data-storefront-design]:not([data-storefront-design="legacy"]) .shop-shell { padding-inline: 16px; }
  html[data-storefront-design]:not([data-storefront-design="legacy"]) .status-band { min-height: 0; }
  html[data-storefront-design]:not([data-storefront-design="legacy"]) .status-band h1 { font-size: 30px; }
  html[data-storefront-design]:not([data-storefront-design="legacy"]) .product-card { grid-template-columns: 80px minmax(0, 1fr) 44px; gap: 12px; }
  html[data-storefront-design]:not([data-storefront-design="legacy"]) .product-card.is-image-free { grid-template-columns: minmax(0, 1fr) 44px; }
  html[data-storefront-design]:not([data-storefront-design="legacy"]) .food-visual { height: 80px; }
  html[data-storefront-design]:not([data-storefront-design="legacy"]) .product-copy h3 { font-size: 20px; }
  html[data-storefront-design]:not([data-storefront-design="legacy"]) .product-copy > p { font-size: 13px; }
  html[data-storefront-design]:not([data-storefront-design="legacy"]) .cart-panel { border-radius: 0; background: var(--brand-surface); }
}
@media (max-width: 520px) {
  html[data-storefront-design]:not([data-storefront-design="legacy"]) .topbar { gap: 9px; padding-inline: 12px; }
  html[data-storefront-design]:not([data-storefront-design="legacy"]) .topbar-actions { gap: 7px; }
  html[data-storefront-design]:not([data-storefront-design="legacy"]) :is(.account-center-button, .reservation-nav-link) { padding-inline: 10px; font-size: 12px; }
  html[data-storefront-design]:not([data-storefront-design="legacy"]) .language-current { font-size: 12px; }
  html[data-storefront-design]:not([data-storefront-design="legacy"]) .cart-panel.is-mobile-overlay { border-radius: 0; }
}