/* 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"]):not([data-theme="sepia"]) 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; }

/* Disponibilité : même badge dans la vitrine, le catalogue et l'espace lecteur. */
html body .collection-annonce .collection-disponibilite,
html body.page-bibliotheque .grille-livres .collection-disponibilite,
html body .el-annonce > .tag {
 background:var(--bientot-fond,#e7f2d6);color:var(--bientot-texte,#37521f);
 border:0;border-radius:999px;padding:6px 12px;font-size:12px;line-height:1.4;
 font-weight:500;letter-spacing:0;display:inline-flex;align-items:center;align-self:flex-start;
}
html[data-theme=dark] body {--bientot-fond:#293b22;--bientot-texte:#d8edbf;}
@media(prefers-color-scheme:dark) {
 html:not([data-theme=light]):not([data-theme=sepia]) body {--bientot-fond:#293b22;--bientot-texte:#d8edbf;}
}
/* Les couvertures et leurs titres gardent une largeur lisible sur téléphone. */
@media(max-width:700px) {
 html body.page-bibliotheque .grille-livres {grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 16px;}
 html .espace-lecteur .el-outils .btn-icone {width:44px;height:44px;}
}


.site-apercu-bandeau {position:relative;z-index:100;padding:14px 20px;background:#edf5d6;color:#293817;font-size:14px;text-align:center;}
.site-apercu-bandeau a {margin-inline-start:16px;text-decoration:underline;font-weight:600;}

/* Résumé d'un livre (fiche) : texte plus grand, demandé par l'autrice (16 px était trop petit). */
body .fiche .description { font-size: clamp(18px, 1.5vw, 20px); line-height: 1.75; max-width: 62ch; }
body .fiche .description p { margin: 0 0 1em; }
body .fiche .description .description-titre { margin: 8px 0 12px; font-size: clamp(22px, 2vw, 26px); }

/* Les contenus saisis (titres, adresses et liens) restent dans leur colonne. */
body :is(h1,h2,h3,p,dd,dt,summary,label,.alerte,.discret) { overflow-wrap:anywhere; }
body :is(.groupe-champ,.profil-identite,.compte-bloc,.carte-formulaire,.el-salutation,.el-titre) { min-width:0; }
body :is(input,select,textarea) { max-width:100%; min-width:0; }
body .formulaire-ligne > * { min-width:0; max-width:100%; }
body :is(.grille-livres,.el-reprises,.el-categories) > * { min-width:0; }
