/* ============================================================================
   L'Espace Vénus (`member-space`) — la feuille du module, à côté de `member-space.js`.
   Ce que seul ce module emploie ; ce qui sert à plusieurs pages reste dans
   `site.css`. Chargée par le site public après `site.css`, dans l'ordre des
   modules (`tests/admin/shell.spec.js`) : découpée de `site.css` au lot 6 sans
   changer l'ordre de la cascade, éprouvée contre l'ancienne feuille unique
   (`tools/comparer-styles.mjs`).
   ============================================================================ */
.auth-duo{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
@media(max-width:520px){ .auth-duo{grid-template-columns:minmax(0,1fr)} }

/* L'identification : la fenêtre « Mon espace » et le tunnel de réservation
   montent le même composant. Mot de passe d'abord (15 octobre 2026, demande de
   Delphine), le code par e-mail en secours — d'où les onglets connexion /
   création, revenus. */
.ident-intro{font-size:13px;color:var(--encre-60);margin-bottom:16px;line-height:1.55}
.ident-note{margin:10px 0 0;font-size:12px;text-align:center}
.ident-msg{font-size:12.5px;color:var(--terracotta-2);margin:-4px 0 12px}
.ident-liens{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;margin-top:14px}
.ident-liens-droite{justify-content:flex-end;margin:-6px 0 14px}
/* L'aide sous un champ — le prénom d'un enfant, pour un cours qui lui est destiné. */
.esp-pour{font-weight:400;opacity:.8;white-space:nowrap}
/* Le choix « avoir » ou « remboursement » (lot G) : un groupe de boutons
   radio, son titre écrit comme celui d'un champ. */
.esp-choix{border:0;padding:0;margin-left:0;margin-right:0;min-width:0;display:grid;gap:8px}
.esp-choix legend{padding:0;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;font-weight:600;margin-bottom:6px;color:var(--encre-60)}
.ident-onglets{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));background:var(--creme-2);border-radius:999px;padding:4px;margin-bottom:18px}
.ident-onglets button{min-height:42px;border:0;border-radius:999px;background:transparent;color:var(--encre-60);font:500 13px var(--font-sans);cursor:pointer}
.ident-onglets button[aria-selected="true"]{background:var(--blanc);color:var(--encre);font-weight:600;box-shadow:0 1px 3px rgba(104,76,74,.18)}

/* ================= MON ESPACE VÉNUS =================
   Une page, plus un tiroir (Delphine, 15 octobre 2026) — d'après la maquette
   validée, puis avec un MENU comme /admin et /pro : une colonne à gauche sur
   ordinateur, des onglets qui défilent sur téléphone. Ce qui demande d'agir
   aujourd'hui en haut : une place proposée, la prochaine séance, les soldes à
   côté ; le reste un geste plus loin.
   ⚠️ Propriétés longues, jamais le raccourci `font:` — il remettrait les
   chiffres en elzévirien (voir les chiffres alignés). */
.esp-page{padding-block:36px 72px}
@media (max-width:899px){ .esp-page{padding-top:10px} }
.esp-tete{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:6px}
.esp-date{font-size:12.5px;color:var(--encre-60);margin-bottom:4px}
.esp-titre{font-family:var(--font-serif);font-weight:500;font-size:clamp(38px,5vw,52px);line-height:1.02;color:var(--brun)}
.esp-titre-l{font-family:var(--font-serif);font-weight:500;font-size:30px;line-height:1.1}
.esp-titre-m{font-family:var(--font-serif);font-weight:500;font-size:25px;line-height:1.15;color:var(--encre)}
.esp-surtitre{font-size:10.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--terracotta-2)}
.esp-petit{font-size:12.5px;line-height:1.45;color:var(--encre-60)}
.esp-gras{font-weight:600}
.esp-rang{display:flex;flex-wrap:wrap;gap:8px}
.esp-rang > *{flex:1 1 auto}
.esp-titre-rang{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px}

/* Le menu et le contenu. ⚠️ Pas le shell plein écran de /admin : la page reste
   une page du site, le menu suit le défilement (`sticky`) au lieu d'être fixé à
   la fenêtre, et il se colle sous l'en-tête par le MÊME décalage que la barre
   d'ancres — un second nombre pour la même hauteur finirait par dériver. */
.esp-cadre{display:flex;flex-direction:column;gap:22px}
.esp-contenu{display:flex;flex-direction:column;gap:22px;min-width:0}
.esp-menu{position:sticky;top:calc(var(--h-entete) + var(--h-mode-test));z-index:41;
  margin-inline:calc(-1 * var(--gout));padding:8px var(--gout);background:var(--creme);border-bottom:1px solid var(--creme-2)}
