/* ===========================================================================
   ISFB Bibliothèque — Feuille de styles
   Inspirée de www.isfb.ch (thème Avada custom)
   Palette officielle extraite du site :
     #1C355E primary dark blue
     #44ACBC teal (certifications)
     #5A1F45 purple (réseau)
     #A28B69 gold (carrière)
     #faf9f8 / #f8f7f6 / #f2f1f0 fonds
   =========================================================================== */

:root {
    /* Couleurs officielles ISFB */
    --isfb-primary: #1C355E;
    --isfb-primary-dark: #142948;
    --isfb-primary-light: #2a4976;
    --isfb-teal: #44ACBC;
    --isfb-purple: #5A1F45;
    --isfb-gold: #A28B69;

    /* Fonds */
    --bg: #faf9f8;
    --bg-alt: #f2f1f0;
    --bg-light: #f8f7f6;
    --white: #ffffff;

    /* Texte */
    --text: #1C355E;
    --text-body: #333c4e;
    --text-muted: #666d75;
    --text-soft: #7e8890;

    /* Bordures & états */
    --border: #e5e2de;
    --border-light: #eceae6;
    --danger: #c0392b;
    --success: #16a34a;
    --warn: #d97706;

    /* Ombres */
    --shadow-xs: 0 1px 2px rgba(28, 53, 94, 0.06);
    --shadow-sm: 0 2px 8px rgba(28, 53, 94, 0.08);
    --shadow-md: 0 6px 18px rgba(28, 53, 94, 0.12);
    --shadow-lg: 0 14px 40px rgba(28, 53, 94, 0.18);

    /* Typo */
    --ff: 'Open Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html, body { height: 100%; }

body {
    font-family: var(--ff);
    font-size: 14px;
    color: var(--text-body);
    background: var(--bg);
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    line-height: 1.55;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

a { color: var(--isfb-primary); text-decoration: none; transition: color .15s; }
a:hover { color: var(--isfb-teal); }

h1, h2, h3, h4, h5 {
    font-family: var(--ff);
    color: var(--isfb-primary);
    font-weight: 600;
    line-height: 1.25;
}

img { max-width: 100%; height: auto; display: block; }

.muted { color: var(--text-muted); }

/* ===========================================================================
   HEADER PUBLIC
   =========================================================================== */

/* Barre supérieure avec sélecteur de langue (style ScienceDirect) */
.isfb-topbar {
    background: var(--isfb-primary);
    color: var(--white);
    font-size: 12px;
}
.isfb-topbar-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 4px 32px;
    display: flex;
    justify-content: flex-end;
    align-items: center;
}
/* Override du style Weglot pour l'intégrer dans la topbar bleu foncé */
#weglot-switcher {
    position: relative;
    z-index: 1000;
}
#weglot-switcher,
#weglot-switcher * {
    box-sizing: border-box !important;
}
/* Conteneur principal : fond transparent, pas de bordure */
#weglot-switcher .country-selector,
#weglot-switcher .wgcurrent,
#weglot-switcher .wg-drop,
#weglot-switcher > div,
#weglot-switcher > aside {
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    position: relative !important;
}
/* Lien principal (langue active) : texte blanc + espace pour la flèche */
#weglot-switcher > div > a,
#weglot-switcher .wgcurrent > a,
#weglot-switcher .wg-drop > a,
#weglot-switcher .country-selector > a {
    color: rgba(255,255,255,0.9) !important;
    font-size: 12px !important;
    font-family: var(--ff) !important;
    padding: 4px 20px 4px 10px !important;
    background: transparent !important;
    text-decoration: none !important;
    display: inline-block !important;
    position: relative !important;
}
#weglot-switcher > div > a:hover,
#weglot-switcher .country-selector > a:hover {
    color: #fff !important;
}
/* Flèche ▾ via CSS à droite du lien actif */
#weglot-switcher > div > a::after,
#weglot-switcher .country-selector > a::after {
    content: '▾' !important;
    position: absolute !important;
    right: 4px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    font-size: 10px !important;
    color: rgba(255,255,255,0.6) !important;
    pointer-events: none !important;
}
/* Masque la flèche native Weglot (souvent un ::after sur .wg-drop) */
#weglot-switcher .wg-drop::after,
#weglot-switcher .country-selector::after {
    display: none !important;
}
/* Dropdown fermé : caché par défaut */
#weglot-switcher ul,
#weglot-switcher .country-selector ul {
    display: none !important;
    position: absolute !important;
    top: 100% !important;
    right: 0 !important;
    left: auto !important;
    width: auto !important;
    min-width: 130px !important;
    background: #fff !important;
    border: 1px solid #ddd !important;
    box-shadow: 0 2px 8px rgba(0,0,0,0.12) !important;
    border-radius: 3px !important;
    margin: 0 !important;
    padding: 4px 0 !important;
    list-style: none !important;
    z-index: 1001 !important;
    overflow: visible !important;
}
/* Zone tampon invisible entre le lien et le dropdown (évite le gap) */
#weglot-switcher ul::before,
#weglot-switcher .country-selector ul::before {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    top: -10px !important;
    left: 0 !important;
    right: 0 !important;
    height: 10px !important;
}
/* Dropdown ouvert */
#weglot-switcher .country-selector.open ul,
#weglot-switcher .wg-drop.open ul,
#weglot-switcher .open > ul,
#weglot-switcher aside[aria-expanded="true"] ul,
#weglot-switcher ul.open,
#weglot-switcher:hover ul,
#weglot-switcher .wg-drop:hover ul,
#weglot-switcher .country-selector:hover ul {
    display: block !important;
}
/* Items dans le dropdown */
#weglot-switcher ul li,
#weglot-switcher .country-selector ul li {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    display: block !important;
}
/* Liens dans le dropdown : texte foncé, pleine largeur */
#weglot-switcher ul li a {
    color: #1C355E !important;
    display: block !important;
    width: 100% !important;
    padding: 7px 16px !important;
    background: transparent !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    line-height: 1.4 !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    border: none !important;
}
#weglot-switcher ul li a:hover {
    background: #f0f4f8 !important;
    color: #1C355E !important;
}
#weglot-switcher ul li.active a {
    font-weight: 600 !important;
    background: #f5f7fa !important;
}

.isfb-header {
    background: var(--white);
    border-bottom: 1px solid var(--border-light);
    flex-shrink: 0;
    position: relative;
    z-index: 10;
}
.isfb-header-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 22px 32px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}
.isfb-brand {
    color: var(--isfb-primary);
    font-weight: 700;
    font-size: 24px;
    text-decoration: none;
    letter-spacing: -0.3px;
    display: flex;
    flex-direction: column;
}
.isfb-brand:hover { color: var(--isfb-primary-dark); text-decoration: none; }
.isfb-brand-label small {
    display: block;
    font-size: 10px;
    font-weight: 600;
    color: var(--text-soft);
    margin-top: 3px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
}
.isfb-logo img { height: 56px; width: auto; }

/* Navigation publique (Bibliothèque / Sources) */
.isfb-public-nav {
    display: flex;
    gap: 4px;
    margin-left: auto;
    margin-right: 24px;
}
.isfb-public-nav a {
    color: var(--isfb-primary);
    font-weight: 700;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    padding: 10px 18px;
    text-decoration: none;
    border-bottom: 3px solid transparent;
    transition: border-color .15s;
}
.isfb-public-nav a:hover {
    border-bottom-color: var(--isfb-teal);
    text-decoration: none;
}
@media (max-width: 768px) {
    .isfb-public-nav { margin: 0; gap: 0; }
    .isfb-public-nav a { padding: 8px 10px; font-size: 11px; }
}

/* ===========================================================================
   MAIN & FOOTER
   =========================================================================== */

.isfb-main {
    flex: 1;
    display: flex;
    flex-direction: column;
    padding: 40px 32px;
    max-width: 1400px;
    width: 100%;
    margin: 0 auto;
}

