/* Prise de rendez-vous : mise en page seulement (tokens et composants dans site.css). */
[hidden] { display: none !important; }

.rdv-page { padding: var(--sp-10) 0 var(--sp-12); }
.rdv-col { max-width: 720px; margin: 0 auto; }
.rdv-col:focus { outline: none; }
.rdv-title { font-size: 2rem; max-width: 26ch; margin-bottom: var(--sp-2); }
.rdv-intro { color: var(--ink-3); font-size: var(--fs-lead); margin: 0 0 var(--sp-6); }
.rdv-project { background: var(--bg-brand); border-radius: var(--radius); padding: var(--sp-3) var(--sp-4); margin: 0 0 var(--sp-6); color: var(--ink-2); max-width: none; }

.rdv-step { border: 0; margin: 0; padding: var(--sp-8) 0; border-top: 1px solid var(--line); min-width: 0; }
.rdv-step:first-child { border-top: 0; padding-top: var(--sp-2); }
.rdv-step legend { display: flex; align-items: center; gap: var(--sp-3); float: left; width: 100%; padding: 0; margin: 0 0 var(--sp-5); font: 700 1.125rem/1.3 var(--font-heading); color: var(--ink); }
.rdv-step legend + * { clear: both; }
.rdv-required { margin: 0 0 var(--sp-4); clear: both; }

.modes { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.modes .choice span { min-height: 88px; }

/* Bandeau de jours à défilement explicite */
.days-bar { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px; gap: var(--sp-2); align-items: center; margin-bottom: var(--sp-5); }
.days-arrow { width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--line-input); background: #fff; color: var(--ink); display: grid; place-items: center; cursor: pointer; padding: 0; }
.days-arrow svg { width: 20px; height: 20px; }
.days-arrow:hover:not([disabled]) { border-color: var(--brand); color: var(--brand); }
.days-arrow[disabled] { border-color: var(--line); color: var(--line-strong); cursor: default; }
.days { display: flex; gap: var(--sp-2); overflow-x: auto; scroll-snap-type: x mandatory; padding: 4px; margin: -4px; scrollbar-width: none; }
.days::-webkit-scrollbar { display: none; }
.day { flex: none; width: 76px; scroll-snap-align: start; padding: var(--sp-2) 4px; border: 1px solid var(--line-input); border-radius: var(--radius); background: #fff; font: inherit; text-align: center; cursor: pointer; display: flex; flex-direction: column; gap: 2px; color: var(--ink); }
.day:hover { border-color: var(--ink-3); }
.day .wd, .day .mo { font-size: var(--fs-small); color: var(--ink-3); }
.day .dn { font: 700 1.375rem/1.2 var(--font-heading); font-variant-numeric: tabular-nums; }
.day[aria-selected="true"] { border: 2px solid var(--brand); background: var(--brand-pale); color: var(--brand-deep); padding: calc(var(--sp-2) - 1px) 3px; }
.day[aria-selected="true"] .wd, .day[aria-selected="true"] .mo { color: var(--brand-deep); }
.slots-day { font-weight: 600; margin: 0 0 var(--sp-3); }
.slots-day::first-letter { text-transform: uppercase; }
.slot-group + .slot-group { margin-top: var(--sp-4); }
.slot-group h3 { font: 600 var(--fs-small)/1.3 var(--font-body); color: var(--ink-3); margin: 0 0 var(--sp-2); }
.slot-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(88px, 1fr)); gap: var(--sp-2); }
.slot-grid .slot { width: 100%; font-variant-numeric: tabular-nums; }

/* Entreprise retrouvée */
.company-card { display: grid; gap: 2px; background: var(--bg-brand); border-radius: var(--radius); padding: var(--sp-3) var(--sp-4); }
.company-card span { color: var(--ink-3); font-size: var(--fs-small); }
.rdv-more { margin-top: var(--sp-5); }
.rdv-more > summary { cursor: pointer; font-weight: 600; color: var(--brand); min-height: 44px; display: inline-flex; align-items: center; gap: 6px; }
.rdv-more > summary:hover { text-decoration: underline; color: var(--brand-hover); }
#rdv-error { margin: 0 0 var(--sp-3); }
.rdv-legal { text-align: left; margin-top: 0; }

