/* Public-menu browser parity.
   Responsive menu layout must follow the rendered menu width, not the outer
   browser viewport. This keeps Studio phone previews and real iOS/Android
   browsers on the same layout contract. */

.bme-menu,
.bme-heritage-exact {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* Heritage Classic previously used @media(max-width:520px). On a desktop
   Studio preview the browser is wide even when the menu canvas is ~390px,
   while on iPhone Safari the browser itself is <520px. That made the same
   design render differently. Make the Heritage renderer responsive to its
   own width instead. */
.bme-heritage-exact {
  container-type: inline-size;
  container-name: beyond-heritage-menu;
}

@container beyond-heritage-menu (max-width: 520px) {
  .bme-heritage-exact .ep-header { padding:22px 16px 12px; }
  .bme-heritage-exact .ep-brand { gap:10px; }
  .bme-heritage-exact .ep-logo { width:44px;height:44px;flex-basis:44px; }
  .bme-heritage-exact .ep-brand-title { font-size:25px; }
  .bme-heritage-exact .ep-lang-pill button { padding:0 10px;font-size:10px; }
  .bme-heritage-exact .ep-hero { margin:6px 14px 16px; }
  .bme-heritage-exact .ep-tabs { padding:0 14px; }
  .bme-heritage-exact .ep-section-head { padding-inline:18px; }
  .bme-heritage-exact .ep-menu-list { padding-inline:14px; }
}

/* iOS Safari can otherwise create horizontal layout drift from intrinsic flex
   and grid children. Keep the public renderer constrained to its container. */
.bme-menu,
.bme-heritage-exact,
.bme-heritage-exact .ep-app {
  max-width:100%;
  min-width:0;
}

.bme-heritage-exact .ep-header,
.bme-heritage-exact .ep-brand,
.bme-heritage-exact .ep-brand-copy,
.bme-heritage-exact .ep-section-head,
.bme-heritage-exact .ep-menu-list,
.bme-heritage-exact .ep-item-row,
.bme-heritage-exact .ep-item-info {
  min-width:0;
}

/* RTL hero headlines such as "משקאות ואוכל" must stay together on one row.
   The previous 78% max-width was appropriate for the English composition but
   forced short Hebrew/Arabic headlines to wrap unnecessarily. Give RTL titles
   the full hero copy width and keep short headlines on one line. */
.bme-heritage-exact .ep-app[dir="rtl"] .ep-hero-title {
  max-width:100%;
  white-space:nowrap;
}

/* Accessibility text scaling must include the price-type role (for example
   Shot / Glass), not only the numeric price. These values follow the same
   115% / 130% / 145% / 160% progression used by the restaurant A+/A− system.
   Keep the selectors stronger than optional Design Studio typography roles so
   an accessibility request always wins while it is active. */
body.restaurant-a11y-text-1 .bme-menu .bme-price-option small { font-size:10.35px !important; }
body.restaurant-a11y-text-2 .bme-menu .bme-price-option small { font-size:11.7px !important; }
body.restaurant-a11y-text-3 .bme-menu .bme-price-option small { font-size:13.05px !important; }
body.restaurant-a11y-text-4 .bme-menu .bme-price-option small { font-size:14.4px !important; }

body.restaurant-a11y-text-1 .bme-heritage-exact .ep-price-option small,
body.restaurant-a11y-text-1 .bme-heritage-exact .ep-dual-price small,
body.restaurant-a11y-text-1 .bme-heritage-exact .ep-wine-prices small { font-size:9.2px !important; }
body.restaurant-a11y-text-2 .bme-heritage-exact .ep-price-option small,
body.restaurant-a11y-text-2 .bme-heritage-exact .ep-dual-price small,
body.restaurant-a11y-text-2 .bme-heritage-exact .ep-wine-prices small { font-size:10.4px !important; }
body.restaurant-a11y-text-3 .bme-heritage-exact .ep-price-option small,
body.restaurant-a11y-text-3 .bme-heritage-exact .ep-dual-price small,
body.restaurant-a11y-text-3 .bme-heritage-exact .ep-wine-prices small { font-size:11.6px !important; }
body.restaurant-a11y-text-4 .bme-heritage-exact .ep-price-option small,
body.restaurant-a11y-text-4 .bme-heritage-exact .ep-dual-price small,
body.restaurant-a11y-text-4 .bme-heritage-exact .ep-wine-prices small { font-size:12.8px !important; }

/* ==========================================================
   HERITAGE FIXED UPPER SHELL

   The restaurant header, hero and category pills are the permanent top shell.
   Menu browsing must happen below that shell, so those three regions never
   move when the customer scrolls through items. This applies identically in
   Content, Design, Preview and the published Heritage menu.
   ========================================================== */
.bme-heritage-exact .ep-app {
  overflow:hidden !important;
}

.bme-heritage-exact .ep-header,
.bme-heritage-exact .ep-hero,
.bme-heritage-exact .ep-tabs-wrap {
  position:relative;
  z-index:30;
  flex:0 0 auto;
}

.bme-heritage-exact .ep-tabs-wrap {
  z-index:40;
  box-shadow:0 6px 16px rgba(30,24,16,.035);
}

/* Item scrolling is isolated to the menu content region. */
.bme-heritage-exact .ep-menu-list {
  min-height:0 !important;
  overflow-y:auto !important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
}