.isfb-footer {
    background: var(--isfb-primary);
    color: rgba(255, 255, 255, 0.85);
    padding: 32px 24px 24px;
    font-size: 13px;
    flex-shrink: 0;
    text-align: center;
    border-top: 4px solid var(--isfb-teal);
}
.isfb-footer a { color: var(--white); text-decoration: none; font-weight: 600; }
.isfb-footer a:hover { color: var(--isfb-teal); }
.isfb-footer p { margin: 4px 0; }

/* ===========================================================================
   HERO + RECHERCHE (index public)
   =========================================================================== */

.library-hero {
    background: var(--isfb-primary);
    color: var(--white);
    padding: 56px 48px;
    margin-bottom: 40px;
    box-shadow: var(--shadow-md);
    position: relative;
    overflow: hidden;
}
.library-hero > * { position: relative; z-index: 1; }
.library-hero h1 {
    color: var(--white);
    font-size: 42px;
    font-weight: 700;
    margin-bottom: 12px;
    letter-spacing: -0.5px;
}
.library-hero p {
    color: rgba(255, 255, 255, 0.85);
    margin-bottom: 28px;
    font-size: 17px;
    max-width: 600px;
}

/* Version compacte sans titre ni sous-titre (style moteur académique) */
.library-hero-compact {
    background: var(--white);
    border-bottom: 1px solid var(--border);
    box-shadow: var(--shadow-xs);
    padding: 0;
    margin-bottom: 24px;
}

.library-search {
    display: flex;
    gap: 0;
    align-items: stretch;
    background: var(--white);
    flex-wrap: wrap;
}

/* En mode compact : pas de padding autour, la barre = le hero */
.library-hero-compact .library-search {
    box-shadow: none;
    border-radius: 0;
}

.library-search-fields {
    display: flex;
    flex: 1;
    min-width: 300px;
}
.library-search-field {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-width: 0;
    border-right: 1px solid var(--border-light);
}
.library-search-field:last-child { border-right: none; }

.library-search-field label {
    font-size: 9px;
    font-weight: 700;
    color: var(--text-muted);
    padding: 10px 12px 0;
    letter-spacing: 0.5px;
    text-transform: uppercase;
}
.library-search-field input[type="text"],
.library-search-field select {
    width: 100%;
    border: none;
    background: transparent;
    padding: 4px 12px 8px;
    font-size: 13px;
    color: var(--text-body);
    font-family: var(--ff);
    border-radius: 0;
    height: auto;
}
.library-search-field input[type="text"]:focus,
.library-search-field select:focus {
    outline: none;
    background: var(--bg-light);
}
.library-search-submit {
    background: var(--isfb-primary);
    color: var(--white);
    border: none;
    border-left: 1px solid var(--border-light);
    padding: 0 22px;
    font-weight: 700;
    font-size: 12px;
    cursor: pointer;
    font-family: var(--ff);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    transition: background .15s;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    white-space: nowrap;
}
.library-search-submit:hover { background: var(--isfb-primary-dark); }
.library-search-submit svg { flex-shrink: 0; }

.library-search-clear {
    align-self: center;
    color: var(--text-muted);
    font-size: 11px;
    margin-left: 4px;
    padding: 0 12px;
    text-decoration: underline;
    font-weight: 600;
}
.library-search-clear:hover { color: var(--isfb-primary); }

/* Responsive */
@media (max-width: 1024px) {
    .library-search-fields { flex-wrap: wrap; }
    .library-search-field { flex: 1 1 45%; border-bottom: 1px solid var(--border-light); }
}
@media (max-width: 640px) {
    .library-search-fields { flex-direction: column; }
    .library-search-field { flex: 1 1 100%; border-right: none; border-bottom: 1px solid var(--border-light); }
    .library-search-submit { width: 100%; justify-content: center; padding: 12px; }
    .library-hero-compact { padding: 12px 16px; }
}

/* ===========================================================================
   GRILLE DE CARTES (bibliothèque)
   =========================================================================== */

.library-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 24px;
}

/* Grille fixe à 5 colonnes pour les blocs home */
.library-grid-5 {
    grid-template-columns: repeat(5, 1fr);
}

/* ===========================================================================
   EXPLORE BOX : mots-clés + catégories + domaines dans un bloc unifié
   =========================================================================== */
.explore-box {
    margin-bottom: 32px;
    background: var(--white);
    box-shadow: var(--shadow-xs);
    border: 1px solid var(--border-light);
}

/* Summary cliquable = le header du bloc */
.explore-box > summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 20px;
    transition: background .15s;
    user-select: none;
    border-bottom: 1px solid var(--border-light);
}
.explore-box:not([open]) > summary { border-bottom: none; }
.explore-box > summary::-webkit-details-marker { display: none; }
.explore-box > summary::after {
    content: '';
    width: 10px;
    height: 10px;
    border-right: 2px solid var(--isfb-primary);
    border-bottom: 2px solid var(--isfb-primary);
    transform: rotate(-45deg);
    flex-shrink: 0;
    transition: transform .2s;
    margin-left: 12px;
}
.explore-box[open] > summary::after { transform: rotate(45deg); }
.explore-box > summary:hover { background: var(--bg-light); }
.explore-box > summary span {
    font-size: 13px;
    font-weight: 700;
    color: var(--isfb-primary);
    text-transform: uppercase;
    letter-spacing: 0.8px;
}
.explore-box > summary small {
    font-size: 11px;
    color: var(--text-muted);
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0;
}

.explore-content {
    padding: 16px 20px 20px;
    animation: fadeIn .2s ease;
}

/* Section intérieure : un groupe de chips avec son label */
.explore-section {
    margin-bottom: 16px;
}
.explore-section:last-child { margin-bottom: 0; }

.explore-label {
    display: block;
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--text-soft);
    margin-bottom: 8px;
}

.explore-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
}

/* Zone mots-clés : centrée pour un effet nuage */
.explore-keywords .explore-chips {
    justify-content: center;
    gap: 10px;
    padding: 8px 0 14px;
}

/* ---------- Chip AUTEUR : bulle arrondie ---------- */
/* 2e rangée de colonnes (Auteurs + Période) : espace au-dessus */
.explore-cols + .explore-cols {
    margin-top: 20px;
    padding-top: 18px;
    border-top: 1px solid var(--border-light);
}
.chip-author {
    border-color: var(--border);
    color: var(--text-body);
    background: var(--bg-light);
}
.chip-author:hover,
.chip-author.active {
    background: var(--isfb-primary);
    color: var(--white);
    border-color: var(--isfb-primary);
}

/* Filtre période (deux selects, style identique au moteur de recherche) */
.explore-period-fields {
    display: flex;
    align-items: stretch;
    background: var(--white);
    border: 1px solid var(--border);
    overflow: hidden;
}
.explore-period-fields select {
    border: none;
    border-right: 1px solid var(--border-light);
    padding: 6px 10px;
    font-size: 11px;
    font-family: var(--ff);
    color: var(--text-body);
    border-radius: 0;
    width: auto;
    cursor: pointer;
    background: var(--white);
    flex: 1;
}
.explore-period-fields select:last-child { border-right: none; }
.explore-period-fields select:focus {
    outline: none;
    background: var(--bg-light);
}
.explore-period-sep { display: none; }

/* Section mots-clés */
.explore-keywords-section {
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--border-light);
}
.explore-chips-keywords {
    justify-content: center;
    gap: 8px;
}

/* Mise en colonnes pour Catégories + Domaines */
.explore-cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

/* ---------- Base des chips ---------- */
.chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 12px;
    border: 1px solid var(--border);
    background: var(--white);
    color: var(--isfb-primary);
    font-weight: 600;
    text-decoration: none;
    border-radius: 999px;
    transition: all .15s ease;
    white-space: nowrap;
    line-height: 1.3;
    font-size: 11px;
    font-family: var(--ff);
}
.chip:hover {
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 2px 8px rgba(28, 53, 94, 0.1);
}

