/* Police Arimo servie par le site (fichiers de public/static/app/assets/fonts,
   licence SIL OFL) : aucune requête chez Google. La graisse 600 utilise le gras. */
@font-face{font-family:'Arimo'; font-style:normal; font-weight:300 500; font-display:swap; src:url('../app/assets/fonts/Arimo-Regular.ttf') format('truetype');}
@font-face{font-family:'Arimo'; font-style:italic; font-weight:300 500; font-display:swap; src:url('../app/assets/fonts/Arimo-Italic.ttf') format('truetype');}
@font-face{font-family:'Arimo'; font-style:normal; font-weight:600 800; font-display:swap; src:url('../app/assets/fonts/Arimo-Bold.ttf') format('truetype');}

:root{
  /* La Galette : page blanche, brun des titres, rouge des traductions */
  --noir:#ffffff;          /* fond */
  --noir-2:#f7f3ee;
  --or:#886c4e;            /* brun La Galette */
  --or-clair:#886c4e;
  --creme:#2c2a2b;         /* texte */
  --gris:#be4344;          /* traductions (rouge) */
  --ft:'Arimo', Helvetica, Arial, sans-serif;
  --fb:'Arimo', Helvetica, Arial, sans-serif;
}
*{box-sizing:border-box;}
html,body{margin:0;}
body{
  background:var(--noir); color:var(--creme); font-family:var(--fb);
  font-weight:300; line-height:1.55; -webkit-text-size-adjust:100%;
}

.pub-head{text-align:center; padding:34px 20px 16px;}
.pub-head img{width:92px; height:92px; margin:0 auto 12px; display:block; object-fit:contain;}
.pub-head h1{font-family:var(--ft); font-weight:700; font-size:27px; margin:0; color:var(--creme);}
.pub-head .sub{font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--or-clair); margin:6px 0 0;}

/* Onglets collants */
.tabs-zone{
  position:sticky; top:0; z-index:10;
  background:rgba(255,255,255,.97); backdrop-filter:blur(8px);
  border-bottom:1px solid rgba(201,162,39,.22);
  padding-top:env(safe-area-inset-top);
}
.tabs{
  display:flex; gap:6px; overflow-x:auto; -webkit-overflow-scrolling:touch;
  padding:12px 14px 10px;
  scrollbar-width:none;
}
.tabs::-webkit-scrollbar{display:none;}
.tab{
  flex:none; padding:10px 17px; border-radius:30px; cursor:pointer;
  font-size:13.5px; font-weight:600; white-space:nowrap;
  color:var(--creme); background:rgba(136,108,78,.08); border:1px solid transparent;
  transition:background .15s, color .15s, border-color .15s;
  -webkit-tap-highlight-color:transparent;
}
.tab.active{background:var(--or); color:#fff; border-color:var(--or);}

/* Chips d'accès rapide aux sections (longues cartes) */
.jump{
  display:flex; gap:6px; overflow-x:auto; -webkit-overflow-scrolling:touch;
  padding:0 14px 10px; scrollbar-width:none;
}
.jump::-webkit-scrollbar{display:none;}
.jump:empty{display:none;}
.jump button{
  flex:none; font-family:var(--fb); font-size:11px; font-weight:500;
  color:var(--or-clair); background:none; border:1px solid rgba(201,162,39,.35);
  border-radius:20px; padding:5px 11px; cursor:pointer; white-space:nowrap;
  -webkit-tap-highlight-color:transparent;
}
.jump button:active{background:rgba(201,162,39,.18);}

/* Retour en haut */
#topBtn{
  position:fixed; right:16px; bottom:calc(18px + env(safe-area-inset-bottom)); z-index:20;
  width:44px; height:44px; border-radius:50%; border:1px solid rgba(201,162,39,.5);
  background:rgba(255,255,255,.95); color:var(--or-clair); font-size:19px; cursor:pointer;
  opacity:0; pointer-events:none; transition:opacity .2s;
  -webkit-tap-highlight-color:transparent;
}
#topBtn.show{opacity:1; pointer-events:auto;}

main{max-width:760px; margin:0 auto; padding:24px 20px 10px;}
.loading{text-align:center; color:var(--gris); padding:60px 0;}