.esp-menu-qui{display:none}
.esp-menu ul{list-style:none;margin:0;padding:0;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;overscroll-behavior-x:contain}
.esp-menu ul::-webkit-scrollbar{display:none}
.esp-menu li{flex:none}
.esp-menu button{min-height:40px;padding:0 14px;border:0;border-radius:999px;background:none;color:var(--encre-60);
  font-family:inherit;font-size:13px;font-weight:600;white-space:nowrap;cursor:pointer}
.esp-menu button:hover{color:var(--encre)}
.esp-menu button[aria-current="page"]{background:var(--brun);color:var(--creme)}
.esp-menu-sortir button{color:var(--brique)}
@media (min-width:900px){
  .esp-cadre{display:grid;grid-template-columns:264px minmax(0,1fr);gap:32px;align-items:start}
  .esp-menu{top:calc(var(--h-entete) + var(--h-mode-test) + 24px);margin:0;padding:0;background:none;border:0}
  .esp-menu-qui{display:block;font-family:var(--font-serif);font-size:26px;line-height:1.1;color:var(--brun);margin:0 0 14px 14px}
  .esp-menu-qui span{display:block;font-family:var(--font-sans);font-size:10.5px;font-weight:600;letter-spacing:.16em;
    text-transform:uppercase;color:var(--terracotta-2);margin-top:4px}
  .esp-menu ul{flex-direction:column;gap:2px;overflow:visible}
  /* ⚠️ « Cartes cadeaux & commandes » débordait de sa colonne une fois actif,
     en graisse 600 (Christophe, 15 octobre 2026) : 219 px de texte pour 212 de
     bouton. La colonne fait 264 px — marge pour les polices plus larges de
     Linux —, et le libellé PASSE À LA LIGNE plutôt que d'être rogné si un
     intitulé plus long arrive un jour. Le `nowrap` ne vaut que pour les onglets
     du téléphone, qui défilent. */
  .esp-menu button{width:100%;text-align:left;border-radius:12px;padding:10px 14px;min-height:42px;font-size:14px;font-weight:500;
    white-space:normal;line-height:1.3}
  .esp-menu button[aria-current="page"]{font-weight:600}
  .esp-menu-sortir{margin-top:12px;padding-top:12px;border-top:1px solid var(--creme-2)}
}
/* La prochaine séance en pleine largeur, ses formules dessous, côte à côte, puis
   l'invitation aux cours découverte (23 octobre 2026, Christophe) : en deux
   colonnes, les tuiles empilées à droite laissaient un vide sous la séance. */
.esp-une{display:flex;flex-direction:column;gap:16px}
/* Les deux prochaines séances côte à côte (23 octobre 2026), s'il y a la
   place : à côté du menu, sous 1 100 px, une carte n'aurait plus que 300 px. */