/* ---------- Chip MOT-CLÉ : gris, tailles variables selon popularité ---------- */
.chip-kw {
    border-color: var(--border);
    color: var(--text-body);
    background: var(--white);
}
.chip-kw:hover {
    border-color: var(--text-muted);
    color: var(--isfb-primary);
    background: var(--bg-light);
}
.chip-kw .chip-count {
    display: inline-block;
    background: var(--bg-light);
    color: var(--text-muted);
    font-size: 10px;
    font-weight: 700;
    padding: 2px 8px;
    border-radius: 999px;
    min-width: 22px;
    text-align: center;
    line-height: 1.3;
    transition: all .2s ease;
}
.chip-kw:hover .chip-count {
    background: var(--isfb-primary);
    color: var(--white);
}

/* Tiers de taille mots-clés (basés sur nombre de citations) */
.chip-tier-0 { font-size: 10px; font-weight: 500; opacity: 0.7; }
.chip-tier-0 .chip-count { font-size: 8px; padding: 1px 5px; min-width: 16px; }

.chip-tier-1 { font-size: 11px; font-weight: 600; opacity: 0.85; }

.chip-tier-2 { font-size: 12px; font-weight: 600; }

.chip-tier-3 { font-size: 14px; padding: 5px 14px; font-weight: 700; }
.chip-tier-3 .chip-count { font-size: 9px; }

.chip-tier-4 {
    font-size: 16px;
    padding: 5px 16px;
    font-weight: 800;
    letter-spacing: -0.2px;
}
.chip-tier-4 .chip-count { font-size: 10px; }

/* ---------- Chip CATÉGORIE : bleu ISFB uniforme ---------- */
.chip-cat {
    border-color: var(--isfb-primary);
    color: var(--isfb-primary);
}
.chip-cat:hover,
.chip-cat.active {
    background: var(--isfb-primary);
    color: var(--white);
}

/* ---------- Chip DOMAINE : couleur propre à chaque domaine ---------- */
.chip-dom {
    border-color: var(--dcolor, var(--isfb-primary));
    color: var(--dcolor, var(--isfb-primary));
}
.chip-dom:hover,
.chip-dom.active {
    background: var(--dcolor, var(--isfb-primary));
    color: var(--white);
}

@media (max-width: 768px) {
    .explore-box { padding: 24px 20px; }
    .explore-cols { grid-template-columns: 1fr; gap: 24px; }
    .chip-tier-4 { font-size: 17px; padding: 7px 16px; }
    .chip-tier-3 { font-size: 15px; padding: 6px 14px; }
    .chip-tier-2 { font-size: 13px; }
}

/* ---------- Navigation rapide par chips (catégories / domaines) ---------- */
.quick-filters {
    margin-bottom: 40px;
    background: var(--white);
    padding: 22px 28px;
    box-shadow: var(--shadow-sm);
    border-left: 4px solid var(--isfb-teal);
}
.quick-filter-row {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    flex-wrap: wrap;
    padding: 10px 0;
}
.quick-filter-row + .quick-filter-row {
    border-top: 1px solid var(--border-light);
    padding-top: 16px;
    margin-top: 4px;
}
.quick-filter-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: var(--text-muted);
    font-weight: 700;
    flex-shrink: 0;
    padding-top: 6px;
    min-width: 180px;
}
.quick-filter-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    flex: 1;
}
.quick-filter-chip {
    display: inline-block;
    padding: 6px 14px;
    background: var(--bg-light);
    color: var(--isfb-primary);
    border: 1px solid var(--border);
    border-radius: 999px;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
    transition: all .15s;
}
.quick-filter-chip:hover {
    background: var(--isfb-primary);
    color: var(--white);
    border-color: var(--isfb-primary);
    text-decoration: none;
}
.quick-filter-chip.active {
    background: var(--isfb-primary);
    color: var(--white);
    border-color: var(--isfb-primary);
}
.quick-filter-chip-colored {
    color: var(--dcolor);
    border-color: var(--dcolor);
    background: var(--white);
}
.quick-filter-chip-colored:hover,
.quick-filter-chip-colored.active {
    background: var(--dcolor);
    color: var(--white);
    border-color: var(--dcolor);
}
@media (max-width: 768px) {
    .quick-filter-label { min-width: 100%; }
}

/* Blocs thématiques (top consultées, dernières pub...) */
.library-block {
    margin-bottom: 48px;
}
.library-block:last-child {
    margin-bottom: 0;
}
.library-block-title {
    color: var(--isfb-primary);
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--border-light);
    display: flex;
    align-items: baseline;
    gap: 16px;
    flex-wrap: wrap;
}
.library-block-count {
    font-size: 13px;
    color: var(--text-muted);
    font-weight: 600;
    background: var(--bg-light);
    padding: 3px 12px;
    border-radius: 999px;
}

.library-card {
    background: var(--white);
    border-radius: 2px;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease;
    display: flex;
    flex-direction: column;
    text-decoration: none;
    color: var(--text-body);
    box-shadow: var(--shadow-sm);
    position: relative;
}
.library-card:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-lg);
    text-decoration: none;
    color: var(--text-body);
}
.library-card:hover .library-card-cover img { transform: scale(1.05); }
.library-card:hover .library-card-body h3 { color: var(--isfb-teal); }

.library-card-cover {
    position: relative;
    aspect-ratio: 4/3;
    background: var(--bg-alt);
    overflow: hidden;
}
.library-card-cover img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform .4s ease;
}
.library-card-nocover {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    background: linear-gradient(135deg, var(--isfb-primary) 0%, var(--isfb-primary-dark) 100%);
    color: rgba(255, 255, 255, 0.25);
}
.library-card-badge {
    position: absolute;
    top: 16px;
    left: 0;
    background: var(--isfb-primary);
    color: var(--white);
    padding: 7px 14px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.8px;
    text-transform: uppercase;
    box-shadow: var(--shadow-sm);
}

/* ---------- Badges de domaine d'activité (sous la cover) ---------- */
.library-card-domains {
    padding: 16px 18px;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    background: var(--white);
}
.domain-badge {
    display: inline-block;
    padding: 5px 12px;
    background: var(--white);
    color: var(--isfb-primary);
    border: 1.5px solid var(--isfb-primary);
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    line-height: 1.4;
}
.domain-badge-preview {
    /* Variante pour l'aperçu admin : garde le fond coloré plein */
    background: var(--isfb-primary);
    color: var(--white);
    border: none;
    font-size: 11px;
    padding: 5px 12px;
    border-radius: 999px;
}