.m-section{margin:0 0 30px;}
.m-section > h2{
  font-family:var(--ft); font-weight:700; font-size:21px; color:var(--creme);
  text-transform:uppercase; letter-spacing:.03em;
  border-bottom:1px solid rgba(201,162,39,.4); padding-bottom:8px; margin:0 0 4px;
}
.m-section > h2 .en{font-family:var(--fb); font-size:12px; font-style:italic; font-weight:300; color:var(--gris); text-transform:none; letter-spacing:0;}
.m-head{color:var(--or-clair); font-weight:600; font-size:14.5px; letter-spacing:.02em; margin:16px 0 6px;}
.m-note{font-size:12px; font-style:italic; color:var(--gris); margin:6px 0;}
.m-formule{color:var(--or-clair); font-weight:500; font-size:15px; margin:4px 0;}
.m-formule.heading{font-family:var(--ft); font-size:20px; font-weight:700; color:var(--creme);}

.m-item{display:flex; align-items:baseline; gap:8px; padding:7px 0; border-bottom:1px solid rgba(255,255,255,.04);}
.m-item .n{flex:1;}
.m-item .fr{font-size:14.5px; font-weight:500; color:var(--creme);}
.m-item .en{font-size:12px; font-style:italic; font-weight:300; color:var(--gris); margin-top:1px;}
.m-item .dots{flex:none; width:14px;}
.m-item .p{font-size:14.5px; font-weight:600; color:var(--or-clair); white-space:nowrap;}
.item-tag{width:14px; height:14px; margin-left:6px; vertical-align:-2px; display:inline-block;}
.m-image{display:flex; justify-content:center; margin:10px 0 18px;}
.m-image img{max-width:100%; height:auto;}

.pub-foot{text-align:center; color:var(--gris); font-size:12px; padding:26px 20px 40px;}
.pub-foot .tiny{font-size:11px; opacity:.7; margin-top:4px;}
.err{text-align:center; color:var(--gris); padding:50px 20px;}

/* une seule colonne : la carte se lit dans l'ordre, du haut vers le bas */

