:root{
  --paper:#faf6ee; --ink:#2b2117; --muted:#93876f; --accent:#a8552e; --line:#e9ddc7;
  --fond:var(--paper); --texte:var(--ink); --faible:var(--muted); --ligne:var(--line);
  --marque:var(--accent); --sur-marque:#fdf9f3; --sur-accent:#fdf9f3;
  --accent-vif:#c2662f;
  --accent-faible:rgba(168,85,46,.09); --accent-ligne:rgba(168,85,46,.36);
  --surface:#ffffff; --doux:#5b4d3c;
  --ok:#4c7a4a; --ok-fond:#eaf3e7; --ok-ligne:#c9ddc2;
  --attente:#a8752e; --attente-fond:#f8eeda; --attente-ligne:#ecd6a6;
  --alerte:#ab4330; --alerte-fond:#fbe9e4; --alerte-ligne:#efc3b6;
  --ease:cubic-bezier(.22,1,.36,1);
}

/* signature : calendrier de disponibilité en cases pleines */
.calendrier{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.calendrier .ent{font-size:10.5px;text-align:center;color:var(--faible);font-weight:600;padding-bottom:2px}
.jour-cal{aspect-ratio:1/.82;border-radius:5px;border:1px solid var(--ligne);background:var(--surface);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;cursor:pointer;font-size:12px;position:relative;transition:transform .12s,box-shadow .12s}
.jour-cal .n{font-family:"Plex Sans",sans-serif;font-weight:600}
.jour-cal .p{font-size:9.5px;color:var(--faible)}
.jour-cal:hover:not(.indispo):not(.hors){transform:translateY(-1px);box-shadow:0 3px 8px rgba(0,0,0,.08);border-color:var(--accent-ligne)}
.jour-cal.hors{opacity:0;pointer-events:none}
.jour-cal.libre{background:var(--surface)}
.jour-cal.select{background:var(--accent);color:#fff;border-color:var(--accent)}
.jour-cal.select .p{color:rgba(255,255,255,.8)}
.jour-cal.entre-deux{background:var(--accent-faible);border-color:var(--accent-ligne)}
.jour-cal.attente{background:var(--attente-fond);border-color:var(--attente-ligne);color:var(--attente)}
.jour-cal.confirme{background:var(--ok-fond);border-color:var(--ok-ligne);color:var(--ok)}
.jour-cal.indispo{background:repeating-linear-gradient(135deg,var(--fond),var(--fond) 4px,var(--ligne) 4px,var(--ligne) 5px);color:var(--faible);cursor:pointer}
.jour-cal.aujourdhui{box-shadow:inset 0 0 0 2px var(--marque)}

.legende-cal{display:flex;gap:14px;flex-wrap:wrap;font-size:11.5px;color:var(--doux);margin-top:12px}
.legende-cal span{display:flex;align-items:center;gap:6px}
.legende-cal i{width:11px;height:11px;border-radius:3px;display:block}

.recap-sejour{background:var(--surface);border:1px solid var(--ligne);border-radius:8px;padding:16px}
.recap-ligne{display:flex;justify-content:space-between;font-size:13px;padding:7px 0;border-bottom:1px solid var(--ligne)}
.recap-ligne:last-child{border-bottom:0}
.recap-ligne.total{font-weight:700;font-size:15px;padding-top:10px}
.recap-ligne .mono{font-weight:600}

.confirmation{text-align:center;padding:40px 20px;max-width:440px;margin:0 auto}
.confirmation .coche{width:56px;height:56px;border-radius:50%;background:var(--ok-fond);color:var(--ok);display:flex;align-items:center;justify-content:center;margin:0 auto 16px}
.confirmation .ref{font-family:"Plex Sans",sans-serif;background:var(--fond);border:1px solid var(--ligne);border-radius:6px;padding:8px 14px;display:inline-block;margin:14px 0;font-weight:600}

.anneau{width:88px;height:88px;flex:none}
.anneau circle{fill:none;stroke-width:8}
.anneau .fond{stroke:var(--ligne)}
.anneau .trace{stroke:var(--marque);stroke-linecap:round;transition:stroke-dashoffset .6s var(--ease)}

/* aperçu vivant — écran de connexion */
.av-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.av-cal-ent{font-size:9px;text-align:center;color:var(--faible);font-weight:600}
.av-cal i{aspect-ratio:1;border-radius:4px;border:1px solid var(--ligne);background:var(--surface);display:flex;align-items:center;justify-content:center;font-style:normal}
.av-cal i.occ{background:var(--ok-fond);border-color:var(--ok-ligne)}
.av-cal i.av-reserve{color:transparent;font-weight:900;background:var(--surface);border-color:var(--ligne)}
.av-hero-actif .av-cal i.av-reserve{animation:avReserver 1s .6s cubic-bezier(.22,1,.36,1) both}
@keyframes avReserver{
  0%{transform:scale(1)}
  45%{transform:scale(1.16)}
  70%,100%{background:var(--accent);border-color:var(--accent);color:var(--surface);transform:scale(1)}
}
.av-legende{margin-top:14px;font-size:12px;color:var(--faible);text-align:center}
@media(prefers-reduced-motion:reduce){.av-hero-actif .av-cal i.av-reserve{animation:none;background:var(--accent);border-color:var(--accent);color:var(--surface)}}