/* =========================================================
   LE SÉSAME — Boutique : carte, fiche produit, panier, commande
   (copie de shop.css pilotée par ls-tokens.css)
   ========================================================= */

/* ---------------- Bandeau de page ---------------- */
.pagehead {
  position: relative; overflow: hidden;
  padding-block: var(--s-8) var(--s-7);
  background: var(--bg-alt);
  border-bottom: 1px solid var(--line);
}
.pagehead h1 { font-size: var(--t-3xl); letter-spacing: -.01em; margin-top: var(--s-3); }
.pagehead p { color: var(--text-mute); max-width: 56ch; margin-top: var(--s-3); font-size: var(--t-lg); }
.crumbs { display: flex; gap: .5rem; font-size: var(--t-xs); color: var(--text-mute); flex-wrap: wrap; }
.crumbs a:hover { color: var(--c-red); }
.crumbs li + li::before { content: "/"; margin-right: .5rem; opacity: .5; }
.crumbs ol { display: flex; gap: .5rem; flex-wrap: wrap; padding: 0; list-style: none; }

/* ---------------- Barre de recherche ---------------- */
.searchbar { position: relative; }
.searchbar input {
  width: 100%;
  padding: 1rem 3rem 1rem 3rem;
  font-size: var(--t-base);
  background: var(--bg);
  border: 1.5px solid var(--line-strong);
  border-radius: var(--r-full);
  transition: border-color var(--d-fast), box-shadow var(--d-fast);
}
.searchbar input:focus {
  outline: none; border-color: var(--c-red);
  box-shadow: 0 0 0 4px rgba(200,150,46,.14);
}
.searchbar__icon {
  position: absolute; left: 1.1rem; top: 50%; transform: translateY(-50%);
  width: 19px; height: 19px; color: var(--text-mute); pointer-events: none;
}
.searchbar__clear {
  position: absolute; right: .9rem; top: 50%; transform: translateY(-50%);
  width: 30px; height: 30px; display: none; place-items: center;
  border-radius: var(--r-full); color: var(--text-mute);
}
.searchbar__clear.is-on { display: grid; }
.searchbar__clear:hover { background: var(--bg-alt); color: var(--text); }

.suggest {
  position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + .5rem);
  background: var(--bg); border: 1px solid var(--line);
  border-radius: var(--r-md); box-shadow: var(--sh-3);
  overflow: hidden; display: none;
}
.suggest.is-on { display: block; }
.suggest button {
  width: 100%; text-align: left;
  display: flex; align-items: center; gap: var(--s-3);
  padding: .7rem 1rem; font-size: var(--t-sm);
  border-bottom: 1px solid var(--line);
}
.suggest button:last-child { border-bottom: 0; }
.suggest button:hover, .suggest button[aria-selected="true"] { background: var(--bg-alt); }
.suggest mark { background: rgba(200,150,46,.42); color: inherit; border-radius: 3px; }
.suggest small { margin-left: auto; color: var(--text-mute); }

/* ---------------- Filtres ---------------- */
.shop {
  display: grid; grid-template-columns: 272px 1fr;
  gap: var(--s-7); align-items: start;
}
@media (max-width: 940px) { .shop { grid-template-columns: 1fr; } }

.filters {
  position: sticky; top: calc(var(--header-h) + var(--s-4));
  display: grid; gap: var(--s-6);
  padding: var(--s-5);
  border: 1px solid var(--line); border-radius: var(--r-lg);
  background: var(--bg);
}
@media (max-width: 940px) {
  .filters { position: static; }
  .filters[hidden] { display: none; }
}
.filters h3 {
  font-size: var(--t-xs); letter-spacing: .18em; text-transform: uppercase;
  color: var(--text-mute); margin-bottom: var(--s-3);
}
.check { display: flex; align-items: center; gap: .65rem; padding: .3rem 0; font-size: var(--t-sm); cursor: pointer; }
.check input { width: 18px; height: 18px; accent-color: var(--c-or); flex: none; }
.check span:last-child { margin-left: auto; color: var(--text-mute); font-size: var(--t-xs); }

