/* ================================================================ */
/* THÈMES GLOBAUX — Iktisar (blanc / beige / noir)                */
/* Fichier séparé contenant toutes les surcharges de thème.       */
/* Doit être chargé APRÈS common-styles.css dans chaque page.     */
/* ================================================================ */

/* ================================================================ */
/*  1. VARIABLES CSS PAR THÈME                                     */
/* ================================================================ */

/* --- Thème Blanc (mode clair neutre) --- */
body.theme-blanc {
  --bg: #f9f9f9;
  --panel: #f0f0f0;
  --panel-light: #ffffff;
  --text-primary: #333333;
  --text-secondary: #555555;
  --muted: #999999;
  --border-color: #e0e0e0;
  --hover-bg: #f5f5f5;
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.06);
  --search-bg: #ffffff;
  --note-item-bg: #ffffff;
  --note-item-hover-bg: #f8f8f8;
  --note-item-shadow: 0 1px 3px rgba(0,0,0,0.05);
  --note-text-main: #333;
  --note-text-sub: #666;
  --note-text-small: #999;
  --note-edit-btn: #666;
  --note-tag-bg: #e8f5e9;
  --note-tag-color: #2e7d32;
  --note-popup-bg: white;
  --note-popup-border: rgba(26, 82, 56, 0.3);
  --note-popup-shadow: 0 4px 14px rgba(0,0,0,0.15);
  --note-close-btn: #999;
  background-color: #f0f0f0;

  /* Palette Carte SVG (Thème Blanc) - Base sombre, lignes vertes */
  --map-base: #ae7b43;
  --map-land: #7a5833;
  --map-coast: #483c27;
  --map-line1: rgba(90, 171, 138, 0.4);
  --map-line2: rgba(74, 145, 120, 0.6);
  --map-line3: #4a9178;
}

/* --- Thème Beige (parchemin — défaut historique) --- */
body.theme-beige {
  --bg: #EBD8B4;
  --panel: #E2CC9F;
  --panel-light: #F3E5CA;
  --text-primary: #2C3539;
  --text-secondary: #5C4A32;
  --muted: #7A6548;
  --border-color: #C4A572;
  --search-bg: #E6D7B7;
  --hover-bg: #D8C395;
  --note-item-bg: #f5f0e6;
  --note-item-hover-bg: #ece4d0;
  --note-item-shadow: 0 1px 3px rgba(80,60,30,0.1);
  --note-text-main: #3d2b1a;
  --note-text-sub: #6b5344;
  --note-text-small: #8b7355;
  --note-edit-btn: #5c4b37;
  --note-tag-bg: #e8f0e0;
  --note-tag-color: #3d5a2e;
  --note-popup-bg: var(--panel);
  --note-popup-border: rgba(139, 115, 85, 0.45);
  --note-popup-shadow: 0 4px 12px rgba(80,60,30,0.18);
  --note-close-btn: #8b7355;
  background-color: #DCC69E;

  /* Palette Carte SVG (Thème Beige/Parchemin) - Base sombre, lignes vertes */
  --map-base: #ae7b43;
  --map-land: #7a5833;
  --map-coast: #483c27;
  --map-line1: rgba(90, 171, 138, 0.4);
  --map-line2: rgba(74, 145, 120, 0.6);
  --map-line3: #4a9178;
}

/* --- Thème Noir (mode sombre) --- */
body.theme-noir {
  --bg: #223235;
  --panel: #1a2628;
  --panel-light: #2a3a3d;
  --text-primary: #e8e8e8;
  --text-secondary: #b0b8bc;
  --muted: #6b7b80;
  --accent: #4a9178;
  --accent-dark: #234739;
  --accent-light: #5aab8a;
  --authors-gold: #C7993F;
  --border-color: rgba(255, 255, 255, 0.1);
  --hover-bg: rgba(255, 255, 255, 0.06);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.2);
  --shadow-md: 0 4px 20px rgba(0, 0, 0, 0.2);
  --shadow-hover: 0 10px 25px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.3);
  /* Search bar: fond solide (requis pour le trick webkit-autofill) */
  --search-bg: #334245;
  --note-item-bg: #333a40;
  --note-item-hover-bg: #3a4248;
  --note-item-shadow: 0 1px 3px rgba(0,0,0,0.2);
  --note-text-main: #ddd;
  --note-text-sub: #aaa;
  --note-text-small: #888;
  --note-edit-btn: #8bddba;
  --note-tag-bg: rgba(138,221,186,0.15);
  --note-tag-color: #8bddba;
  --note-popup-bg: #2a3035;
  --note-popup-border: rgba(90, 184, 138, 0.45);
  --note-popup-shadow: 0 4px 14px rgba(0,0,0,0.55);
  --note-close-btn: #888;
  /* Status / feedback en sombre : fonds très assombris, textes éclaircis */
  --success-bg: rgba(34, 197, 94, 0.12);
  --success-text: #6ee7a8;
  --success-border: rgba(34, 197, 94, 0.35);
  --error-bg: rgba(239, 68, 68, 0.12);
  --error-text: #fca5a5;
  --error-border: rgba(239, 68, 68, 0.35);
  --warning-bg: rgba(245, 158, 11, 0.12);
  --warning-text: #fcd34d;
  --warning-border: rgba(245, 158, 11, 0.35);
  --info-bg: rgba(59, 130, 246, 0.14);
  --info-text: #93c5fd;
  --info-border: rgba(59, 130, 246, 0.35);
  background-color: #1a1e21;

  /* Palette Carte SVG (Thème Noir) - Base sombre, lignes dorées */
  --map-base: #ae7b43;
  --map-land: #7a5833;
  --map-coast: #483c27;
  --map-line1: rgba(165, 127, 52, 0.4);
  --map-line2: rgba(199, 153, 63, 0.6);
  --map-line3: #C7993F;
}

/* ================================================================ */
/*  2. WRAP (conteneur principal)                                  */
/* ================================================================ */

body.theme-blanc .wrap {
  background-color: #f9f9f9;
  border-color: rgba(0, 0, 0, 0.08);
}

body.theme-beige .wrap {
  background-color: #EBD8B4;
}

body.theme-noir .wrap {
  background-color: #223235;
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.3);
}

/* ================================================================ */
/*  3. SIDEBAR + MENTIONS LÉGALES                                  */
/* ================================================================ */

/* --- Blanc --- */
body.theme-blanc .sidebar {
  background: rgba(255, 255, 255, 0.95);
  border-color: rgba(0, 0, 0, 0.08);
  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.04),
    0 10px 15px -3px rgba(0, 0, 0, 0.04);
}
body.theme-blanc .mentions-legales-sidebar {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}
body.theme-blanc .sidebar .icon:not(.active):hover {
  background: rgba(240, 240, 240, 0.9);
}

/* --- Beige --- */
body.theme-beige .sidebar {
  background: rgba(226, 204, 159, 0.94);
  border-color: #C4A572;
  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.06),
    0 10px 15px -3px rgba(0, 0, 0, 0.06);
}
body.theme-beige .mentions-legales-sidebar {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}
body.theme-beige .sidebar .icon:not(.active):hover {
  background: rgba(216, 195, 149, 0.9);
}

body.theme-beige .sidebar .icon {
  color: #C4A572;
}

/* --- Noir --- */
body.theme-noir .sidebar {
  background: rgba(34, 50, 53, 0.95);
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow:
    0 4px 6px -1px rgba(0, 0, 0, 0.2),
    0 10px 15px -3px rgba(0, 0, 0, 0.2),
    inset 0 0 0 1px rgba(255, 255, 255, 0.05);
}
body.theme-noir .mentions-legales-sidebar {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}
body.theme-noir .sidebar .icon {
  color: #b0b8bc;
}
body.theme-noir .sidebar .icon.active {
  color: #e8e8e8;
  background: color-mix(in srgb, var(--accent-gold) 80%, transparent);
}
body.theme-noir .sidebar .icon:not(.active):hover {
  background: rgba(255, 255, 255, 0.06);
}
body.theme-noir .mentions-legales-sidebar .icon {
  color: #b0b8bc;
}
body.theme-noir .mentions-legales-sidebar .icon:not(.active):hover {
  background: transparent;
  box-shadow: none;
}

/* Icônes SVG personnalisées — filtres calqués sur les couleurs des icônes existantes */

/* Thème blanc : couleurs SVG naturelles (vert #0f5d3f + or #c9a24a), opacité héritage */

/* Thème beige : légère atténuation supplémentaire pour correspondre au fond chaud */
body.theme-beige .sidebar .icon img.ikt-nav-icon {
  opacity: 0.55;
  filter: sepia(0.12);
}
body.theme-beige .sidebar .icon:not(.active):hover img.ikt-nav-icon {
  opacity: 1;
  filter: none;
}
body.theme-beige .sidebar .icon.active img.ikt-nav-icon {
  filter: brightness(0) invert(1);
  opacity: 1;
}

/* Thème sombre : booster la luminosité pour que les verts sombres (#0f5d3f, #06301e)
   restent visibles sur fond sombre tout en conservant les dégradés d'ombres */
body.theme-noir .sidebar .icon img.ikt-nav-icon {
  filter: brightness(1.8) saturate(1.1);
  opacity: 0.65;
}
body.theme-noir .sidebar .icon:not(.active):hover img.ikt-nav-icon {
  filter: brightness(2.2) saturate(1.2);
  opacity: 1;
}
body.theme-noir .sidebar .icon.active img.ikt-nav-icon {
  filter: brightness(0) invert(1);
  opacity: 1;
}

/* ================================================================ */
/*  4. SLOGAN — adapté par thème                                   */
/* ================================================================ */

body.theme-blanc .slogan {
  background: rgba(255, 255, 255, 0.95);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
body.theme-blanc .slogan-text {
  color: var(--accent);
}

body.theme-beige .slogan {
  background: var(--panel-light);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}
body.theme-beige .slogan-text {
  color: var(--accent);
}

body.theme-noir .slogan {
  background: var(--panel-light);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3);
  overflow: hidden;
}
body.theme-noir .slogan-text {
  color: var(--accent-gold);
}
/* Logo doré en thème sombre — masque CSS (alpha de l'image + background-color),
   pas de drop-shadow décalé + translateX hors champ : même bug que
   .wrap-top-logo (section 5 plus bas) — sur certaines tablettes/iPhone,
   quand un ancêtre force sa propre couche GPU, WebKit clippe silencieusement
   l'ombre décalée et le logo devient invisible (constaté : logo manquant
   uniquement en thème sombre). Le masque ne dépend ni d'un filter ni d'un
   transform : aucune zone de rendu décalée à calculer, donc pas de ce bug. */
