/* =====================================================================
   Espace membre
   =====================================================================
   Chargé uniquement sur /espace, après site.css dont il reprend les
   jetons (couleurs, polices, échelles). Le site vitrine n'a pas à
   porter le poids de ces règles, et l'espace n'a pas à hériter de son
   en-tête fixe ni de ses marges de section.
   ===================================================================== */

body.espace{
  background:var(--craie);
  color:var(--nuit);
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

/* --- En-tête ------------------------------------------------------- */
.espace-tete{
  background:var(--nuit);
  display:flex; align-items:center; justify-content:space-between;
  gap:18px; padding:14px clamp(16px, 4vw, 40px);
}
.espace-tete .marque{display:flex; align-items:center; gap:14px; text-decoration:none;}
.espace-tete .marque img{height:41px; width:auto; display:block;}
.espace-tete .marque span{
  color:var(--sur-nuit-fort); font-size:.68rem; font-weight:700;
  letter-spacing:.22em; text-transform:uppercase;
}
.espace-tete form{margin:0;}
.lien-sobre{
  background:none; border:none; cursor:pointer; font-family:inherit;
  color:var(--sur-nuit-faible); font-size:.68rem; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase; padding:10px 4px;
}
.lien-sobre:hover{color:#fff;}

/* --- Corps --------------------------------------------------------- */
.espace-corps{flex:1; display:flex; flex-direction:column; padding:clamp(32px, 6vw, 72px) 20px;}

/* La carte centrée des écrans d'accès : connexion, invitation, oubli. */
.carte-centree{
  width:100%; max-width:430px; margin:auto;
  background:#fff; border:1px solid var(--pierre); border-radius:4px;
  padding:clamp(26px, 5vw, 40px);
}
.carte-centree h1{font-size:clamp(1.5rem, 4vw, 1.9rem); margin:0 0 6px;}
.carte-centree .sous{color:var(--ardoise); font-size:.92rem; line-height:1.5; margin:0 0 22px;}
.carte-centree label{
  display:block; margin-bottom:6px; font-size:.68rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; color:var(--ardoise);
}
.carte-centree input{
  width:100%; box-sizing:border-box; margin-bottom:18px; padding:13px 14px;
  border:1px solid var(--pierre); border-radius:3px; font:inherit; font-size:1rem;
  background:var(--craie); color:var(--nuit);
}
.carte-centree input:focus{outline:2px solid var(--orange); outline-offset:1px; background:#fff;}
.carte-centree .btn{width:100%; justify-content:center; margin-top:4px;}
.carte-centree .apres{margin:20px 0 0; font-size:.86rem; text-align:center;}
.carte-centree .apres a{color:var(--ardoise);}
.carte-centree .apres a:hover{color:var(--orange);}

/* --- Avis ---------------------------------------------------------- */
.avis{
  margin:0 0 18px; padding:12px 14px; border-radius:3px; font-size:.9rem; line-height:1.5;
  background:var(--brume); border-left:3px solid var(--pierre);
}
.avis.vert{background:#EAF5EF; border-left-color:#2E7D52;}
.avis.rouge{background:#FBECE9; border-left-color:var(--orange);}

/* --- Les deux espaces, en haut du tableau de bord ------------------- */
/* Adèle accompagne en préparation mentale et en coaching avec le même
   compte. Ces deux cartes disent laquelle elle vient d'ouvrir — et que
   l'autre existe, même si elle n'est pas encore ouverte. */
.choix-espaces{
  display:grid; grid-template-columns:repeat(2, minmax(0,1fr));
  gap:16px; margin:14px 0 36px;
}
.espace-porte{
  background:#fff; border:1px solid var(--pierre); border-left:4px solid var(--pierre);
  border-radius:4px; padding:20px 22px;
}
.espace-porte.actif{border-left-color:var(--orange);}
.espace-porte.ferme{background:none; border-style:dashed; border-left-style:dashed;}
.espace-porte .tete{display:flex; align-items:center; justify-content:space-between; gap:12px;}
.espace-porte b{font-size:1.05rem;}
.espace-porte .detail{margin:8px 0 0; font-size:.88rem; color:var(--ardoise); line-height:1.5;}
.espace-porte .combien{
  margin:10px 0 0; font-size:.68rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; color:var(--ardoise);
}
.espace-porte.ferme b, .espace-porte.ferme .combien{color:var(--ardoise);}
@media (max-width:620px){
  .choix-espaces{grid-template-columns:1fr;}
}

/* --- Listes (tableau de bord) -------------------------------------- */
.espace-large{width:100%; max-width:1040px; margin:0 auto;}
.espace-large h1{font-size:clamp(1.7rem, 5vw, 2.4rem); margin:0 0 6px;}
.espace-large .sous{color:var(--ardoise); margin:0 0 32px;}
.espace-large .compte{
  font-size:.68rem; font-weight:700; letter-spacing:.16em;
  text-transform:uppercase; color:var(--ardoise); margin:0 0 12px;
}
.liste-dossiers{width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--pierre);}
.liste-dossiers th{
  text-align:left; padding:15px 20px; font-size:.68rem; font-weight:700;
  letter-spacing:.16em; text-transform:uppercase; color:var(--ardoise);
  border-bottom:1px solid var(--pierre);
}
.liste-dossiers td{padding:20px; border-bottom:1px solid var(--pierre); vertical-align:middle;}
/* Un nom coupé en deux se lit mal ; une formule longue, elle, peut
   passer à la ligne sans gêner personne. */
.liste-dossiers .col-athlete b{white-space:nowrap;}
/* Ces deux-là sont des conteneurs DANS la cellule, jamais la cellule
   elle-même : un <td> en display:flex sort du tableau, et la ligne de
   séparation ne traverse plus toute la largeur. */
.liste-dossiers .etiquette{white-space:normal;}
/* Deux pastilles de statut côte à côte, pas empilées sans air. */
.col-statut{display:flex; flex-wrap:wrap; align-items:center; gap:8px;}
.liste-dossiers tr:last-child td{border-bottom:none;}
.liste-dossiers small{color:var(--ardoise);}
.etat{
  display:inline-block; padding:6px 12px; border-radius:99px;
  font-size:.68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  background:var(--brume); color:var(--ardoise);
}
.etat.ok{background:#EAF5EF; color:#2E7D52;}
.etat.attente{background:#FDF3E7; color:#9A6212;}

/* Sur téléphone, un tableau à trois colonnes devient illisible : les
   lignes se déplient. */
@media (max-width:620px){
  .liste-dossiers, .liste-dossiers tbody, .liste-dossiers tr, .liste-dossiers td{display:block;}
  .liste-dossiers thead{display:none;}
  .liste-dossiers tr{border-bottom:1px solid var(--pierre); padding:6px 0;}
  .liste-dossiers tr:last-child{border-bottom:none;}
  .liste-dossiers td{border:none; padding:6px 16px;}
}

/* La ligne au-dessus du tableau : le compte à gauche, l'action à droite. */
.barre-actions{display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;}
.barre-actions .compte{margin:0;}
.liste-dossiers a{color:var(--nuit); text-decoration:none;}
.liste-dossiers a:hover b{color:var(--orange);}
.facultatif{font-weight:400; letter-spacing:0; text-transform:none;}

/* =====================================================================
   Tableau de bord et dossier (lot 2)
   ===================================================================== */

/* Un libellé nécessaire au lecteur d'écran, mais redondant à l'œil quand
   le champ porte déjà son intitulé en indication. Défini ici : la classe
   existait dans l'administration, pas dans le CSS du site. */
.hors-ecran{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}

/* --- Recherche et filtres ------------------------------------------ */
.recherche{display:flex; gap:8px; align-items:center; margin:0;}
.recherche input[type="search"]{
  width:min(280px, 60vw); padding:10px 12px; border:1px solid var(--pierre);
  border-radius:3px; font:inherit; font-size:.94rem; background:#fff;
}
.recherche input[type="search"]:focus{outline:2px solid var(--orange); outline-offset:1px;}
.puces{display:flex; flex-wrap:wrap; gap:10px; margin:22px 0 26px;}
.puce{
  display:inline-block; padding:9px 17px; border-radius:99px; text-decoration:none;
  border:1px solid var(--pierre); background:#fff; color:var(--ardoise);
  font-size:.74rem; font-weight:700; letter-spacing:.06em;
}
.puce:hover{border-color:var(--ardoise); color:var(--nuit);}
.puce.actif{background:var(--nuit); border-color:var(--nuit); color:#fff;}
.filtre-actif{font-size:.84rem; color:var(--ardoise); margin:0 0 16px;}
.filtre-actif a{color:var(--orange); margin-left:8px;}

/* --- Colonnes du tableau ------------------------------------------- */
.col-athlete{display:flex; align-items:center; gap:14px; line-height:1.45;}
.pastille{
  flex:none; width:42px; height:42px; border-radius:50%;
  display:grid; place-items:center; background:var(--brume); color:var(--nuit);
  font-size:.74rem; font-weight:800; letter-spacing:.04em;
}
.pastille.grande{width:56px; height:56px; font-size:1rem; background:var(--orange); color:#fff;}
.etiquette{
  display:inline-block; padding:7px 13px; border-radius:99px; background:var(--brume);
  font-size:.76rem; font-weight:700; line-height:1.4; color:var(--nuit); white-space:nowrap;
}
.etiquette.vide{background:none; border:1px dashed var(--pierre); color:var(--ardoise); font-weight:400;}
.col-action a{
  white-space:nowrap; font-size:.76rem; font-weight:700; letter-spacing:.1em;
  text-transform:uppercase; color:var(--nuit); text-decoration:none;
}
.col-action a:hover{color:var(--orange);}
a.etat{text-decoration:none;}
a.etat:hover{background:var(--nuit); color:#fff;}

/* --- En-tête du dossier -------------------------------------------- */
.retour{margin:0 0 18px; font-size:.84rem;}
.retour a{color:var(--ardoise); text-decoration:none;}
.retour a:hover{color:var(--orange);}
.dossier-tete{
  display:flex; align-items:center; gap:18px; flex-wrap:wrap;
  padding-bottom:22px; border-bottom:1px solid var(--pierre); margin-bottom:4px;
}
.dossier-tete .qui{flex:1; min-width:220px;}
.dossier-tete h1{font-size:clamp(1.4rem, 3.4vw, 1.8rem); margin:0 0 4px;}
.dossier-tete .sous{margin:0; font-size:.9rem;}
.formule-actuelle{text-align:right;}
.formule-actuelle b{display:block; margin-top:4px; color:var(--orange); font-size:1rem;}
.formule-actuelle b.vide{color:var(--ardoise); font-weight:400;}

/* --- Onglets -------------------------------------------------------- */
.onglets{
  display:flex; gap:30px; flex-wrap:wrap; margin:26px 0 0;
  border-bottom:1px solid var(--pierre);
}
.onglets a{
  padding:0 0 12px; text-decoration:none; color:var(--ardoise);
  font-size:.73rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase;
  border-bottom:2px solid transparent; margin-bottom:-1px;
}
.onglets a:hover{color:var(--nuit);}
.onglets a.actif{color:var(--nuit); border-bottom-color:var(--orange);}
.onglet-corps{padding-top:32px;}

/* --- Cartes et listes ----------------------------------------------- */
.grille-deux{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:22px; align-items:start;}
.carte{background:#fff; border:1px solid var(--pierre); border-radius:4px; padding:26px; margin-bottom:22px;}
.carte .vide{color:var(--ardoise); font-style:italic; margin:10px 0 0;}
.carte .note{color:var(--ardoise); font-size:.82rem; margin:14px 0 0; line-height:1.5;}
.liste-simple{list-style:none; margin:12px 0 0; padding:0;}
.liste-simple li{
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  padding:14px 0; border-bottom:1px solid var(--pierre);
}
.liste-simple li:last-child{border-bottom:none;}
.liste-simple small{color:var(--ardoise);}
.historique li{align-items:flex-start;}
.commentaire{padding:12px 0; border-bottom:1px solid var(--pierre);}
.commentaire:last-child{border-bottom:none;}
.commentaire .meta{font-size:.74rem; color:var(--ardoise); margin:0 0 6px;}
.commentaire p:last-child{margin:0; font-size:.92rem; line-height:1.55;}

/* --- Formulaires ---------------------------------------------------- */
.formulaire .champ{margin-bottom:16px;}
.formulaire.ligne{display:flex; gap:16px; align-items:flex-end; flex-wrap:wrap;}
.formulaire.ligne .champ{margin-bottom:0;}
.formulaire label{
  display:block; margin-bottom:6px; font-size:.66rem; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase; color:var(--ardoise);
}
.formulaire input, .formulaire textarea, .formulaire select{
  width:100%; box-sizing:border-box; padding:11px 12px; border:1px solid var(--pierre);
  border-radius:3px; font:inherit; font-size:.96rem; background:#fff; color:var(--nuit);
}
.formulaire textarea{resize:vertical; line-height:1.55;}
.formulaire input:focus, .formulaire textarea:focus, .formulaire select:focus{
  outline:2px solid var(--orange); outline-offset:1px;
}
.formulaire .pleine-largeur{grid-column:1 / -1;}
.formulaire .btn{margin-top:8px;}

@media (max-width:760px){
  .grille-deux{grid-template-columns:1fr;}
  .formule-actuelle{text-align:left; width:100%;}
  .onglets{gap:16px;}
  .col-athlete{align-items:flex-start;}
}

/* --- Fiches de bilan et comparaison (lot 4) ------------------------- */
.radar{max-width:420px; margin:14px auto 0;}
.radar svg{width:100%; height:auto; display:block;}
.comparaison{width:100%; border-collapse:collapse; margin-top:14px;}
.comparaison th{
  text-align:left; padding:10px 12px; font-size:.64rem; font-weight:700;
  letter-spacing:.14em; text-transform:uppercase; color:var(--ardoise);
  border-bottom:1px solid var(--pierre);
}
.comparaison td{padding:11px 12px; border-bottom:1px solid var(--pierre);}
.comparaison tr:last-child td{border-bottom:none;}
.comparaison .num{text-align:right; font-variant-numeric:tabular-nums; font-weight:700;}
.comparaison .hausse{color:#2E7D52;}
.comparaison .baisse{color:#B3261E;}
.actions-bilan{display:flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:flex-end;}
.en-ligne{display:inline; margin:0;}
.bilans li{gap:16px;}
@media (max-width:620px){
  .actions-bilan{justify-content:flex-start;}
  .bilans li{flex-direction:column; align-items:flex-start;}
}

/* --- Commentaires et consentements (lot 5) -------------------------- */
.bloc-commentaire{padding:16px 0;}
.bloc-commentaire .corps{margin:0 0 10px; font-size:.95rem; line-height:1.6;}
.bloc-commentaire .meta .etat{margin-left:8px;}
.actions-commentaire{display:flex; align-items:center; gap:14px; flex-wrap:wrap;}
.actions-commentaire form{margin:0;}
.modifier summary{
  cursor:pointer; font-size:.7rem; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:var(--ardoise);
}
.modifier summary:hover{color:var(--orange);}
.modifier textarea{margin-top:10px;}
.consentement{padding:18px 0; border-bottom:1px solid var(--pierre);}
.consentement:last-of-type{border-bottom:none;}
.consentement .meta{margin:0 0 8px; font-size:1rem;}
.consentement .trace{margin:0 0 4px; font-size:.86rem; color:var(--ardoise);}
.consentement .trace.faible{font-size:.8rem;}
.texte-consentement{margin:12px 0;}
.texte-consentement summary{
  cursor:pointer; font-size:.7rem; font-weight:700; letter-spacing:.12em;
  text-transform:uppercase; color:var(--ardoise);
}
.texte-consentement summary:hover{color:var(--orange);}
.texte-consentement .contenu{
  margin-top:12px; padding:16px; background:var(--craie); border-radius:3px;
  font-size:.88rem; line-height:1.6;
}
.texte-consentement .contenu p{margin:0 0 10px;}
.texte-consentement .contenu p:last-child{margin:0;}
.carte.accent{background:var(--nuit); color:var(--sur-nuit-fort); border-color:var(--nuit);}
.carte.accent .eyebrow{color:var(--ambre);}
.carte.accent p{color:var(--sur-nuit-fort);}
.carte.accent .note{color:var(--sur-nuit-faible);}
.carte.accent .btn{margin-top:14px; margin-right:8px;}
.formule-lecture{font-size:1.05rem; line-height:1.5;}

/* --- Droits sur les données (lot 6) --------------------------------- */
.carte.danger{border-color:#E2B4AE;}
.carte.danger .eyebrow{color:#B3261E;}
.carte.danger summary{
  cursor:pointer; margin-top:12px; font-size:.7rem; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase; color:#B3261E;
}
.btn.danger{background:#B3261E; border-color:#B3261E; color:#fff;}
.btn.danger:hover{background:#8F1E18; border-color:#8F1E18;}
.carte .list{width:100%; border-collapse:collapse; margin-top:12px;}
.carte .list th{
  text-align:left; padding:9px 0; font-size:.72rem; font-weight:600;
  color:var(--ardoise); border-bottom:1px solid var(--pierre); width:60%;
}
.carte .list td{padding:9px 0; border-bottom:1px solid var(--pierre); font-weight:700;}
.carte .list tr:last-child th, .carte .list tr:last-child td{border-bottom:none;}
.etapes{margin:16px 0; padding-left:22px; line-height:1.9;}
.etapes code.secret{
  display:inline-block; margin-top:8px; padding:10px 14px; background:var(--brume);
  border-radius:3px; font-size:1.05rem; letter-spacing:.14em; font-weight:700; color:var(--nuit);
  user-select:all;
}
.actions-tete{display:flex; align-items:center; gap:18px;}
.actions-tete a.lien-sobre{text-decoration:none;}

/* =====================================================================
   Le résumé athlète (lot 7)
   ===================================================================== */

/* --- Écran coach : graphique à gauche, champs à droite -------------- */
.grille-resume{display:grid; grid-template-columns:minmax(0,4fr) minmax(0,6fr); gap:20px; align-items:start;}
.colonne-champs{display:flex; flex-direction:column;}
.etiquette-groupe{
  display:block; margin:4px 0 8px; font-size:.66rem; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase; color:var(--ardoise);
}
.grille-axes{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:12px; margin-bottom:16px;}
.axe{border:1px solid var(--pierre); border-top:3px solid var(--orange); border-radius:4px; padding:12px; background:#fff;}
.axe .numero{font-size:.6rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:var(--orange); margin-bottom:8px;}
.axe input{margin-bottom:8px;}
.avis.rappel{background:#FDF3E7; border-left-color:var(--orange);}
.note.prive{color:var(--ardoise);}
.barre-resume{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  flex-wrap:wrap; margin-top:20px; padding-top:18px; border-top:1px solid var(--pierre);
}
.barre-resume .note{margin:0;}
.barre-resume .boutons{display:flex; gap:10px; flex-wrap:wrap;}

/* --- Écran athlète : la restitution --------------------------------- */
.espace-large.etroit{max-width:620px;}
.tete-bilan h1{margin-bottom:2px;}
.badge-bilan{
  display:inline-block; margin:0 0 16px; padding:9px 18px; border-radius:99px;
  font-size:.7rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase;
}
.badge-bilan.provisoire{border:2px solid var(--orange); color:var(--orange);}
.badge-bilan.finalise{background:var(--nuit); color:#fff;}
.badge-bilan.finalise::before,
.badge-bilan.provisoire::before{content:"● "; }
.intro-attente{color:var(--ardoise); line-height:1.6; margin:0 0 18px;}
.note.centre{text-align:center;}
.titre-section{
  font-size:.82rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase;
  color:var(--nuit); margin:26px 0 8px;
}
.texte-resume{margin:0; line-height:1.65;}
.axes{list-style:none; margin:12px 0 0; padding:0;}
.axes li{
  display:flex; align-items:center; gap:14px; background:#fff; border:1px solid var(--pierre);
  border-left:4px solid var(--orange); border-radius:4px; padding:14px 16px; margin-bottom:10px;
}
.axes .numero{
  flex:none; width:26px; height:26px; border-radius:50%; background:var(--orange); color:#fff;
  display:grid; place-items:center; font-size:.78rem; font-weight:800;
}
.axes small{color:var(--ardoise);}
.synthese{
  display:flex; gap:14px; align-items:flex-start; margin:24px 0 0; padding:18px;
  background:#fff; border:1px solid var(--pierre); border-radius:4px;
}
.synthese .pastille{flex:none; background:var(--nuit); color:#fff; width:38px; height:38px;}
.synthese p{margin:0; font-style:italic; line-height:1.6;}
.carte.transition{margin-top:26px; border-top:4px solid var(--orange);}
.carte.transition .btn{margin-top:14px;}
.attente{
  margin-top:20px; padding:18px; border:1px dashed var(--pierre); border-radius:4px;
  color:var(--ardoise); line-height:1.6;
}
.attente p{margin:0;}

@media (max-width:860px){
  .grille-resume{grid-template-columns:1fr;}
  .grille-axes{grid-template-columns:1fr;}
  .barre-resume{flex-direction:column; align-items:stretch;}
}

/* --- Historique de l'athlète (lot 8) -------------------------------- */
.chronologie{list-style:none; margin:20px 0 0; padding:0 0 0 20px; border-left:2px solid var(--pierre);}
.chronologie li{position:relative; margin-bottom:26px;}
.chronologie li::before{
  content:""; position:absolute; left:-27px; top:6px;
  width:12px; height:12px; border-radius:50%; background:var(--orange); border:3px solid var(--craie);
}
.chronologie .date{display:flex; align-items:center; gap:10px; margin-bottom:8px;}
.chronologie .carte{margin-bottom:0;}
.radar.petit{max-width:240px; margin:0 auto 10px;}
.radar.moyen{max-width:280px; margin:16px auto 0;}
.axes-courts{list-style:none; margin:12px 0 0; padding:0;}
.axes-courts li{display:flex; align-items:center; gap:10px; padding:7px 0; font-size:.92rem;}
.axes-courts .numero{
  flex:none; width:20px; height:20px; border-radius:50%; background:var(--brume);
  color:var(--nuit); display:grid; place-items:center; font-size:.68rem; font-weight:800;
}

/* --- Barre de navigation de l'athlète (maquette 04) ----------------- */
.barre-bas{
  position:sticky; bottom:0; background:var(--nuit);
  display:flex; justify-content:space-around; padding:10px 12px 14px;
}
.barre-bas a{
  display:flex; flex-direction:column; align-items:center; gap:4px; text-decoration:none;
  font-size:.64rem; color:var(--sur-nuit-faible); padding:2px 8px;
}
.barre-bas a.actif{color:#fff; font-weight:700;}
.barre-bas .point{width:6px; height:6px; border-radius:50%; background:transparent;}
.barre-bas a.actif .point{background:var(--orange);}
body.espace{padding-bottom:0;}
.carte.proposition{border-left:4px solid var(--orange);}