/* =========================================================================
   PRISE DE RENDEZ-VOUS — le formulaire de la section #entretien (accueil).
   Formulaire : index.html, #formulaire-entretien · script : rendez-vous.js ·
   fonction : api/rendez-vous.js.

   UN REGISTRE, PAS UNE CARTE. Le titre de chaque rang tient la marge
   (Cormorant italique, encre bleue), les champs sont à filet, aucun cadre
   autour, aucun coin arrondi, aucun dégradé de couleur. L'or ne fait que
   DÉSIGNER : le filet du bouton d'envoi, et le point posé dans le coin des
   créneaux choisis (≤ 3 points de 6 px).

   Contrastes mesurés sur l'ivoire #E9ECF1 ET sur le coin froid du papier
   (#D8DEE6, là où tombe le formulaire, bas droit de `.clair`) :
   texte doux #353C45 9,41 / 8,23 · erreur #8A2618 7,48 / 6,54 ·
   filet des champs #6B7480 4,00 / 3,50 (≥ 3 exigé pour un bord de champ) ·
   anneau de focus bronze 4,94 / 4,32 · coche : ivoire sur bleu 11,61, or
   sur bleu 5,19. Les clairs utilisent le même `--focus` bronze que `.clair`.

   ⚠ LES PETITS CORPS SE MESURENT EN DENSITÉ 1, LETTRE PAR LETTRE (15/10).
   Sur l'écran d'un PC (1 pixel par pixel CSS), le fût d'un « i » ou d'un
   « l » en Archivo 400 tombe à cheval sur deux pixels : #3F4750 en 13 px
   donnait 3,0:1 sur ces lettres, alors que la couleur « fait » 7,96:1.
   Mesuré sur l'ivoire et le coin froid (banc du formulaire, « contraste ») :
   tient — 14 px graisse 500 en #353C45 (4,85 au pire), 14 px graisse 600
   pour l'erreur, 13 px graisse 600 pour les dates. Ne pas redescendre.
   ========================================================================= */

/* la section est un diptyque (titre | suite) : le formulaire prend toute la
   largeur, sous les deux */
#formulaire-entretien{grid-column:1 / -1;min-width:0;}
/* LE FORMULAIRE EST LÀ DÈS L'ARRIVÉE (15/10, vu sur iPhone). main.js fait
   arriver en fondu tout enfant de `.dans` : arrivé par « Entretien », le
   formulaire restait à opacité 0 sous « Écrire à la maison » une à deux
   secondes. La cible d'un appel à l'action ne se fait pas attendre — même
   règle que `.prix .prix-pied.rev` dans studio.css. */
#formulaire-entretien.rev{opacity:1;transform:none;}