/* ---------- Checkboxes de sélection de domaines (formulaire admin) ---------- */
.domain-checkbox-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 10px;
    margin-top: 8px;
}
.domain-checkbox {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 14px;
    border: 1px solid var(--border);
    cursor: pointer;
    background: var(--white);
    transition: all .15s;
    font-size: 13px;
    color: var(--text-body);
    font-weight: 600;
}
.domain-checkbox:hover {
    border-color: var(--dcolor, var(--isfb-primary));
    background: var(--bg-light);
}
.domain-checkbox input[type="checkbox"] {
    width: auto;
    margin: 0;
    accent-color: var(--dcolor, var(--isfb-primary));
    transform: scale(1.1);
}
.domain-checkbox input[type="checkbox"]:checked ~ .domain-checkbox-label {
    color: var(--isfb-primary);
    font-weight: 700;
}
.domain-checkbox:has(input:checked) {
    border-color: var(--dcolor, var(--isfb-primary));
    border-width: 2px;
    padding: 11px 13px;
    background: var(--bg-light);
}
.domain-checkbox-swatch {
    display: inline-block;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    flex-shrink: 0;
    box-shadow: 0 0 0 1px rgba(0,0,0,0.08);
}
/* Bloc info sous la couverture : titre, auteur, date (style académique) */
.library-card-info {
    padding: 10px 12px 8px;
}
.library-card-title {
    font-size: 12px;
    font-weight: 700;
    color: var(--isfb-primary);
    line-height: 1.35;
    margin: 0 0 4px 0;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.library-card:hover .library-card-title { color: var(--isfb-teal); }
.library-card-authors {
    font-size: 10px;
    color: var(--text-muted);
    font-style: italic;
    line-height: 1.4;
    margin: 0 0 2px 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.library-card-date {
    font-size: 9px;
    color: var(--text-soft);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.4px;
    margin: 0;
}

.library-empty {
    background: var(--white);
    border-radius: 4px;
    padding: 80px 24px;
    text-align: center;
    color: var(--text-muted);
    box-shadow: var(--shadow-sm);
    font-size: 15px;
}

/* ===========================================================================
   PAGE SOURCES (moteur de navigation dans les références citées)
   =========================================================================== */

.sources-hero {
    padding-bottom: 40px;
}
.sources-search-fields {
    grid-template-columns: 3fr 1fr;
}

.sources-stats {
    display: flex;
    gap: 20px;
    margin-bottom: 28px;
    flex-wrap: wrap;
    padding: 14px 20px;
    background: var(--bg-light);
    border-left: 4px solid var(--isfb-teal);
}
.sources-stat {
    font-size: 13px;
    color: var(--text-muted);
}
.sources-stat strong {
    color: var(--isfb-primary);
    font-size: 18px;
    font-weight: 700;
    margin-right: 4px;
}

.sources-list {
    display: grid;
    gap: 18px;
}

.source-card {
    background: var(--white);
    padding: 24px 28px;
    box-shadow: var(--shadow-sm);
    border-left: 4px solid var(--isfb-primary);
    transition: box-shadow .15s, transform .15s;
}
.source-card:hover {
    box-shadow: var(--shadow-md);
}

.source-card-header {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 12px;
}

.source-type-badge {
    display: inline-block;
    padding: 4px 12px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: var(--white);
}
.source-type-academic     { background: var(--isfb-primary); }
.source-type-professional { background: var(--isfb-teal); }

.source-cited-count {
    font-size: 11px;
    color: var(--text-muted);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    background: var(--bg-light);
    padding: 3px 10px;
    border-radius: 999px;
}

.source-content {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 15px;
    line-height: 1.65;
    color: var(--text-body);
    margin-bottom: 10px;
}

.source-url {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: var(--isfb-teal);
    font-family: 'Courier New', monospace;
    font-size: 12px;
    font-weight: 600;
    word-break: break-all;
    margin-bottom: 14px;
    padding: 6px 10px;
    background: var(--bg-light);
    border-left: 2px solid var(--isfb-teal);
    text-decoration: none;
}
.source-url:hover {
    background: var(--isfb-teal);
    color: var(--white);
    text-decoration: none;
}
.source-url svg { flex-shrink: 0; }

.source-citations {
    padding-top: 14px;
    border-top: 1px solid var(--border-light);
    font-size: 13px;
    display: flex;
    align-items: baseline;
    gap: 10px;
    flex-wrap: wrap;
}
.source-citations-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: var(--text-muted);
    font-weight: 700;
    flex-shrink: 0;
}
.source-citation-link {
    color: var(--isfb-primary);
    font-weight: 600;
    padding: 4px 10px;
    background: var(--bg-light);
    text-decoration: none;
    transition: all .15s;
    font-size: 13px;
}
.source-citation-link:hover {
    background: var(--isfb-primary);
    color: var(--white);
    text-decoration: none;
}
.source-citation-date {
    opacity: 0.7;
    font-weight: 400;
    margin-left: 3px;
}

@media (max-width: 768px) {
    .sources-search-fields { grid-template-columns: 1fr; }
    .source-card { padding: 20px; }
}

/* ===========================================================================
   VUE DOCUMENT (liseuse + métadonnées)
   =========================================================================== */

.document-view { width: 100%; }
.document-view-toolbar { margin-bottom: 20px; }
.back-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: var(--isfb-primary);
    font-weight: 600;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    padding: 8px 16px;
    background: var(--white);
    border-radius: 3px;
    box-shadow: var(--shadow-xs);
    transition: all .15s;
}
.back-link:hover {
    color: var(--white);
    background: var(--isfb-primary);
    text-decoration: none;
}

.document-view-layout {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 28px;
    align-items: start;
}

.document-reader {
    background: var(--white);
    padding: 16px;
    box-shadow: var(--shadow-sm);
    border-radius: 2px;
    border-top: 4px solid var(--isfb-primary);
}

/* ===========================================================================
   VUE HTML NATIVE (pour les publications Observatoire avec contenu en DB)
   =========================================================================== */

.document-html-reader {
    background: var(--white);
    box-shadow: var(--shadow-sm);
    border-top: 4px solid var(--isfb-primary);
    padding: 0;
    min-height: 600px;
}
.obs-copyright {
    text-align: center;
    font-size: 11px;
    color: var(--text-muted);
    padding: 12px 20px 0;
    font-style: italic;
}

.obs-article {
    max-width: 780px;
    margin: 0 auto;
    padding: 48px 56px 56px;
    font-family: Georgia, 'Times New Roman', serif;
    color: #1a1a1a;
    line-height: 1.65;
}

/* En-tête Observatoire : titre principal + sous-titre centrés */
.obs-header {
    text-align: center;
    padding: 18px 20px;
    margin-bottom: 32px;
    background: var(--bg-alt);
    border-radius: 2px;
}
.obs-header-main {
    font-family: var(--ff);
    font-size: 18px;
    font-weight: 700;
    color: var(--isfb-primary);
    line-height: 1.3;
    letter-spacing: -0.2px;
    margin-bottom: 6px;
}
.obs-subtitle {
    text-align: center;
    font-size: 11px;
    color: var(--text-muted);
    font-style: italic;
    text-transform: uppercase;
    letter-spacing: 1.5px;
    font-family: var(--ff);
}

.obs-title {
    font-size: 28px;
    font-style: italic;
    font-weight: 700;
    color: var(--isfb-primary);
    line-height: 1.25;
    margin-bottom: 18px;
    letter-spacing: -0.3px;
}

.obs-authors {
    font-size: 16px;
    font-family: var(--ff);
    color: var(--text-body);
    margin-bottom: 6px;
}
.obs-authors strong { font-weight: 700; color: var(--isfb-primary); }
.obs-authors sup { font-size: 11px; font-weight: 400; }

.obs-affiliations {
    font-size: 12px;
    font-family: var(--ff);
    color: var(--text-muted);
    font-style: italic;
    margin-bottom: 28px;
}
.obs-affiliations sup { font-size: 10px; margin-right: 2px; }

/* Encart Informations / Résumé */
.obs-infobox {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 24px;
    padding: 22px 0;
    border-top: 1px solid var(--text-body);
    border-bottom: 1px solid var(--text-body);
    margin-bottom: 32px;
    font-family: var(--ff);
}
.obs-infobox h3 {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1.2px;
    color: var(--isfb-primary);
    margin-bottom: 10px;
    font-family: var(--ff);
}
.obs-infobox-col-info {
    padding-right: 20px;
    border-right: 1px solid var(--border-light);
}
.obs-kw-label {
    font-size: 13px;
    font-style: italic;
    margin-bottom: 4px;
    color: var(--text-body);
}
.obs-kw-list {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 13px;
    color: var(--text-body);
    line-height: 1.55;
}
.obs-abstract-text {
    font-size: 13px;
    line-height: 1.65;
    color: var(--text-body);
    text-align: justify;
}

/* Corps de l'article */
.obs-body {
    font-size: 16px;
    line-height: 1.75;
    text-align: justify;
}
.obs-body p {
    margin: 0 0 16px 0;
}
.obs-body a {
    color: var(--isfb-primary);
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 2px;
}
.obs-body a:hover {
    color: var(--isfb-teal);
}
.obs-body strong { font-weight: 700; }
.obs-body em { font-style: italic; }

.obs-section-heading {
    font-family: var(--ff);
    font-size: 18px;
    font-weight: 700;
    color: var(--isfb-primary);
    margin-top: 32px;
    margin-bottom: 14px;
    line-height: 1.3;
    padding-top: 8px;
}

