/* =========================================================================
   34 ISTANBUL — Menu page extras
   NEW badge, "option on request" tags, weekday note, tools row (order / PDF / print),
   3D model button + dialog, menu notes, and a clean print stylesheet.
   ========================================================================= */

/* ---------- Badges ---------- */
.badge-new {
  display: inline-flex; align-items: center; font-family: var(--sans); font-size: 0.6rem; font-weight: 600;
  letter-spacing: 0.16em; text-transform: uppercase; line-height: 1; padding: 0.28rem 0.5rem 0.24rem;
  border: 1px solid var(--copper); color: var(--copper-light); border-radius: 999px; white-space: nowrap;
  transform: translateY(-0.25rem);
}
.menu-cat__title .badge-new { vertical-align: middle; transform: translateY(-0.4em); margin-left: 0.4rem; }
.menu-key .badge-new { transform: none; }
.diet--opt { border-style: dashed; white-space: nowrap; }

/* ---------- Dish extras ---------- */
.dish__days { margin-top: 0.4rem; font-size: var(--fs-xs); letter-spacing: 0.16em; text-transform: uppercase; color: var(--copper-light); }
.dish__3d, .model-btn {
  display: inline-flex; align-items: center; gap: 0.45rem; margin-top: 0.7rem; min-height: 2.75rem; padding: 0 0.9rem;
  border: 1px solid var(--line-strong); font-size: 0.68rem; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--ivory); transition: background 0.3s, color 0.3s, border-color 0.3s;
}
.dish__3d .icon, .model-btn .icon { width: 1.05rem; height: 1.05rem; color: var(--copper-light); }
.dish__3d:hover, .dish__3d:focus-visible { background: var(--ivory); color: var(--forest); border-color: var(--ivory); }
.dish__3d:hover .icon, .dish__3d:focus-visible .icon { color: var(--copper-deep); }

/* ---------- Layout helpers (replace former inline styles) ---------- */
.menu-body { padding-top: 0; }
.menu-body__intro { padding-top: 4rem; max-width: 40rem; }
.menu-cta__inner { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 2rem; }
.menu-cta__actions { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.menu-unavailable { padding-top: 1.5rem; }
.menu-unavailable .notice { align-items: center; }
.menu-offers { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); gap: 1.5rem; padding-top: clamp(2.5rem, 5vw, 4rem); }

/* ---------- Tools row: order online, PDF, print ---------- */
.menu-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.5rem; margin-top: 2rem; }
.menu-tools__link {
  display: inline-flex; align-items: center; gap: 0.55rem; min-height: 2.75rem; padding: 0.4rem 0;
  font-size: 0.74rem; font-weight: 600; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ivory);
  background: linear-gradient(currentColor, currentColor) 0 calc(100% - 0.35rem) / 0 1px no-repeat;
  transition: background-size 0.6s var(--ease-out), color 0.3s;
}
.menu-tools__link small { font-size: 0.66rem; letter-spacing: 0.1em; color: var(--text-muted); text-transform: none; font-weight: 500; }
.menu-tools__link .icon { width: 1.1rem; height: 1.1rem; color: var(--copper-light); }
.menu-tools__link:hover, .menu-tools__link:focus-visible { background-size: 100% 1px; color: var(--copper-light); }

/* ---------- Notes & footnotes ---------- */
.menu-notes { margin-top: 1rem; display: grid; gap: 0.4rem; color: var(--text-muted); font-size: var(--fs-sm); }
.menu-notes li { position: relative; padding-left: 1.1rem; }
.menu-notes li::before { content: ""; position: absolute; left: 0; top: 0.7em; width: 0.45rem; height: 1px; background: var(--copper); }
.menu-footnotes { margin-top: 1rem; font-size: var(--fs-sm); }
.menu-footnotes p + p { margin-top: 0.6rem; }

/* ---------- Print-only header ---------- */
.menu-print-head { display: none; }

/* ---------- 3D model dialog ---------- */
.model-dialog { position: fixed; inset: 0; z-index: 995; display: grid; place-items: center; padding: max(1rem, env(safe-area-inset-top)) 1rem max(1rem, env(safe-area-inset-bottom)); }
.model-dialog__backdrop { position: absolute; inset: 0; background: rgba(5, 12, 10, 0.78); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; transition: opacity 0.35s var(--ease-out); }
.model-dialog__panel {
  position: relative; width: min(56rem, 100%); max-height: calc(100vh - 2rem); max-height: calc(100svh - 2rem);
  display: grid; grid-template-rows: auto minmax(0, 1fr) auto; background: var(--forest); border: 1px solid var(--line);
  box-shadow: 0 40px 80px -30px rgba(0, 0, 0, 0.7); opacity: 0; transform: translateY(1.25rem) scale(0.985);
  transition: opacity 0.4s var(--ease-out), transform 0.5s var(--ease-out);
}
.model-dialog.is-open .model-dialog__backdrop { opacity: 1; }
.model-dialog.is-open .model-dialog__panel { opacity: 1; transform: none; }
.model-dialog__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 0.9rem 0.9rem 0.9rem 1.4rem; border-bottom: 1px solid var(--line); }
.model-dialog__title { font-family: var(--serif); font-weight: 400; font-size: var(--fs-xl); line-height: 1.1; }
.model-dialog__close { width: 2.9rem; height: 2.9rem; display: grid; place-items: center; border: 1px solid var(--line-strong); flex: none; transition: background 0.3s, color 0.3s; }
.model-dialog__close:hover, .model-dialog__close:focus-visible { background: var(--ivory); color: var(--forest); }
.model-dialog__stage { position: relative; min-height: min(70vh, 34rem); background: radial-gradient(circle at 50% 40%, var(--forest-soft), var(--forest-deep) 75%); }
.model-dialog__stage model-viewer { width: 100%; height: 100%; min-height: min(70vh, 34rem); --poster-color: transparent; background: transparent; }
.model-dialog__stage .model-dialog__loading { position: absolute; inset: 0; display: grid; place-items: center; font-size: var(--fs-xs); letter-spacing: 0.2em; text-transform: uppercase; color: var(--text-muted); }
.model-dialog__hint { padding: 0.8rem 1.4rem 1rem; font-size: var(--fs-sm); color: var(--text-muted); border-top: 1px solid var(--line); }
body.model-open { overflow: hidden; }