.range { width: 100%; accent-color: var(--c-or); }
.range-val { display: flex; justify-content: space-between; font-size: var(--t-xs); color: var(--text-mute); margin-top: .4rem; }

.chips { display: flex; flex-wrap: wrap; gap: .5rem; }
.chip {
  padding: .45rem .9rem; font-size: var(--t-xs); font-weight: 700;
  border: 1.5px solid var(--line-strong); border-radius: var(--r-full);
  transition: all var(--d-fast) var(--e-out);
}
.chip:hover { border-color: var(--c-red); }
.chip[aria-pressed="true"] { background: var(--grad-heat); border-color: transparent; color: var(--accent-ink); }

.toolbar {
  display: flex; flex-wrap: wrap; gap: var(--s-3);
  align-items: center; justify-content: space-between;
  margin-bottom: var(--s-5);
}
.toolbar__count { font-size: var(--t-sm); color: var(--text-mute); }
.toolbar select {
  padding: .6rem 1rem; border: 1.5px solid var(--line-strong);
  border-radius: var(--r-full); background: var(--bg); font-size: var(--t-sm);
}
.filters-toggle { display: none; }
@media (max-width: 940px) { .filters-toggle { display: inline-flex; } }

/* ---------------- Grille produits ---------------- */
.dishes { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--s-5); }
@media (max-width: 1180px) { .dishes { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px)  { .dishes { grid-template-columns: 1fr; } }
.dish.is-out { opacity: .58; }
.dish.is-out .dish__media::after {
  content: "Épuisé aujourd'hui";
  position: absolute; inset: auto 0 0 0; padding: .5rem;
  background: rgba(17,17,17,.86); color: #fff;
  font-size: var(--t-xs); font-weight: 700; text-align: center;
  letter-spacing: .08em; text-transform: uppercase;
}

.empty {
  grid-column: 1 / -1; text-align: center;
  padding: var(--s-9) var(--s-5);
  border: 2px dashed var(--line-strong); border-radius: var(--r-lg);
}
.empty h3 { font-size: var(--t-xl); margin-bottom: var(--s-3); }
.empty p { color: var(--text-mute); margin-bottom: var(--s-5); }

/* Catégorie : titre d'ancrage */
.catblock + .catblock { margin-top: var(--s-8); }
.catblock__head {
  display: flex; align-items: baseline; gap: var(--s-4);
  margin-bottom: var(--s-5); padding-bottom: var(--s-3);
  border-bottom: 2px solid var(--line);
}
.catblock__head h2 { font-size: var(--t-xl); letter-spacing: -.01em; }
.catblock__head span { font-size: var(--t-sm); color: var(--text-mute); }

/* ---------------- Fiche produit ---------------- */
.product { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-8); align-items: start; }
@media (max-width: 940px) { .product { grid-template-columns: 1fr; gap: var(--s-6); } }

.product__media {
  position: sticky; top: calc(var(--header-h) + var(--s-4));
  border-radius: var(--r-xl); overflow: hidden;
  aspect-ratio: 1; background: var(--grad-gold);
}
@media (max-width: 940px) { .product__media { position: static; aspect-ratio: 4/3; } }

.product__title { font-size: var(--t-2xl); margin-block: var(--s-3); }
.product__price {
  font-family: var(--font-display); font-size: var(--t-2xl);
  letter-spacing: -.03em; display: flex; align-items: baseline; gap: var(--s-3);
}
.product__price s { font-size: var(--t-lg); color: var(--text-mute); font-weight: 500; }

.optgroup { margin-top: var(--s-6); }
.optgroup > h3 {
  font-size: var(--t-xs); letter-spacing: .18em; text-transform: uppercase;
  color: var(--text-mute); margin-bottom: var(--s-3);
}
.optrow { display: flex; flex-wrap: wrap; gap: .6rem; }
.opt {
  padding: .6rem 1.05rem; font-size: var(--t-sm); font-weight: 650;
  border: 1.5px solid var(--line-strong); border-radius: var(--r-full);
  transition: all var(--d-fast) var(--e-out);
}
.opt:hover { border-color: var(--c-red); }
.opt[aria-pressed="true"] { background: var(--c-ink); color: var(--accent-ink); border-color: transparent; }
.opt small { opacity: .7; margin-left: .35rem; }

