/* Visual-only layer for the shared public menu. Checkout behavior stays in menu.js. */
:root {
  --bg-body: var(--color-bg);
  --bg-surface: var(--color-card);
  --bg-surface-subtle: var(--color-bg);
  --bg-surface-hover: var(--color-bg);
  --brand-dark: var(--color-dark);
  --brand-primary: var(--color-dark);
  --brand-accent: var(--color-dark);
  --brand-accent-hover: var(--color-dark);
  --brand-accent-light: var(--color-accent);
  --brand-accent-border: var(--color-accent);
  --text-heading: var(--color-dark);
  --text-body: var(--color-dark);
  --text-muted: var(--color-text-muted);
  --text-light: var(--color-card);
  --price-color: var(--color-dark);
  --success: var(--color-ok);
  --success-bg: var(--color-ok-bg);
  --success-border: var(--color-ok-bg);
  --border-subtle: var(--color-line);
  --border-medium: var(--color-line);
  --border-focus: var(--color-dark);
  --shadow-subtle: none;
  --shadow-card: none;
  --shadow-card-hover: none;
  --shadow-floating: none;
  --shadow-sheet: none;
}
html { scroll-behavior: smooth; }
[hidden] { display: none !important; }
body { background: var(--color-bg); color: var(--color-dark); font-size: 15px; }
button, input, select { font-size: inherit; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible {
  outline: 3px solid var(--color-dark); outline-offset: 2px;
}
.store-header-container a:focus-visible { outline-color: var(--color-accent); }
.modifier-option-input:focus-visible + .modifier-option-label,
.payment-option:has(input:focus-visible),
.order-receipt-label:focus-within {
  outline: 3px solid var(--color-dark); outline-offset: 2px;
}
#loader { background: var(--color-dark); }
.loader-spinner { border-top-color: var(--color-accent); }
.loader-brand span { color: var(--color-accent); }
.store-header-container {
  position: sticky; top: 0; z-index: 40; background-color: var(--color-dark);
  padding: 16px var(--menu-page-gutter);
  min-height: 76px;
  border-bottom: 0;
}
.store-header-container.is-compact { min-height: 58px; padding-top: 7px; padding-bottom: 7px; }
.store-header-container.is-compact .store-address,
.store-header-container.is-compact .store-contacts,
.store-header-container.is-compact .header-service-meta { display: none; }
.store-header-container.is-compact .store-logo { width: 40px; height: 40px; }
.header-overlay-ambient { background: color-mix(in srgb, var(--color-dark) 84%, transparent); }
.store-header-wrapper { gap: 12px; align-items: center; }
.store-branding { flex-direction: row; align-items: center; gap: 12px; }
.store-logo { width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--color-line); box-shadow: none; }
.store-name { font-size: clamp(18px,2vw,25px); line-height: 1.15; margin: 0; }
.store-address { font-size: 13px; margin-top: 3px; }
.posit-partner-badge { display: none; }
.store-contacts { gap: 8px; }
.contact-item, .social-icon-btn { min-height: 44px; font-size: 14px; }
.social-icon-btn { min-width: 44px; }
.header-service-meta {
  position: relative; z-index: 2; display: flex; flex-wrap: wrap;
  align-items: center; gap: 7px; margin-top: 8px;
  font-size: 14px; font-weight: 700;
}
.header-status-pill, .header-eta-pill {
  display: inline-flex; align-items: center; min-height: 28px;
  padding: 4px 9px; border-radius: 10px;
  background: var(--color-ok-bg); color: var(--color-ok-contrast);
}
.header-status-pill.closed { background: var(--color-closed-bg); color: var(--color-closed); }
.header-eta-pill { background: var(--color-card); color: var(--color-dark); }
.delivery-details-row .badge-status-pill { display: none; }
.closed-banner {
  padding: 10px var(--menu-page-gutter);
  background: var(--color-closed-bg);
  color: var(--color-closed);
  font-weight: 700;
  border-bottom: 1px solid var(--color-line);
}
.closed-banner[hidden], .menu-facts[hidden], .all-categories-panel[hidden] { display: none; }
.delivery-status-card { margin: 0 auto; padding: 12px var(--menu-page-gutter) 4px; }
.delivery-toggle-group { border-radius: 12px; padding: 4px; box-shadow: none; }
.delivery-toggle-option { min-height: 44px; }
.delivery-toggle-option.active { background: var(--color-dark); color: var(--color-card); box-shadow: none; }
.delivery-toggle-option.active i { color: var(--color-card); }
.delivery-details-row { margin-top: 8px; padding: 8px 12px; border-radius: 10px; box-shadow: none; }
.badge-status-pill { color: var(--color-ok-contrast); background: var(--color-ok-bg); border-color: var(--color-ok-bg); }
.badge-status-pill.closed, .badge-status-pill.unknown {
  color: var(--color-closed); background: var(--color-closed-bg); border-color: var(--color-closed-bg);
}
.badge-status-pill.closed .pulse-dot, .badge-status-pill.unknown .pulse-dot { background: var(--color-closed); }
.menu-facts { display: flex; gap: 8px; flex-wrap: wrap; margin: 9px 0 2px; }
.menu-facts span { border: 1px solid var(--color-line); border-radius: 99px; padding: 6px 10px; background: var(--color-card); color: var(--color-dark); font-size: 13px; }
.menu-app-wrapper { grid-template-columns: minmax(0,1fr) minmax(300px,330px); gap: 18px; padding-top: 4px; }
.menu-discovery { grid-column: 1 / -1; }
.search-container { margin-bottom: 0; }
.search-box { box-shadow: none; border-radius: 10px; min-height: 46px; }
.category-section-container {
  grid-column: 1 / -1; position: sticky; top: 58px; z-index: 30;
  display: flex; align-items: center; gap: 10px;
  padding: 9px 0; margin: 0; border: 0; border-bottom: 1px solid var(--color-line);
  border-radius: 0; background: var(--color-bg); box-shadow: none; min-width: 0;
}
.category-section-header { display: none; }
.category-grid { display: flex; flex: 1; gap: 7px; overflow-x: auto; padding: 2px 0; scrollbar-width: thin; min-width: 0; }
.category-grid { scrollbar-width: none; }
.category-grid::-webkit-scrollbar { display: none; }
.category-tab, .all-categories-btn {
  flex: 0 0 auto; width: auto; min-height: 44px; padding: 9px 14px;
  background: var(--color-card); color: var(--color-dark);
  border: 1px solid var(--color-line); border-radius: 99px;
  font-size: 14px; font-weight: 700; white-space: nowrap; box-shadow: none;
}
.category-tab.active { color: var(--color-card); background: var(--color-dark); border-color: var(--color-dark); box-shadow: none; }
.all-categories-btn { background: var(--color-bg); }
.all-categories-panel {
  position: absolute; top: 100%; right: 0; width: min(360px,100%); max-height: 55vh;
  overflow: auto; display: grid; gap: 3px; padding: 10px; border: 1px solid var(--color-line);
  border-radius: 12px; background: var(--color-card);
}
.all-categories-panel button { min-height: 44px; text-align: left; padding: 8px 12px; border: 0; border-radius: 8px; background: var(--color-card); color: var(--color-dark); }
.all-categories-panel button:hover { background: var(--color-bg); }
.menu-sections { gap: 24px; }
.menu-section { scroll-margin-top: 78px; }
.section-title { font-size: 19px; margin-bottom: 10px; border: 0; padding: 0; }
.product-list { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.product-card {
  min-height: 110px; padding: 12px; gap: 10px; border-radius: 12px;
  align-items: center; box-shadow: none; transition: border-color .16s ease;
}
.product-card:hover { transform: none; box-shadow: none; border-color: var(--color-text-muted); }
.product-details { min-width: 0; min-height: 84px; }
.product-name { font-size: 15px; font-weight: 700; margin-bottom: 3px; }
.product-description { font-size: 13px; margin: 0 0 6px; color: var(--color-text-muted); }
.product-price { font-size: 16px; font-weight: 700; }
.featured-badge { order: 2; background: var(--color-accent); color: var(--color-dark); border: 0; border-radius: 99px; text-transform: none; letter-spacing: 0; font-size: 11px; padding: 3px 7px; }
.product-img-wrapper { order: -1; width: 76px; height: 76px; border-radius: 10px; }
.add-btn, .product-inline-qty button {
  width: 44px; height: 44px; min-width: 44px; padding: 0;
  justify-content: center; border: 0; border-radius: 50%;
  color: var(--color-card); background: var(--color-cta); font-size: 20px; box-shadow: none;
}
.add-btn:hover, .product-inline-qty button:hover { background: var(--color-cta); color: var(--color-card); transform: none; box-shadow: none; }
.add-btn:disabled, .product-inline-qty button:disabled { background: var(--color-line); color: var(--color-dark); cursor: not-allowed; }
.add-btn[hidden] { display: none; }
.product-inline-qty {
  display: inline-flex; align-items: center; gap: 8px; font-weight: 700;
  animation: productQtyAppear .16s ease-out both;
}
@keyframes productQtyAppear {
  from { opacity: 0; transform: scale(.92); }
  to { opacity: 1; transform: scale(1); }
}
.product-inline-qty button { font-size: 22px; }
.product-card.is-closed { cursor: default; }
.menu-cart-column { top: 76px; }
.desktop-cart-card { border-radius: 12px; padding: 15px; box-shadow: none; }
.delivery-fee-note { margin: 8px 0 0; color: var(--color-text-muted); font-size: 13px; line-height: 1.4; }
.cart-badge-label, .cart-header-icon { display: none; }
.empty-cart-state { padding: 26px 10px; }
.cart-item-name { white-space: normal; }
.qty-btn, .qty-btn:hover { background: var(--color-card); color: var(--color-dark); box-shadow: none; min-width: 44px; min-height: 44px; }
.sheet-action-btn, .cart-bar { background: var(--color-cta); color: var(--color-card); box-shadow: none; }
.wsp-btn, .wsp-btn:hover { background: var(--color-ok); color: var(--color-card); box-shadow: none; }
.sheet-action-btn:hover, .cart-bar:hover { background: var(--color-cta); color: var(--color-card); box-shadow: none; }
.cart-bar { border: 0; border-radius: 12px; min-height: 54px; bottom: max(10px,env(safe-area-inset-bottom)); }
.cart-count-badge { background: var(--color-card); color: var(--color-cta); }
.cart-action-text { color: var(--color-card); }
.bottom-sheet { border: 1px solid var(--color-line); border-bottom: 0; box-shadow: none; }
.sheet-close-btn, #orderChatForm button { min-width: 44px; min-height: 44px; }
.track-current-order, .order-attachment, .order-receipt-label { min-height: 44px; }
.order-receipt-label input {
  display: block;
  position: absolute; width: 1px; height: 1px; opacity: 0;
  overflow: hidden; clip-path: inset(50%);
}
.order-chat-bubble small { opacity: 1; color: var(--color-dark); }
.toast-notify.error { background: var(--color-closed-bg); color: var(--color-closed); }
.toast-notify.error i { color: var(--color-closed); }
.order-tracking, .payment-qr-box img { border-radius: 12px; }
@media (max-width: 1099px) {
  .menu-app-wrapper { grid-template-columns: minmax(0,1fr); }
  .menu-cart-column { display: none; }
  .store-branding { flex-direction: row; align-items: center; gap: 10px; }
  .store-header-container { padding: 11px var(--menu-page-gutter); }
  .delivery-toggle-option, .cart-count-badge, .store-address,
  .menu-facts span, .product-description, .featured-badge,
  .delivery-fee-note, .badge-status-pill, .hours-text, .empty-cart-desc,
  .cart-item-modifiers, .form-group label, .form-group input,
  .payment-method-title, .payment-option-copy strong, .payment-option-copy small,
  .summary-row, .sheet-description, .modifier-group-required,
  .modifier-option-name-col, .modifier-modifier-price, .footer-sub,
  .order-tracking-detail, .order-chat, .order-chat-bubble small,
  .order-attachment, .order-receipt-hint, .payment-qr-box p,
  .qty-value, .toast-notify { font-size: 14px; }
}
@media (max-width: 700px) {
  .store-contacts { display: flex; width: auto; gap: 4px; }
  .store-contacts .contact-item span { display: none; }
  .store-contacts .contact-item, .store-contacts .social-icon-btn { min-width: 44px; padding: 9px; justify-content: center; }
  .store-name { font-size: 18px; }
  .store-logo { width: 40px; height: 40px; }
  .delivery-status-card { padding: 9px 12px 0; }
  .delivery-details-row { flex-direction: row; align-items: center; }
  .menu-app-wrapper { padding: 4px 12px 95px; gap: 10px; }
  .category-section-container { padding: 6px 0; }
  .category-grid { padding: 2px 0; gap: 6px; }
  .category-tab { min-height: 44px; max-width: none; }
  .all-categories-btn { padding: 9px 11px; }
  .product-list { grid-template-columns: 1fr; gap: 7px; }
  .product-card { min-height: 92px; padding: 10px; }
  .product-details { min-height: 72px; }
  .product-img-wrapper { width: 64px; height: 64px; }
  .cart-bar { left: 10px; right: 10px; width: calc(100% - 20px); }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}