/* Boîtes de références */
.obs-refs-box {
    margin-top: 36px;
    padding-top: 20px;
    border-top: 2px solid var(--border-light);
}
.obs-refs-box h3 {
    font-family: var(--ff);
    font-size: 15px;
    font-weight: 700;
    color: var(--isfb-primary);
    margin-bottom: 14px;
    text-transform: none;
    letter-spacing: 0;
}
.obs-refs-list {
    list-style: none;
    padding: 0;
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
}
.obs-refs-list li {
    padding: 8px 0 8px 20px;
    text-indent: -20px;
    border-bottom: 1px dashed var(--border-light);
    color: var(--text-body);
}
.obs-refs-list li:last-child { border-bottom: none; }
.obs-refs-list li a {
    color: var(--isfb-primary);
    word-break: break-all;
    font-family: var(--ff);
    font-size: 12px;
    text-decoration: underline;
}
.obs-refs-list li a:hover { color: var(--isfb-teal); }

@media (max-width: 900px) {
    .obs-article { padding: 32px 24px; }
    .obs-title { font-size: 24px; }
    .obs-infobox { grid-template-columns: 1fr; }
    .obs-infobox-col-info {
        padding-right: 0;
        padding-bottom: 16px;
        border-right: none;
        border-bottom: 1px solid var(--border-light);
    }
    .obs-body { font-size: 15px; }
}

.document-meta {
    background: var(--white);
    padding: 32px;
    box-shadow: var(--shadow-sm);
    border-radius: 2px;
    border-top: 4px solid var(--isfb-teal);
}
.document-meta-title {
    font-size: 22px;
    color: var(--isfb-primary);
    margin-bottom: 16px;
    line-height: 1.3;
    font-weight: 700;
    letter-spacing: -0.2px;
}
.document-meta-badge {
    display: inline-block;
    background: var(--isfb-primary);
    color: var(--white);
    padding: 6px 14px;
    font-size: 10px;
    font-weight: 700;
    margin-bottom: 20px;
    text-transform: uppercase;
    letter-spacing: 1px;
}
.document-meta-list { margin-bottom: 24px; }
.document-meta-list dt {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--isfb-teal);
    margin-top: 20px;
    margin-bottom: 6px;
}
.document-meta-list dt:first-child { margin-top: 0; }
.document-meta-list dd { color: var(--text-body); font-size: 14px; line-height: 1.55; }
.document-meta-authors { list-style: none; padding: 0; }
.document-meta-authors li {
    padding: 10px 0;
    border-bottom: 1px solid var(--border-light);
    font-size: 13px;
    line-height: 1.5;
}
.document-meta-authors li:last-child { border-bottom: none; padding-bottom: 0; }
.document-meta-authors strong { color: var(--isfb-primary); font-size: 14px; }
.document-meta-authors em { color: var(--text-muted); font-size: 12px; font-style: normal; }
.document-meta-authors span { color: var(--text-body); font-size: 12px; }
.document-meta-summary {
    font-size: 13px;
    line-height: 1.65;
    color: var(--text-body);
    white-space: pre-wrap;
}
.document-meta-tags { display: flex; flex-wrap: wrap; gap: 6px; }

/* ---------- Boutons Partager / Citer ---------- */
.doc-actions {
    display: flex;
    gap: 24px;
    padding: 16px 0;
    margin-bottom: 8px;
    border-top: 1px solid var(--border-light);
    border-bottom: 1px solid var(--border-light);
}
.doc-action {
    background: none;
    border: none;
    padding: 4px 0;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    color: var(--isfb-primary);
    font-family: var(--ff);
    font-size: 15px;
    font-weight: 400;
    transition: color .15s;
}
.doc-action:hover { color: var(--isfb-teal); }
.doc-action svg { flex-shrink: 0; }
.doc-action span { line-height: 1; }

/* ---------- Permalien dans les métadonnées ---------- */
.doc-permalink {
    display: block;
    text-decoration: none;
    color: var(--isfb-primary);
    padding: 8px 12px;
    background: var(--bg-light);
    border-left: 3px solid var(--isfb-teal);
    font-size: 12px;
    word-break: break-all;
    transition: background .15s;
}
.doc-permalink:hover { background: var(--bg-alt); color: var(--isfb-primary); text-decoration: none; }
.doc-permalink strong {
    display: inline-block;
    font-family: 'Courier New', monospace;
    font-size: 13px;
    color: var(--isfb-primary);
    letter-spacing: 0.5px;
}
.doc-permalink .muted { font-size: 11px; color: var(--text-muted); }

/* ---------- MODAL ---------- */
.modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.modal.open { display: flex; }
.modal-overlay {
    position: absolute;
    inset: 0;
    background: rgba(20, 41, 72, 0.75);
    backdrop-filter: blur(3px);
    cursor: pointer;
}
.modal-box {
    position: relative;
    background: var(--white);
    max-width: 600px;
    width: 100%;
    max-height: calc(100vh - 40px);
    overflow-y: auto;
    box-shadow: var(--shadow-lg);
    border-top: 4px solid var(--isfb-teal);
    animation: modalIn .2s ease;
}
@keyframes modalIn {
    from { opacity: 0; transform: translateY(20px); }
    to   { opacity: 1; transform: translateY(0); }
}
.modal-header {
    padding: 22px 28px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--border-light);
}
.modal-header h2 {
    font-size: 18px;
    color: var(--isfb-primary);
    font-weight: 700;
    letter-spacing: -0.2px;
}
.modal-close {
    background: none;
    border: none;
    font-size: 32px;
    color: var(--text-muted);
    cursor: pointer;
    line-height: 1;
    padding: 0 4px;
    transition: color .15s;
}
.modal-close:hover { color: var(--isfb-primary); }
.modal-body { padding: 24px 28px 28px; }
.modal-label {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--isfb-teal);
    font-weight: 700;
    margin-bottom: 12px;
}

/* Onglets de styles de citation */
.citation-tabs {
    display: flex;
    gap: 0;
    border-bottom: 2px solid var(--border-light);
    margin-bottom: 20px;
    flex-wrap: wrap;
}
.citation-tab {
    background: none;
    border: none;
    padding: 12px 18px;
    font-family: var(--ff);
    font-size: 13px;
    font-weight: 700;
    color: var(--text-muted);
    cursor: pointer;
    border-bottom: 3px solid transparent;
    margin-bottom: -2px;
    transition: all .15s;
    text-transform: none;
    letter-spacing: 0;
}
.citation-tab:hover { color: var(--isfb-primary); }
.citation-tab.active {
    color: var(--isfb-primary);
    border-bottom-color: var(--isfb-teal);
}
.citation-panel { display: none; }
.citation-panel.active { display: block; animation: fadeIn .2s; }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }

.citation-caption {
    font-size: 12px;
    color: var(--text-muted);
    margin-bottom: 12px;
    font-style: italic;
}

/* Citation text */
.citation-text {
    background: var(--bg-light);
    border-left: 4px solid var(--isfb-primary);
    padding: 20px 22px;
    margin-bottom: 20px;
    font-size: 15px;
    line-height: 1.7;
    color: var(--text-body);
    font-family: Georgia, 'Times New Roman', serif;
}
.citation-text em { font-style: italic; color: var(--isfb-primary); }
.citation-text a {
    color: var(--isfb-primary);
    text-decoration: underline;
    word-break: break-all;
}

.citation-feedback {
    margin-top: 14px;
    font-size: 13px;
    font-weight: 600;
    min-height: 20px;
}
.citation-feedback.success { color: var(--success); }
.citation-feedback.error   { color: var(--danger); }

/* Modal de partage */
.share-link-row {
    display: flex;
    gap: 10px;
    margin-bottom: 8px;
}
.share-link-row input {
    flex: 1;
    background: var(--bg-light);
    font-family: 'Courier New', monospace;
    font-size: 13px;
    color: var(--text-body);
    border: 1px solid var(--border);
}
.share-link-row button { flex-shrink: 0; }

