/* 23 octobre 2026 : une seule identité visuelle sur tout le site, vitrine, pages publiques et espace connecté.
   Chargée en dernier. Elle ne crée aucune couleur : elle ramène chaque écran aux jetons de anointed.css
   (--background, --foreground, --card, --muted-foreground, --border, --soft, --accent-citron, --accent-ink, --police-titre, --police-texte).
   Ce qu'elle unifie : les couleurs et polices de l'espace connecté, les boutons (pilule), les cartes (24 px),
   les questions pliables (rangées blanches arrondies), la graisse des titres. */

:root {
  --rayon-carte: 24px;
  --rayon-rangee: 18px;
  --rayon-bouton: 999px;
}

/* 1. Espace connecté (espace-lecteur.css avait ses propres gris, ses verts et une police mal nommée qui retombait sur la police du système). */
body:has(.espace-lecteur) { background: var(--background); color: var(--foreground); }
html .espace-lecteur, html[data-theme="dark"] .espace-lecteur {
  --el-surface: var(--card); --el-fond: var(--background); --el-texte: var(--foreground);
  --el-secondaire: var(--muted-foreground); --el-bord: var(--border);
  font-family: var(--police-texte);
}
.espace-lecteur h1, .espace-lecteur h2, .espace-lecteur h3, .espace-lecteur .el-marque { font-family: var(--police-titre); }
.espace-lecteur :focus-visible { outline-color: var(--accent-trait, var(--foreground)); }
.espace-lecteur .el-navigation a[aria-current], html[data-theme="dark"] .el-pastilles a[aria-current], .el-pastilles a[aria-current] { background: var(--accent-citron); color: var(--accent-ink); }
.espace-lecteur .el-avatar { background: var(--soft); color: var(--foreground); }
html[data-theme="dark"] .el-pastilles a, html[data-theme="dark"] .el-decouverte .el-recherche { background: var(--card); color: var(--foreground); }

/* 2. Titres : même police, même graisse partout (le diaporama de l'accueil garde sa graisse allégée). */
body h1, body h2, body h3 { font-weight: 650; }
body .el-titre h1, body .fiche h1, body .bandeau-page h1 { font-weight: 650; }
.site-vitrine .sv-section h2 { font-weight: 650; }

/* 3. Boutons : pilule partout, sur la vitrine comme sur les pages et dans l'espace connecté. */
html body .btn, html body .btn.outline, html body .btn.soft,
html body.site-vitrine .sv-section .btn, html body.site-vitrine .entete-site .btn, html body.site-vitrine .barre-abo .btn,
html body.site-vitrine .madeleine-diapo__texte .btn { border-radius: var(--rayon-bouton); }

/* 4. Cartes : un seul rayon. */
body .carte-formulaire, body .compte-bloc, body .note-carte, body .panneau-centre,
.espace-lecteur .profil-identite, .espace-lecteur .carte-reprise { border-radius: var(--rayon-carte); }

/* 5. Questions pliables : la rangée blanche arrondie de l'espace connecté devient la référence (aide, accueil, compte). */
body .questions { margin-top: 28px; border-top: 0; display: grid; gap: 10px; }
body .questions details, body .vitrine-faq details, body details.question {
  margin: 0; padding: 4px 20px; border: 1px solid var(--border); border-bottom: 1px solid var(--border);
  border-radius: var(--rayon-rangee); background: var(--card);
}
body .vitrine-faq details { margin-block: 10px; }
body .questions summary, body .vitrine-faq summary { min-height: 56px; font-weight: 600; }
body .questions details[open], body .vitrine-faq details[open] { border-color: var(--border); }
body .questions details > p, body .vitrine-faq details > p { margin: 0 0 16px; color: var(--muted-foreground); line-height: 1.7; }

/* 6. Administration (23 octobre 2026) : même identité que le site. admin-interface.css redéfinissait ses propres gris, un jaune en sombre
   et des tailles de 10 à 12 px. « unset » rend à chaque jeton la valeur du site (les jetons personnalisés sont hérités du document). */
html body.adm, html[data-theme="dark"] body.adm {
  --background: unset; --card: unset; --foreground: unset; --muted-foreground: unset; --border: unset; --soft: unset; --input: unset;
  --primary: unset; --primary-foreground: unset; --lavender: unset; --lavender-ink: unset;
  --actif-fond: var(--accent-citron); --actif-encre: var(--accent-ink);
  font-size: 14px;
}
@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) body.adm {
    --background: unset; --card: unset; --foreground: unset; --muted-foreground: unset; --border: unset; --soft: unset; --input: unset;
    --primary: unset; --primary-foreground: unset; --lavender: unset; --lavender-ink: unset;
    --actif-fond: var(--accent-citron); --actif-encre: var(--accent-ink);
  }
}
html body.adm .adm-nav a { font-size: 14px; border-radius: 14px; }
html body.adm .adm-groupe, html body.adm .adm-marque small, html body.adm .adm-moi-texte strong, html body.adm .adm-moi-texte small,
html body.adm .adm-compte, html body.adm .adm-haut .adm-fil, html body.adm .adm-tableau th, html body.adm .adm-indicateur-label { font-size: 13px; }
html body.adm .adm-page-courante, html body.adm .adm-entete p, html body.adm .adm-tableau table, html body.adm .adm-recherche-menu input { font-size: 14px; }
html body.adm .adm-carte h2 { font-size: 16px; }
html body.adm .adm-carte, html body.adm .adm-tableau, html body.adm .adm-indicateur, html body.adm .adm-stat { border-radius: var(--rayon-carte); }
html body.adm .adm-nouveau, html body.adm .btn { font-size: 14px; }
html body.adm .adm-nouveau { background: var(--accent-citron); color: var(--accent-ink); }
html body.adm .adm-recherche-menu input { border-radius: 999px; }
html body.adm .adm-haut .adm-nouveau, html body.adm a.adm-nouveau, html body.adm button.adm-nouveau { background: var(--accent-citron); color: var(--accent-ink); border-radius: 999px; }
html body.adm .adm-initiales, html body.adm .adm-pastille { font-size: 13px; }
html body.adm .adm-avatar, html body.adm .adm-moi .adm-avatar, html body.adm .adm-avatar .adm-initiales { font-size: 13px; }
html body.adm .adm-ajouter, html body.adm .adm-site { font-size: 13px; }

/* 7. Barre du haut de l'administration : boutons d'icône sans cercle ni contour (menu, thème). Le bouton d'import n'a plus de contour sombre. */
html body.adm .adm-haut .btn-icone { border: 0; background: none; box-shadow: none; }
html body.adm .adm-haut .btn-icone:hover { background: var(--soft); }
html body.adm .adm-haut .adm-nouveau { border: 0; box-shadow: none; }