/* Barre collante basse (bureau et mobile) : récapitulatif + action principale */
.rdv-bar { display: block; padding: var(--sp-3) var(--gutter) calc(var(--sp-3) + env(safe-area-inset-bottom)); }
.rdv-bar-inner { max-width: 720px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4); }
.rdv-recap { min-width: 0; }
.rdv-recap strong { display: block; font: 700 1.0625rem/1.3 var(--font-heading); }
.rdv-recap strong::first-letter { text-transform: uppercase; }
.rdv-recap strong.is-empty { color: var(--ink-3); font-weight: 600; }
.rdv-recap small { display: block; color: var(--ink-3); font-size: var(--fs-small); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.has-rdv-bar .site-footer { padding-bottom: calc(var(--sp-20) + 72px); }

/* Confirmation */
.done-card { display: grid; justify-items: start; gap: var(--sp-4); }
.done-card .rdv-title { margin: 0; }
.done-card .lead { margin: 0; }
.done-card .lead::first-letter { text-transform: uppercase; }
.done-check { width: 48px; height: 48px; border-radius: 50%; background: var(--brand); color: #fff; display: grid; place-items: center; }
.done-check svg { width: 28px; height: 28px; }
.recap-list { margin: 0; display: grid; width: 100%; border-top: 1px solid var(--line); }
.recap-list > div { display: grid; grid-template-columns: 200px minmax(0, 1fr); gap: var(--sp-4); padding: var(--sp-3) 0; border-bottom: 1px solid var(--line); }
.recap-list dt { color: var(--ink-3); }
.recap-list dd { margin: 0; font-weight: 600; overflow-wrap: anywhere; }
.done-links { display: flex; flex-wrap: wrap; gap: var(--sp-2) var(--sp-8); margin: 0; }
.done-card .notice { width: 100%; }

@media (max-width: 767px) {
  .rdv-page { padding: var(--sp-6) 0 var(--sp-10); }
  .rdv-title { font-size: 1.75rem; }
  .rdv-intro { font-size: 1rem; }
  .rdv-step { padding: var(--sp-6) 0; }
  .modes { grid-template-columns: minmax(0, 1fr); }
  .modes .choice span { min-height: 64px; }
  .day { width: 68px; }
  .slot-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .rdv-bar-inner { gap: var(--sp-3); }
  .rdv-bar .btn { padding: 0 var(--sp-4); }
  .recap-list > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .done-card .btn { width: 100%; }
  body.has-rdv-bar .site-footer { padding-bottom: calc(var(--sp-16) + 80px); }
}
.lbl-short { display: none; }
@media (max-width: 420px) {
  .lbl-long { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; }
  .lbl-short { display: inline; }
  /* En-tête de tunnel : la mention d'étape tient sur deux lignes au plus (voir rapport P2, à reprendre dans site.css) */
  .site-header[data-layout="tunnel"] .tunnel-step { font-size: .875rem; line-height: 1.25; }
  .site-header[data-layout="tunnel"] .tunnel-links { gap: var(--sp-3); }
}

/* Erreurs : sous le champ fautif (ou au-dessus des créneaux), avec un repère qui ne dépend pas de la couleur */
.rdv-page .field-error, #rdv-error { display: flex; gap: var(--sp-2); align-items: flex-start; margin: var(--sp-2) 0 0; font-size: var(--fs-small); line-height: var(--lh-small); color: var(--danger); font-weight: 600; }
.rdv-page .field-error[hidden], #rdv-error[hidden] { display: none; }
.rdv-page .field-error::before, #rdv-error::before { content: "!"; flex: none; width: 18px; height: 18px; margin-top: 1px; border-radius: 50%; background: var(--danger); color: #fff; font: 700 .75rem/18px var(--font-heading); text-align: center; }
#slot-error { margin: 0 0 var(--sp-4); }
.rdv-gone { margin: 0 0 var(--sp-4); }
/* Champ focalisé après une erreur : jamais caché par la barre collante ni l’en-tête */
.rdv-page .input, .rdv-page .textarea { scroll-margin: 96px 0 160px; }