.share-buttons {
    display: flex;
    gap: 12px;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid var(--border-light);
}
.share-link {
    flex: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 16px;
    border: 1px solid var(--border);
    color: var(--isfb-primary);
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
    transition: all .15s;
}
.share-link:hover {
    background: var(--isfb-primary);
    color: var(--white);
    border-color: var(--isfb-primary);
    text-decoration: none;
}
.tag {
    background: var(--bg-light);
    color: var(--isfb-primary);
    padding: 5px 12px;
    font-size: 11px;
    font-weight: 600;
    border: 1px solid var(--border);
    text-transform: lowercase;
    letter-spacing: 0.3px;
}

/* ===========================================================================
   TOOLBAR DU LECTEUR PDF
   =========================================================================== */

.isfb-toolbar {
    background: var(--bg-light);
    padding: 10px 14px;
    display: flex;
    align-items: center;
    gap: 6px;
    margin-bottom: 12px;
    flex-wrap: wrap;
    border-bottom: 1px solid var(--border-light);
}
.isfb-toolbar button,
.isfb-toolbar a {
    background: var(--white);
    border: 1px solid var(--border);
    color: var(--isfb-primary);
    width: 38px;
    height: 38px;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all .15s ease;
}
.isfb-toolbar button:hover,
.isfb-toolbar a:hover {
    background: var(--isfb-primary);
    color: var(--white);
    border-color: var(--isfb-primary);
}
.isfb-toolbar button:disabled { opacity: 0.4; cursor: not-allowed; }
.isfb-toolbar button:disabled:hover {
    background: var(--white);
    color: var(--isfb-primary);
    border-color: var(--border);
}
.isfb-pageinfo {
    font-weight: 700;
    color: var(--isfb-primary);
    padding: 0 12px;
    min-width: 72px;
    text-align: center;
    font-size: 13px;
    letter-spacing: 0.5px;
}
.isfb-sep { width: 1px; height: 24px; background: var(--border); margin: 0 4px; }

/* ---------- VIEWER FLIPBOOK ---------- */
.isfb-viewer-wrapper {
    background: var(--bg-alt);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    min-height: 600px;
    overflow: hidden;
}
.isfb-flipbook .stf__block { box-shadow: var(--shadow-lg); }

.isfb-loader {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background: var(--bg-alt);
    z-index: 5;
    gap: 16px;
}
.isfb-loader.hidden { display: none; }
.isfb-loader p { color: var(--text-muted); font-size: 14px; }
.isfb-spinner {
    width: 48px; height: 48px;
    border: 4px solid var(--border);
    border-top-color: var(--isfb-primary);
    border-radius: 50%;
    animation: spin 0.9s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ---------- PANNEAU MINIATURES ---------- */
.isfb-thumbs-panel {
    position: fixed;
    top: 0;
    right: -360px;
    width: 340px;
    height: 100vh;
    background: var(--white);
    box-shadow: -6px 0 24px rgba(28, 53, 94, 0.18);
    transition: right .3s ease;
    z-index: 100;
    display: flex;
    flex-direction: column;
    border-left: 4px solid var(--isfb-primary);
}
.isfb-thumbs-panel.open { right: 0; }
.isfb-thumbs-header {
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--isfb-primary);
}
.isfb-thumbs-header h2 { font-size: 15px; font-weight: 700; color: var(--white); text-transform: uppercase; letter-spacing: 1px; }
.isfb-thumbs-header button {
    background: none; border: none;
    font-size: 28px; color: var(--white);
    cursor: pointer; line-height: 1; padding: 0 8px;
}
.isfb-thumbs-list {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    align-content: start;
}
.isfb-thumb {
    cursor: pointer;
    border: 2px solid var(--border);
    overflow: hidden;
    background: var(--white);
    transition: all .15s ease;
    position: relative;
}
.isfb-thumb:hover { border-color: var(--isfb-teal); transform: translateY(-2px); }
.isfb-thumb.active { border-color: var(--isfb-primary); box-shadow: 0 0 0 3px rgba(28,53,94,0.25); }
.isfb-thumb canvas, .isfb-thumb img { width: 100%; height: auto; display: block; }
.isfb-thumb-num {
    position: absolute; bottom: 0; left: 0; right: 0;
    background: rgba(28, 53, 94, 0.9);
    color: var(--white);
    font-size: 11px; text-align: center;
    padding: 4px; font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* ---------- ERREUR ---------- */
.isfb-error {
    background: var(--white);
    border-left: 4px solid var(--danger);
    padding: 36px 32px;
    max-width: 600px;
    margin: 40px auto;
    box-shadow: var(--shadow-sm);
}
.isfb-error h2 { color: var(--danger); margin-bottom: 12px; font-size: 22px; }
.isfb-error p { color: var(--text-body); margin-bottom: 10px; }
.isfb-hint { color: var(--text-muted); font-size: 13px; margin-top: 16px; }
.isfb-error code, .install-box code {
    background: var(--bg-light);
    padding: 3px 8px;
    font-family: 'Courier New', monospace;
    color: var(--isfb-primary);
    font-size: 13px;
}

/* ===========================================================================
   PAGE LÉGALE (conditions d'utilisation)
   =========================================================================== */

.legal-page {
    max-width: 860px;
    margin: 0 auto;
    background: var(--white);
    padding: 56px 64px;
    box-shadow: var(--shadow-sm);
    border-top: 4px solid var(--isfb-primary);
}
.legal-header {
    padding-bottom: 28px;
    margin-bottom: 36px;
    border-bottom: 2px solid var(--border-light);
}
.legal-header h1 {
    font-size: 34px;
    color: var(--isfb-primary);
    font-weight: 700;
    letter-spacing: -0.5px;
    margin-bottom: 8px;
}
.legal-updated {
    color: var(--text-muted);
    font-size: 13px;
    font-style: italic;
}

.legal-section {
    margin-bottom: 36px;
}
.legal-section h2 {
    font-size: 18px;
    color: var(--isfb-primary);
    margin-bottom: 14px;
    font-weight: 700;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--isfb-teal);
    text-transform: none;
    letter-spacing: 0;
}
.legal-section p {
    color: var(--text-body);
    font-size: 14px;
    line-height: 1.75;
    margin-bottom: 14px;
    text-align: justify;
}
.legal-section ul {
    margin: 14px 0 18px 28px;
    color: var(--text-body);
    font-size: 14px;
    line-height: 1.75;
}
.legal-section ul li {
    margin-bottom: 10px;
    text-align: justify;
}
.legal-section strong { color: var(--isfb-primary); font-weight: 700; }
.legal-section code {
    background: var(--bg-light);
    padding: 2px 6px;
    font-family: 'Courier New', monospace;
    color: var(--isfb-primary);
    font-size: 13px;
}
.legal-section a {
    color: var(--isfb-primary);
    text-decoration: underline;
}

.legal-contact {
    background: var(--bg-light);
    border-left: 4px solid var(--isfb-teal);
    padding: 16px 20px;
    margin-top: 12px;
    font-size: 14px;
    line-height: 1.8;
}

.legal-footer-note {
    margin-top: 40px;
    padding: 20px 24px;
    background: var(--bg-light);
    border-left: 4px solid var(--isfb-primary);
    font-size: 13px;
    color: var(--text-muted);
    font-style: italic;
    line-height: 1.6;
}

@media (max-width: 768px) {
    .legal-page { padding: 32px 24px; }
    .legal-header h1 { font-size: 26px; }
    .legal-section h2 { font-size: 16px; }
    .legal-section ul { margin-left: 20px; }
}

/* ===========================================================================
   FORMULAIRES GÉNÉRIQUES
   =========================================================================== */