/* ---------- La Galette ---------- */
.pub-head img{width:120px; height:auto;}
.pub-head h1{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0);}
.pub-head .sub{color:var(--or);}
.m-section > h2{color:var(--or); text-align:center; letter-spacing:.1em; border-top:1px solid var(--or); border-bottom:1px solid var(--or); padding:8px 0; font-size:19px;}
.m-section.sub > h2{text-align:left; border-top:none; font-size:15px; padding:4px 0 6px;}
.m-item{border-bottom:1px solid rgba(0,0,0,.05);}
.m-item .fr{font-weight:600; color:var(--creme); text-transform:uppercase; font-size:14px; letter-spacing:.02em;}
.m-item .fr .desc{font-weight:400; color:var(--gris); font-size:11.5px; letter-spacing:.03em;}
.m-item .sub{font-size:11.5px; color:var(--or); margin-top:1px; text-transform:uppercase;}
.m-item .en{font-style:normal; font-weight:400; text-transform:uppercase; font-size:11px; letter-spacing:.03em;}
.m-item .p{color:var(--creme);}
.m-item .wps{display:flex; flex-direction:column; align-items:flex-end; gap:1px;}
.m-item .wp small{font-size:10px; color:#888; font-weight:400;}
.item-tag{width:18px; height:18px;}
.item-tag.tag-new{width:30px; height:13px;}
.m-head{color:var(--or); font-style:italic; font-size:16px; font-weight:400;}
.m-note{color:#666;}
.m-menu{text-align:center; border:1px solid rgba(136,108,78,.3); border-radius:12px; padding:18px 12px;}
.m-line{line-height:1.35;}
.m-line.v-title{font-size:22px; color:var(--or); margin-bottom:6px;}
.m-line.v-main{font-weight:700; font-size:14px; margin-top:8px;}
.m-line.v-sub{color:var(--gris); font-weight:700; font-size:11px;}
.m-line.v-small{color:var(--or); font-weight:700; font-size:11px;}
.m-line.v-or{font-size:12px; font-weight:700;}
.m-line.v-stars{color:#aaa; font-size:10px; letter-spacing:.1em;}
.m-banner{background:var(--or); color:#fff; text-align:center; font-weight:700; padding:8px 10px; text-transform:uppercase; letter-spacing:.05em; font-size:13px; margin:10px 0;}
.m-image img{border-radius:8px;}

/* ---------- Langues ---------- */
.langs{display:flex; justify-content:center; gap:6px; padding:10px 14px 0;}
.langs .lang{
  display:inline-flex; align-items:center; gap:5px; font-family:var(--fb); font-size:12px; font-weight:600;
  color:var(--creme); background:none; border:1px solid rgba(136,108,78,.3); border-radius:20px;
  padding:5px 10px; cursor:pointer; -webkit-tap-highlight-color:transparent;
}
.langs .lang .flag{font-size:14px; line-height:1;}
.langs .lang.active{background:var(--or); border-color:var(--or); color:#fff;}

/* ---------- Lisibilité (relecture jury) ---------- */
.m-item{display:flex; align-items:flex-start; justify-content:space-between; gap:14px; padding:9px 0;}
.m-item .n{flex:1; min-width:0;}
.m-item .fr{font-size:14.5px; line-height:1.3;}
.m-item .desc, .m-item .sub{display:block; font-size:13px; font-weight:400; color:#5f564d; text-transform:none; letter-spacing:0; margin-top:2px; line-height:1.4;}
.m-item .en{display:block; font-size:12.5px; font-style:italic; font-weight:400; color:#8f857b; text-transform:none; letter-spacing:0; margin-top:1px;}
.m-item .p{font-size:14.5px; font-weight:600; white-space:nowrap; padding-top:1px;}
.m-item .item-tag{width:17px; height:17px; margin-left:6px; vertical-align:-3px;}
.langs .lang{min-height:40px; padding:6px 13px; font-size:13px;}
.jump button{min-height:36px; padding:7px 13px; font-size:12px;}
.m-legend{display:flex; justify-content:center; gap:18px; font-size:12.5px; color:#5f564d; margin:0 0 18px; flex-wrap:wrap;}
.m-legend img{width:16px; height:16px; vertical-align:-3px; margin-right:4px;}
.m-order{text-align:center; border:1px solid rgba(136,108,78,.35); border-radius:12px; padding:16px; margin:0 0 24px;}
.m-order .t{font-size:20px; font-weight:700; color:var(--or); text-transform:uppercase; letter-spacing:.06em;}
.m-order .s{font-size:13px; color:#5f564d; margin:2px 0 10px;}
.m-order .tel{display:inline-block; background:var(--or); color:#fff; text-decoration:none; font-weight:700; font-size:17px; padding:11px 20px; border-radius:30px;}
.m-banner-web{text-align:center; text-transform:uppercase; font-style:normal; font-weight:700; letter-spacing:.06em; font-size:13px; margin:22px 0 8px;}
.pub-foot, .pub-foot .tiny{color:#6b6158;}

/* ---------- Choix de la langue (arrivée par le QR code) ---------- */
.lang-gate{position:fixed; inset:0; z-index:50; background:rgba(255,255,255,.97); display:flex; align-items:center; justify-content:center; padding:20px;}
.lang-gate[hidden]{display:none;}
.lang-gate-box{width:100%; max-width:360px; text-align:center;}
.lang-gate-box img{width:120px; margin:0 auto 18px; display:block;}
.lg-title{font-size:19px; font-weight:700; color:var(--or); margin:0 0 20px; line-height:1.35;}
.lg-title span{display:block; font-size:13px; font-weight:400; color:#6b6158; margin-top:4px;}
.lg-btns{display:flex; flex-direction:column; gap:12px;}
.lg-btn{display:flex; align-items:center; gap:14px; width:100%; min-height:58px; padding:12px 20px; border-radius:14px;
  border:1.5px solid rgba(136,108,78,.35); background:#fff; font-family:var(--fb); font-size:18px; font-weight:600; color:var(--creme); cursor:pointer;
  -webkit-tap-highlight-color:transparent;}
.lg-btn .flag{font-size:28px; line-height:1;}
.lg-btn:active, .lg-btn.current{border-color:var(--or); background:rgba(136,108,78,.08);}
body.gate-open{overflow:hidden;}
.lang-fab{position:fixed; left:16px; bottom:calc(18px + env(safe-area-inset-bottom)); z-index:20;
  min-height:44px; padding:0 16px; border-radius:24px; border:1px solid rgba(136,108,78,.5); background:rgba(255,255,255,.96);
  font-family:var(--fb); font-size:14px; font-weight:600; color:var(--creme); box-shadow:0 4px 14px rgba(0,0,0,.12); cursor:pointer;
  -webkit-tap-highlight-color:transparent;}
.lang-fab[hidden]{display:none;}
.lang-fab span{margin-left:4px;}

/* ---------- Plateforme Vikto Labs (carte.vikto-labs.fr) ---------- */
/* logo absent : masqué, le nom du resto s'affiche à sa place */
.pub-head img.broken, .lang-gate-box img.broken{display:none;}
.pub-head.no-logo h1{position:static; width:auto; height:auto; overflow:visible; clip:auto; margin-top:6px;}
/* carte injoignable : bouton pour réessayer */
.err-retry{margin-top:16px; min-height:44px; padding:10px 22px; border:0; border-radius:24px; background:var(--or); color:#fff;
  font-family:var(--fb); font-size:15px; font-weight:600; cursor:pointer; -webkit-tap-highlight-color:transparent;}
/* aperçu depuis l'éditeur (admin.vikto-labs.fr/<resto>/apercu/) */
.preview-bar{background:#16202a; color:#fff; font-size:13px; line-height:1.4; text-align:center; padding:9px 16px;}

/* ---------- Codes des plats (langues étrangères) ---------- */
.vh{position:absolute !important; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;}
/* pastille collée au premier mot du nom : jamais seule sur sa ligne */
.code-lead{white-space:nowrap;}
.code{
  display:inline-block; min-width:2.7em; margin:0 .5em 0 0; padding:.14em .38em .1em; vertical-align:.08em;
  border:1.5px solid var(--or); border-radius:.45em; background:#fff; color:var(--creme);
  font-family:var(--fb); font-size:.82em; font-weight:700; line-height:1.2; letter-spacing:.03em; text-align:center;
  text-transform:none; font-variant-numeric:tabular-nums; cursor:pointer; -webkit-tap-highlight-color:transparent;
}
.code:focus-visible{outline:2px solid var(--or); outline-offset:2px;}
.m-line .code{font-size:13px; vertical-align:.25em;}
.has-code{cursor:pointer; -webkit-tap-highlight-color:transparent;}
.m-item.has-code:active{background:rgba(136,108,78,.06);}
.m-codes-hint{margin:0 0 18px; padding:9px 12px; border:1px solid rgba(136,108,78,.3); border-radius:10px; background:rgba(136,108,78,.06);
  font-size:13px; line-height:1.4; color:#5f564d; text-align:center;}

/* écran « à montrer au serveur » (en français) */
.code-card{position:fixed; inset:0; z-index:60; background:rgba(44,42,43,.45); display:flex; align-items:center; justify-content:center;
  padding:calc(14px + env(safe-area-inset-top)) 14px calc(14px + env(safe-area-inset-bottom)); touch-action:none;}
.code-card[hidden]{display:none;}
/* écran ouvert : la carte derrière ne défile pas (comme l'écran de choix de la langue) */
html.card-open{overflow:hidden;}
html.card-open.card-gutter{scrollbar-gutter:stable;}
.cc-box{width:100%; max-width:440px; max-height:100%; overflow-y:auto; overscroll-behavior:contain; background:#fff; border-radius:18px; padding:22px 20px 18px;
  text-align:center; box-shadow:0 10px 40px rgba(0,0,0,.25);}
.cc-say{margin:0 0 14px; font-size:15px; font-weight:600; color:#5f564d; line-height:1.35;}
.cc-code{display:inline-block; min-width:2.4em; margin:0 auto 14px; padding:4px 18px; border:3px solid var(--or); border-radius:14px;
  font-size:64px; font-weight:700; line-height:1.1; color:var(--creme); letter-spacing:.02em; font-variant-numeric:tabular-nums;}
.cc-fr{margin:0 0 2px; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:#8f857b;}
.cc-name{margin:0 0 8px; font-size:26px; font-weight:700; line-height:1.2; color:var(--creme); overflow-wrap:anywhere;}
.cc-desc{margin:0 0 10px; font-size:16px; line-height:1.4; color:#5f564d;}
.cc-lines{list-style:none; margin:0 0 10px; padding:0; font-size:15px; line-height:1.4; color:var(--creme);}
.cc-lines li{padding:4px 0; border-top:1px solid rgba(136,108,78,.18);}
.cc-prices{list-style:none; margin:4px 0 12px; padding:0; font-size:22px; font-weight:700; color:var(--creme); line-height:1.35;}
.cc-local{margin:0 0 14px; padding-top:10px; border-top:1px solid rgba(136,108,78,.2); font-size:13px; color:#8f857b; line-height:1.35;}
.cc-close{min-height:48px; min-width:160px; padding:10px 26px; border:0; border-radius:26px; background:var(--or); color:#fff;
  font-family:var(--fb); font-size:16px; font-weight:600; cursor:pointer; -webkit-tap-highlight-color:transparent;}
.cc-close:focus-visible{outline:3px solid #2c2a2b; outline-offset:2px;}
.cc-box [hidden]{display:none;}