.qty { display: inline-flex; align-items: center; border: 1.5px solid var(--line-strong); border-radius: var(--r-full); }
.qty button { width: 42px; height: 42px; display: grid; place-items: center; font-size: 1.2rem; font-weight: 700; }
.qty button:hover { color: var(--c-red); }
.qty output { min-width: 34px; text-align: center; font-family: var(--font-display); font-weight: 700; }

.addbar { display: flex; gap: var(--s-3); align-items: center; margin-top: var(--s-6); flex-wrap: wrap; }

.accordion { border-top: 1px solid var(--line); margin-top: var(--s-7); }
.accordion details { border-bottom: 1px solid var(--line); }
.accordion summary {
  padding: var(--s-4) 0; cursor: pointer; list-style: none;
  display: flex; align-items: center; justify-content: space-between;
  font-family: var(--font-display); font-weight: 700; font-size: var(--t-base);
}
.accordion summary::-webkit-details-marker { display: none; }
.accordion summary::after { content: "+"; font-size: 1.3rem; color: var(--c-red); transition: transform var(--d-fast); }
.accordion details[open] summary::after { transform: rotate(45deg); }
.accordion .acc__body { padding-bottom: var(--s-5); font-size: var(--t-sm); color: var(--text-mute); }

.nutri { display: grid; grid-template-columns: repeat(auto-fit, minmax(92px, 1fr)); gap: var(--s-3); }
.nutri div { padding: var(--s-3); background: var(--bg-alt); border-radius: var(--r-md); text-align: center; }
.nutri b { display: block; font-family: var(--font-display); font-size: var(--t-lg); color: var(--text); }
.nutri span { font-size: var(--t-xs); }

/* ---------------- Panier ---------------- */
.cartgrid { display: grid; grid-template-columns: 1fr 380px; gap: var(--s-7); align-items: start; }
@media (max-width: 940px) { .cartgrid { grid-template-columns: 1fr; } }

.line {
  display: grid; grid-template-columns: 92px 1fr auto; gap: var(--s-4);
  padding: var(--s-4) 0; border-bottom: 1px solid var(--line);
  align-items: center;
}
.line__thumb { width: 92px; aspect-ratio: 1; border-radius: var(--r-md); overflow: hidden; background: var(--grad-gold); }
.line__name { font-family: var(--font-display); font-weight: 700; font-size: var(--t-base); }
.line__opts { font-size: var(--t-xs); color: var(--text-mute); margin-top: .25rem; }
.line__remove { font-size: var(--t-xs); color: var(--text-mute); text-decoration: underline; margin-top: .4rem; }
.line__remove:hover { color: var(--danger); }
.line__right { display: grid; justify-items: end; gap: var(--s-3); }
.line__price { font-family: var(--font-display); font-weight: 700; }
@media (max-width: 560px) {
  .line { grid-template-columns: 68px 1fr; }
  .line__thumb { width: 68px; }
  .line__right { grid-column: 1 / -1; justify-items: stretch; grid-template-columns: auto 1fr; align-items: center; }
  .line__price { justify-self: end; }
}

.summary { padding: var(--s-6); display: grid; gap: var(--s-4); position: sticky; top: calc(var(--header-h) + var(--s-4)); }
@media (max-width: 940px) { .summary { position: static; } }
.summary h2 { font-size: var(--t-xl); }
.sumrow { display: flex; justify-content: space-between; gap: var(--s-4); font-size: var(--t-sm); }
.sumrow--total {
  padding-top: var(--s-4); border-top: 2px solid var(--line);
  font-family: var(--font-display); font-size: var(--t-xl); font-weight: 700;
}
.sumrow--save { color: var(--ok); font-weight: 700; }
.coupon { display: flex; gap: .5rem; }
.coupon input { flex: 1; padding: .7rem .9rem; border: 1.5px solid var(--line-strong); border-radius: var(--r-md); text-transform: uppercase; }