.rdv{
  --rdv-encre:var(--bleu,#163455);
  --rdv-texte:var(--encre,#101418);
  --rdv-doux:#353C45;
  --rdv-filet:#6B7480;
  --rdv-filet-leger:rgba(22,52,85,.16);
  --rdv-erreur:#8A2618;
  --rdv-choix-fond:var(--bleu,#163455);
  --rdv-choix-texte:#F3F5F8;
  --rdv-fond:var(--ivoire,#E9ECF1);
  --rdv-focus:var(--bronze,#7E6027);
  --rdv-col:clamp(10rem,19vw,16rem);   /* la marge des titres de rang */
  position:relative;
  /* l'écart de la grille de la section (`.contact .dans`) s'ajoute déjà ici */
  margin-top:clamp(.5rem,2vh,1.5rem);
  padding-top:clamp(2rem,5vh,3rem);
  border-top:1px solid var(--rdv-filet-leger);
  color:var(--rdv-texte);
  font-size:1rem;line-height:1.5;
}
/* si la section passe un jour sur la nuit : encre ivoire, focus or */
.nuit .rdv,.abysse .rdv,.invitation .rdv{
  --rdv-encre:var(--ivoire-titre,#F2F4F7);
  --rdv-texte:var(--ivoire-texte,#E4E6EA);
  --rdv-doux:#B6B9BE;
  --rdv-filet:#8A919B;
  --rdv-filet-leger:rgba(217,196,161,.16);
  --rdv-erreur:#F2A493;
  --rdv-choix-fond:var(--ivoire-titre,#F2F4F7);
  --rdv-choix-texte:#0A0B0D;
  --rdv-fond:#0A0B0D;
  --rdv-focus:var(--or,#C4A15A);
}
.rdv [hidden]{display:none !important;}
.rdv :focus-visible{outline:2px solid var(--rdv-focus);outline-offset:3px;}

/* l'annonce « Envoi en cours… » ne se lit qu'au lecteur d'écran */
.rdv-annonce{
  position:absolute !important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;
}

/* ------------------------------------------ la tête */
.rdv-tete{
  display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;
  gap:.4rem 2rem;margin:0 0 clamp(1.6rem,4vh,2.6rem);
}
.rdv h3{
  font-family:var(--display);font-weight:500;font-size:clamp(1.75rem,2.7vw,2.3rem);
  line-height:1.08;letter-spacing:-.006em;color:var(--rdv-encre);margin:0;
}
.rdv-regle{margin:0;font-size:.875rem;font-weight:500;color:var(--rdv-doux);}

/* ------------------------------------------ les rangs : titre en marge */
.rdv-rang{border:0;margin:0;padding:0;min-width:0;display:flow-root;}
.rdv-rang + .rdv-rang{margin-top:clamp(1.7rem,3.8vh,2.5rem);}
.rdv-marge{
  float:left;width:var(--rdv-col);margin:0;padding:.3rem 1.5rem 0 0;
  font-family:var(--display);font-style:italic;font-weight:500;
  font-size:clamp(1.3rem,1.7vw,1.5rem);line-height:1.15;color:var(--rdv-encre);
}
.rdv-marge .rdv-fac{display:block;margin-top:.25rem;font-family:var(--texte);font-style:normal;}
.rdv-corps{margin-left:var(--rdv-col);}
.rdv-fac{font-size:.875rem;font-weight:500;color:var(--rdv-doux);}
.rdv-aide{margin:.45rem 0 0;font-size:.875rem;font-weight:500;line-height:1.45;color:var(--rdv-doux);}
.rdv-corps > .rdv-aide:first-child{margin:0;}

/* ------------------------------------------ vous : quatre champs à filet
   Les survols sont rangés sous @media (hover:hover), comme dans studio.css :
   au doigt, Safari les laisse collés après un toucher (un « Autre » souligné
   sans être choisi, vu sur iPhone le 15/10). */
.rdv-identite{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.15rem clamp(1.5rem,3.2vw,3.2rem);}
.rdv-champ{margin:0;display:flex;flex-direction:column;min-width:0;}
.rdv-champ label{font-size:.875rem;font-weight:500;line-height:1.3;color:var(--rdv-doux);}
.rdv input[type="text"],.rdv input[type="email"],.rdv input[type="tel"],.rdv textarea{
  display:block;width:100%;margin:.2rem 0 0;padding:.45rem 0 .5rem;min-height:44px;
  font-family:var(--texte);font-size:1.0625rem;line-height:1.4;color:var(--rdv-texte);
  background:transparent;border:0;border-bottom:1px solid var(--rdv-filet);border-radius:0;
  box-shadow:none;-webkit-appearance:none;appearance:none;
}
.rdv input[type="text"]:focus,.rdv input[type="email"]:focus,.rdv input[type="tel"]:focus,.rdv textarea:focus{
  border-bottom-color:var(--rdv-encre);
}
@media (hover:hover){
  .rdv input[type="text"]:hover,.rdv input[type="email"]:hover,.rdv input[type="tel"]:hover,.rdv textarea:hover{
    border-bottom-color:var(--rdv-encre);
  }
}
/* le remplissage automatique ne repeint pas le champ en jaune ou en bleu */
.rdv input:-webkit-autofill{
  -webkit-box-shadow:0 0 0 100px var(--rdv-fond) inset;box-shadow:0 0 0 100px var(--rdv-fond) inset;
  -webkit-text-fill-color:var(--rdv-texte);
}
.rdv [aria-invalid="true"]:not([type="radio"]):not([type="checkbox"]){border-bottom:2px solid var(--rdv-erreur);}

/* le message s'écrit sur une feuille réglée : une ligne par ligne de texte */
.rdv textarea{
  --ligne:1.75rem;
  min-height:calc(var(--ligne) * 5 + .55rem);padding:0 0 .55rem;line-height:var(--ligne);resize:vertical;
  background-image:repeating-linear-gradient(180deg,transparent 0,transparent calc(var(--ligne) - 1px),var(--rdv-filet-leger) calc(var(--ligne) - 1px),var(--rdv-filet-leger) var(--ligne));
  background-attachment:local;
}

/* ------------------------------------------ les choix (sujet, échange) */
.rdv-liste{display:flex;flex-wrap:wrap;gap:0 2.2rem;margin-top:-.35rem;}
.rdv-choix{
  position:relative;display:inline-flex;align-items:center;gap:.7rem;min-height:44px;
  font-size:1rem;line-height:1.3;color:var(--rdv-texte);cursor:pointer;
}
.rdv-choix input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;}
.rdv-rond{
  flex:none;width:18px;height:18px;border:1.5px solid var(--rdv-encre);border-radius:50%;
  display:grid;place-items:center;
}
.rdv-rond::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--rdv-encre);transform:scale(0);}
.rdv-choix input:checked + .rdv-rond::after{transform:scale(1);}
.rdv-choix input:checked ~ .rdv-lib{font-weight:600;color:var(--rdv-encre);}
@media (hover:hover){
  .rdv-choix:hover .rdv-lib{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em;}
}
.rdv-choix input:focus-visible + .rdv-rond{outline:2px solid var(--rdv-focus);outline-offset:3px;}

/* ------------------------------------------ les créneaux : un tableau de service
   Sans JavaScript : cinq colonnes, les jours de la semaine. Avec : les dix
   prochains jours ouvrés — dix colonnes sur un grand écran, deux semaines de
   cinq sur un écran moyen, une ligne par jour sur téléphone. Le lundi qui
   ouvre une semaine porte un filet : on lit les semaines d'un coup d'œil. */
.rdv-grille{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.4rem;margin-top:.95rem;}
.rdv-jour{display:grid;gap:.4rem;align-content:start;min-width:0;}
.rdv-date{margin:0 0 .15rem;font-size:.8125rem;font-weight:600;line-height:1.2;letter-spacing:.02em;color:var(--rdv-doux);}
/* « ven. 16 oct. » : le chiffre en bloc, donc trois lignes sur grand écran
   (jour, chiffre, mois) et une seule sur téléphone.
   Le chiffre est en ARCHIVO, pas en Cormorant (15/10) : les chiffres du
   Cormorant sont elzéviriens et, en petit, « 16 » se lisait « I6 », « 21 »
   « 2I ». Sa version de la maison n'a pas de chiffres alignés (pas de `lnum`
   dans le sous-ensemble) : `lining-nums` n'y changerait rien. Chasse fixe
   (`tnum`, présent) : les chiffres des colonnes s'alignent. */
.rdv-date b{
  display:block;margin:.1rem 0 .15rem;font-family:var(--texte);font-weight:500;
  font-size:1.3rem;line-height:1;letter-spacing:0;color:var(--rdv-encre);
  font-variant-numeric:tabular-nums;
}
.rdv-case{position:relative;display:block;}
.rdv-case input{position:absolute;inset:0;z-index:1;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;}
.rdv-case > span{
  position:relative;display:flex;align-items:center;justify-content:center;min-height:44px;
  padding:.3rem .2rem;border:1px solid var(--rdv-filet);
  font-size:.8125rem;line-height:1.15;text-align:center;white-space:nowrap;color:var(--rdv-texte);
}
@media (hover:hover){ .rdv-case:hover > span{border-color:var(--rdv-encre);} }
.rdv-case input:checked + span{
  background:var(--rdv-choix-fond);border-color:var(--rdv-choix-fond);color:var(--rdv-choix-texte);font-weight:600;
}
/* le point de la maison, dans le coin du créneau choisi */
.rdv-case input:checked + span::before{
  content:"";position:absolute;top:5px;left:5px;width:6px;height:6px;border-radius:50%;background:var(--or,#C4A15A);
}
.rdv-case input:focus-visible + span{outline:2px solid var(--rdv-focus);outline-offset:2px;z-index:2;}
.rdv-compte{margin:.7rem 0 0;font-size:.875rem;font-weight:500;color:var(--rdv-doux);min-height:1.3em;}
.rdv-compte.rdv-plein{color:var(--rdv-encre);font-weight:600;}

/* dix colonnes seulement là où « après-midi » tient dans sa case (≥ 1200 px) */
@media (min-width:1200px){
  .rdv-grille[data-jours="10"]{grid-template-columns:repeat(10,minmax(0,1fr));}
  .rdv-grille[data-jours="10"] .rdv-semaine{padding-left:.45rem;border-left:1px solid var(--rdv-filet-leger);}
}

/* ------------------------------------------ erreurs */
.rdv-erreur{display:block;margin-top:.4rem;font-size:.875rem;line-height:1.4;font-weight:600;color:var(--rdv-erreur);}
.rdv-resume{
  margin:0 0 clamp(1.6rem,4vh,2.4rem);padding:.15rem 0 .15rem 1.1rem;
  border-left:2px solid var(--rdv-erreur);color:var(--rdv-erreur);max-width:60rem;
}
.rdv-resume p{margin:0 0 .35rem;font-weight:600;}
.rdv-resume ul{margin:0;padding:0;list-style:none;}
.rdv-resume li{margin:.2rem 0;font-size:.9375rem;font-weight:500;line-height:1.45;}
.rdv-resume a{color:var(--rdv-erreur);text-underline-offset:.2em;}

/* ------------------------------------------ l'envoi
   Sa propre marge haute : le champ piège, glissé entre le message et ce
   rang, casse `.rdv-rang + .rdv-rang` (l'information RGPD collait à l'aide
   du message, vu sur la capture du 15/10). */
.rdv-pied{margin-top:clamp(2.4rem,5.5vh,3.4rem);}
.rdv-envoi{display:flex;align-items:flex-end;justify-content:space-between;gap:1.2rem 3rem;}
.rdv-rgpd{margin:0;max-width:64ch;font-size:.875rem;font-weight:500;line-height:1.55;color:var(--rdv-doux);}
.rdv-rgpd a,.rdv-repli a,.rdv-etat a{color:var(--rdv-encre);text-underline-offset:.2em;}
/* le bouton garde le dessin des appels du site (libellé + filet d'or), en
   plus grand : c'est le geste qui compte dans cette section */
.rdv .rdv-bouton{
  flex:none;margin:0;padding:.55rem 0;background:none;border:0;border-radius:0;cursor:pointer;
  font-family:var(--mono);font-size:.8125rem;font-weight:600;letter-spacing:.18em;line-height:1.2;
  text-transform:uppercase;color:var(--rdv-encre);
}
.rdv .rdv-bouton::after{width:48px;}
.rdv .rdv-bouton:focus-visible::after{width:76px;}
@media (hover:hover){ .rdv .rdv-bouton:hover::after{width:76px;} }
.rdv .rdv-bouton[aria-disabled="true"]{cursor:progress;}
.rdv .rdv-bouton[aria-disabled="true"]::after{width:76px;}

.rdv-etat{margin-top:1.4rem;padding:.15rem 0 .15rem 1.1rem;border-left:2px solid var(--rdv-erreur);max-width:64ch;}
.rdv-etat p{margin:0 0 .5rem;font-size:.9375rem;font-weight:500;line-height:1.55;}
.rdv-etat p:first-child{font-weight:600;color:var(--rdv-erreur);}
.rdv-etat p:last-child{margin-bottom:0;}

/* ------------------------------------------ envoyé */
.rdv-fin{padding:clamp(.5rem,2vh,1.5rem) 0 0;margin-left:var(--rdv-col);max-width:60ch;}
.rdv-fin:focus{outline:none;}
.rdv-fin-titre{
  margin:0 0 .5rem;font-family:var(--display);font-weight:500;
  font-size:clamp(2.1rem,3.6vw,3rem);line-height:1.04;color:var(--rdv-encre);
}
.rdv-fin p{margin:0 0 .6rem;}
.rdv-fin-rappel{font-size:.9375rem;font-weight:500;color:var(--rdv-doux);}

/* ------------------------------------------ écrans moyens et téléphone */
@media (max-width:1199px){
  .rdv-grille[data-jours="10"]{grid-template-columns:repeat(5,minmax(0,1fr));row-gap:1.1rem;}
}
@media (max-width:720px){
  .rdv{--rdv-col:0px;}
  .rdv-marge{float:none;display:block;width:auto;padding:0;margin:0 0 .55rem;}
  .rdv-marge .rdv-fac{display:inline;margin:0 0 0 .3rem;}
  .rdv-identite{grid-template-columns:minmax(0,1fr);}
  .rdv-liste{flex-direction:column;gap:0;margin-top:-.2rem;}
  /* une ligne par jour : la date, puis matin | après-midi */
  .rdv-grille,.rdv-grille[data-jours="10"]{grid-template-columns:minmax(0,1fr);gap:.4rem;row-gap:.4rem;}
  .rdv-jour{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr) minmax(0,1.15fr);align-items:center;}
  .rdv-grille .rdv-semaine{margin-top:.35rem;padding-top:.55rem;border-top:1px solid var(--rdv-filet-leger);}
  .rdv-date{margin:0;}
  .rdv-date b{display:inline;font-size:1.125rem;margin:0 .1rem;}
  .rdv-envoi{flex-direction:column;align-items:flex-start;}
  .rdv-fin{margin-left:0;}
}

/* ------------------------------------------ préférences d'affichage */
@media (prefers-reduced-motion:reduce){
  .rdv .rdv-bouton::after{transition:none;}
}
@media (forced-colors:active){
  .rdv-case input:checked + span{outline:3px solid Highlight;outline-offset:-4px;}
  .rdv-rond,.rdv-case > span,.rdv input,.rdv textarea{border-color:CanvasText;}
  .rdv-rond::after{background:CanvasText;}
}
