/* NJANSANG — styles propres à la page La Carte (onglets, plats, menus dégustation, légende). Chargé après styles.css et filtres.css. */
@layer pages {
  .section--carte { padding-block-start: 0; }
  /* Tiroir de filtres (mobile) */
  .sheet { position: fixed; inset: auto 0 0 0; margin: 0; width: 100%; max-width: 100%; max-height: 88svh; border-radius: var(--radius-l) var(--radius-l) 0 0; background: var(--color-creme); color: var(--color-encre); display: none; flex-direction: column; box-shadow: var(--shadow-l); }
  .sheet[open] { display: flex; }
  .sheet__head { display: flex; justify-content: space-between; align-items: center; padding: 1rem 1.25rem .5rem; border-block-end: 1px solid var(--color-ligne); }
  .sheet__title { font-size: 1.4rem; }
  .sheet__body { overflow-y: auto; padding: 1rem 1.25rem; }
  .sheet__body .filters__foot { display: none; }
  .sheet__foot { padding: .75rem 1.25rem calc(.75rem + env(safe-area-inset-bottom)); border-block-start: 1px solid var(--color-ligne); }
  @media (prefers-reduced-motion: no-preference) { .sheet[open] { animation: sheet-in var(--dur-3) var(--ease-out); } @keyframes sheet-in { from { transform: translateY(30px); opacity: .4; } } }
  /* Onglets */
  .tablist { position: relative; display: flex; gap: .25rem; overflow-x: auto; scroll-snap-type: x proximity; scrollbar-width: none; border-block-end: 1px solid var(--color-ligne); margin-block-end: var(--space-6); margin-inline: calc(-1 * var(--gutter)); padding-inline: var(--gutter); }
  .tablist::-webkit-scrollbar { display: none; }
  .tablist-wrap { position: relative; }
  .tablist-wrap.has-more::after { content: ""; position: absolute; inset-block: 0 1px; inset-inline-end: calc(-1 * var(--gutter)); inline-size: 3rem; background: linear-gradient(90deg, transparent, var(--color-creme)); pointer-events: none; }
  .tab { flex: none; scroll-snap-align: start; position: relative; display: inline-flex; align-items: center; gap: .35rem; min-height: 3rem; padding: .5rem 1rem; font-weight: 650; font-size: .975rem; color: var(--color-encre-2); white-space: nowrap; border-radius: var(--radius-s) var(--radius-s) 0 0; transition: color var(--dur-2), background-color var(--dur-2); }
  .tab:hover { color: var(--color-encre); background: var(--color-lin); }
  .tab[aria-selected="true"] { color: var(--color-encre); }
  .tab[aria-selected="true"]::after { content: ""; position: absolute; inset-inline: .75rem; inset-block-end: -1px; height: 3px; border-radius: 3px 3px 0 0; background: var(--color-terracotta); }
  .tab__count { font-weight: 500; color: var(--color-encre-2); font-variant-numeric: tabular-nums; }
  .tab__count--zero { color: var(--color-erreur); }
  @media (min-width: 48em) { .tablist { margin-inline: 0; padding-inline: 0; } .tablist-wrap.has-more::after { inset-inline-end: 0; } }
  /* Sections de carte */
  .menu-section { scroll-margin-top: calc(var(--header-h) + 1rem); }
  .menu-section + .menu-section { margin-block-start: var(--space-8); }
  .js .menu-sections.is-tabbed .menu-section + .menu-section { margin-block-start: 0; }
  .menu-section:focus-visible { outline-offset: 8px; }
  .menu-section__title { font-size: var(--fs-h2); margin-block-end: var(--space-5); display: flex; align-items: center; gap: 1rem; }
  .menu-section__title::after { content: ""; flex: 1; height: 12px; background: var(--ndop-encre) repeat-x left center; }
  .menu-section__intro { color: var(--color-encre-2); max-width: 44rem; margin-block-end: var(--space-5); }
  .dishes { display: grid; }
  @media (min-width: 64em) {
    .dishes { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 3.5rem; background: linear-gradient(var(--color-ligne), var(--color-ligne)) 50% 0 / 1px 100% no-repeat; }
  }
  .dish { container-type: inline-size; padding-block: 1.25rem; border-block-end: 1px dashed rgb(39 22 16 / .18); scroll-margin-top: calc(var(--header-h) + 5rem); }
  .dish--photo { display: grid; grid-template-columns: 5.25rem minmax(0, 1fr); gap: 1rem; align-items: start; }
  .dish__thumb { aspect-ratio: 4 / 5; border-radius: 999px 999px .4rem .4rem; overflow: hidden; background: var(--color-nuit-2); }
  .dish__thumb img { width: 100%; height: 100%; object-fit: cover; }
  .dish__main { display: grid; gap: .35rem; min-width: 0; }
  .dish__head { display: flex; align-items: baseline; gap: .5rem; }
  .dish__name { font-size: clamp(1.15rem, 1.05rem + .45vw, 1.4rem); font-weight: 500; line-height: 1.2; }
  .dish__leader { flex: 1; min-width: 1rem; border-block-end: 1.5px dotted rgb(39 22 16 / .45); transform: translateY(-.3em); }
  .dish__head .price { font-size: 1.05rem; }
  .dish__prices { display: grid; justify-items: end; text-align: end; gap: .1rem; }
  .dish__prices .price + .dish__unit { margin-block-end: .2rem; }
  .dish__unit { font-size: .75rem; color: var(--color-encre-2); font-weight: 500; }
  .dish__incl { font-size: .8125rem; font-weight: 600; color: var(--color-foret); white-space: nowrap; }
  .dish__detail { color: var(--color-encre-2); font-size: .97rem; }
  .dish__actions { display: flex; flex-wrap: wrap; align-items: flex-start; gap: .25rem 1rem; margin-block-start: .2rem; }
  .dish__pairing summary { display: inline-flex; align-items: center; gap: .35rem; list-style: none; min-height: 2.75rem; font-weight: 650; font-size: .9rem; color: var(--color-terracotta-texte); }
  .dish__pairing summary::-webkit-details-marker { display: none; }
  .dish__pairing summary::after { content: "+"; font-weight: 500; margin-inline-start: .15rem; }
  .dish__pairing[open] summary::after { content: "–"; }
  .dish__pairing p { font-size: .9rem; display: grid; gap: .2rem; padding: .6rem .8rem; border-radius: var(--radius-s); background: var(--color-lin); margin-block-end: .4rem; }
  .dish__add { display: inline-flex; align-items: center; gap: .35rem; min-height: 2.75rem; padding-inline: .9rem; border-radius: var(--radius-pill); border: 1.5px solid var(--color-foret); color: var(--color-foret); font-weight: 650; font-size: .875rem; text-decoration: none; transition: background-color var(--dur-2), color var(--dur-2); }
  .dish__add:hover { background: var(--color-foret); color: var(--color-creme); }
  .dish__add.is-added { background: var(--color-foret); color: var(--color-creme); }
  .tastings { display: grid; gap: var(--space-5); }
  @media (min-width: 48em) { .tastings { grid-template-columns: repeat(2, minmax(0, 1fr)); } .tasting--feature { grid-column: 1 / -1; } }
  .tasting { position: relative; display: grid; gap: .9rem; align-content: start; justify-items: start; padding: clamp(1.4rem, 1.1rem + 1.4vw, 2.25rem); background: var(--color-ivoire); border: 1px solid var(--color-encre); border-radius: var(--radius-m); box-shadow: inset 0 0 0 4px var(--color-ivoire), inset 0 0 0 5px var(--color-ocre); }
  .tasting--feature { background: var(--color-nuit); color: var(--color-creme); border-color: var(--color-nuit); box-shadow: inset 0 0 0 4px var(--color-nuit), inset 0 0 0 5px rgb(225 160 53 / .7); }
  .tasting__head { display: grid; gap: .3rem; width: 100%; }
  .tasting__when { font-size: var(--fs-label); text-transform: uppercase; letter-spacing: .1em; font-weight: 650; color: var(--color-ocre-texte); }
  .tasting--feature .tasting__when { color: var(--color-ocre); }
  .tasting__name { font-size: clamp(1.75rem, 1.4rem + 1.4vw, 2.5rem); font-weight: 400; display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .75rem; }
  .tasting__count { font-family: var(--font-body); font-size: .9rem; font-weight: 650; color: var(--color-foret); letter-spacing: .02em; }
  .tasting--feature .tasting__count { color: var(--color-foret-clair); }
  .tasting__price { display: flex; flex-wrap: wrap; align-items: baseline; gap: .2rem .5rem; }
  .tasting__price .price { font-size: 1.4rem; }
  .tasting--feature .tasting__price .price { color: var(--color-ocre); }
  .tasting--feature :is(.price__eur, .dish__unit, .tasting__phrase, .tasting__acc) { color: var(--color-creme-attenue); }
  .tasting__phrase { color: var(--color-encre-2); }
  .tasting--feature .muted { color: var(--color-creme-attenue); }
  .tasting__steps { display: grid; gap: .35rem; padding-inline-start: 1.4rem; font-size: .97rem; }
  .tasting--feature .tasting__steps { counter-reset: s; list-style: none; padding: 0; gap: 0; width: 100%; }
  @media (min-width: 64em) { .tasting--feature .tasting__steps { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 2.5rem; } }
  .tasting--feature .tasting__steps li { counter-increment: s; display: grid; grid-template-columns: 2rem 1fr; padding-block: .55rem; border-block-end: 1px solid var(--color-ligne-nuit); }
  .tasting--feature .tasting__steps li::before { content: counter(s); font-family: var(--font-display); font-style: italic; color: var(--color-ocre); }
  .tasting__steps li::marker { color: var(--color-terracotta); font-weight: 650; }
  .tasting__acc { display: flex; gap: .4rem; align-items: flex-start; font-size: .9rem; color: var(--color-encre-2); }
  .tasting__acc .icon { margin-block-start: .2rem; }
  .tasting__note { width: 100%; font-size: .9rem; padding: .75rem .9rem; border-radius: var(--radius-s); background: #FBEBDC; border-inline-start: 3px solid var(--color-terracotta); color: var(--color-encre); }
  .tasting__note strong { color: var(--color-foret); }
  .tasting--feature .tasting__note { background: var(--color-nuit-2); color: var(--color-creme); }
  .tasting--feature .tasting__note strong { color: var(--color-foret-clair); }
  .brunch-box { display: grid; gap: .75rem; padding: 1.25rem 1.5rem; border-radius: var(--radius-m); background: var(--color-foret); color: var(--color-creme); margin-block-end: var(--space-4); }
  .brunch-box__title { font-family: var(--font-display); font-size: 1.35rem; }
  .brunch-box__prices { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: .5rem 2rem; }
  .brunch-box__prices li { display: grid; }
  .brunch-box__prices li span:first-child { font-size: .8125rem; color: var(--color-foret-clair); }
  .brunch-box__prices .price { font-size: 1.25rem; color: var(--color-creme); }
  .brunch-box .price__eur { color: var(--color-foret-clair); }
  .brunch-box__text { color: var(--color-lin); font-size: .95rem; }
  .drinks-group + .drinks-group { margin-block-start: var(--space-6); }
  .drinks-group__title { font-size: 1.35rem; padding-block-end: .5rem; border-block-end: 1px solid var(--color-encre); margin-block-end: .25rem; }
  .health { display: flex; gap: .5rem; align-items: flex-start; font-size: .875rem; color: var(--color-encre-2); margin-block-start: var(--space-5); padding: .9rem 1rem; border: 1px solid var(--color-sable); border-radius: var(--radius-s); }
  .health .icon { margin-block-start: .15rem; }
  .legende__grid { display: grid; gap: var(--space-6); }
  .legende__list { list-style: none; padding: 0; display: grid; gap: .5rem; margin-block: .75rem; }
  .legende__list li { display: flex; align-items: center; gap: .6rem; }
  .legende__list .icon { color: var(--color-foret); }
  .legende__note { font-size: .875rem; color: var(--color-encre-2); max-width: 30rem; }
  .mentions-carte { display: grid; gap: .5rem; margin-block-start: var(--space-6); padding-block-start: var(--space-5); border-block-start: 1px solid var(--color-ligne); font-size: .9rem; color: var(--color-encre-2); }
  .mentions-carte p { display: flex; gap: .5rem; align-items: flex-start; }
  .mentions-carte .icon { margin-block-start: .2rem; }
  @media (min-width: 48em) { .legende__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
}