.form-group { margin-bottom: 20px; }
.form-group label {
    display: block;
    font-weight: 700;
    color: var(--isfb-primary);
    margin-bottom: 8px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.8px;
}
.form-group small {
    display: block;
    font-size: 12px;
    color: var(--text-muted);
    margin-top: 6px;
}
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="date"],
input[type="search"],
select,
textarea {
    width: 100%;
    padding: 12px 14px;
    border: 1px solid var(--border);
    border-radius: 2px;
    font-size: 14px;
    font-family: var(--ff);
    color: var(--text-body);
    background: var(--white);
    transition: border-color .15s, box-shadow .15s;
}
input:focus, select:focus, textarea:focus {
    outline: none;
    border-color: var(--isfb-primary);
    box-shadow: 0 0 0 3px rgba(28, 53, 94, 0.12);
}
textarea { resize: vertical; min-height: 120px; }

/* Boutons : réutilisables ET auto-appliqués aux submit non-classés */
.btn,
button[type="submit"]:not(.link-action):not(.link-danger):not(.btn-remove-author):not(.library-search button) {
    display: inline-block;
    padding: 12px 24px;
    border-radius: 2px;
    border: 1px solid transparent;
    font-weight: 700;
    font-size: 13px;
    cursor: pointer;
    text-decoration: none;
    transition: all .15s;
    font-family: var(--ff);
    text-transform: uppercase;
    letter-spacing: 0.8px;
    line-height: 1.2;
}
.btn:hover { text-decoration: none; }
.btn-primary {
    background: var(--isfb-primary);
    color: var(--white);
    border-color: var(--isfb-primary);
}
.btn-primary:hover {
    background: var(--isfb-primary-dark);
    border-color: var(--isfb-primary-dark);
    color: var(--white);
}
.btn-secondary {
    background: var(--white);
    color: var(--isfb-primary);
    border-color: var(--isfb-primary);
}
.btn-secondary:hover {
    background: var(--isfb-primary);
    color: var(--white);
}
.btn-danger {
    background: var(--danger);
    color: var(--white);
    border-color: var(--danger);
}
.btn-danger:hover { background: #991b1b; }
.btn-block { display: block; width: 100%; text-align: center; }

.link-action {
    background: none; border: none;
    color: var(--isfb-primary); font-weight: 700;
    cursor: pointer; padding: 4px 8px; font-family: var(--ff);
    font-size: 12px; text-transform: uppercase; letter-spacing: 0.5px;
}
.link-danger {
    background: none; border: none;
    color: var(--danger); font-weight: 700;
    cursor: pointer; padding: 4px 8px; font-family: var(--ff);
    font-size: 12px; text-transform: uppercase; letter-spacing: 0.5px;
}
.link-danger:hover, .link-action:hover { text-decoration: underline; }

/* ---------- FLASH ---------- */
.flash {
    padding: 14px 20px;
    border-radius: 2px;
    margin-bottom: 20px;
    font-size: 14px;
    border-left: 4px solid;
    font-weight: 500;
}
.flash-success { background: #ecfdf5; border-color: var(--success); color: #065f46; }
.flash-error   { background: #fef2f2; border-color: var(--danger); color: #991b1b; }
.flash-warn    { background: #fffbeb; border-color: var(--warn); color: #92400e; }
.flash-info    { background: #eff6ff; border-color: var(--isfb-primary); color: var(--isfb-primary); }

/* ===========================================================================
   AUTH (login, forgot, reset)
   =========================================================================== */

.auth-body {
    background: var(--isfb-primary);
    background-image:
        radial-gradient(circle at 20% 30%, rgba(68, 172, 188, 0.3) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(162, 139, 105, 0.2) 0%, transparent 50%),
        linear-gradient(135deg, var(--isfb-primary) 0%, var(--isfb-primary-dark) 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px;
    min-height: 100vh;
}
.auth-box {
    background: var(--white);
    padding: 48px 40px;
    max-width: 440px;
    width: 100%;
    box-shadow: var(--shadow-lg);
    border-top: 4px solid var(--isfb-teal);
}
.auth-logo {
    display: block;
    text-align: center;
    margin-bottom: 24px;
}
.auth-logo img { height: 64px; margin: 0 auto; }
.auth-box h1 {
    text-align: center;
    color: var(--isfb-primary);
    font-size: 22px;
    margin-bottom: 28px;
    font-weight: 700;
    letter-spacing: -0.2px;
}
.auth-box h1 small {
    display: block;
    font-size: 10px;
    font-weight: 700;
    color: var(--text-soft);
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-top: 6px;
}
.auth-links {
    text-align: center;
    margin-top: 24px;
    font-size: 13px;
    color: var(--text-muted);
    padding-top: 20px;
    border-top: 1px solid var(--border-light);
}
.auth-links a { margin: 0 6px; font-weight: 600; }

/* ===========================================================================
   ADMIN (nav, container, tables)
   =========================================================================== */

.admin-body { background: var(--bg); }

.admin-nav {
    background: var(--isfb-primary);
    position: relative;
}
.admin-nav::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 3px;
    background: linear-gradient(90deg, var(--isfb-teal) 0%, var(--isfb-gold) 50%, var(--isfb-purple) 100%);
}
.admin-nav-inner {
    max-width: 1400px;
    margin: 0 auto;
    padding: 0 32px;
    display: flex;
    align-items: center;
    gap: 2px;
    flex-wrap: wrap;
}
.admin-nav a {
    color: rgba(255, 255, 255, 0.85);
    padding: 16px 20px;
    font-size: 12px;
    font-weight: 700;
    text-decoration: none;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    transition: all .15s;
    position: relative;
}
.admin-nav a:hover {
    color: var(--white);
    background: rgba(255, 255, 255, 0.08);
}
.admin-nav-spacer { flex: 1; }
.admin-nav-user {
    color: rgba(255, 255, 255, 0.6);
    padding: 16px 12px;
    font-size: 12px;
    font-weight: 600;
}
.admin-nav-logout { color: var(--isfb-teal) !important; }
.admin-nav-logout:hover { background: var(--isfb-teal) !important; color: var(--white) !important; }

.admin-main {
    flex: 1;
    padding: 40px 32px;
    max-width: 1400px;
    width: 100%;
    margin: 0 auto;
}
.admin-container {
    background: var(--white);
    padding: 40px 48px;
    box-shadow: var(--shadow-sm);
    border-top: 4px solid var(--isfb-primary);
}
.admin-narrow { max-width: 720px; margin: 0 auto; }
.admin-container h1 {
    color: var(--isfb-primary);
    font-size: 28px;
    margin-bottom: 28px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--border-light);
    font-weight: 700;
    letter-spacing: -0.3px;
}
.admin-container h2 {
    color: var(--isfb-primary);
    font-size: 18px;
    margin: 32px 0 16px;
    font-weight: 700;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--bg-alt);
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.admin-header-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 28px;
    flex-wrap: wrap;
    gap: 16px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--border-light);
}
.admin-header-row h1 {
    margin-bottom: 0;
    padding-bottom: 0;
    border: none;
}

.admin-filter {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-bottom: 24px;
    flex-wrap: wrap;
    padding: 16px;
    background: var(--bg-light);
}
.admin-filter input[type="search"] { flex: 1; min-width: 220px; border-color: var(--border); }

.admin-quick-actions {
    display: flex;
    gap: 12px;
    margin-bottom: 32px;
    flex-wrap: wrap;
}

/* ---------- ADMIN HUB (page Administration) ---------- */
.admin-hub {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 8px;
}
.admin-container .admin-hub-card {
    background: var(--white);
    border: 1px solid var(--border);
    border-left: 4px solid var(--isfb-primary);
    padding: 36px 28px 32px;
    text-decoration: none;
    color: var(--text-body);
    display: flex;
    flex-direction: column;
    transition: all .2s ease;
    box-shadow: var(--shadow-xs);
    position: relative;
    min-height: 240px;
}
.admin-container .admin-hub-card:hover {
    border-left-color: var(--isfb-teal);
    box-shadow: var(--shadow-md);
    transform: translateY(-3px);
    text-decoration: none;
}
.admin-container .admin-hub-icon {
    color: var(--isfb-primary);
    margin-bottom: 18px;
    line-height: 0;
}
.admin-container .admin-hub-card:hover .admin-hub-icon {
    color: var(--isfb-teal);
}
/* Spécificité augmentée pour écraser .admin-container h2 */
.admin-container .admin-hub-card h2 {
    color: var(--isfb-primary);
    font-size: 19px;
    font-weight: 700;
    margin: 0 0 12px 0;
    padding: 0;
    border: none;
    text-transform: none;
    letter-spacing: -0.2px;
    line-height: 1.3;
}
.admin-container .admin-hub-card p {
    font-size: 13px;
    color: var(--text-muted);
    line-height: 1.55;
    margin: 0 0 20px 0;
    flex: 1;
}
.admin-container .admin-hub-count {
    display: inline-block;
    align-self: flex-start;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: var(--isfb-primary);
    background: var(--bg-light);
    padding: 6px 14px;
    border-radius: 999px;
}

@media (max-width: 900px) {
    .admin-hub { grid-template-columns: 1fr; }
}

/* ---------- STATS ---------- */
.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 20px;
    margin-bottom: 36px;
}
.stat-card {
    background: var(--white);
    padding: 28px 24px;
    text-align: center;
    box-shadow: var(--shadow-sm);
    border-top: 4px solid var(--isfb-primary);
    position: relative;
    transition: transform .2s;
}
.stat-card:hover { transform: translateY(-3px); }
.stat-card.stat-success { border-top-color: var(--success); }
.stat-card.stat-warn { border-top-color: var(--warn); }
.stat-card.stat-muted { border-top-color: var(--text-muted); }
.stat-value {
    display: block;
    font-size: 38px;
    font-weight: 700;
    color: var(--isfb-primary);
    line-height: 1;
}
.stat-label {
    display: block;
    font-size: 11px;
    color: var(--text-muted);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-top: 10px;
    font-weight: 700;
}

/* ---------- TABLE ADMIN ---------- */
.admin-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 12px;
    background: var(--white);
}
.admin-table th {
    text-align: left;
    padding: 14px 16px;
    font-size: 11px;
    text-transform: uppercase;
    color: var(--isfb-primary);
    border-bottom: 2px solid var(--isfb-primary);
    font-weight: 700;
    letter-spacing: 0.8px;
    background: var(--bg-light);
}
.admin-table td {
    padding: 14px 16px;
    border-bottom: 1px solid var(--border-light);
    vertical-align: middle;
    font-size: 13px;
}
.admin-table tr:hover td { background: var(--bg-light); }
.admin-actions { white-space: nowrap; }
.admin-actions a, .admin-actions button { margin-right: 12px; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; }
.admin-thumb {
    width: 44px;
    height: 58px;
    object-fit: cover;
    border: 1px solid var(--border);
    box-shadow: var(--shadow-xs);
}

