/* ══════════════════════════════════════════════════════════════
   ALIVA THEME — Full dark editorial
   Palette: #100E0A (bg) · #F5C842 (solar) · #E85D2F (rouge) · #B8D44E (vert)
   Typographie: Fraunces (serif) + Instrument Sans + JetBrains Mono
   ══════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,700;0,9..144,900;1,9..144,400;1,9..144,700&family=Instrument+Sans:wght@400;500;600;700&family=JetBrains+Mono:wght@400;700&display=swap');

/* ── Variables ────────────────────────────────────────────────── */
:root {
    --aliva-bg:        #100E0A;
    --aliva-surface:   #1C1916;
    --aliva-surface2:  #242018;
    --aliva-border:    rgba(255,255,255,.09);
    --aliva-text:      rgba(255,255,255,.90);
    --aliva-muted:     rgba(255,255,255,.48);
    --aliva-solar:     #F5C842;
    --aliva-rouge:     #E85D2F;
    --aliva-vert:      #B8D44E;
    --aliva-mono:      'JetBrains Mono', monospace;

    /* Écrase les variables du layout */
    --primary:    #F5C842;
    --secondary:  #100E0A;
    --primary-10: rgba(245,200,66,.10);
    --primary-20: rgba(245,200,66,.18);
    --cat-primary:    #F5C842;
    --cat-secondary:  #100E0A;
    --cat-accent-bg:  rgba(245,200,66,.10);
}