@media (max-width: 760px) {
  .menu-tools { gap: 0.5rem 1.25rem; }
  .menu-tools .btn { flex: 1 1 100%; }
  .model-dialog { padding: 0; }
  .model-dialog__panel { width: 100%; height: 100%; max-height: none; border: 0; }
  .model-dialog__stage, .model-dialog__stage model-viewer { min-height: 0; height: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .model-dialog__backdrop, .model-dialog__panel { transition: none; transform: none; }
}

/* =========================================================================
   Print: clean, black on white, two columns, every allergen note expanded
   ========================================================================= */
@media print {
  @page { margin: 12mm; }
  html, body { background: #fff !important; color: #000 !important; }
  body { font-size: 10.5pt; line-height: 1.4; }
  .site-header, .announce, .site-footer, .book-bar, .curtain, .grain, .loader, .mobile-menu, .skip-link,
  .menu-nav, .menu-switch, .menu-tools, .menu-cta, .page-hero__bgword, .breadcrumb, .dish__media, .dish__3d, .model-btn,
  .toast, .model-dialog, .menu-offers, .menu-unavailable, .ornament, .dish__leader, [data-toast] { display: none !important; }

  /* Neutralise animation start states and inline GSAP styles. */
  [data-reveal], [data-split] .line__inner, .reveal-mask, .reveal-mask img, .dish, .dish__name, .dish__more-body {
    opacity: 1 !important; transform: none !important; visibility: visible !important; clip-path: none !important;
  }
  .dish__more-body { height: auto !important; overflow: visible !important; }

  .menu-print-head { display: block !important; border-bottom: 1pt solid #000; padding-bottom: 6pt; margin-bottom: 10pt; font-size: 9pt; }
  .menu-print-head__name { font-family: var(--serif); font-size: 18pt; line-height: 1.1; margin-bottom: 2pt; }

  .page-hero { padding: 0 !important; background: none !important; min-height: 0 !important; overflow: visible; }
  .page-hero__title { font-size: 22pt !important; max-width: none; color: #000 !important; }
  .page-hero__title em { color: #000 !important; }
  .page-hero__lede { margin-top: 4pt !important; font-size: 10pt; color: #333 !important; }
  .section, .section--dark { background: none !important; padding: 0 !important; color: #000 !important; }
  .container { max-width: none !important; padding: 0 !important; }
  .menu-body__intro { padding-top: 8pt; font-size: 11pt; color: #000; }

  .menu-cat { display: block !important; padding: 10pt 0 4pt !important; border-bottom: 0.5pt solid #999 !important; }
  .menu-cat__head { position: static !important; break-after: avoid; page-break-after: avoid; margin-bottom: 4pt; }
  .menu-cat__index { display: none !important; }
  .menu-cat__title { font-size: 15pt !important; color: #000 !important; }
  .menu-cat__desc { margin-top: 2pt; color: #333 !important; max-width: none; }
  .menu-cat__items { display: block !important; columns: 2; column-gap: 14mm; }
  .dish { break-inside: avoid; page-break-inside: avoid; padding: 4pt 0 !important; border-bottom: 0 !important; }
  .dish::before { display: none !important; }
  .dish__row { display: flex !important; gap: 6pt; }
  .dish__name { font-size: 11.5pt !important; color: #000 !important; }
  .dish__price { font-size: 11pt !important; color: #000 !important; margin-left: auto; }
  .dish__desc, .dish__days, .dish__flag, .dish__more-body { color: #333 !important; font-size: 9pt; }
  .dish__more { margin-top: 2pt; }
  .dish__more summary { color: #000 !important; font-size: 8pt; }
  .dish__more summary::after { content: none !important; }
  .diet, .badge-new { color: #000 !important; border-color: #000 !important; transform: none !important; }

  .menu-note { border: 0.5pt solid #000 !important; padding: 8pt !important; margin-top: 10pt !important; break-inside: avoid; color: #000; }
  .menu-note p, .menu-notes, .menu-key, .menu-footnotes { color: #000 !important; }
  a[href]::after { content: none !important; }
}