.modes { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.mode {
  padding: var(--s-4); text-align: left;
  border: 1.5px solid var(--line-strong); border-radius: var(--r-md);
  transition: all var(--d-fast) var(--e-out);
}
.mode b { display: block; font-family: var(--font-display); font-size: var(--t-sm); }
.mode span { font-size: var(--t-xs); color: var(--text-mute); }
.mode[aria-pressed="true"] { border-color: var(--c-red); background: rgba(200,150,46,.05); }

/* ---------------- Commande (checkout) ---------------- */
.steps { display: flex; gap: var(--s-3); margin-bottom: var(--s-7); flex-wrap: wrap; }
.stepdot { display: flex; align-items: center; gap: .6rem; font-size: var(--t-sm); color: var(--text-mute); }
.stepdot b {
  width: 28px; height: 28px; display: grid; place-items: center;
  border-radius: var(--r-full); border: 1.5px solid var(--line-strong);
  font-family: var(--font-display); font-size: var(--t-xs);
}
.stepdot.is-on { color: var(--text); font-weight: 700; }
.stepdot.is-on b { background: var(--grad-heat); color: var(--accent-ink); border-color: transparent; }
.stepdot + .stepdot::before { content: ""; width: 26px; height: 1.5px; background: var(--line-strong); }

.fieldset { padding: var(--s-6); display: grid; gap: var(--s-4); border: 1px solid var(--line); border-radius: var(--r-lg); }
.fieldset > h2 { font-size: var(--t-lg); }
.frow { display: grid; grid-template-columns: 1fr 1fr; gap: var(--s-4); }
@media (max-width: 560px) { .frow { grid-template-columns: 1fr; } }

.paylist { display: grid; gap: .6rem; }
.pay-opt {
  display: flex; align-items: center; gap: var(--s-3);
  padding: var(--s-4); cursor: pointer;
  border: 1.5px solid var(--line-strong); border-radius: var(--r-md);
  transition: all var(--d-fast);
}
.pay-opt:has(input:checked) { border-color: var(--c-red); background: rgba(200,150,46,.05); }
.pay-opt input { accent-color: var(--c-or); width: 18px; height: 18px; }
.pay-opt b { font-size: var(--t-sm); }
.pay-opt span { font-size: var(--t-xs); color: var(--text-mute); }
.pay-opt__tag { margin-left: auto; font-size: .62rem; letter-spacing: .1em; text-transform: uppercase; color: var(--text-mute); }

/* ---------------- Confirmation ---------------- */
.done { text-align: center; max-width: 620px; margin-inline: auto; }
.done__seal {
  width: 96px; height: 96px; margin-inline: auto; margin-bottom: var(--s-5);
  border-radius: var(--r-full); display: grid; place-items: center;
  background: var(--grad-heat); color: var(--accent-ink);
  animation: pop 620ms var(--e-back);
}
@keyframes pop { from { transform: scale(.4); opacity: 0; } }
.done h1 { font-size: var(--t-2xl); }
.done__actions { display: flex; flex-wrap: wrap; gap: var(--s-3); justify-content: center; margin-top: var(--s-6); }

.track { display: grid; gap: 0; margin-top: var(--s-8); text-align: left; }
.track__step { display: grid; grid-template-columns: 34px 1fr; gap: var(--s-4); }
.track__mark { display: grid; justify-items: center; }
.track__dot {
  width: 16px; height: 16px; border-radius: 50%;
  border: 3px solid var(--line-strong); background: var(--bg); margin-top: 5px;
}
.track__step.is-done .track__dot { background: var(--c-red); border-color: var(--c-red); }
.track__step.is-now .track__dot { border-color: var(--c-red); animation: ping 1.6s ease-out infinite; }
@keyframes ping { 50% { box-shadow: 0 0 0 8px rgba(200,150,46,.16); } }
.track__bar { width: 3px; flex: 1; background: var(--line); min-height: 34px; }
.track__step.is-done .track__bar { background: var(--c-red); }
.track__step:last-child .track__bar { display: none; }
.track__body { padding-bottom: var(--s-5); }
.track__body b { font-family: var(--font-display); font-size: var(--t-base); }
.track__body p { font-size: var(--t-sm); color: var(--text-mute); }

/* =========================================================
   Fenêtre de configuration d'un plat
   ========================================================= */
.sheet-back {
  position: fixed; inset: 0; z-index: var(--z-modal);
  background: rgba(10, 10, 10, .62);
  backdrop-filter: blur(4px);
  display: grid; place-items: center;
  padding: var(--s-4);
  opacity: 0; pointer-events: none;
  transition: opacity var(--d-mid) var(--e-out);
}
.sheet-back.is-on { opacity: 1; pointer-events: auto; }

.sheet {
  position: relative;
  width: min(560px, 100%);
  max-height: min(88svh, 860px);
  background: var(--bg);
  border-radius: var(--r-xl);
  box-shadow: var(--sh-3);
  display: flex; flex-direction: column;
  overflow: hidden;
  transform: translateY(24px) scale(.98);
  transition: transform var(--d-mid) var(--e-back);
}
.sheet-back.is-on .sheet { transform: none; }
@media (max-width: 560px) {
  .sheet-back { padding: 0; align-items: end; }
  .sheet { max-height: 92svh; border-radius: var(--r-xl) var(--r-xl) 0 0; }
  .sheet::before {
    content: ""; position: absolute; top: 9px; left: 50%; z-index: 4;
    width: 42px; height: 4px; margin-left: -21px;
    border-radius: 4px; background: rgba(255,255,255,.55);
  }
  .sheet__body { padding-top: var(--s-6); }
  .sheet__foot { padding-bottom: calc(var(--s-4) + env(safe-area-inset-bottom, 0px)); }
  .sheet input, .sheet textarea, .sheet select { font-size: 16px; }
}

/* L'image fait partie du contenu : elle défile avec le reste. */
.sheet__media {
  position: relative;
  width: 100%;
  max-width: 340px;          /* l'image reste centrée, jamais pleine largeur */
  aspect-ratio: 4 / 3;
  max-height: 30svh;
  margin: 0 auto var(--s-5);
  border-radius: var(--r-lg);
  overflow: hidden;
  background: var(--grad-gold);
}
.sheet__media svg,
.sheet__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 560px) { .sheet__media { max-width: 260px; max-height: 24svh; } }