.esp-prochaines{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
@media (min-width:1100px){ .esp-prochaines[data-n="2"]{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* La prochaine séance : la seule carte pleine de l'écran. Crème sur brun 6,8:1. */
.esp-prochaine{background:var(--brun);color:var(--creme);border-radius:22px;padding:22px 24px;display:flex;flex-direction:column;gap:14px}
.esp-prochaine .esp-titre-l{color:var(--creme)}
.esp-prochaine .esp-surtitre{color:#E8CDBF}
.esp-prochaine-texte{display:flex;flex-direction:column;gap:4px;font-size:15px}
.esp-clair{color:#E8DED3}
.esp-prochaine .esp-petit{color:#E8DED3;margin-top:8px}
.esp-actions:not([hidden]){display:flex;flex-direction:column}
.esp-btn-creme,.esp-btn-trait-clair{min-height:44px;padding:0 18px;border-radius:999px;font-size:12px;font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;cursor:pointer}
.esp-btn-creme{border:0;background:var(--creme);color:var(--brun)}
.esp-btn-creme:hover{background:var(--blanc)}
.esp-btn-trait-clair{border:1px solid #E8DED3;background:transparent;color:var(--creme)}
.esp-btn-trait-clair:hover{background:rgba(247,239,230,.12)}
.esp-confirmer[hidden]{display:none}
/* ⚠️ `display:flex` l'emporterait sur l'attribut `hidden` : la confirmation
   s'affichait d'emblée. Même piège que le formulaire de connexion de /pro. */
.esp-confirmer{border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:10px;font-size:13px;background:var(--accent-soft)}

.esp-soldes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:12px}
.esp-tuile{background:var(--blanc);border:1px solid rgba(34,34,33,.06);border-radius:18px;padding:16px 18px;display:flex;flex-direction:column;gap:6px}
/* Les cours découverte : un bandeau, la phrase et son bouton sur une ligne
   quand elle tient, le bouton dessous sinon. */
.esp-offert{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 18px;
  background:var(--sauge-clair);border-radius:18px;padding:14px 18px;font-size:14px}
.esp-offert p{flex:1 1 260px;margin:0}
.esp-chiffre{font-family:var(--font-serif);font-size:40px;line-height:1;color:var(--encre)}
.esp-chiffre small{font-family:var(--font-sans);font-size:13px;color:var(--encre-60)}
.esp-lien{align-self:flex-start;margin-top:4px;font-size:13px;font-weight:600}

.esp-place{background:var(--blanc);border:1.5px solid var(--terracotta);border-radius:18px;padding:16px 18px;display:flex;flex-direction:column;gap:12px}
.esp-place-ligne{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px}

.esp-bloc{display:flex;flex-direction:column;gap:12px}
.esp-parcours{padding:14px 16px;border-radius:12px;background:var(--creme,#FBF6EF);margin-bottom:12px}
/* Deux jours par rangée au plus : à trois, « Yin Yoga & Voyage sonore » tenait
   sur trois lignes à côté de son bouton. */
.esp-semaine{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.esp-jour{background:var(--blanc);border-radius:18px;padding:14px 16px 6px;display:flex;flex-direction:column;gap:6px}
.esp-creneau{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px solid var(--creme-2)}
.esp-creneau-texte{flex:1;min-width:0}
.esp-pastille{width:10px;height:10px;border-radius:50%;flex:none;background:var(--sauge)}
.esp-btn-sable{min-height:40px;padding:0 14px;border-radius:999px;border:0;background:var(--creme-2);color:var(--brun);
  font-size:12px;font-weight:600;flex:none;white-space:nowrap;cursor:pointer}
.esp-btn-sable:hover{background:var(--peche)}
.esp-etiquette{font-size:11px;font-weight:600;border-radius:999px;padding:5px 10px;white-space:nowrap;background:var(--sauge-clair);color:var(--encre)}

.esp-liste{background:var(--blanc);border-radius:18px;padding:4px 16px;display:flex;flex-direction:column}
.esp-ligne{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 12px;padding:12px 0;border-bottom:1px solid var(--creme-2);font-size:14px}
.esp-liste > .esp-ligne:last-child,.esp-ligne-bloc:last-child .esp-ligne{border-bottom:0}
.esp-ligne-fin{display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:6px}
.esp-ligne-bloc .esp-confirmer{margin-bottom:12px}

.esp-porte{max-width:440px;margin:24px auto;text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px}
.esp-porte p{color:var(--encre-60)}
.esp-contenu > .esp-titre{outline:none}
.esp-tete .esp-titre{outline:none}
.esp-ligne-quoi{display:flex;align-items:center;gap:10px;min-width:0}
.esp-etiquette-attente{background:var(--accent-soft)}
.esp-bascules{display:flex;gap:4px;padding:4px;border-radius:999px;background:var(--creme-2)}
.esp-bascule{min-height:36px;padding:0 16px;border:0;border-radius:999px;background:none;color:var(--encre-60);
  font-family:inherit;font-size:13px;font-weight:600;cursor:pointer}
.esp-bascule[aria-pressed="true"]{background:var(--blanc);color:var(--encre);box-shadow:0 1px 3px rgba(104,76,74,.18)}
.esp-vide{background:var(--blanc);border-radius:18px;padding:24px;display:flex;flex-direction:column;align-items:flex-start;gap:12px}

/* Sortis de `site.css` (lot 8) : ils n'habillent que l'Espace Vénus. Plus
   spécifiques que les règles qu'ils précisent, leur rang ne change rien. */
/* Sur téléphone, la barre collante « Réserver un cours » dit déjà la même chose. */
@media (max-width:899px){ .esp-tete .btn{display:none} }
.esp-titre-rang a,.esp-titre-rang .lien-sobre{font-size:13px;font-weight:600}
.esp-confirmer.clair{background:rgba(247,239,230,.12)}
.esp-contenu > .card{margin-bottom:0;max-width:760px}

/* La porte affichée avant les scripts (`index.html`, `core/router-early.js`) :
   une session déjà ouverte dans ce navigateur montre « Ouverture… » à sa place,
   pour qu'une cliente connectée ne voie jamais « Se connecter » passer. */
.esp-ouverture{display:none;margin:48px auto;text-align:center;color:var(--encre-60)}
#memberBody[data-attente] .esp-ouverture{display:block}
#memberBody[data-attente] .esp-porte{display:none}

/* « Mes informations » (23 octobre 2026) : une carte par sujet, son titre et
   son bouton sur la même ligne ; un formulaire s'ouvre dans sa carte. */
.esp-infos{display:flex;flex-direction:column;gap:8px}
.esp-infos-tete{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.esp-infos-tete h4{margin-bottom:0}
.esp-infos-tete .mini-btn{white-space:nowrap}
.esp-infos-form:not(:empty){margin-top:8px}

/* Mes enfants : les boutons gardent leur hauteur, même face à deux lignes de texte. */
.enfant-ligne{align-items:center}
.enfant-ligne > .u-d-flex{align-items:center;flex:none}