body.theme-noir .slogan .slogan-logo-wrap {
  display: inline-flex;
  align-items: center;
  position: relative;
}
body.theme-noir .slogan .slogan-logo-wrap .slogan-logo {
  opacity: 0;
}
body.theme-noir .slogan .slogan-logo-wrap::after {
  content: '';
  position: absolute;
  inset: 0;
  background-color: var(--accent-gold);
  -webkit-mask-image: url('assets/brand/logo-icon.png');
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-image: url('assets/brand/logo-icon.png');
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
}

/* ================================================================ */
/*  5. LOGO EN HAUT (wrap-top-logo)                                */
/* ================================================================ */

/* Recolore le logo en doré via un masque CSS (alpha de l'image + background-color)
   plutôt qu'un drop-shadow à grand décalage + translateX hors champ : sur
   certains iPhone, quand l'ancêtre .mobile-header force sa propre couche GPU
   (transform: translateZ(0)), WebKit clippe silencieusement l'ombre décalée
   et le logo devient invisible. Le masque ne dépend ni d'un filter ni d'un
   transform : aucune zone de rendu à calculer, donc pas de ce bug. */
body.theme-noir .wrap-top-logo {
  position: relative;
}
body.theme-noir .wrap-top-logo img {
  opacity: 0;
}
body.theme-noir .wrap-top-logo::after {
  content: '';
  position: absolute;
  inset: 0;
  background-color: var(--accent-gold);
  -webkit-mask-image: url('assets/brand/logo-complet.svg');
  -webkit-mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-image: url('assets/brand/logo-complet.svg');
  mask-size: contain;
  mask-repeat: no-repeat;
  mask-position: center;
}

/* ================================================================ */
/*  6. BARRE DE RECHERCHE + TOP BAR                                */
/* ================================================================ */

/* Les couleurs de fond, texte, placeholder et icône sont gérées
   via les variables --search-bg, --text-primary, --muted
   définies dans :root et surchargées par thème dans la section 1. */

/* --- Blanc --- */
body.theme-blanc .search {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

/* --- Beige --- */
body.theme-beige .search {
  background: var(--panel-light);
  border: 1px solid #C4A572;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

body.theme-beige .search input:-webkit-autofill,
body.theme-beige .search input:-webkit-autofill:hover,
body.theme-beige .search input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px var(--panel-light) inset !important;
  -webkit-text-fill-color: var(--text-primary) !important;
}

/* --- Noir --- */
body.theme-noir .search {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
}
body.theme-noir .search-results-container {
  background: var(--panel);
  border: 1px solid rgba(255, 255, 255, 0.1);
}
body.theme-noir .results-section {
  background: var(--panel-light);
}
body.theme-noir .section-title {
  color: #e8e8e8;
}
body.theme-noir .section-header {
  border-bottom-color: rgba(255, 255, 255, 0.08);
}
body.theme-noir .result-item {
  background: rgba(255, 255, 255, 0.04);
  color: var(--text-primary);
}
body.theme-noir .result-item:hover {
  background: rgba(255, 255, 255, 0.08);
}

/* Texte dans les résultats */
body.theme-noir .result-title {
  color: var(--text-primary);
}
body.theme-noir .result-author,
body.theme-noir .result-meta {
  color: var(--text-secondary);
}
body.theme-noir .result-excerpt {
  color: var(--text-secondary);
}
body.theme-noir .highlight {
  background-color: rgba(250, 204, 21, 0.35);
  color: var(--text-primary);
}
body.theme-noir .no-results,
body.theme-noir .no-results-text {
  color: var(--muted);
}

/* Panneau filtres avancés */
body.theme-noir .filter-drawer {
  border-color: rgba(255, 255, 255, 0.1);
}
body.theme-noir .filter-drawer-header {
  background: var(--panel);
  border-bottom-color: rgba(255, 255, 255, 0.08);
}
body.theme-noir .filter-drawer-title {
  color: var(--text-primary);
}
body.theme-noir .filter-label {
  color: var(--muted);
}
body.theme-noir .filter-field-btn {
  border-color: rgba(255, 255, 255, 0.12);
  color: var(--text-secondary);
}
body.theme-noir .filter-field-btn:hover {
  border-color: var(--accent);
  color: var(--accent);
}
body.theme-noir .filter-select,
body.theme-noir .filter-input {
  border-color: rgba(255, 255, 255, 0.12);
  color: var(--text-primary);
  background: var(--panel);
}
body.theme-noir .filter-operators-info {
  background: rgba(255, 255, 255, 0.04);
}
body.theme-noir .filter-operators-title {
  color: var(--text-primary);
}
body.theme-noir .filter-operators-list {
  color: var(--text-secondary);
}
body.theme-noir .filter-operators-list code {
  background: rgba(255, 255, 255, 0.08);
  color: #f4a9c0;
}

/* Chips de filtres actifs */
body.theme-noir .filter-chip {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.12);
  color: var(--text-primary);
}
body.theme-noir .filter-chip:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.2);
}
body.theme-noir .filter-chip-label {
  color: var(--text-secondary);
}
body.theme-noir .filter-chip-value {
  color: var(--text-primary);
}
body.theme-noir .filter-chip-condition {
  color: var(--muted);
}
body.theme-noir .filter-chip-remove {
  color: var(--muted);
}

/* Bouton filtre dans la barre de recherche */
body.theme-noir .filter-toggle-btn {
  color: var(--muted);
}
body.theme-noir .filter-toggle-btn:hover {
  background: rgba(255, 255, 255, 0.08);
}
body.theme-noir .filter-toggle-btn.active {
  background: var(--accent-gold, #b89e14);
  color: #1a0e00; /* icône noire sur fond doré */
}

/* Auto-complétion */
body.theme-noir .autocomplete-suggestions {
  background: var(--panel-light);
  border-color: rgba(255, 255, 255, 0.1);
}
body.theme-noir .autocomplete-suggestion {
  color: var(--text-primary);
  border-bottom-color: rgba(255, 255, 255, 0.05);
}
body.theme-noir .autocomplete-suggestion:hover,
body.theme-noir .autocomplete-suggestion.highlighted {
  background: rgba(255, 255, 255, 0.06);
}
body.theme-noir .autocomplete-no-results {
  color: var(--muted);
}
body.theme-noir .autocomplete-suggestions::-webkit-scrollbar-track {
  background: var(--panel);
}
body.theme-noir .autocomplete-suggestions::-webkit-scrollbar-thumb {
  background: rgba(255, 255, 255, 0.15);
}

/* Popup résultats complets */
body.theme-noir .results-popup-header {
  border-bottom-color: rgba(255, 255, 255, 0.08);
}
body.theme-noir .results-popup-header h3 {
  color: var(--text-primary);
}
body.theme-noir .results-popup-close {
  background: rgba(255, 255, 255, 0.08);
  color: var(--text-secondary);
}
body.theme-noir .results-popup-close:hover {
  background: rgba(255, 255, 255, 0.14);
  color: var(--text-primary);
}
body.theme-noir .popup-result-item:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: var(--accent);
}
body.theme-noir .popup-result-title {
  color: var(--text-primary);
}
body.theme-noir .popup-result-badge {
  background: rgba(255, 255, 255, 0.08);
  color: var(--text-secondary);
}

/* ================================================================ */
/*  7. BOUTON D'AUTHENTIFICATION + DROPDOWN                        */
/* ================================================================ */

/* --- Blanc --- */
body.theme-blanc button#authBtn {
  background-color: #ffffff;
  color: var(--text-primary);
  border-color: var(--border-color);
}
body.theme-blanc .auth-dropdown-menu {
  background: #ffffff;
  border-color: var(--border-color);
}
body.theme-blanc .auth-dropdown-item {
  color: var(--text-primary);
  border-bottom-color: #f0f0f0;
}
body.theme-blanc .auth-dropdown-item:hover {
  background-color: var(--hover-bg);
}

/* --- Beige --- */
body.theme-beige button#authBtn {
  background-color: var(--panel-light);
  color: var(--text-primary);
  border-color: #C0A26E;
}
body.theme-beige .auth-dropdown-menu {
  background: var(--panel-light);
  border-color: #C0A26E;
}
body.theme-beige .auth-dropdown-item {
  color: var(--text-primary);
  border-bottom-color: #CBAF80;
}
body.theme-beige .auth-dropdown-item:hover {
  background-color: #D8C395;
}
body.theme-beige .auth-dropdown-trigger:hover {
  background-color: #D8C395;
}

/* --- Noir --- */
body.theme-noir button#authBtn {
  background-color: var(--panel-light);
  color: #e8e8e8;
  border-color: rgba(255, 255, 255, 0.15);
}
body.theme-noir .auth-dropdown-menu {
  background: var(--panel-light);
  border-color: rgba(255, 255, 255, 0.1);
}
body.theme-noir .auth-dropdown-item {
  color: #e8e8e8;
  border-bottom-color: rgba(255, 255, 255, 0.06);
}
body.theme-noir .auth-dropdown-item:hover {
  background-color: rgba(255, 255, 255, 0.08);
}
body.theme-noir .auth-dropdown-trigger:hover {
  background-color: rgba(255, 255, 255, 0.06);
}
body.theme-noir .auth-dropdown-trigger span#userEmail {
  color: #e8e8e8;
}
body.theme-noir .auth-dropdown-trigger svg#userAvatar {
  fill: #b0b8bc;
}