.sheet__close {
  position: absolute; top: var(--s-4); right: var(--s-4); z-index: 3;
  width: 46px; height: 46px;
  display: grid; place-items: center;
  border-radius: var(--r-full);
  background: var(--bg); color: var(--c-ink);
  border: 1px solid var(--line);
  box-shadow: var(--sh-2);
  transition: transform var(--d-fast) var(--e-back),
              background var(--d-fast), color var(--d-fast);
}
.sheet__close svg { width: 22px; height: 22px; }
.sheet__close:hover {
  transform: rotate(90deg);
  background: var(--grad-heat); color: var(--accent-ink); border-color: transparent;
}
[data-theme="dark"] .sheet__close { color: #ECE7DD; }

.sheet__body { overflow-y: auto; padding: var(--s-6); flex: 1; }

.sheet__intro { text-align: center; padding-inline: var(--s-2); }
.sheet__title { font-size: var(--t-xl); }
.sheet__desc {
  color: var(--text-mute); font-size: var(--t-sm);
  margin: .6rem auto 0; max-width: 46ch;
}
.sheet__price {
  font-family: var(--font-display); font-size: var(--t-2xl);
  letter-spacing: -.03em;
  background: var(--grad-heat);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  margin-top: var(--s-4);
}
.sheet__meta {
  display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-4);
  justify-content: center; margin-top: var(--s-3);
  font-size: var(--t-xs); color: var(--text-mute);
}

/* ---------------- Groupe d'options ---------------- */
.ogroup {
  margin-top: var(--s-5);
  border: 1.5px dashed var(--line-strong);
  border-radius: var(--r-lg);
  padding: var(--s-5);
}
.ogroup.is-missing { border-color: var(--c-red); border-style: solid; }
.ogroup__head { display: flex; align-items: baseline; gap: var(--s-3); flex-wrap: wrap; }
.ogroup__head h4 {
  font-family: var(--font-display); font-size: var(--t-base);
  text-transform: uppercase; letter-spacing: .03em;
}
.ogroup__req {
  padding: .18rem .55rem; border-radius: var(--r-full);
  background: var(--c-red); color: var(--accent-ink);
  font-size: .62rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase;
}
.ogroup__hint { width: 100%; font-size: var(--t-xs); color: var(--text-mute); margin-top: .25rem; }
.ogroup__list { margin-top: var(--s-4); display: grid; gap: .15rem; }

