/* ==========================================================================
   La Famiglia Public Menu Styles
   Version: 2026-01-22 (Cleaned / De-bloated)
   Notes:
   - Keeps current live behavior: segmented pill tabs, active tab rust fill,
     inactive tab rust text, larger pill size, PDF link on right, RW note styling.
   - Removes obsolete arrow indicator rules and redundant overrides.
   ========================================================================== */

/* THEME VARIABLES & BASE WRAPPER ----------------------------------------- */
.public-menu-page {
  --pm-accent:        #6f2a27;
  --pm-accent-hover:  #8a3b37;
  --pm-text:          #2a2927;
  --pm-muted:         #4b5563; /* gray-600 */
  --pm-border:        #d5cec7;
  --pm-bg:            #efe8dd;
  --pm-note:          #6c6864;
  --pm-link:          #0d47b8;
  --pm-link-hover:    #073b99;
  --pm-heading:       #2a2927;

  background: var(--pm-bg);
  color: var(--pm-text);
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
               Roboto, "Helvetica Neue", Arial, sans-serif;
  padding-bottom: 4rem;
}

@media (prefers-color-scheme: dark) {
  .public-menu-page {
    /* Force same light palette in dark user preference */
    background: var(--pm-bg);
    color: var(--pm-text);
  }
}

/* PAGE SHELL -------------------------------------------------------------- */
.menu-shell {
  max-width: 1180px;
  margin: 0 auto;
  padding: 3rem 1.25rem 0 1.25rem;
  box-sizing: border-box;
}

/* -------------------------------------------------------------------------
   MENU TABS (Segemented pill style – CURRENT)
   - Targets the first two <a> children in .menu-tabs (the two menus)
   - Leaves the last <a> (PDF Menu) as a regular link aligned right
   ------------------------------------------------------------------------- */

.menu-tabs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .6rem;
  margin: 0 0 1.75rem;
  padding: 0;
}

/* Base anchor styling (all tabs/links) */
.menu-tab {
  position: relative;
  display: inline-block;
  font-weight: 600;
  text-decoration: none;
  font-family: inherit;
  line-height: 1.15;
  transition: color .18s ease, background-color .18s ease, border-color .18s ease;
  padding: 0;
}

/* Keep existing “active” semantic class, but do NOT force a color here.
   (Pill styles below control active/inactive appearance.) */
.menu-tab.is-active {}

/* PDF link */
.menu-tabs > a:last-of-type,
.menu-tab--pdf,
.menu-download-link {
  margin-left: auto;
  font-size: 1.25rem;
  line-height: 1.2;
  font-weight: 600;
  letter-spacing: 0;
  color: var(--pm-link);
  text-transform: none;
  white-space: nowrap;
  text-decoration: none;
}

.menu-tabs > a:last-of-type:hover,
.menu-tab--pdf:hover,
.menu-download-link:hover,
.menu-tabs > a:last-of-type:focus,
.menu-tab--pdf:focus,
.menu-download-link:focus {
  text-decoration: underline;
  color: var(--pm-link-hover);
}

/* Segmented pill styling: first two menu links only */
.public-menu-page .menu-tabs > a:nth-of-type(1),
.public-menu-page .menu-tabs > a:nth-of-type(2) {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  border-radius: 999px;

  /* ~25% larger sizing (current live) */
  font-size: 1.44rem;
  line-height: 1.1;
  padding: .53rem 1.31rem;

  letter-spacing: 0;

  background: transparent;
  color: var(--pm-accent);
  border: 1px solid color-mix(in srgb, var(--pm-accent) 35%, transparent);

  margin-right: 0; /* cancels legacy spacing */
}

/* Remove legacy separator line behavior if any older rules apply */
.public-menu-page .menu-tabs > a:nth-of-type(2)::before,
.public-menu-page .menu-tab--primary + .menu-tab--primary::before {
  content: none !important;
  display: none !important;
}

/* Active pill uses site accent (rust) */
.public-menu-page .menu-tabs > a:nth-of-type(1).is-active,
.public-menu-page .menu-tabs > a:nth-of-type(2).is-active {
  background: var(--pm-accent);
  border-color: var(--pm-accent);
  color: #fff;
}

/* Hover/focus for inactive pills */
.public-menu-page .menu-tabs > a:nth-of-type(1):not(.is-active):hover,
.public-menu-page .menu-tabs > a:nth-of-type(2):not(.is-active):hover,
.public-menu-page .menu-tabs > a:nth-of-type(1):not(.is-active):focus,
.public-menu-page .menu-tabs > a:nth-of-type(2):not(.is-active):focus {
  border-color: color-mix(in srgb, var(--pm-accent) 55%, transparent);
  outline: none;
}

/* Mobile: keep pill sizing readable */
@media (max-width: 520px) {
  .public-menu-page .menu-tabs {
    gap: .5rem;
  }
  .public-menu-page .menu-tabs > a:nth-of-type(1),
  .public-menu-page .menu-tabs > a:nth-of-type(2) {
    font-size: 1.31rem;
    padding: .50rem 1.13rem;
  }
}