/* Guest dropdown theme overrides */
body.theme-blanc .auth-dropdown-trigger-guest { color: var(--text-secondary); }
body.theme-beige .auth-dropdown-trigger-guest { color: var(--text-secondary); }
body.theme-noir .auth-dropdown-trigger-guest { color: #b0b8bc; }
body.theme-noir .auth-dropdown-trigger-guest:hover { background-color: rgba(255, 255, 255, 0.06); }

body.theme-blanc .auth-dropdown-menu-guest { background: #ffffff; border-color: var(--border-color); }
body.theme-beige .auth-dropdown-menu-guest { background: var(--panel-light); border-color: #C0A26E; }
body.theme-noir .auth-dropdown-menu-guest { background: var(--panel-light); border-color: rgba(255, 255, 255, 0.1); }

/* ================================================================ */
/*  8. SÉLECTEUR DE THÈME (dans le dropdown)                       */
/* ================================================================ */

.auth-theme-selector {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 10px 16px;
  border-bottom: 1px solid #f0f0f0;
}
.auth-theme-label {
  display: none;
}
.auth-theme-btn {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  border: 2px solid transparent;
  cursor: pointer;
  transition: all 0.2s ease;
  padding: 0;
  position: relative;
}
.auth-theme-btn:hover {
  transform: scale(1.15);
}
.auth-theme-btn.active {
  border-color: var(--accent-gold);
  box-shadow: 0 0 0 2px rgba(200, 155, 60, 0.3);
}
.auth-theme-btn[data-layout-theme="blanc"] {
  background: #f9f9f9;
  border-color: var(--border-color);
}
.auth-theme-btn[data-layout-theme="blanc"].active {
  border-color: var(--accent-gold);
}
.auth-theme-btn[data-layout-theme="beige"] {
  background: #e6d0a7;
  border-color: #c8b08a;
}
.auth-theme-btn[data-layout-theme="beige"].active {
  border-color: var(--accent-gold);
}
.auth-theme-btn[data-layout-theme="noir"] {
  background: #223235;
  border-color: #445;
}
.auth-theme-btn[data-layout-theme="noir"].active {
  border-color: var(--accent-gold);
}

body.theme-beige .auth-theme-selector {
  border-bottom-color: #CBAF80;
}
body.theme-noir .auth-theme-selector {
  border-bottom-color: rgba(255, 255, 255, 0.06);
}
body.theme-noir .auth-theme-label {
  color: #b0b8bc;
}

/* ================================================================ */
/*  9. OPTION PSEUDO (dans le dropdown) — utilise .auth-dropdown-item */
/* ================================================================ */
/* Supprimé : .auth-dropdown-item-pseudo a été remplacé par .auth-dropdown-item pour uniformité */

/* ================================================================ */
/*  10. MODAL PSEUDO                                               */
/* ================================================================ */

.pseudo-modal-overlay {
  position: fixed;
  top: 0; left: 0; right: 0; bottom: 0;
  background: rgba(0, 0, 0, 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10000;
  opacity: 0;
  transition: opacity 0.3s ease;
}
.pseudo-modal-overlay.visible { opacity: 1; }

.pseudo-modal {
  background: var(--panel-light, #fff);
  border-radius: 12px;
  padding: 28px 32px;
  max-width: 400px;
  width: 90%;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  transform: translateY(20px);
  transition: transform 0.3s ease;
}
.pseudo-modal-overlay.visible .pseudo-modal { transform: translateY(0); }

.pseudo-modal h3 {
  font-family: var(--font-serif);
  font-size: 18px; font-weight: 700;
  color: var(--text-primary);
  margin: 0 0 6px 0;
}
.pseudo-modal p {
  font-size: 13px;
  color: var(--text-secondary);
  margin: 0 0 16px 0; line-height: 1.5;
}
.pseudo-modal-input {
  width: 100%;
  padding: 10px 14px;
  border: 1.5px solid rgba(0, 0, 0, 0.15);
  border-radius: var(--card-radius);
  font-size: 14px;
  font-family: var(--font-sans);
  color: var(--text-primary);
  background: var(--bg, #fff);
  outline: none;
  transition: border-color 0.2s ease;
  box-sizing: border-box;
}
.pseudo-modal-input:focus { border-color: var(--accent); }
.pseudo-modal-error {
  font-size: 12px; color: #e53e3e;
  margin-top: 6px; min-height: 18px;
}
.pseudo-modal-actions {
  display: flex; justify-content: flex-end;
  gap: 10px; margin-top: 16px;
}
.pseudo-modal-btn {
  padding: 8px 20px;
  border-radius: var(--card-radius);
  font-size: 13px; font-weight: 600;
  font-family: var(--font-sans);
  cursor: pointer; transition: all 0.2s ease;
  border: none;
}
.pseudo-modal-btn-cancel {
  background: var(--panel);
  color: var(--text-secondary);
  border: 1px solid rgba(0, 0, 0, 0.1);
}
.pseudo-modal-btn-cancel:hover { background: var(--panel-light); }
.pseudo-modal-btn-save { background: var(--accent); color: #fff; }
.pseudo-modal-btn-save:hover { background: var(--accent-dark); transform: translateY(-1px); }

body.theme-noir .pseudo-modal { background: var(--panel-light); }
body.theme-noir .pseudo-modal-input {
  background: var(--panel);
  border-color: rgba(255, 255, 255, 0.15);
  color: #e8e8e8;
}

/* ================================================================ */
/*  11. BOUTONS RETOUR                                             */
/* ================================================================ */

body.theme-blanc .back-button,
body.theme-blanc .btn-back-icon {
  background: rgba(255, 255, 255, 0.95);
  color: var(--text-primary);
  border-color: rgba(0, 0, 0, 0.12);
}
body.theme-beige .back-button,
body.theme-beige .btn-back-icon {
  background: rgba(226, 204, 159, 0.95);
  color: var(--text-primary);
  border-color: #C4A572;
}
body.theme-noir .back-button,
body.theme-noir .btn-back-icon {
  background: rgba(42, 58, 61, 0.95);
  color: #e8e8e8;
  border-color: rgba(255, 255, 255, 0.1);
}
body.theme-noir .back-button-xmind {
  background: rgba(42, 58, 61, 0.95);
  color: #e8e8e8;
  border-color: rgba(255, 255, 255, 0.1);
}

/* ================================================================ */
/*  12. FILTRE TOGGLE + BOUTONS DE FILTRE                          */
/* ================================================================ */

body.theme-noir .filter-toggle-btn { color: var(--accent-gold, #b89e14); border-color: rgba(255,255,255,0.12); background: var(--panel-light); }

body.theme-noir .filter-btn {
  background: rgba(255, 255, 255, 0.06);
  color: #b0b8bc;
  border-color: rgba(255, 255, 255, 0.1);
}
@media (hover: hover) {
  body.theme-noir .filter-btn:hover {
    background: rgba(255, 255, 255, 0.1);
  }
}

/* ================================================================ */
/*  13. TITRES DE SECTIONS                                         */
/* ================================================================ */

body.theme-blanc .accueil-section-title h2 { color: var(--text-primary); }
body.theme-beige .accueil-section-title h2 { color: var(--text-primary); }
body.theme-noir .accueil-section-title h2 { color: #e8e8e8; }

/* ================================================================ */
/*  14. LABELS DES ICÔNES SIDEBAR                                  */
/* ================================================================ */

body.theme-noir .label {
  background-color: #2a3a3d;
  color: #e8e8e8;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
}

/* ================================================================ */
/*  15. TOAST NOTIFICATIONS                                        */
/* ================================================================ */

body.theme-noir .ikt-toast          { border-color: rgba(255, 255, 255, 0.08); }
body.theme-noir .ikt-toast--success { --toast-accent: var(--accent-light, #5aab8a); --toast-icon-bg: rgba(90, 171, 138, 0.15); }
body.theme-noir .ikt-toast--info    { --toast-accent: #b0b8bc; --toast-icon-bg: rgba(176, 184, 188, 0.12); }

/* ================================================================ */
/*  16. SCROLLBAR                                                  */
/* ================================================================ */

body.theme-noir ::-webkit-scrollbar-track { background: #1a2628; }
body.theme-noir ::-webkit-scrollbar-thumb { background: #5a7a7e; }
body.theme-noir ::-webkit-scrollbar-thumb:hover { background: #7a9a9e; }

/* Scrollbar kanban/notes plus claires en mode sombre */
body.theme-noir .kanban-content,
body.theme-noir .note-card,
body.theme-noir .selected-text {
    scrollbar-color: rgba(255, 255, 255, 0.3) transparent;
}

body.theme-noir .kanban-content::-webkit-scrollbar-thumb,
body.theme-noir .note-card::-webkit-scrollbar-thumb,
body.theme-noir .selected-text::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.25) !important;
}

body.theme-noir .kanban-content::-webkit-scrollbar-thumb:hover,
body.theme-noir .note-card::-webkit-scrollbar-thumb:hover,
body.theme-noir .selected-text::-webkit-scrollbar-thumb:hover {
    background: rgba(255, 255, 255, 0.4) !important;
}

body.theme-noir .kanban-content::-webkit-scrollbar-track,
body.theme-noir .note-card::-webkit-scrollbar-track,
body.theme-noir .selected-text::-webkit-scrollbar-track {
    background: rgba(255, 255, 255, 0.05) !important;
}

/* ================================================================ */
/*  17. SELECTION TEXT                                              */
/* ================================================================ */

body.theme-noir ::selection { background: rgba(74, 145, 120, 0.4); color: #fff; }
body.theme-blanc ::selection { background: rgba(46, 74, 64, 0.2); color: var(--text-primary); }

/* ================================================================ */
/* ================================================================ */
/*  SURCHARGES PAR PAGE (éléments spécifiques)                     */
/* ================================================================ */
/* ================================================================ */

/* ================================================================ */
/*  P1. ACCUEIL — Carousel, section titles, history cards          */
/* ================================================================ */

/* Carousel indicators */
body.theme-noir .carousel-indicator {
  background: rgba(255, 255, 255, 0.2);
}
body.theme-noir .carousel-indicator.active {
  background: var(--accent-dark);
}

/* Disabled arrows */
body.theme-beige .arrow.disabled {
  background: #e0d8c6;
  color: var(--muted);
}
body.theme-noir .arrow.disabled {
  background: rgba(255, 255, 255, 0.06);
  color: #6b7b80;
}

/* History cards (banner) */
body.theme-beige .history-card {
  background: rgba(226, 204, 159, 0.95);
}
body.theme-beige .history-card-title { color: var(--text-primary); }
body.theme-beige .history-card-author { color: var(--text-secondary); }
body.theme-beige .history-progress-track { background: #C4A572; }

body.theme-noir .history-card {
  background: rgba(42, 58, 61, 0.95);
}
body.theme-noir .history-card-title { color: #e8e8e8; }
body.theme-noir .history-card-author { color: #b0b8bc; }
body.theme-noir .history-card-chapter { color: #6b7b80; }
body.theme-noir .history-progress-track { background: rgba(255, 255, 255, 0.1); }
body.theme-noir .history-progress-text { color: #b0b8bc; }

/* ================================================================ */
/*  P2. BIBLIOTHÈQUE — Hero, book cards, filters, pagination       */
/* ================================================================ */

/* Hero */
body.theme-beige .library-hero h1 { color: var(--text-primary); }
body.theme-noir .library-hero h1 { color: #e8e8e8; }

/* Search */
body.theme-beige .library-search-box input {
  color: var(--text-primary);
  background: var(--panel-light);
  border-color: #C4A572;
}
body.theme-noir .library-search-box input {
  color: #e8e8e8;
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.1);
}

/* Stats & sort */
body.theme-beige .library-stats { color: var(--text-secondary); }
body.theme-beige .library-sort-controls label { color: var(--text-secondary); }
body.theme-beige .library-sort-controls select {
  color: var(--text-primary);
  background: var(--panel-light);
}
body.theme-noir .library-stats { color: #6b7b80; }
body.theme-noir .library-sort-controls label { color: #6b7b80; }
body.theme-noir .library-sort-controls select {
  color: #e8e8e8;
  background: var(--panel-light);
  border-color: rgba(255, 255, 255, 0.1);
}

/* Filter buttons */
body.theme-beige .filter-btn {
  color: var(--text-secondary);
  border-color: #C4A572;
}
@media (hover: hover) {
  body.theme-beige .filter-btn:hover {
    background: #D8C395;
  }
}
body.theme-beige .filter-btn-icon { color: var(--muted); }

/* Book cards */
body.theme-beige .book-card {
  background: var(--panel-light);
  border-color: #CBAF80;
}
body.theme-noir .book-card {
  background: var(--panel-light);
  border-color: rgba(255, 255, 255, 0.06);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}


/* ================================================================ */
/*  P3. BOOK DETAIL                                                */
/* ================================================================ */

body.theme-beige .book-detail .lead { color: var(--text-secondary); }
body.theme-noir .book-detail .lead { color: #b0b8bc; }

body.theme-beige .action-item {
  background: rgba(226, 204, 159, 0.6);
}
body.theme-beige .action-item:hover {
  background: rgba(226, 204, 159, 0.9);
}
body.theme-noir .action-item {
  background: rgba(255, 255, 255, 0.06);
}
body.theme-noir .action-item:hover {
  background: rgba(255, 255, 255, 0.12);
}

body.theme-noir .btn-card {
  border-color: rgba(255, 255, 255, 0.1);
  color: #e8e8e8;
}
body.theme-noir .btn-card .icon-circle {
  background: rgba(255, 255, 255, 0.08);
}
body.theme-noir .book-detail .back-button {
  border-color: rgba(255, 255, 255, 0.1);
  color: #e8e8e8;
  background: rgba(42, 58, 61, 0.95);
}
body.theme-noir .book-detail .back-button:hover {
  background: rgba(42, 58, 61, 1);
}
body.theme-noir .youtube-link {
  border-color: rgba(255, 255, 255, 0.1);
  color: #e8e8e8;
}

/* Résumés modal */
body.theme-noir .resumes-modal-header {
  background: linear-gradient(var(--panel), var(--panel-light));
}
body.theme-noir .resumes-modal-header h2 { color: #e8e8e8; }
body.theme-noir .resumes-modal-book-info {
  background: var(--panel);
}
body.theme-noir .resumes-modal-book-info h3 { color: #e8e8e8; }
body.theme-noir .resumes-modal-book-info p { color: #b0b8bc; }
body.theme-noir .resume-item {
  border-color: rgba(255, 255, 255, 0.08);
}
body.theme-noir .resume-content h3 { color: #e8e8e8; }
body.theme-noir .resume-description { color: #b0b8bc; }
body.theme-noir .resume-date { color: #6b7b80; }
body.theme-noir .resumes-modal-footer {
  background: var(--panel);
}
body.theme-noir .resumes-modal-close-btn {
  background: rgba(255, 255, 255, 0.08);
  color: #e8e8e8;
}

/* ================================================================ */
/*  P4. AUTEUR — Fiche auteur                                      */
/* ================================================================ */

body.theme-beige .author-name { color: var(--text-primary); }
body.theme-beige .section-title:not(.results-section .section-title) { color: var(--text-primary); }
body.theme-beige .author-bio { color: var(--text-secondary); }
body.theme-beige .tag { background: #D8C395; color: #4a443a; border-color: #C4A572; }
body.theme-beige .info-item { background: var(--panel-light); border-left-color: #C4A572; }
body.theme-beige .info-item strong { color: #4a443a; }
body.theme-beige .oeuvre-card { background: var(--panel-light); border-color: #C4A572; }
body.theme-beige .citation { background: var(--panel-light); border-left-color: #C4A572; }

body.theme-noir .author-name { color: #e8e8e8; }
body.theme-noir .author-bio { color: #b0b8bc; }
body.theme-noir .tag { background: rgba(255, 255, 255, 0.06); color: #b0b8bc; border-color: rgba(255, 255, 255, 0.1); }
body.theme-noir .info-item { background: var(--panel-light); border-left-color: var(--accent); }
body.theme-noir .info-item strong { color: #e8e8e8; }
body.theme-noir .oeuvre-card { background: var(--panel-light); border-color: rgba(255, 255, 255, 0.08); }
body.theme-noir .oeuvre-card h4 { color: #e8e8e8; }
body.theme-noir .oeuvre-year { color: #6b7b80; }
body.theme-noir .oeuvre-themes { color: #b0b8bc; }
body.theme-noir .citation { background: var(--panel-light); border-left-color: var(--accent); color: #b0b8bc; }
body.theme-noir .ref-section h4 { color: #e8e8e8; }
body.theme-noir .ref-section li { color: #b0b8bc; }
body.theme-noir .pdf-link { background: var(--accent); color: #fff; }
body.theme-noir .author-alt-names { color: #6b7b80; }
body.theme-noir .author-location { color: #b0b8bc; }

/* ================================================================ */
/*  P5. LISTE AUTEURS                                              */
/* ================================================================ */

body.theme-beige .authors-header h1 { color: var(--text-primary); }
body.theme-beige .authors-search-container input {
  border-color: #C4A572;
  background: var(--panel-light);
}
body.theme-beige .author-card { background: var(--panel-light); border-color: #CBAF80; }
body.theme-beige .author-avatar { background: #D8C395; color: #8c7b6c; }

body.theme-noir .authors-header h1 { color: #e8e8e8; }
body.theme-noir .authors-search-container input {
  border-color: rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.06);
  color: #e8e8e8;
}
body.theme-noir .authors-search-container input:focus {
  border-color: var(--accent);
  background: rgba(255, 255, 255, 0.08);
}
body.theme-noir .author-card {
  background: var(--panel-light);
  border-color: rgba(255, 255, 255, 0.06);
}
body.theme-noir .author-card:hover { border-color: rgba(255, 255, 255, 0.15); }
body.theme-noir .author-avatar { background: rgba(255, 255, 255, 0.06); color: #6b7b80; }
body.theme-noir .author-name { color: #e8e8e8; }
body.theme-noir .author-dates { color: #6b7b80; }
body.theme-noir .author-bio-excerpt { color: #b0b8bc; }
body.theme-noir .loading-authors,
body.theme-noir .no-authors { color: #6b7b80; }

/* ================================================================ */
/*  P6. MES NOTES                                                  */
/* ================================================================ */


body.theme-beige .note-header { border-bottom-color: #CBAF80; }
body.theme-beige .book-title { color: var(--text-primary); }
body.theme-beige .selected-text { color: var(--text-secondary); background: var(--panel); }
body.theme-beige .user-note { color: var(--text-primary); }
body.theme-beige .note-footer { border-top-color: #CBAF80; }

body.theme-noir .note-header { border-bottom-color: rgba(255, 255, 255, 0.06); }
body.theme-noir .book-title { color: #e8e8e8; }
body.theme-noir .note-date { color: #6b7b80; }
body.theme-noir .selected-text { color: #b0b8bc; background: rgba(255, 255, 255, 0.04); }
body.theme-noir .user-note { color: #e8e8e8; }

body.theme-noir .note-footer { border-top-color: rgba(255, 255, 255, 0.06); }
body.theme-noir .access-book-btn { border-color: rgba(255, 255, 255, 0.1); color: #b0b8bc; }
body.theme-noir .access-book-btn:hover { background: rgba(255, 255, 255, 0.06); }
body.theme-noir .action-btn { border-color: rgba(255, 255, 255, 0.1); color: #b0b8bc; }

/* Pagination notes */
body.theme-noir .pagination-btn,
body.theme-noir .pagination-number {
  border-color: rgba(255, 255, 255, 0.1);
  color: #b0b8bc;
}
body.theme-noir .pagination-number:hover { background: rgba(255, 255, 255, 0.06); }
body.theme-noir .pagination-info { color: #6b7b80; }

/* Filter modal notes */
body.theme-noir .popup-header { border-bottom-color: rgba(255, 255, 255, 0.08); }
body.theme-noir .popup-title { color: #e8e8e8; }
body.theme-noir .filter-section-title { color: #b0b8bc; }
body.theme-noir .filter-modal-actions { border-top-color: rgba(255, 255, 255, 0.08); }
body.theme-noir .btn-secondary { border-color: rgba(255, 255, 255, 0.1); color: #b0b8bc; }

/* Kanban notes */
body.theme-noir .kanban-column { background: var(--panel); border-color: rgba(255, 255, 255, 0.06); }
body.theme-noir .kanban-header { border-bottom-color: rgba(255, 255, 255, 0.08); background: var(--panel); }
body.theme-noir .kanban-count { color: #6b7b80; }

/* Search box notes */
body.theme-noir .notes-search-box input {
  border-color: rgba(255, 255, 255, 0.1);
  background: rgba(255, 255, 255, 0.06);
  color: #e8e8e8;
}
body.theme-noir .search-box svg { color: #6b7b80; }
body.theme-noir .notes-stats { color: #6b7b80; }

/* Filters button & view buttons (mes-notes) */
body.theme-noir .filters-btn {
  background: rgba(255, 255, 255, 0.06);
  color: #e8e8e8;
  border-color: rgba(255, 255, 255, 0.1);
}
body.theme-noir .filters-btn:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #e8e8e8;
  border-color: var(--accent);
}
body.theme-noir .filters-btn.active {
  background: var(--accent, #4a9178);
  color: #fff;
  border-color: var(--accent, #4a9178);
}
/* .view-btn / .view-controls (thème sombre) — style commun avec les onglets
   de Bibliothèque et les dispositions d'Auteurs, voir public/toolbar-shared.css */

/* Library controls (sort) in dark mode */
body.theme-noir .library-sort-controls select {
  color: #e8e8e8;
  background: var(--panel-light);
  border-color: rgba(255, 255, 255, 0.1);
}

/* ================================================================ */
/*  P7. LECTURE                                                    */
/* ================================================================ */

/* Sidebar lecture — beige */
body.theme-beige .sidebar-column { background-color: var(--panel); color: #3d2b1a; }
body.theme-beige .sidebar-tabs { border-bottom-color: #c5b99b; }
body.theme-beige .sidebar-tab { background: #e0d6c2; color: #6b5344; }
body.theme-beige .sidebar-tab:hover { background: #d8ccb5; }
body.theme-beige .sidebar-tab.active { background: #ede5d3; color: #3d5a2e; border-bottom-color: #3d5a2e; }
body.theme-beige .sidebar-widget h3 { color: #6b5344; }
body.theme-beige .toc-item { background: #f5f0e6; color: #3d2b1a; border-left-color: #c5b99b; }
body.theme-beige .toc-item:hover { background: #ece4d0; }
body.theme-beige .search-box input { color: #3d2b1a; border-color: #c5b99b; }
body.theme-beige .notes-stats span { color: #8b7355 !important; }
body.theme-beige .stopwatch-display { color: #3d2b1a; }
body.theme-beige .stopwatch-widget h3 { color: #8b7355; }
body.theme-beige .sidebar-toggle-bar { background: var(--panel); }
body.theme-beige .sidebar-toggle-bar:hover { background: rgba(61, 90, 46, 0.15); }
body.theme-beige .sidebar-toggle-bar-chev { border-color: #3d5a2e; }
body.theme-beige #notes-list::-webkit-scrollbar-track { background: #d8ccb5; }
body.theme-beige #notes-list::-webkit-scrollbar-thumb { background: #b0a08a; }
body.theme-beige #notes-list::-webkit-scrollbar-thumb:hover { background: #8b7355; }

/* Sidebar lecture — noir */
body.theme-noir .sidebar-column { background-color: var(--panel); color: #ddd; }
body.theme-noir .sidebar-tabs { border-bottom-color: #444; }
body.theme-noir .sidebar-tab { background: #333a40; color: #aaa; }
body.theme-noir .sidebar-tab:hover { background: #3a4248; }
body.theme-noir .sidebar-tab.active { background: #2a3035; color: #8bddba; border-bottom-color: #8bddba; }
body.theme-noir .sidebar-widget h3 { color: #aaa; }
body.theme-noir .sidebar-toggle-bar { background: var(--panel); }
body.theme-noir .toc-item { background: #333a40; color: #ddd; border-left-color: #555; }
body.theme-noir .toc-item:hover { background: #3a4248; }
body.theme-noir .search-box input { background: #333a40; color: #ddd; border-color: #444; }
body.theme-noir .notes-stats span { color: #888 !important; }
body.theme-noir #notes-list::-webkit-scrollbar-track { background: #3a4248; }
body.theme-noir #notes-list::-webkit-scrollbar-thumb { background: #666; }
body.theme-noir #notes-list::-webkit-scrollbar-thumb:hover { background: #888; }
body.theme-noir .stopwatch-display { color: #aaa; }

/* Navigation lecture */
body.theme-beige .book-navigation { background-color: var(--panel); }
body.theme-beige .nav-btn { background: var(--panel-light); border-color: #C4A572; color: var(--text-secondary); }
body.theme-beige .page-indicator { color: var(--text-secondary); }
body.theme-beige .book-badge { color: var(--text-primary); background: var(--panel); border-color: #C4A572; }

body.theme-noir .book-navigation { background-color: var(--panel); }
body.theme-noir .nav-btn { background: var(--panel-light); border-color: rgba(255, 255, 255, 0.1); color: #b0b8bc; }
body.theme-noir .nav-btn:disabled { background: rgba(255, 255, 255, 0.03); border-color: rgba(255, 255, 255, 0.05); color: #6b7b80; }
body.theme-noir .page-indicator { color: #b0b8bc; }
body.theme-noir .book-badge { color: #e8e8e8; background: var(--panel-light); border-color: rgba(255, 255, 255, 0.1); }

/* Header lecture */
body.theme-beige .book-header h1 { color: var(--text-primary); }
body.theme-noir .book-header h1 { color: #e8e8e8; }

/* Sidebar toggle — règles supplémentaires */

/* Widgets sidebar — éléments non couverts ci-dessus */
body.theme-noir .search-box,
body.theme-noir .note-input { background: var(--panel-light); color: #e8e8e8; }
body.theme-noir .notes-count { color: #b0b8bc; }
body.theme-noir .author-info p { color: #b0b8bc; }
body.theme-noir .book-thumb-title { color: #e8e8e8; }

/* Popup minuteur */
body.theme-noir .minuteur-popup-content {
  background: var(--panel-light);
}
body.theme-noir .minuteur-popup-message { color: #e8e8e8; }
body.theme-noir .timer-duration {
  border-color: rgba(255, 255, 255, 0.1);
  background: var(--panel);
  color: #e8e8e8;
}

body.theme-noir .timer-settings {
  border-top-color: rgba(255, 255, 255, 0.1);
}
body.theme-noir .timer-settings-label {
  color: #6b7b80;
}
body.theme-noir .timer-adjust-btn {
  background: var(--panel);
  border-color: rgba(255, 255, 255, 0.1);
  color: #b0b8bc;
}
body.theme-noir .timer-unit {
  color: #6b7b80;
}

/* Selection action */
body.theme-beige .selection-action-btn {
  background: var(--panel);
  color: #6b5344;
}
body.theme-beige .selection-action-btn:hover {
  background: rgba(0, 0, 0, 0.06);
}
body.theme-noir .selection-action-btn {
  background: transparent;
  color: #e8e8e8;
}
body.theme-noir .selection-action-btn:hover {
  background: rgba(255, 255, 255, 0.12);
}

/* ================================================================ */
/*  P8. MENTIONS LÉGALES                                           */
/* ================================================================ */

body.theme-noir .mentions-content { color: #b0b8bc; }
body.theme-noir .mentions-content h2 { color: #e8e8e8; }
body.theme-noir .mentions-content a { color: var(--accent-light); }

/* ================================================================ */
/*  P9. PDF — Viewer, toolbar, TOC, modals                        */
/* ================================================================ */

/* --- Beige --- */
body.theme-beige .hero-left { --pdf-bg-secondary: #ddd0ba; }
body.theme-beige .pdf-viewer-container {
  background: #F0E8D8;
  border-color: #C4A572;
}
body.theme-beige .pdf-viewer-header {
  background: var(--panel-light);
  border-bottom-color: #C4A572;
}
body.theme-beige .pdf-viewer-body { background: #d8cebb; }
body.theme-beige .pdf-viewer-input,
body.theme-beige .pdf-viewer-select,
body.theme-beige .pdf-viewer-page-input {
  background: var(--panel-light);
  border-color: #C4A572;
  color: var(--text-primary);
}
body.theme-beige .pdf-viewer-input:focus {
  background: var(--panel-light);
  border-color: #8b7355;
}
body.theme-beige .pdf-viewer-btn {
  color: var(--text-primary);
  border-color: #C4A572;
}
body.theme-beige .pdf-viewer-btn:hover {
  background: #D8C395;
  color: #8b7355;
  border-color: #8b7355;
}
body.theme-beige .pdf-viewer-btn.pdf-viewer-ghost {
  color: var(--text-secondary);
  border-color: #C4A572;
}
body.theme-beige .pdf-viewer-btn.pdf-viewer-ghost:hover {
  background: #D8C395;
  color: #8b7355;
}
body.theme-beige .pdf-viewer-btn.pdf-viewer-close { color: var(--text-secondary); }
body.theme-beige .pdf-viewer-btn.pdf-viewer-close:hover {
  background: #D8C395;
  color: var(--text-primary);
}
body.theme-beige .pdf-viewer-controls-group { background: var(--panel); border-color: #C4A572; }
body.theme-beige .pdf-viewer-separator { background: #C4A572; }
body.theme-beige .pdf-viewer-zoom-label { color: var(--text-primary); }
body.theme-beige .pdf-viewer-status,
body.theme-beige .pdf-viewer-note { color: var(--text-secondary); }

/* PDF TOC */
body.theme-beige .pdf-toc-panel { background: var(--panel); }
body.theme-beige .pdf-toc-content { background: #EBD8B4; }
body.theme-beige .pdf-toc-header h3 { color: var(--text-primary); }
body.theme-beige .pdf-toc-close { color: var(--text-secondary); }
body.theme-beige .pdf-toc-close:hover { background: #D8C395; color: var(--text-primary); }
body.theme-beige .pdf-toc-item { color: var(--text-primary); }
body.theme-beige .pdf-toc-item:hover { background: #D8C395; color: #8b7355; }
body.theme-beige .pdf-toc-toggle { color: var(--muted); }
body.theme-beige .pdf-toc-toggle:hover { background: #D8C395; color: var(--text-primary); }
body.theme-beige .pdf-toc-expand-btn { color: var(--text-secondary); border-color: #C4A572; }
body.theme-beige .pdf-toc-expand-btn:hover { background: #D8C395; color: var(--text-primary); }
body.theme-beige .pdf-toc-content::-webkit-scrollbar-track { background: var(--panel); }
body.theme-beige .pdf-toc-content::-webkit-scrollbar-thumb { background: #c4b99e; }

/* PDF Compare modal */
body.theme-beige .pdf-compare-modal-content { background: var(--panel-light); border-color: #C4A572; }
body.theme-beige .pdf-compare-modal-header { background: var(--panel); border-bottom-color: #C4A572; }
body.theme-beige .pdf-compare-modal-header h3 { color: var(--text-primary); }
body.theme-beige .pdf-compare-book-item { color: var(--text-primary); }
body.theme-beige .pdf-compare-book-item:hover { background: #D8C395; color: #8b7355; }
body.theme-beige .pdf-compare-book-item .book-category { color: var(--muted); }

/* PDF Shared toolbar */
body.theme-beige .pdf-shared-toolbar { background: var(--panel-light); border-color: #C4A572; }
body.theme-beige .pdf-shared-search-group { background: var(--panel); border-color: #C4A572; }

/* PDF Selection & Search popup */
body.theme-beige #pdfSelectionPopup { background: var(--panel-light); border-color: #C4A572; }
body.theme-beige .pdf-selection-action-btn { background: var(--panel); color: #6b5344; }
body.theme-beige .pdf-selection-action-btn:hover { background: rgba(0,0,0,0.06); }
body.theme-beige .search-popup { background: var(--panel-light); }
body.theme-beige .search-popup input { border-color: #C4A572; background: var(--panel-light); color: var(--text-primary); }
body.theme-beige .pdf-search-popup-doc-btn { background: var(--panel); color: var(--text-secondary); border-color: #C4A572; }
/* .active doit rester visuellement distinct du bouton inactif — sans cette
   surcharge, la règle générique ci-dessus (même spécificité + sélecteur body
   plus long) l'emportait sur .pdf-search-popup-doc-btn.active (pdf-style.css),
   rendant le bouton actif quasi indiscernable de l'inactif. */
body.theme-beige .pdf-search-popup-doc-btn.active { background: var(--accent, #1A5238); color: #fff; border-color: var(--accent, #1A5238); }

/* PDF compare title */
body.theme-beige .pdf-compare-title-label { color: var(--text-primary); }

/* --- Noir --- */
body.theme-noir .hero-left { --pdf-bg-secondary: #1a1e21; }
body.theme-noir .pdf-viewer-container {
  background: var(--panel);
  border-color: rgba(255, 255, 255, 0.08);
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.3);
}
body.theme-noir .pdf-viewer-header {
  background: var(--panel-light);
  border-bottom-color: rgba(255, 255, 255, 0.08);
}
body.theme-noir .pdf-viewer-body { background: #1a1e21; }
body.theme-noir .pdf-viewer-input,
body.theme-noir .pdf-viewer-select,
body.theme-noir .pdf-viewer-page-input {
  background: var(--panel);
  border-color: rgba(255, 255, 255, 0.1);
  color: #e8e8e8;
}
body.theme-noir .pdf-viewer-input::placeholder { color: #6b7b80; }
body.theme-noir .pdf-viewer-input:focus {
  background: var(--panel);
  border-color: var(--accent);
}
body.theme-noir .pdf-viewer-btn {
  color: #b0b8bc;
  border-color: rgba(255, 255, 255, 0.1);
}
body.theme-noir .pdf-viewer-btn:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #e8e8e8;
  border-color: rgba(255, 255, 255, 0.2);
}
body.theme-noir .pdf-viewer-btn.pdf-viewer-ghost {
  color: #b0b8bc;
  border-color: rgba(255, 255, 255, 0.06);
}
body.theme-noir .pdf-viewer-btn.pdf-viewer-ghost:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #e8e8e8;
}
body.theme-noir .pdf-viewer-btn.pdf-viewer-close { color: #6b7b80; }
body.theme-noir .pdf-viewer-btn.pdf-viewer-close:hover {
  background: rgba(255, 255, 255, 0.08);
  color: #e8e8e8;
}
body.theme-noir .pdf-viewer-controls-group { background: rgba(255, 255, 255, 0.04); border-color: rgba(255, 255, 255, 0.08); }
body.theme-noir .pdf-viewer-separator { background: rgba(255, 255, 255, 0.08); }
body.theme-noir .pdf-viewer-zoom-label { color: #e8e8e8; }
body.theme-noir .pdf-viewer-status,
body.theme-noir .pdf-viewer-note { color: #6b7b80; }

/* PDF TOC dark */
body.theme-noir .pdf-toc-panel { background: var(--panel); }
body.theme-noir .pdf-toc-content { background: var(--panel-light); }
body.theme-noir .pdf-toc-header h3 { color: #e8e8e8; }
body.theme-noir .pdf-toc-close { color: #6b7b80; }
body.theme-noir .pdf-toc-close:hover { background: rgba(255, 255, 255, 0.08); color: #e8e8e8; }
body.theme-noir .pdf-toc-empty { color: #6b7b80; }
body.theme-noir .pdf-toc-item { color: #b0b8bc; }
body.theme-noir .pdf-toc-item:hover { background: rgba(255, 255, 255, 0.06); color: var(--accent-light); }
body.theme-noir .pdf-toc-item.level-3 { color: #6b7b80; }
body.theme-noir .pdf-toc-toggle { color: #6b7b80; }
body.theme-noir .pdf-toc-toggle:hover { background: rgba(255, 255, 255, 0.06); color: #b0b8bc; }
body.theme-noir .pdf-toc-expand-btn { color: #6b7b80; border-color: rgba(255, 255, 255, 0.1); }
body.theme-noir .pdf-toc-expand-btn:hover { background: rgba(255, 255, 255, 0.06); color: #b0b8bc; border-color: rgba(255, 255, 255, 0.15); }
body.theme-noir .pdf-toc-content::-webkit-scrollbar-track { background: var(--panel); }
body.theme-noir .pdf-toc-content::-webkit-scrollbar-thumb { background: #3a4f52; }
body.theme-noir .pdf-toc-content::-webkit-scrollbar-thumb:hover { background: #4a6568; }

/* PDF Compare modal dark */
body.theme-noir .pdf-compare-modal-content { background: var(--panel-light); border-color: rgba(255, 255, 255, 0.1); }
body.theme-noir .pdf-compare-modal-header { background: var(--panel); border-bottom-color: rgba(255, 255, 255, 0.08); }
body.theme-noir .pdf-compare-modal-header h3 { color: #e8e8e8; }
body.theme-noir .pdf-compare-book-item { color: #b0b8bc; }
body.theme-noir .pdf-compare-book-item:hover { background: rgba(255, 255, 255, 0.06); color: var(--accent-light); }
body.theme-noir .pdf-compare-book-item .book-category { color: #6b7b80; }

/* PDF Shared toolbar dark */
body.theme-noir .pdf-shared-toolbar { background: var(--panel-light); border-color: rgba(255, 255, 255, 0.08); }
body.theme-noir .pdf-shared-search-group { background: rgba(255, 255, 255, 0.04); border-color: rgba(255, 255, 255, 0.08); }
body.theme-noir .pdf-shared-title-left { color: #b0b8bc; }
body.theme-noir .pdf-shared-title-right { color: var(--accent-light); }

/* PDF Selection & Search popup dark */
body.theme-noir #pdfSelectionPopup { background: var(--panel-light); border-color: var(--accent); }
body.theme-noir .pdf-selection-action-btn { background: transparent; color: #e8e8e8; }
body.theme-noir .pdf-selection-action-btn:hover { background: rgba(255, 255, 255, 0.08); }
body.theme-noir .search-popup { background: var(--panel-light); border-color: var(--accent-gold, #b89e14); }
body.theme-noir .search-popup input { border-color: rgba(255, 255, 255, 0.1); background: var(--panel); color: #e8e8e8; }
body.theme-noir .search-popup-nav { background: var(--accent-gold, #b89e14); }
body.theme-noir .search-popup-nav:hover:not(:disabled) { background: var(--accent-gold-light, #d4af5f); }
body.theme-noir .pdf-search-popup-doc-btn { background: var(--panel); color: #b0b8bc; border-color: rgba(255, 255, 255, 0.1); }
/* .active doit rester visuellement distinct du bouton inactif — même raison
   que la surcharge équivalente en thème beige ci-dessus. Doré (pas vert) en
   thème sombre : c'est déjà l'accent utilisé pour les éléments actifs de ce
   thème (cf. .search-popup-nav ci-dessus), le vert s'y fond davantage. */
body.theme-noir .pdf-search-popup-doc-btn.active { background: var(--accent-gold, #b89e14); color: #fff; border-color: var(--accent-gold, #b89e14); }
body.theme-noir .pdf-compare-title-label { color: #e8e8e8; }

/* Compare fullscreen dark background */
body.theme-noir .hero-left:fullscreen,
body.theme-noir .hero-left:-webkit-full-screen {
  background: #111;
}
body.theme-noir .hero-left:fullscreen.compare-active,
body.theme-noir .hero-left:-webkit-full-screen.compare-active {
  background: #111;
}

/* Compare fullscreen beige background */
body.theme-beige .hero-left:fullscreen,
body.theme-beige .hero-left:-webkit-full-screen {
  background: #C4A572;
}
body.theme-beige .hero-left:fullscreen.compare-active,
body.theme-beige .hero-left:-webkit-full-screen.compare-active {
  background: #C4A572;
}

/* ================================================================ */
/*  P10. XMIND — Mind map, controls, search, nodes                */
/* ================================================================ */

/* --- Beige --- */
body.theme-beige .xmind-container {
  background: var(--panel);
}

body.theme-beige .xmind-container:fullscreen .xmind-controls,
body.theme-beige .xmind-container.simulated-fullscreen .xmind-controls {
  background: var(--mm-ctrl-bg, #e2cc9f);
}
body.theme-beige .xmind-controls {
  background: var(--mm-ctrl-bg, #e2cc9f);
}
body.theme-beige .zoom-slider-container {
  background: rgba(0, 0, 0, 0.04);
}
body.theme-beige .node { border-color: #C4A572; }
body.theme-beige .node-content { color: var(--text-primary); }
body.theme-beige .search-input {
  border-color: #C4A572;
  background: var(--panel-light);
  color: var(--text-primary);
}
body.theme-beige .search-input:focus { border-color: #8b7355; }
body.theme-beige .search-btn {
  background: var(--panel-light);
  color: var(--text-secondary);
  border-color: #C4A572;
}
body.theme-beige .search-btn:hover { background: #D8C395; }
body.theme-beige .zoom-label, body.theme-beige .zoom-btn { color: var(--text-secondary); }
body.theme-beige .search-count { color: var(--muted); }
body.theme-beige .empty-message { color: var(--muted); }
body.theme-beige .central-root .node {
  background: linear-gradient(135deg, var(--panel-light), var(--panel));
  border-color: var(--text-primary);
}
body.theme-beige .back-button-xmind {
  background: rgba(226, 204, 159, 0.95);
  color: var(--text-primary);
  border-color: #C4A572;
}
body.theme-beige .back-button-xmind:hover {
  background: var(--panel-light);
}
/* --- Noir --- */
body.theme-noir .xmind-container {
  background: var(--panel);
}
body.theme-noir .xmind-container:fullscreen,
body.theme-noir .xmind-container.simulated-fullscreen {
  background: var(--panel);
}
body.theme-noir .xmind-container:fullscreen .xmind-controls,
body.theme-noir .xmind-container.simulated-fullscreen .xmind-controls {
  background: var(--mm-ctrl-bg, #1e1e2e);
}
body.theme-noir .xmind-controls {
  background: var(--mm-ctrl-bg, #1e1e2e);
}
body.theme-noir .zoom-slider-container {
  background: rgba(255, 255, 255, 0.06);
}
body.theme-noir .node {
  background: var(--panel-light);
  border-color: rgba(255, 255, 255, 0.12);
}
body.theme-noir .node-content { color: #e8e8e8 !important; }
body.theme-noir .node-content * { color: #e8e8e8 !important; }
body.theme-noir #mindmap-content { color: #e8e8e8; }
body.theme-noir #mindmap-content .node-content { color: #e8e8e8 !important; }
body.theme-noir .search-input {
  border-color: rgba(255, 255, 255, 0.1);
  background: var(--panel);
  color: #e8e8e8;
}
body.theme-noir .search-input::placeholder { color: #6b7b80; }
body.theme-noir .search-input:focus { border-color: var(--accent); }
body.theme-noir .search-btn {
  background: var(--panel);
  color: #b0b8bc;
  border-color: rgba(255, 255, 255, 0.1);
}
body.theme-noir .search-btn:hover { background: rgba(255, 255, 255, 0.08); color: #e8e8e8; }
body.theme-noir .zoom-label, body.theme-noir .zoom-btn { color: #6b7b80; }
body.theme-noir .search-count { color: #6b7b80; }
body.theme-noir .empty-message { color: #6b7b80; }
body.theme-noir .central-root .node {
  background: linear-gradient(135deg, var(--panel-light), var(--panel));
  border-color: rgba(255, 255, 255, 0.2);
}
body.theme-noir .node.search-active { background: rgba(74, 145, 120, 0.15); }
body.theme-noir .search-hit { background: rgba(255, 200, 0, 0.25); }
body.theme-noir .search-hit.active-hit { background: rgba(255, 180, 0, 0.4); }
body.theme-noir .toggle-btn { border-color: rgba(255, 255, 255, 0.15); }

/* XMind branch colors in dark mode — remplace les pastels clairs par des teintes sombres.
   !important requis : les règles .layout-map-clockwise .branches-left > .branch:nth-child(N) > .node
   ont une spécificité plus haute (5 classes) et écrasaient ces overrides (3 classes). */
body.theme-noir .branch:nth-child(6n+1) > .node { background: rgba(100, 80, 130, 0.3) !important; }
body.theme-noir .branch:nth-child(6n+2) > .node { background: rgba(60, 100, 140, 0.3) !important; }
body.theme-noir .branch:nth-child(6n+3) > .node { background: rgba(140, 70, 70, 0.3)  !important; }
body.theme-noir .branch:nth-child(6n+4) > .node { background: rgba(140, 100, 60, 0.3) !important; }
body.theme-noir .branch:nth-child(6n+5) > .node { background: rgba(60, 120, 80, 0.3)  !important; }
body.theme-noir .branch:nth-child(6n+6) > .node { background: rgba(50, 120, 110, 0.3) !important; }

body.theme-noir .summary-label {
  background: linear-gradient(135deg, rgba(74, 145, 120, 0.2), rgba(74, 145, 120, 0.15));
  color: var(--accent-light);
  border-color: rgba(74, 145, 120, 0.3);
}
body.theme-noir .summary-node {
  background: linear-gradient(135deg, rgba(74, 145, 120, 0.15), rgba(74, 145, 120, 0.1)) !important;
  border-color: rgba(74, 145, 120, 0.3) !important;
}

/* Floating topics dark */
body.theme-noir .floating-topic > .node {
  background: linear-gradient(135deg, rgba(140, 70, 70, 0.2), rgba(140, 50, 50, 0.15)) !important;
}
body.theme-noir .floating-topic-root > .node {
  background: linear-gradient(135deg, rgba(140, 100, 50, 0.2), rgba(140, 80, 30, 0.15)) !important;
}

/* Boundary dark */
body.theme-noir .boundary-overlay {
  background: rgba(77, 208, 225, 0.06);
  border-color: rgba(77, 208, 225, 0.3);
}
body.theme-noir .boundary-title { background: rgba(77, 208, 225, 0.8); }
body.theme-noir #structureBadge { background: rgba(74, 145, 120, 0.9); }

/* ============================================================ */
/* P11 — PATH HIGHLIGHT PARTAGÉ (mindmap-path-highlight.js)     */
/* Mise en avant du chemin au survol dans les cartes mentales    */
/* ============================================================ */

/* Transition par défaut sur tous les éléments SVG de mindmap */
#mindmap-svg line,
#mindmap-svg path {
  transition: opacity 0.25s ease;
}

/* Nœuds mis en avant */
.mm-path-highlight {
  filter: brightness(1.1) !important;
  z-index: 100 !important;
  transition: filter 0.25s ease, opacity 0.25s ease;
}

/* Nœuds assombris — légèrement estompés + transparents.
   Peu d'assombrissement (brightness proche de 1) + opacity modérée
   → les couleurs restent lisibles, l'effet "secondaire" vient surtout
   de la transparence et d'une légère décoloration. */
.mm-path-dimmed {
  filter: brightness(0.82) saturate(0.5) !important;
  opacity: 0.55 !important;
  transition: filter 0.25s ease, opacity 0.25s ease;
}

/* Clusters assombris (circulaire) — transparence pure, pas de darkening.
   L'enfant .mm-path-dimmed a son propre filter neutralisé ci-dessous
   pour éviter le cumul parent × enfant. */
.mm-path-dimmed-cluster {
  filter: none !important;
  opacity: 0.35 !important;
  transition: filter 0.25s ease, opacity 0.25s ease;
}

/* Neutraliser le filter des nœuds enfants dans un cluster dimmed
   (le cluster parent gère déjà l'opacity — pas de double application). */
.mm-path-dimmed-cluster .node.mm-path-dimmed {
  filter: none !important;
  opacity: 1 !important;
}

/* Traits SVG mis en avant (éclaircis) */
#mindmap-svg line.mm-path-highlight,
#mindmap-svg path.mm-path-highlight {
  opacity: 1 !important;
  transition: opacity 0.25s ease;
}

/* Traits SVG assombris */
#mindmap-svg line.mm-path-dimmed,
#mindmap-svg path.mm-path-dimmed {
  opacity: 0.15 !important;
  transition: opacity 0.25s ease;
}

/* Branches assombries (xmind) — même approche, pas d'opacity
   car les nœuds enfants ont déjà leur propre mm-path-dimmed. */
.branch.mm-path-dimmed {
  /* pas d'opacity pour éviter le cumul avec les .node enfants */
  transition: opacity 0.25s ease;
}

/* Livres dans le MÊME cluster que le survolé — transparence identique
   au traitement des autres clusters pour un rendu uniforme. */
.category-cluster:not(.mm-path-dimmed-cluster) .node.mm-path-dimmed {
  opacity: 0.35 !important;
  filter: brightness(0.9) saturate(0.5) !important;
}

/* Neutraliser le dimming du background circle dans un cluster dimmed
   (le cluster gère déjà l'opacity globalement). */
.mm-path-dimmed-cluster .category-background-circle.mm-path-dimmed {
  filter: none !important;
  opacity: 1 !important;
}

/* Les nœuds highlighted dans un cluster dimmed restent pleinement visibles */
.mm-path-dimmed-cluster .mm-path-highlight {
  filter: brightness(1.1) !important;
  opacity: 1 !important;
}

/* Thème noir : ajustements */
body.theme-noir .mm-path-dimmed {
  filter: brightness(0.7) saturate(0.4) !important;
  opacity: 0.5 !important;
}

body.theme-noir .mm-path-dimmed-cluster {
  filter: none !important;
  opacity: 0.3 !important;
}

body.theme-noir .mm-path-highlight {
  filter: brightness(1.2) !important;
}

body.theme-noir #mindmap-svg line.mm-path-dimmed,
body.theme-noir #mindmap-svg path.mm-path-dimmed {
  opacity: 0.12 !important;
}

/* ── xmind spécifique ──────────────────────────────────────────────────────
   Approche couleur directe : on ne touche pas à opacity ni brightness.
   Texte #555 sur fond #f0f0f0 → contraste ~5.7:1 (AA), clairement
   secondaire visuellement sans sacrifier la lisibilité.
   Valable pour les thèmes blanc ET beige (fond clair).
   Exclusion des nœuds circulaires (livres, catégories, racine) qui utilisent
   l'approche opacity/filter standard. */
.xmind-container .node.mm-path-dimmed:not(.book-node):not(.category-node):not(.root-node) {
  opacity: 1 !important;
  filter: none !important;
  color: #555 !important;
  background: #f0f0f0 !important;
  border-color: #d0d0d0 !important;
  box-shadow: none !important;
}
.xmind-container .node.mm-path-dimmed:not(.book-node):not(.category-node):not(.root-node) .node-content {
  color: #555 !important;
}

/* Thème beige : le fond page est beige, on reste dans les tons neutres */
body.theme-beige .xmind-container .node.mm-path-dimmed:not(.book-node):not(.category-node):not(.root-node) {
  color: #666 !important;
  background: #ede8e0 !important;
  border-color: #ccc3b0 !important;
}
body.theme-beige .xmind-container .node.mm-path-dimmed:not(.book-node):not(.category-node):not(.root-node) .node-content {
  color: #666 !important;
}

/* Thème noir : fond sombre → texte gris clair visible */
body.theme-noir .xmind-container .node.mm-path-dimmed:not(.book-node):not(.category-node):not(.root-node) {
  opacity: 1 !important;
  filter: none !important;
  color: #888 !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border-color: rgba(255, 255, 255, 0.15) !important;
  box-shadow: none !important;
}
body.theme-noir .xmind-container .node.mm-path-dimmed:not(.book-node):not(.category-node):not(.root-node) .node-content {
  color: #888 !important;
}

/* ================================================================ */
/*  Iktisar Story Popup — adapté par thème                         */
/* ================================================================ */

body.theme-blanc .iktisar-story-popup {
  background: #ffffff;
  border-color: rgba(0, 0, 0, 0.08);
}
body.theme-blanc .iktisar-story-chapter p,
body.theme-blanc .iktisar-story-chapter ul li {
  color: var(--text-secondary);
}

body.theme-beige .iktisar-story-popup {
  background: var(--panel-light);
  border-color: #C4A572;
}

body.theme-noir .iktisar-story-popup {
  background: var(--panel-light);
  border-color: var(--accent);
}
body.theme-noir .iktisar-story-title {
  color: var(--accent-gold, #C9A84C);
}
body.theme-noir .iktisar-story-chapter h3 {
  color: var(--accent-gold, #C9A84C);
  border-bottom-color: var(--accent-gold, #C9A84C);
}
body.theme-noir .iktisar-story-chapter p,
body.theme-noir .iktisar-story-chapter ul li {
  color: var(--text-secondary);
}
body.theme-noir .iktisar-story-arabic {
  color: var(--accent-gold, #C9A84C);
}
body.theme-noir .iktisar-story-quote {
  color: var(--accent-gold, #C9A84C) !important;
  border-left-color: var(--accent-gold, #C9A84C);
}
body.theme-noir .iktisar-story-dua {
  color: var(--accent-gold, #C9A84C) !important;
}
body.theme-noir .notif-card-unread {
  border-left-color: var(--accent-gold, #C9A84C);
}
body.theme-noir .iktisar-story-logo {
  filter: brightness(0) saturate(100%) invert(65%) sepia(73%) saturate(700%) hue-rotate(5deg) brightness(92%);
}

/* ================================================================ */
/*  Tutoriel Popover — adapté par thème                           */
/* ================================================================ */

/* Thème blanc */
body.theme-blanc .tutorial-popover {
  background: #ffffff;
  border-color: rgba(0, 0, 0, 0.08);
}
body.theme-blanc .tutorial-popover::after {
  background: #ffffff;
}

/* Thème beige — variables suffisent, rien à surcharger */

/* Thème noir — doré à la place du vert */
body.theme-noir .tutorial-popover {
  background: var(--panel-light);
  border-color: var(--accent-gold, #b89e14);
  box-shadow: 0 12px 40px rgba(0, 0, 0, 0.55);
}
body.theme-noir .tutorial-popover::after {
  background: var(--panel-light);
  border-color: var(--accent-gold, #b89e14);
}
body.theme-noir .tutorial-content h3 {
  color: var(--accent-gold, #C9A84C);
}
body.theme-noir .tutorial-btn-next {
  background: var(--accent-gold-light, #d4af5f);
}
body.theme-noir .tutorial-btn-next:hover {
  background: var(--accent-gold, #b89e14);
  box-shadow: 0 4px 12px rgba(212, 175, 95, 0.3);
}

/* ================================================================ */
/*  Bouton Tutoriel — adapté par thème                             */
/* ================================================================ */

body.theme-blanc .btn-tutorial-trigger {
  background: var(--panel-light);
  border-color: rgba(26, 82, 56, 0.15);
  color: var(--accent);
}
body.theme-blanc .btn-tutorial-trigger:hover {
  background: var(--hover-bg);
}

body.theme-beige .btn-tutorial-trigger {
  background: var(--panel-light);
  border-color: rgba(26, 82, 56, 0.2);
  color: var(--accent);
}
body.theme-beige .btn-tutorial-trigger:hover {
  background: var(--panel);
}

body.theme-noir .btn-tutorial-trigger {
  background: var(--panel-light);
  border-color: var(--accent-gold, #b89e14);
  color: var(--accent-gold, #C9A84C);
}
body.theme-noir .btn-tutorial-trigger:hover {
  background: var(--panel);
  border-color: var(--accent-gold-light, #d4af5f);
}
body.theme-noir .btn-tutorial-trigger svg {
  color: var(--accent-gold, #b89e14);
}

/* ================================================================ */
/*  PAGE AUTEURS — thèmes sombre et beige                           */
/* ================================================================ */

body.theme-noir .featured-author-banner {
  background: rgba(30, 40, 45, 0.8);
  border-left-color: var(--accent);
  border-color: rgba(255, 255, 255, 0.08);
}
body.theme-noir .card-circle,
body.theme-noir .featured-circle,
body.theme-noir .recent-circle {
  border-color: rgba(255, 255, 255, 0.15);
}
body.theme-noir .card-circle::before,
body.theme-noir .featured-circle::before,
body.theme-noir .recent-circle::before {
  border-color: rgba(255, 255, 255, 0.1);
}
body.theme-noir .recent-card {
  background: rgba(30, 40, 45, 0.6);
  border-color: rgba(255, 255, 255, 0.07);
}
body.theme-noir .recent-card:hover {
  background: rgba(40, 52, 58, 0.85);
}
body.theme-noir .card-quote mark,
body.theme-noir .featured-quote mark {
  background-color: rgba(255, 220, 50, 0.2);
  color: #f0d060;
}
body.theme-noir .custom-select-btn {
  border-color: rgba(255, 255, 255, 0.12);
  color: #e8e8e8;
}
body.theme-noir .custom-select-list {
  background: var(--panel-light, #1e2a2e);
  border-color: rgba(255, 255, 255, 0.1);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4);
}
body.theme-noir .custom-select-item {
  color: #e8e8e8;
}
body.theme-noir .custom-select-item:hover,
body.theme-noir .custom-select-item.selected {
  background: rgba(74, 145, 120, 0.15);
  color: var(--accent-light);
}
body.theme-noir .sort-order-btn {
  border-color: rgba(255, 255, 255, 0.12);
  color: #b0b8bc;
}
body.theme-noir .authors-sort-controls select {
  border-color: rgba(255, 255, 255, 0.1);
  color: #e8e8e8;
}

/* Beige theme auteurs */
body.theme-beige .featured-author-banner {
  background: rgba(252, 248, 240, 0.8);
}

/* ================================================================ */
/* === OVERRIDES POUR LE THÈME MAQUETTE (Iktisar) === */
/* ================================================================ */

body.theme-maquette {
  --bg: #0E211F !important;
  --bg-alt: #0A1817 !important;
  --panel: #152724 !important;
  --panel-light: #1B322D !important;
  --text-primary: #E2D6BC !important;
  --authors-gold: #C7993F !important;
  --text-secondary: rgba(226, 214, 188, 0.7) !important;
  --muted: rgba(226, 214, 188, 0.4) !important;
  --accent: #C7993F !important;
  --accent-dark: #A57F34 !important;
  --accent-light: #DFB663 !important;
  --border-color: rgba(226, 214, 188, 0.1) !important;
  --hover-bg: rgba(226, 214, 188, 0.06) !important;
  --search-bg: rgba(0, 0, 0, 0.2) !important;
  
  --note-item-bg: #152724 !important;
  --note-item-hover-bg: #1B322D !important;
  --note-text-main: #E2D6BC !important;
  --note-text-sub: rgba(226, 214, 188, 0.7) !important;
  --note-text-small: rgba(226, 214, 188, 0.4) !important;
  --note-edit-btn: #C7993F !important;
  --note-tag-bg: rgba(199, 153, 63, 0.15) !important;
  --note-tag-color: #C7993F !important;
  --note-popup-bg: #152724 !important;
  --note-popup-border: rgba(199, 153, 63, 0.45) !important;
  
  background-color: #0E211F !important;
  
  /* Palette Carte SVG (Thème Maquette) - Base sombre, lignes dorées */
  --map-base: #ae7b43;
  --map-land: #7a5833;
  --map-coast: #483c27;
  --map-line1: rgba(165, 127, 52, 0.4);
  --map-line2: rgba(199, 153, 63, 0.6);
  --map-line3: #C7993F;
}

/* Écraser les couleurs "en dur" du theme-noir */
body.theme-maquette .wrap {
  background-color: #0E211F !important;
}

body.theme-maquette .sidebar,
body.theme-maquette .mentions-legales-sidebar {
  background-color: #0E211F !important; /* Sidebar same as bg, or slightly darker #0A1817 */
  border-right: 1px solid rgba(199, 153, 63, 0.15) !important; /* Ligne dorée subtile pour séparer */
}

body.theme-maquette .sidebar .icon.active {
  background-color: #152724 !important;
  color: #C7993F !important;
}

body.theme-maquette .sidebar .icon:not(.active):hover {
  background-color: #1B322D !important;
}

body.theme-maquette .search-input {
  background-color: rgba(226, 214, 188, 0.05) !important;
  color: #E2D6BC !important;
  border: 1px solid rgba(226, 214, 188, 0.1) !important;
}

body.theme-maquette .auth-dropdown-menu,
body.theme-maquette .auth-dropdown-menu-guest {
  background-color: #152724 !important;
  border-color: rgba(199, 153, 63, 0.2) !important;
}

body.theme-maquette .auth-dropdown-item:hover {
  background-color: #1B322D !important;
}

body.theme-maquette .auth-theme-btn.active {
  border-color: #C7993F !important;
  background-color: rgba(199, 153, 63, 0.15) !important;
}

/* Header et boutons */
body.theme-maquette .btn-outline,
body.theme-maquette .filters-btn,
body.theme-maquette .sort-btn,
body.theme-maquette .layout-btn,
body.theme-maquette .view-btn,
body.theme-maquette .library-tab {
  background-color: transparent !important;
  border-color: rgba(226, 214, 188, 0.1) !important;
  color: #E2D6BC !important;
}

body.theme-maquette .layout-btn.active,
body.theme-maquette .view-btn.active,
body.theme-maquette .library-tab.active {
  background-color: #1B322D !important;
  color: #C7993F !important;
  border-color: #C7993F !important;
}

body.theme-maquette .pagination-btn {
  background-color: transparent !important;
  border-color: rgba(226, 214, 188, 0.1) !important;
  color: #E2D6BC !important;
}

body.theme-maquette .pagination-btn.active {
  background-color: #C7993F !important;
  color: #0E211F !important;
  border-color: #C7993F !important;
}

/* Avatar Header circle */
body.theme-maquette .auth-user-avatar-img {
  border: 2px solid #C7993F !important;
}

/* Logo Iktisar in sidebar top */
body.theme-maquette .wrap-top-logo img {
  filter: brightness(0) saturate(100%) invert(67%) sepia(21%) saturate(1067%) hue-rotate(352deg) brightness(97%) contrast(87%); /* Tente de reproduire le doré #C7993F grossièrement si c'est un SVG */
}

/* Active icons color in sidebar */
body.theme-maquette .sidebar .icon.active svg {
  color: #C7993F !important;
}

/* ================================================================ */
/* CARTE PARTAGÉE — auteurs, notes (et toute future carte)          */
/* Appliquer la classe .app-card en plus de la classe spécifique.   */
/* La classe spécifique gère : padding, flex, overflow, couleur     */
/* d'accent via --app-card-hover-border.                            */
/* ================================================================ */
.app-card {
  --app-card-hover-border: var(--authors-gold);
  background: var(--panel-light, #fff);
  border: 1px solid var(--border-color);
  border-radius: 12px;
  cursor: pointer;
  position: relative;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
  margin-bottom: 4px; /* espace pour l'ombre basse, partagé auteurs + notes */
  /* background-color retiré : .app-card:hover ne le change jamais, son seul
     effet était d'animer la toute première application du style (fond
     transparent -> blanc) à chaque création de carte — flash "texte brut
     sans conteneur visible" pendant ~300ms sur les cartes auteurs/notes. */
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.app-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
  border-color: var(--app-card-hover-border, var(--accent));
}

body.theme-noir .app-card,
body.theme-noir .generation-card {
  background: rgba(30, 40, 45, 0.6);
  border-color: rgba(255, 255, 255, 0.07);
}

body.theme-noir .app-card:hover {
  background: rgba(40, 52, 58, 0.85);
  border-color: rgba(74, 145, 120, 0.3);
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.45);
}