.orow {
  display: flex; align-items: center; gap: var(--s-3);
  padding: .6rem .2rem;
  border-bottom: 1px solid var(--line);
}
.orow:last-child { border-bottom: 0; }
.orow__label { flex: 1; font-size: var(--t-sm); font-weight: 600; }
.orow__plus {
  font-size: var(--t-xs); font-weight: 700; color: var(--ok);
  background: rgba(27,138,90,.12); padding: .2rem .5rem; border-radius: var(--r-full);
  white-space: nowrap;
}

/* Choix unique : interrupteur */
.opick {
  width: 46px; height: 26px; flex: none; border-radius: var(--r-full);
  background: var(--line-strong); position: relative;
  transition: background var(--d-fast);
}
.opick::after {
  content: ""; position: absolute; top: 3px; left: 3px;
  width: 20px; height: 20px; border-radius: 50%; background: #fff;
  transition: transform var(--d-fast) var(--e-back);
}
.opick[aria-pressed="true"] { background: var(--grad-heat); }
.opick[aria-pressed="true"]::after { transform: translateX(20px); }

/* Choix multiple : compteur */
.ostep { display: inline-flex; align-items: center; gap: .1rem; flex: none; }
.ostep button {
  width: 30px; height: 30px; display: grid; place-items: center;
  border-radius: var(--r-full); background: var(--bg-alt);
  font-size: 1.05rem; font-weight: 700; line-height: 1;
  transition: background var(--d-fast), color var(--d-fast);
}
.ostep button:hover:not(:disabled) { background: var(--grad-heat); color: var(--accent-ink); }
.ostep button:disabled { opacity: .35; cursor: not-allowed; }
.ostep output {
  min-width: 26px; text-align: center;
  font-family: var(--font-display); font-weight: 700; font-size: var(--t-sm);
}
.ostep output[data-on="1"] { color: var(--c-red); }

.sheet__note { margin-top: var(--s-5); }
.sheet__note textarea {
  width: 100%; padding: .8rem 1rem; margin-top: .5rem;
  border: 1.5px solid var(--line-strong); border-radius: var(--r-md);
  background: var(--bg); font: inherit; font-size: var(--t-sm); resize: vertical;
}

.sheet__foot {
  flex: none; display: flex; align-items: center; gap: var(--s-4);
  padding: var(--s-4) var(--s-6);
  border-top: 1px solid var(--line);
  background: var(--bg);
}
.sheet__foot .qty { flex: none; }
.sheet__foot .btn { flex: 1; }
@media (max-width: 420px) {
  .sheet__foot { padding: var(--s-4); gap: var(--s-3); }
  .sheet__foot .btn { padding-inline: 1rem; font-size: var(--t-xs); }
}

.orow__img {
  width: 42px; height: 42px; flex: none;
  border-radius: 9px; object-fit: cover;
  background: var(--bg-alt);
}