/* MOBILE: hide PDF link while preserving :last-of-type targeting */
@media (max-width: 640px) {
  .public-menu-page .menu-tabs > a:last-of-type,
  .public-menu-page .menu-tab--pdf,
  .public-menu-page .menu-download-link {
    visibility: hidden !important;
    pointer-events: none !important;
  }
}

/* === TAB SWAP ANIMATION HELPER ===========================================
   Used by the JS in show.blade.php to animate the swap on page load.
============================================================================ */
.public-menu-page .pm-tab-animating {
  transition: transform 240ms ease;
  will-change: transform;
}

/* -------------------------------------------------------------------------
   SECTION WRAPPERS
   ------------------------------------------------------------------------- */
.menu-section {
  margin: 0;
  padding: 0;
}
.menu-section.first {
  border-top: none;
  padding-top: 0;
}

/* SECTION HEADING (text-xl / bold / border) ------------------------------- */
.menu-section-title {
  margin: 0 0 1rem 0;
  padding-bottom: .25rem;
  font-size: 1.25rem;
  line-height: 1.75rem;
  font-weight: 700;
  letter-spacing: normal;
  color: var(--pm-heading);
  border-bottom: 1px solid var(--pm-border);
  text-transform: none;
}

/* GRID / COLUMNS --------------------------------------------------------- */
.menu-two-col {
  display: flex;
  align-items: flex-start;
  gap: 2.5rem; /* Tailwind gap-x-10 approximation */
}
.menu-col { flex: 1 1 0; min-width: 0; }

@media (max-width: 980px) {
  .menu-two-col {
    flex-direction: column;
    gap: 2rem;
  }
}

/* MENU ITEMS ------------------------------------------------------------- */
.menu-item {
  margin-bottom: 1rem;
}
.menu-item:last-child { margin-bottom: 0; }

.menu-item-head {
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;           /* gap-6 */
  font-size: 1.125rem;   /* text-lg */
  line-height: 1.75rem;
  font-weight: 700;
}

.menu-item-title {
  flex: 1 1 auto;
  min-width: 0;
  font-weight: 700;
  color: var(--pm-text);
}

.menu-item-price {
  flex: 0 0 auto;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 600;
  color: var(--pm-text);
  white-space: nowrap;
  text-align: right;
  min-width: 42px;
}

.menu-item-desc {
  font-size: 0.875rem;
  line-height: 1.25rem;
  margin-top: .25rem;
  max-width: 46ch;
  color: var(--pm-muted);
  font-weight: 400;
}

@media (max-width: 640px) {
  .menu-item-head {
    font-size: 1.05rem;
    line-height: 1.5rem;
  }
  .menu-item-desc {
    font-size: 0.82rem;
    line-height: 1.2rem;
  }
}

/* FOOTNOTE / NOTES ------------------------------------------------------- */
.menu-section-note {
  margin-top: 1.25rem;
  font-size: 0.75rem;
  line-height: 1.1rem;
  color: var(--pm-note);
  max-width: 80ch;
}

.menu-empty-note {
  opacity: .7;
  font-size: 0.9rem;
  margin-top: 1rem;
}

/* SECTION SPACING REINFORCEMENT ------------------------------------------ */
.menu-section + .menu-section {
  margin-top: 3rem !important;
}
.menu-section-title {
  margin-bottom: 1.25rem;
}

/* RESTAURANT WEEK NOTE (CURRENT) ------------------------------------------ */
.public-menu-page .rw-note {
  margin: 22px 0 36px 0;  /* bottom space doubled-ish */
  font-size: 18.5px;      /* ~33% larger than 14px */
  line-height: 1.35;
  font-weight: 600;       /* medium */
  color: var(--pm-text);
}
.public-menu-page .rw-note-sep {
  padding: 0 .4rem;
  opacity: .7;
}

/* NAV / HEADER NORMALIZATION — scoped to menu content only */
.public-menu-page #main-nav {
  display: flex;
  column-gap: 2.5rem;
  row-gap: 0;
  margin: 0 auto;
  max-width: 1374px;
  width: 100%;
}
.public-menu-page #main-nav a {
  letter-spacing: 0;
  margin: 0;
  padding: 0;
  font-feature-settings: "kern","liga","clig","calt";
  text-rendering: optimizeLegibility;
}

/* SITE WIDTH VARIABLES (retain if other pages rely on them) -------------- */
:root {
  --site-max: 1374px;
  --site-pad-inline: clamp(1rem, 3vw, 2.5rem);
}
.lf-site-container {
  max-width: var(--site-max);
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--site-pad-inline);
  padding-right: var(--site-pad-inline);
  box-sizing: border-box;
}
.flex-header-nav,
header .flex-header-nav,
main:not(.full-bleed),
#app > main:not(.full-bleed),
footer .lf-site-container,
footer .lf-footer-inner {
  max-width: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
.full-bleed {
  max-width: none !important;
  width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}