/* ── Reset global fond & typo ─────────────────────────────────── */
body {
    background: var(--aliva-bg);
    color: var(--aliva-text);
    font-family: 'Instrument Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

/* ── Navbar ───────────────────────────────────────────────────── */
.navbar {
    background: rgba(16,14,10,.92);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: 1px solid var(--aliva-border);
    box-shadow: none;
}
.navbar-brand { color: #fff; font-family: 'Fraunces', Georgia, serif; font-style: italic; font-size: 19px; }
.navbar-brand span { color: var(--aliva-solar); font-style: normal; }
.navbar-links a { color: rgba(255,255,255,.60); }
.navbar-links a:hover { background: rgba(255,255,255,.07); color: #fff; }
.navbar-cta { background: var(--aliva-solar) !important; color: #100E0A !important; }
.navbar-cta:hover { background: #ffd740 !important; color: #100E0A !important; }

/* ── Breadcrumb ──────────────────────────────────────────────── */
.breadcrumb { color: rgba(255,255,255,.40); }
.breadcrumb a { color: var(--aliva-solar); }
.breadcrumb a:hover { color: #ffd740; }

/* ── Footer ───────────────────────────────────────────────────── */
.footer {
    background: #0a0806;
    border-top: 1px solid var(--aliva-border);
    color: rgba(255,255,255,.40);
}
.footer strong { color: rgba(255,255,255,.80); }
.footer a { color: rgba(255,255,255,.55); }

/* ── Cards formation ──────────────────────────────────────────── */
.card-f {
    background: var(--aliva-surface);
    border-color: var(--aliva-border);
}
.card-f:hover { box-shadow: 0 8px 32px rgba(0,0,0,.50); }
.card-title-f { color: rgba(255,255,255,.92); }
.card-excerpt-f { color: rgba(255,255,255,.52); }
.card-footer-f { border-top-color: rgba(255,255,255,.07); }
.card-price-f { color: var(--aliva-solar); }
.card-price-nc { color: rgba(255,255,255,.40); }
.card-tag { background: rgba(255,255,255,.07); color: rgba(255,255,255,.55); }
.card-tag:hover { background: rgba(245,200,66,.15); color: var(--aliva-solar); }
.card-accent { background: var(--aliva-solar); }
.card-accent.presentiel       { background: linear-gradient(90deg, var(--aliva-solar), var(--aliva-rouge)); }
.card-accent.distanciel       { background: linear-gradient(90deg, var(--aliva-vert), var(--aliva-solar)); }
.card-accent.mixte            { background: linear-gradient(90deg, var(--aliva-vert), var(--aliva-solar)); }
.card-accent.e_learning       { background: linear-gradient(90deg, var(--aliva-rouge), var(--aliva-solar)); }

/* Session badge */
.session-badge--ok { color: var(--aliva-vert); background: rgba(184,212,78,.10); }
.session-badge--ok a { color: var(--aliva-vert); }
.session-badge--none { color: rgba(255,255,255,.30); background: rgba(255,255,255,.04); }
.session-dot { background: var(--aliva-vert); box-shadow: 0 0 0 2px rgba(184,212,78,.25); }
@keyframes pulse-dot {
    0%,100% { box-shadow: 0 0 0 2px rgba(184,212,78,.25); }
    50% { box-shadow: 0 0 0 4px rgba(184,212,78,.15); }
}

/* Badge modalite */
.badge-presentiel       { background: rgba(245,200,66,.12); color: var(--aliva-solar); }
.badge-distanciel       { background: rgba(184,212,78,.12); color: var(--aliva-vert); }
.badge-classe_virtuelle { background: rgba(184,212,78,.10); color: var(--aliva-vert); }
.badge-mixte            { background: rgba(232,93,47,.12); color: var(--aliva-rouge); }
.badge-e_learning       { background: rgba(232,93,47,.10); color: var(--aliva-rouge); }
.badge-formation_action { background: rgba(245,200,66,.10); color: var(--aliva-solar); }
.badge-atelier          { background: rgba(255,255,255,.07); color: rgba(255,255,255,.60); }

/* Niveau badges */
.badge-niveau-debutant     { background: rgba(184,212,78,.12); color: var(--aliva-vert); }
.badge-niveau-intermediaire{ background: rgba(245,200,66,.12); color: var(--aliva-solar); }
.badge-niveau-avance       { background: rgba(232,93,47,.12); color: var(--aliva-rouge); }
.badge-niveau-expert       { background: rgba(232,93,47,.18); color: #ff7c55; }
.badge-niveau-default      { background: rgba(255,255,255,.07); color: rgba(255,255,255,.45); }

/* ── Sidebar filtres ──────────────────────────────────────────── */
.filters-sidebar {
    background: var(--aliva-surface) !important;
    border-color: var(--aliva-border) !important;
    box-shadow: none;
}
.filter-section-title { color: rgba(255,255,255,.35) !important; }
.filter-option { color: rgba(255,255,255,.65) !important; }
.filter-option:hover { color: var(--aliva-solar) !important; }
.filter-option.active { color: var(--aliva-solar) !important; }
.filter-option .filter-ct { background: rgba(255,255,255,.07) !important; color: rgba(255,255,255,.40) !important; }
.filter-option.active .filter-ct { background: rgba(245,200,66,.15) !important; color: var(--aliva-solar) !important; }
.filter-sep { background: rgba(255,255,255,.07) !important; }
.filter-reset-link { border-color: rgba(255,255,255,.10) !important; color: rgba(255,255,255,.35) !important; background: transparent !important; }
.filter-reset-link:hover { background: rgba(255,255,255,.05) !important; color: rgba(255,255,255,.70) !important; }
.tag-chip { background: rgba(255,255,255,.06) !important; color: rgba(255,255,255,.50) !important; }
.tag-chip:hover, .tag-chip.active { background: rgba(245,200,66,.14) !important; color: var(--aliva-solar) !important; }

/* ── Pills familles ───────────────────────────────────────────── */
.famille-pills-wrap { background: rgba(16,14,10,.95); border-bottom-color: rgba(255,255,255,.08); }
.famille-pill { color: rgba(255,255,255,.48); background: rgba(255,255,255,.05); border-color: rgba(255,255,255,.08); }
.famille-pill:hover { color: rgba(255,255,255,.85); background: rgba(255,255,255,.10); border-color: rgba(255,255,255,.18); }
.famille-pill.active { color: #100E0A; background: var(--aliva-solar); border-color: var(--aliva-solar); }
.pill-count { background: rgba(255,255,255,.12); color: rgba(255,255,255,.50); }
.famille-pill.active .pill-count { background: rgba(0,0,0,.20); color: rgba(0,0,0,.70); }
.pill-parcours { color: #100E0A !important; background: var(--aliva-vert) !important; border-color: var(--aliva-vert) !important; }
.pill-count-parcours { background: rgba(0,0,0,.20) !important; color: rgba(0,0,0,.60) !important; }

/* ── CTA band ─────────────────────────────────────────────────── */
.cta-band { background: var(--aliva-surface2); border: 1px solid var(--aliva-border); }
.btn-cta-white { background: var(--aliva-solar); color: #100E0A; }
.btn-cta-white:hover { opacity: .88; color: #100E0A; }

/* ── Famille section ──────────────────────────────────────────── */
.famille-header { border-bottom-color: rgba(255,255,255,.07); }
.famille-name { color: rgba(255,255,255,.90); }
.famille-desc { color: rgba(255,255,255,.48); }
.famille-count-badge { background: rgba(245,200,66,.12); color: var(--aliva-solar); }
.famille-voir-plus { color: var(--aliva-solar); }
.results-bar { color: rgba(255,255,255,.45); }
.results-bar strong { color: rgba(255,255,255,.90); }

/* ── FAQ ──────────────────────────────────────────────────────── */
.faq-item { background: var(--aliva-surface); border-color: var(--aliva-border); }
.faq-question { color: rgba(255,255,255,.85); }
.faq-question:hover { background: rgba(255,255,255,.04); }
.faq-icon { background: var(--aliva-solar); color: #100E0A; }
.faq-answer { color: rgba(255,255,255,.55); border-top-color: rgba(255,255,255,.07); }
.faq-section-title { color: rgba(255,255,255,.90); }
.faq-section-sub { color: rgba(255,255,255,.48); }

/* ── Bouton retour haut ───────────────────────────────────────── */
#back-to-top { background: var(--aliva-solar); color: #100E0A; }
#back-to-top:hover { background: #ffd740; }

/* ── Flash success ────────────────────────────────────────────── */
.flash-success { background: rgba(184,212,78,.10); border-color: rgba(184,212,78,.30); color: var(--aliva-vert); }

/* ── Parcours sidebar ─────────────────────────────────────────── */
.sidebar-parcours-link { color: rgba(255,255,255,.60) !important; }
.sidebar-parcours-link:hover { color: var(--aliva-solar) !important; }
.sidebar-parcours-name { color: rgba(255,255,255,.80) !important; }
.sidebar-parcours-link:hover .sidebar-parcours-name { color: var(--aliva-solar) !important; }

/* ── Famille encart ───────────────────────────────────────────── */
.famille-encart { background: var(--aliva-surface); }
.famille-encart-title { color: rgba(255,255,255,.90); }
.famille-encart-body { color: rgba(255,255,255,.55); }
.famille-encart-vision { background: rgba(255,255,255,.04); }
.famille-encart-vision-lbl { color: var(--aliva-solar); }
.famille-encart-vision-text { color: rgba(255,255,255,.65); }

/* ── Btn catalogue ────────────────────────────────────────────── */
.btn-cat { background: var(--aliva-solar); color: #100E0A; }
.btn-cat:hover { opacity: .88; color: #100E0A; }
.btn-cat-outline { border-color: var(--aliva-solar); color: var(--aliva-solar); }
.btn-cat-outline:hover { background: rgba(245,200,66,.10); }

/* ── Tooltip modal ────────────────────────────────────────────── */
.has-tip::after { background: #0a0806; color: rgba(255,255,255,.80); box-shadow: 0 4px 16px rgba(0,0,0,.40); }
.has-tip::before { border-top-color: #0a0806; }
