/* Styles partagés — Réservations Le Cèdre */
/* Palette : vert cèdre = sur place, bleu froid = à emporter (liaison froide), résine = attention */
:root{
  --cedre:#1E4D45; --cedre-f:#133530; --cedre-c:#E0ECE7;
  --froid:#2A6391; --froid-c:#E1ECF5;
  --resine:#B97A08; --resine-c:#FBF0D6;
  --encre:#15221E; --gris:#56645F; --trait:#D3DCD8;
  --fond:#EFF3F1; --papier:#FFFFFF;
  --alerte:#A5302B; --alerte-c:#F9E4E2;
  --f-titre:'Bricolage Grotesque','Trebuchet MS',sans-serif;
  --f-texte:'Atkinson Hyperlegible',Verdana,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--f-texte);font-size:17px;line-height:1.5;color:var(--encre);background:var(--fond)}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--resine);outline-offset:2px}
[hidden]{display:none!important}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* Bandeau */
.bandeau{background:var(--cedre);color:#fff;padding:12px 18px;display:flex;align-items:center;justify-content:space-between;gap:12px;position:sticky;top:0;z-index:20}
.marque{display:flex;flex-direction:column;line-height:1.1}
.marque-nom{font-family:var(--f-titre);font-weight:800;font-size:24px;letter-spacing:-.02em}
.marque-sous{font-size:14px;opacity:.85}
.bandeau .lien{color:#fff;text-decoration-color:rgba(255,255,255,.5)}

main{max-width:720px;margin:0 auto;padding:18px 16px 96px}
.titre{font-family:var(--f-titre);font-weight:800;font-size:clamp(30px,7.5vw,44px);line-height:1.02;letter-spacing:-.025em;margin:10px 0 10px}
.sous-titre{font-family:var(--f-titre);font-weight:800;font-size:23px;letter-spacing:-.01em;margin:30px 0 10px}
.intro{color:var(--gris);margin:0 0 18px;max-width:34em}
.petit{font-size:15px;color:var(--gris)}
.note{background:var(--resine-c);border-left:4px solid var(--resine);padding:10px 14px;border-radius:0 8px 8px 0;margin:10px 0}

/* Boutons */
.btn{border:0;border-radius:10px;padding:13px 20px;font-weight:700;cursor:pointer;min-height:48px}
.btn:disabled{opacity:.45;cursor:not-allowed}
.btn.principal{background:var(--cedre);color:#fff}
.btn.principal:hover:not(:disabled){background:var(--cedre-f)}
.btn.secondaire{background:var(--papier);color:var(--cedre);box-shadow:inset 0 0 0 2px var(--cedre)}
.btn.discret{background:transparent;color:var(--gris);box-shadow:inset 0 0 0 1px var(--trait);padding:8px 14px;min-height:40px;font-weight:400}
.btn.danger{background:var(--alerte);color:#fff}
.btn.large{width:100%}
.lien{background:none;border:0;padding:6px 0;color:var(--cedre);text-decoration:underline;text-underline-offset:3px;cursor:pointer;font-size:15px}
.btn-rond{width:44px;height:44px;border-radius:50%;border:2px solid var(--cedre);background:var(--papier);color:var(--cedre);font-size:24px;line-height:1;cursor:pointer}
.btn-rond:disabled{opacity:.3;cursor:not-allowed}

/* Champs */
label{display:block;font-weight:700;font-size:15px;margin-bottom:14px}
input[type=text],input[type=email],input[type=password],input[type=number],input:not([type]),select,textarea{
  display:block;width:100%;margin-top:6px;padding:12px 14px;border:2px solid var(--trait);border-radius:8px;background:var(--papier);font-weight:400;font-size:17px}
input:focus,select:focus,textarea:focus{border-color:var(--cedre);outline:none}
textarea{resize:vertical}
.case{display:flex;gap:10px;align-items:flex-start;font-weight:400}
.case input{width:22px;height:22px;margin:2px 0 0;flex:none;accent-color:var(--cedre)}
.erreur{color:var(--alerte);font-weight:700;min-height:0;margin:8px 0}
.erreur:empty{display:none}
.ok-msg{color:var(--cedre);font-weight:700;margin:8px 0}
.ok-msg:empty{display:none}

.carte{background:var(--papier);border-radius:14px;padding:18px;box-shadow:0 1px 0 var(--trait)}

/* Jauge « assiettes » : un rond par couvert */
.jauge{margin:8px 0}
.dots{display:flex;flex-wrap:wrap;gap:4px;margin-bottom:4px}
.dot{width:12px;height:12px;border-radius:50%;border:2px solid var(--cedre);background:var(--papier)}
.dot.pris{background:var(--trait);border-color:var(--trait)}
.jauge.em .dot:not(.pris){border-color:var(--froid)}
.jauge-txt{font-size:15px}
.jauge-txt strong{font-family:var(--f-titre);font-size:19px}
.jauge.sp .jauge-txt strong{color:var(--cedre)}
.jauge.em .jauge-txt strong{color:var(--froid)}
.barre{display:block;height:10px;border-radius:5px;background:var(--cedre-c);overflow:hidden}
.barre>span{display:block;height:100%;background:var(--cedre)}
.jauge.em .barre{background:var(--froid-c)}
.jauge.em .barre>span{background:var(--froid)}

/* Étiquettes de mode */
.tag{display:inline-block;font-size:13px;font-weight:700;padding:2px 9px;border-radius:999px;white-space:nowrap}
.tag.sur_place{background:var(--cedre-c);color:var(--cedre)}
.tag.emporter{background:var(--froid-c);color:var(--froid)}
.tag.annulee{background:var(--alerte-c);color:var(--alerte)}
.tag.servie{background:var(--encre);color:#fff}

/* Toast */
#toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,40px);opacity:0;background:var(--encre);color:#fff;padding:12px 18px;border-radius:10px;z-index:50;transition:.25s;pointer-events:none;max-width:90vw}
#toast.on{transform:translate(-50%,0);opacity:1}

.chargement{color:var(--gris);padding:24px 0}

/* Logo dans le bandeau (fichier logo.png à côté des pages) */
.marque-bloc{display:flex;align-items:center;gap:12px;min-width:0}
.logo{height:46px;width:auto;max-width:120px;object-fit:contain;background:#fff;border-radius:10px;padding:4px 6px;flex:none}
/* Message permanent (Paramètres) : distinct du message du jour */
.message-general{background:var(--cedre-c);border-left:4px solid var(--cedre);padding:12px 16px;border-radius:0 10px 10px 0;margin:6px 0 16px;white-space:pre-line;font-weight:700;color:var(--cedre-f)}