/* Demande d'accompagnement (src/modules/accompagnement.ts) : formulaire /accompagnement, encart de la page
   d'inscription et lien du pied de la connexion. Chargée après connexion.css, dont elle reprend les jetons (couleurs
   de la charte, rayon des champs). Thème clair uniquement, aucun vert. */

/* ---------- Encart de l'inscription : l'autre choix, juste sous « Créer mon compte » ---------- */
.accor { display: flex; align-items: center; gap: 14px; margin: 2px 0 -2px; color: var(--faint); font-size: .92rem; text-transform: uppercase; letter-spacing: .08em; }
.accor::before, .accor::after { content: ""; flex: 1; height: 1px; background: var(--color-border); }
.accpromo {
  position: relative; padding: 20px 22px; border-radius: var(--auth-radius);
  background: var(--color-secondary); border: 1px solid var(--color-secondary-2);
}
.accpromo p { margin: 0; }
.accpromo__title { font-weight: 700; font-size: 1.08rem; color: var(--ink); }
.accpromo__text { margin-top: 6px !important; color: var(--soft); line-height: 1.5; }
.accpromo__btn {
  display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 52px; margin-top: 14px;
  padding: 0 20px; border-radius: var(--auth-radius); background: #fff; border: 1.5px solid var(--ember-d);
  color: var(--ember-d); font-weight: 700; font-size: 1.02rem; text-decoration: none;
  transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}
.accpromo__btn svg { transition: transform .18s ease; }
.accpromo__btn:hover { background: var(--cream); box-shadow: 0 8px 18px -14px rgba(154, 58, 24, .9); text-decoration: none; }
.accpromo__btn:hover svg { transform: translateX(4px); }
.accpromo__btn:focus-visible { outline: 3px solid var(--ink); outline-offset: 3px; }
.accpromo__free { margin-top: 10px !important; text-align: center; font-size: .9rem; color: var(--soft); }

/* ---------- Pied de la connexion : second lien sur sa propre ligne ---------- */
.authsplit__foot-alt { display: block; margin-top: 10px; }

/* ---------- Formulaire /accompagnement ---------- */
/* Formulaire long : le panneau illustré reste en haut, à côté des premiers champs, au lieu d'être centré sur la hauteur. */
.authsplit:has(.accform) { align-items: start; }
.authsplit:has(.accform) .authpanel { position: sticky; top: 24px; }

.accgroup { margin: 0; padding: 16px 18px 18px; border: 1px solid var(--color-border); border-radius: var(--auth-radius); background: var(--color-surface); min-width: 0; }
.accgroup__legend { padding: 0 6px; margin-left: -6px; font-weight: 700; font-size: 1rem; color: var(--ink); }
.accgroup__hint { margin: 0 0 12px; font-size: .92rem; color: var(--faint); line-height: 1.45; }
.accgroup--error { border-color: var(--err); }
.accgroup .authfield__error { margin: 10px 2px 0; }
/* Sous-groupes des disponibilités : sans cadre, légende plus discrète. */
.accgroup--nested { padding: 0; border: 0; background: transparent; }
.accgroup--nested + .accgroup--nested { margin-top: 14px; }
.accgroup--nested .accgroup__legend { padding: 0; margin: 0 0 8px; font-weight: 600; font-size: .92rem; color: var(--soft); }
.accgroup__note { margin-top: 16px; }
.accgroup__note .authfield__box { height: 56px; }

/* Choix en pastilles : vrais boutons radio et cases à cocher, masqués visuellement, cible de 44 px au moins. */
.accchips { display: flex; flex-wrap: wrap; gap: 8px; }
.accchip { position: relative; display: inline-flex; cursor: pointer; }
.accchip__input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.accchip__box {
  display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border-radius: 999px;
  border: 1.5px solid #c9bca4; background: #fff; color: var(--ink); font-weight: 600; font-size: .98rem; line-height: 1.2;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.accchip:hover .accchip__box { border-color: var(--ink); }
.accchip__input:checked + .accchip__box { background: var(--ink); border-color: var(--ink); color: #fff; }
.accchip__input[type="checkbox"]:checked + .accchip__box::before {
  content: ""; width: 10px; height: 6px; margin-right: 8px; border: 0 solid #fff; border-width: 0 0 2px 2px; transform: rotate(-45deg) translateY(-2px);
}
.accchip__input:focus-visible + .accchip__box { outline: 3px solid var(--ember-d); outline-offset: 2px; }
.accgroup--error .accchip__box { border-color: var(--err); }

/* Zone de message : même boîte que les champs, sur plusieurs lignes. */
.accarea__box { height: auto; align-items: flex-start; padding-block: 16px; }
.accarea { height: auto; min-height: 96px; resize: vertical; line-height: 1.5; }

/* Mention d'information (article 13 du RGPD) : lisible, sous la note du devis. */
.accinfo { margin: 0; padding: 14px 16px; border-radius: var(--auth-radius); background: var(--cream); border: 1px solid var(--color-border); color: var(--soft); font-size: .88rem; line-height: 1.55; }
.accinfo a { color: var(--ember-d); font-weight: 600; }

@media (max-width: 480px) {
  .accgroup { padding: 14px 14px 16px; }
  .accpromo { padding: 18px 16px; }
  .accchip__box { padding: 0 14px; }
}