/* ---------- Bandeau photographique des pages ---------- */
.pagehead--photo {
  position: relative;
  isolation: isolate;
  color: #fff;
  border-bottom: 0;
  padding-block: var(--s-9) var(--s-8);
  overflow: hidden;
}
.pagehead__img {
  position: absolute; inset: 0; z-index: -2;
  width: 100%; height: 100%; object-fit: cover;
}
.pagehead__veil {
  position: absolute; inset: 0; z-index: -1;
  background:
    linear-gradient(to top, rgba(8,8,8,.93) 0%, rgba(8,8,8,.66) 45%, rgba(8,8,8,.42) 100%),
    radial-gradient(80% 70% at 15% 100%, rgba(200,150,46,.32), transparent 70%);
}
.pagehead--photo h1 { color: #fff; text-shadow: 0 2px 30px rgba(0,0,0,.45); }
.pagehead--photo p { color: rgba(255,255,255,.78); }
.pagehead--photo .crumbs,
.pagehead--photo .crumbs a { color: rgba(255,255,255,.62); }
.pagehead--photo .crumbs a:hover { color: var(--c-gold); }
.pagehead--photo .eyebrow { color: var(--c-gold); }
.pagehead--photo .eyebrow::before { background: var(--grad-gold); }

/* Le cœur d'un favori reste rempli, pas seulement coloré */
.dish__fav[aria-pressed="true"] svg { fill: currentColor; }
.dish__fav[aria-pressed="true"] { color: var(--c-red); background: rgba(255,255,255,.95); }

/* ---------- Cartes d'offres ---------- */
.bento__item {
  position: relative;
  display: flex; flex-direction: column; justify-content: flex-end;
  gap: var(--s-3);
  padding: var(--s-6);
  border-radius: var(--r-xl);
  min-height: 260px;
  overflow: hidden;
}
.bento__item h2 { font-size: var(--t-2xl); line-height: 1.05; }
.bento__item p { font-size: var(--t-sm); }
.bento__item .btn { align-self: flex-start; margin-top: var(--s-3); }

.bento__item--large { grid-column: span 2; grid-row: span 2; min-height: 460px; }
.bento__item--large h2 { font-size: var(--t-3xl); }
.bento__item--small { min-height: 180px; }
@media (max-width: 760px) {
  .bento__item--large { grid-column: span 1; grid-row: span 1; min-height: 320px; }
}

.bento__item--red  { background: var(--grad-heat); color: var(--accent-ink); }
.bento__item--red p { color: rgba(255,255,255,.86); }
.bento__item--gold { background: var(--grad-gold); color: var(--c-ink); }
.bento__item--gold p { color: rgba(17,17,17,.78); }
.bento__item--dark {
  background: var(--bg-alt); color: var(--text);
  border: 1px solid var(--line);
}

.bento__tag {
  align-self: flex-start;
  padding: .4rem 1rem; border-radius: var(--r-full);
  background: var(--grad-gold); color: var(--c-ink);
  font-family: var(--font-display); font-size: var(--t-xs);
  font-weight: 800; letter-spacing: .12em; text-transform: uppercase;
}
.bento__item--gold .bento__tag { background: rgba(17,17,17,.14); }

.bento__price {
  font-family: var(--font-display); font-size: var(--t-3xl);
  font-weight: 700; letter-spacing: -.03em;
  margin-top: var(--s-2);
}

/* ---------- Page « Notre histoire » ---------- */
.toc a.is-on { color: var(--c-red); font-weight: 700; }
.prose h2 { scroll-margin-top: 110px; }

/* =========================================================
   Tableaux des pages publiques
   Les règles existaient côté administration seulement : le tableau
   des allergènes s'affichait sans mise en forme.
   ========================================================= */
.tbl-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }

.tbl {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--t-sm);
}
.tbl th,
.tbl td {
  padding: .85rem 1rem;
  text-align: left;
  border-bottom: 1px solid var(--line);
  vertical-align: middle;
}
.tbl thead th {
  position: sticky; top: 0; z-index: 1;
  background: var(--bg-alt);
  font-family: var(--font-display);
  font-size: var(--t-xs);
  font-weight: 700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--text-mute);
  white-space: nowrap;
}
.tbl tbody tr { transition: background var(--d-fast); }
.tbl tbody tr:hover { background: var(--bg-alt); }
.tbl tbody tr:last-child td { border-bottom: 0; }

/* Colonnes chiffrées : alignées à droite, chiffres de même largeur */
.tbl .num {
  text-align: right;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.tbl .empty-row {
  text-align: center;
  padding: var(--s-7) var(--s-4);
  color: var(--text-mute);
}

/* Le nom du plat garde la priorité visuelle */
#allerg-table td:first-child { font-weight: 600; min-width: 170px; }
#allerg-table td:nth-child(2) { color: var(--text-mute); min-width: 190px; }

@media (max-width: 720px) {
  .tbl th, .tbl td { padding: .7rem .65rem; }
  #allerg-table { font-size: var(--t-xs); }
}