.status {
    display: inline-block;
    padding: 4px 12px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
}
.status-publie { background: #ecfdf5; color: #065f46; }
.status-brouillon { background: #fffbeb; color: #92400e; }
.status-archive { background: #f3f4f6; color: #4b5563; }

/* ---------- FORMULAIRE DOCUMENT ---------- */
.admin-form { max-width: 100%; }
.form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
}
.form-col-full { grid-column: 1 / -1; }

.admin-inline-form {
    display: flex;
    gap: 16px;
    align-items: flex-end;
    padding: 24px;
    background: var(--bg-light);
    border-left: 4px solid var(--isfb-teal);
    margin-bottom: 32px;
    flex-wrap: wrap;
}
.admin-inline-form .form-group { margin-bottom: 0; flex: 1; }

.author-row {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr auto;
    gap: 10px;
    margin-bottom: 10px;
    align-items: center;
    padding: 12px;
    background: var(--bg-light);
    border-left: 3px solid var(--isfb-teal);
}

/* Sections de l'éditeur Observatoire */
.section-row {
    padding: 20px;
    background: var(--bg-light);
    border-left: 4px solid var(--isfb-primary);
    margin-bottom: 16px;
    position: relative;
}
.section-row .form-group { margin-bottom: 14px; }
.section-row .form-group:last-of-type { margin-bottom: 0; }
.section-row textarea {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 14px;
    line-height: 1.55;
}
.btn-remove-section,
.btn-remove-reference {
    background: var(--white);
    border: 1px solid var(--border);
    color: var(--danger);
    padding: 6px 14px;
    cursor: pointer;
    font-family: var(--ff);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-top: 10px;
}
.btn-remove-section:hover,
.btn-remove-reference:hover {
    background: var(--danger);
    color: var(--white);
    border-color: var(--danger);
}

/* Lignes de référence (académique / professionnelle) */
.reference-row {
    padding: 16px;
    background: var(--bg-light);
    border-left: 3px solid var(--isfb-teal);
    margin-bottom: 12px;
}
.reference-row textarea {
    font-family: Georgia, 'Times New Roman', serif;
    font-size: 13px;
    margin-bottom: 8px;
}
.reference-row input[type="text"] {
    font-family: 'Courier New', monospace;
    font-size: 13px;
}
.btn-remove-author {
    background: var(--white);
    border: 1px solid var(--border);
    width: 38px;
    height: 42px;
    color: var(--danger);
    font-size: 24px;
    cursor: pointer;
    line-height: 1;
}
.btn-remove-author:hover { background: var(--danger); color: var(--white); border-color: var(--danger); }

.cover-field {
    display: flex;
    gap: 20px;
    align-items: flex-start;
}
.cover-preview {
    width: 160px;
    height: 210px;
    object-fit: cover;
    border: 1px solid var(--border);
    background: var(--bg-light);
    flex-shrink: 0;
    box-shadow: var(--shadow-sm);
}
.cover-preview-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--text-muted);
    font-size: 12px;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.info-box {
    background: var(--bg-light);
    border-left: 4px solid var(--isfb-teal);
    padding: 16px 20px;
    margin-bottom: 28px;
    font-size: 14px;
}

.form-actions {
    display: flex;
    gap: 12px;
    margin-top: 32px;
    padding-top: 24px;
    border-top: 1px solid var(--border-light);
}

/* ===========================================================================
   RESPONSIVE
   =========================================================================== */

@media (max-width: 1024px) {
    .document-view-layout { grid-template-columns: 1fr; }
    .document-meta { position: static; max-height: none; }
    .form-grid { grid-template-columns: 1fr; }
    .author-row { grid-template-columns: 1fr 1fr; }
    .library-hero { padding: 40px 32px; }
    .library-hero h1 { font-size: 32px; }
    .admin-container { padding: 32px 24px; }
}

@media (max-width: 768px) {
    .isfb-header-inner { padding: 16px 20px; gap: 12px; }
    .isfb-brand { font-size: 18px; }
    .isfb-brand-label small { font-size: 9px; }
    .isfb-logo img { height: 42px; }
    .isfb-main, .admin-main { padding: 20px 16px; }
    .library-hero { padding: 32px 24px; }
    .library-hero h1 { font-size: 26px; }
    .library-hero p { font-size: 15px; }
    .library-search { padding: 8px; }
    .library-search input[type="search"] { border-right: none; border-bottom: 1px solid var(--border-light); }
    .library-grid { grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 16px; }
    .admin-container { padding: 24px 16px; }
    .admin-nav-inner { padding: 0 16px; }
    .admin-nav a { padding: 12px 10px; font-size: 11px; }
    .isfb-toolbar { padding: 8px; gap: 4px; justify-content: center; }
    .isfb-viewer-wrapper { padding: 12px; min-height: 420px; }
    .isfb-thumbs-panel { width: 100%; right: -100%; }
    .cover-field { flex-direction: column; }
    .author-row { grid-template-columns: 1fr; }
    .auth-box { padding: 32px 24px; }
    .stats-grid { grid-template-columns: repeat(2, 1fr); }
    .document-meta { padding: 24px; }
}

@media (max-width: 480px) {
    .isfb-sep { display: none; }
    .isfb-toolbar button, .isfb-toolbar a { width: 36px; height: 36px; }
    .library-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
    .library-card-body { padding: 16px; }
    .library-card-body h3 { font-size: 15px; }
    .library-hero h1 { font-size: 22px; }
}