/* ============================================================================
   SciencesWiki — Re-skin CRT « IBM monochrome » du FRONT LEGACY.
   Ne change PAS le balisage : restyle les composants existants (base.html.twig
   + pages wiki) en phosphore-sur-tube. Chargé seulement quand le thème 'crt' est
   actif (Paramètres › Général) et jamais en back-office.

   Autonome (n'importe pas crt.css). Tout est scopé sous body.theme-crt.
   Les manettes d'effets (--scan-opacity, etc.) sont identiques à crt.css : ajustez
   ici pour le front legacy, ou via le panneau ⚙ sur les pages de présentation.
   ========================================================================== */



body.theme-crt {
    /* Palette phosphore P4 (blanc-gris chaud). */
    --phos:        #d7d8cf;
    --phos-dim:    #8f968c;
    --phos-bright: #f4f5ee;
    --phos-faint:  #4d544c;
    --glow:        rgba(215, 216, 207, .45);

    /* On REDÉFINIT les variables legacy : tout composant qui les utilise bascule
       automatiquement (couleurs d'accent, lignes, encre, fonds). */
    --accent:      #b9f0c9;   /* ex-teal #019fb9 */
    --accent-dark: #eafff2;   /* ex-bleu nuit */
    --aca:         #a9d8c2;   /* bloc académique (était bleu) */
    --vul:         #f0d8a0;   /* bloc vulgarisation (ambre d'appoint) */
    --bg:          #0a0d0b;
    --line:        #3a423c;
    --ink:         #d7d8cf;

    /* Manettes d'effets (cf. crt.css). 0 = effet désactivé. */
    --scan-opacity: 0.42;
    --rgb-opacity: 0;
    --vignette: 0.8;
    --curve: 13%;
    --flicker: 0.03;
    --roll: 0.095;
    --roll-speed: 2s;
    --glow-blur: 16px;
    --glow-strength: 0.6;
    --cursor-speed: 0.8s;
    --tw-speed: 37;

    min-width: fit-content;
    
    background: var(--bg);
    background-image: radial-gradient(120% 130% at 50% 50%, transparent 55%, rgba(0,0,0,.55) 100%);
    color: var(--phos);
    text-shadow: 0 0 1px var(--glow), 0 0 var(--glow-blur) rgba(215,216,207,var(--glow-strength));
    -webkit-font-smoothing: none;
}

/* ----------------------------- Surcouches tube ----------------------------- */
body.theme-crt .crt-overlay, body.theme-crt .crt-flicker { position: fixed; inset: 0; pointer-events: none; z-index: 9000; }
body.theme-crt .crt-overlay {
    z-index: 9001; mix-blend-mode: multiply;
    background:
        repeating-linear-gradient(to bottom,
            rgba(0,0,0,0) 0,
            rgba(0,0,0,0) calc(var(--scan-gap) - var(--scan-thickness)),
            rgba(0,0,0,var(--scan-opacity)) calc(var(--scan-gap) - var(--scan-thickness)),
            rgba(0,0,0,var(--scan-opacity)) var(--scan-gap)),
        repeating-linear-gradient(to right,
            rgba(255,80,80,var(--rgb-opacity)),
            rgba(80,255,80,var(--rgb-opacity)) 1px,
            rgba(80,80,255,var(--rgb-opacity)) 2px);
}
body.theme-crt .crt-overlay::after {
    content: ''; position: absolute; inset: 0;
    background:
        radial-gradient(140% 140% at 50% -10%, rgba(255,255,255,.05), transparent 40%),
        radial-gradient(120% 120% at 50% 50%, transparent 60%, rgba(0,0,0,var(--vignette)) 100%);
    border-radius: 50% / var(--curve);
    box-shadow: inset 0 0 120px 30px rgba(0,0,0,calc(var(--vignette) * .92));
}
body.theme-crt .crt-flicker { z-index: 9002; background: rgba(215,216,207,var(--flicker)); animation: crt-flick var(--flicker-speed) steps(2) infinite; }
body.theme-crt .crt-flicker::before { content: ''; position: absolute; left: 0; right: 0; height: 28vh; background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,var(--roll)), rgba(255,255,255,0)); animation: crt-roll var(--roll-speed) linear infinite; }
@keyframes crt-flick { 0% { opacity: .92; } 50% { opacity: 1; } 100% { opacity: .96; } }
@keyframes crt-roll { 0% { top: -30vh; } 100% { top: 100vh; } }

/* L'enveloppe legacy reste au-dessus des scanlines. */
body.theme-crt > header, body.theme-crt > main, body.theme-crt > footer { position: relative; z-index: 10; }

/* -------------------------------- Typographie ------------------------------ */
body.theme-crt h1, body.theme-crt h2, body.theme-crt h3, body.theme-crt h4 { color: var(--phos-bright); letter-spacing: .02em; }
body.theme-crt a { color: var(--accent); }
body.theme-crt a:hover, body.theme-crt a:focus { color: var(--phos-bright); }
body.theme-crt a:focus { font-weight: bold; }
body.theme-crt .muted, body.theme-crt .qmeta time, body.theme-crt small { color: var(--phos-dim); }
body.theme-crt strong, body.theme-crt b { color: var(--phos-bright); }
body.theme-crt hr { border-color: var(--line); }

body.theme-crt a.scw-analyze { color: var(--phos); }

/* --------------------------------- En-tête --------------------------------- */
body.theme-crt header { border-bottom-color: var(--line); }
body.theme-crt header .brand { color: var(--accent); }
/* Logo dédié CRT (logo-crt.svg servi par le template) : pas de filtre. */
body.theme-crt header .brand img { filter: none; }
body.theme-crt header nav a, body.theme-crt header nav .nav-dd { color: var(--phos); }
body.theme-crt header nav a:hover, body.theme-crt header nav .nav-dd:hover, body.theme-crt header nav .nav-dd:focus-within { background: rgba(185,240,201,.12); color: var(--phos-bright); }
body.theme-crt header nav a.is-active, body.theme-crt header nav .nav-dd.is-active { color: var(--accent); }
body.theme-crt header nav a.is-active::after { background: var(--accent); }
body.theme-crt .nav-dd-top { color: var(--phos); background: none; border: none; }
body.theme-crt .nav-dd-top:hover, body.theme-crt .nav-dd:focus-within .nav-dd-top { background: rgba(185,240,201,.14); color: var(--phos-bright); }
/* Menu « Mon compte » : fond OPAQUE et AU-DESSUS des surcouches tube (sinon les
   scanlines/vignette le rendent illisible et il semble se superposer au contenu). */
body.theme-crt .nav-dd-menu { background: #0c100e; border-color: var(--accent); box-shadow: 0 10px 28px rgba(0,0,0,.7); z-index: 9100; }
body.theme-crt .nav-dd-menu a { color: var(--phos); }
body.theme-crt .nav-dd-menu a:hover { background: rgba(185,240,201,.12); color: var(--phos-bright); }
body.theme-crt .nav-dd-logout { color: #f3b0b0 !important; border-top-color: var(--line); }
body.theme-crt .nav-email { color: var(--phos-dim); }

/* --------------------------------- Cartes ---------------------------------- */
body.theme-crt .card, body.theme-crt .side-block, body.theme-crt .qlist li,
body.theme-crt .stat-grid .s, body.theme-crt .ask, body.theme-crt .cartouche {
    background: rgba(215,216,207,.014) !important; border-color: var(--line) !important; color: var(--phos);
}
body.theme-crt .card { color: var(--phos); }
body.theme-crt .card:hover { border-color: var(--accent) !important; box-shadow: inset 0 0 0 1px var(--accent); }
body.theme-crt .qlist a.q-title { color: var(--phos-bright); }
body.theme-crt .qlist a.q-title:hover { color: var(--accent); }
body.theme-crt .stat-grid .s strong { color: var(--phos-bright); }

/* Lanceurs de domaines : forcés en monochrome (on neutralise les fonds colorés inline). */
body.theme-crt .domain-card { background: #0d110f !important; border-color: var(--phos-faint) !important; box-shadow: none; }
body.theme-crt .domain-card::after { background: none !important; }
body.theme-crt .domain-card:hover { border-color: var(--accent) !important; box-shadow: 0 0 18px rgba(185,240,201,.14); transform: scale(1.02); }
body.theme-crt .domain-card .d-label, body.theme-crt .domain-card .d-sub { color: var(--phos); text-shadow: 0 0 1px var(--glow); }

/* Onglets « Nous rejoindre ». */
body.theme-crt .join-tabs { border-bottom-color: var(--line); }
body.theme-crt .join-tabs button { color: var(--phos-dim); background: none; }
body.theme-crt .join-tabs button[aria-selected="true"] { color: var(--accent); border-bottom-color: var(--accent); }

/* -------------------------- Pastilles, badges, états ----------------------- */
body.theme-crt .pill { background: rgba(215,216,207,.04); color: var(--phos-dim); border-color: var(--line); }
body.theme-crt .pill.author { background: rgba(185,240,201,.06); color: #cfeede; border-color: var(--line); }
body.theme-crt .pill.node { background: rgba(185,240,201,.06); color: var(--accent); border-color: var(--line); }
body.theme-crt .badge { text-shadow: none; }
body.theme-crt .badge.ok { background: #14301f; color: #b9f0c9; }
body.theme-crt .badge.warn { background: #3a2f12; color: #f0d8a0; }

/* Blocs académique / vulgarisation (les bordures viennent de --aca/--vul, déjà redéfinis). */
body.theme-crt .sources { color: var(--phos-dim); }

/* ------------------------------ Formulaires -------------------------------- */
body.theme-crt input[type=text], body.theme-crt input[type=email], body.theme-crt input[type=password],
body.theme-crt input[type=search], body.theme-crt input[type=number], body.theme-crt textarea, body.theme-crt select {
    background: rgba(0,0,0,.35) !important; color: var(--phos-bright) !important;
    border: 1px solid var(--line) !important; text-shadow: 0 0 4px var(--glow);
}
body.theme-crt input:focus, body.theme-crt textarea:focus, body.theme-crt select:focus {
    outline: none; border-color: var(--accent) !important; box-shadow: 0 0 0 1px var(--accent), inset 0 0 12px rgba(185,240,201,.06);
}
body.theme-crt input::placeholder, body.theme-crt textarea::placeholder { color: var(--phos-faint); }

/* Boutons (accent, vote, soumissions). */
body.theme-crt button, body.theme-crt .ask button, body.theme-crt .join-pane button[type=submit] {
    background: transparent !important; color: var(--accent) !important;
    border: 1px solid var(--accent) !important; text-shadow: none; text-transform: uppercase; letter-spacing: .03em;
}
body.theme-crt button:hover, body.theme-crt .ask button:hover { background: var(--accent) !important; color: var(--bg) !important; }
body.theme-crt button:disabled { opacity: .45; }

/* --------------------------------- Tableaux -------------------------------- */
body.theme-crt td { border-bottom-color: var(--line); }
body.theme-crt table th { color: var(--phos-bright); }

/* ----------------------------- Contenu Markdown ---------------------------- */
body.theme-crt .md { color: var(--phos); }
body.theme-crt .md h2 { border-bottom-color: var(--line); }
body.theme-crt .md a { color: var(--accent); text-decoration-color: rgba(185,240,201,.45); }
body.theme-crt .md a:hover { text-decoration-color: var(--accent); }
body.theme-crt .md blockquote { border-left-color: var(--line); color: var(--phos-dim); }
body.theme-crt .md th, body.theme-crt .md td { border-color: var(--line); }
body.theme-crt .md code { background: rgba(215,216,207,.08); color: var(--phos-bright); }
body.theme-crt .md pre { background: rgba(0,0,0,.4); border: 1px solid var(--line); }

/* Bannière IA / cartouche / divers. */
body.theme-crt .ai-banner { background: #2a2410 !important; border-color: #6b5a1f !important; color: #f0d8a0 !important; }
body.theme-crt .ai-banner a { color: var(--accent) !important; }
body.theme-crt .cartouche .avatar { background: linear-gradient(135deg, var(--accent), #4d544c); color: var(--bg); }
body.theme-crt .cartouche .note { color: var(--phos-dim); }
body.theme-crt .crumbs a { color: var(--phos-dim); }
body.theme-crt .crumbs a:hover { color: var(--accent); }
body.theme-crt #stream-out { border-color: var(--line); }
body.theme-crt #stream-out h4 { color: var(--vul); }
body.theme-crt .loader { border-color: var(--phos-faint); border-top-color: var(--accent); }

/* --------------------------------- Footer ---------------------------------- */
body.theme-crt footer { border-top-color: var(--line); color: var(--phos-dim); }
body.theme-crt footer a { color: var(--phos-dim); }
body.theme-crt footer a:hover { color: var(--phos-bright); }

/* ======================= CORRECTION DE CONTRASTE ========================== */
/* Les pages legacy posent beaucoup de couleurs EN LIGNE (style="...") : fonds
   clairs (texte phosphore illisible) et textes sombres (invisibles sur le tube).
   On les neutralise par sélecteurs d'attribut + !important, regroupés par famille
   sémantique. Les règles spécifiques (succès/alerte/erreur) viennent APRÈS les
   neutres pour gagner en cas de collision de sous-chaîne (#fff ⊂ #fffbeb). */

/* --- Fonds clairs neutres → sombre + texte phosphore --- */
body.theme-crt [style*="background:#fff"], body.theme-crt [style*="background: #fff"],
body.theme-crt [style*="background:#fafafa"], body.theme-crt [style*="background:#fafcff"],
body.theme-crt [style*="background:#f8fafc"], body.theme-crt [style*="background:#f1f5f9"],
body.theme-crt [style*="background:#f9fafb"], body.theme-crt [style*="background:#e2e8f0"],
body.theme-crt [style*="background:#eef2ff"], body.theme-crt [style*="background:#f3f4f6"],
body.theme-crt [style*="rgba(255,255,255"], body.theme-crt [style*="rgba(255, 255, 255"] {
    background: #0e1310 !important; color: var(--phos) !important; border-color: var(--line) !important;
}

/* --- Fonds « succès » verts → vert phosphore sombre --- */
body.theme-crt [style*="background:#f0fdf4"], body.theme-crt [style*="background:#ecfdf5"],
body.theme-crt [style*="background:#dcfce7"], body.theme-crt [style*="background:#d1fae5"] {
    background: #11301e !important; color: #bdf3cf !important; border-color: #2f6b46 !important;
}

/* --- Fonds « alerte » ambre → ambre sombre --- */
body.theme-crt [style*="background:#fffbeb"], body.theme-crt [style*="background:#fef3c7"],
body.theme-crt [style*="background:#fefce8"], body.theme-crt [style*="background:#fff7ed"] {
    background: #2a2410 !important; color: #f2dca6 !important; border-color: #6b5a1f !important;
}

/* --- Fonds « erreur » rouges → rouge sombre --- */
body.theme-crt [style*="background:#fef2f2"], body.theme-crt [style*="background:#fee2e2"],
body.theme-crt [style*="background:#fecaca"] {
    background: #2a1414 !important; color: #f3b0b0 !important; border-color: #7f3030 !important;
}

/* --- Textes sombres en ligne → phosphore lisible (gris/quasi-noir) --- */
body.theme-crt [style*="color:#111827"], body.theme-crt [style*="color:#1f2937"],
body.theme-crt [style*="color:#374151"], body.theme-crt [style*="color:#1e293b"],
body.theme-crt [style*="color:#0f172a"], body.theme-crt [style*="color:#334155"],
body.theme-crt [style*="color:#475569"] {
    color: var(--phos) !important;
}
body.theme-crt [style*="color:#6b7280"], body.theme-crt [style*="color:#64748b"],
body.theme-crt [style*="color:#9ca3af"], body.theme-crt [style*="color:#94a3b8"] {
    color: var(--phos-dim) !important;
}

/* --- Textes sémantiques sombres → accents lisibles (rouge/vert/ambre/bleu) --- */
body.theme-crt [style*="color:#991b1b"], body.theme-crt [style*="color:#b91c1c"],
body.theme-crt [style*="color:#dc2626"], body.theme-crt [style*="color:#792424"] { color: #f3b0b0 !important; }
body.theme-crt [style*="color:#166534"], body.theme-crt [style*="color:#065f46"],
body.theme-crt [style*="color:#16a34a"], body.theme-crt [style*="color:#15803d"] { color: #bdf3cf !important; }
body.theme-crt [style*="color:#92400e"], body.theme-crt [style*="color:#78350f"],
body.theme-crt [style*="color:#b45309"] { color: #f2dca6 !important; }
body.theme-crt [style*="color:#3730a3"], body.theme-crt [style*="color:#1e40af"] { color: #b9c8ee !important; }

/* --- Classes définies dans les <style> par page (recherche, nœud, réponse,
       revue de littérature, controverses, vote…) : surchargées par spécificité. --- */
body.theme-crt .lr-aside, body.theme-crt .node-aside, body.theme-crt .rs-card,
body.theme-crt .cv-state, body.theme-crt .cv-card, body.theme-crt .qa-item {
    background: #0e1310 !important; border-color: var(--line) !important; color: var(--phos) !important;
}
body.theme-crt .art-edit-btn, body.theme-crt .vote-btn {
    background: transparent !important; color: var(--accent) !important; border-color: var(--accent) !important;
}
body.theme-crt .vote-btn:hover, body.theme-crt .rev-actions a:hover, body.theme-crt .rev-actions button:hover {
    background: rgba(185,240,201,.12) !important; color: var(--phos-bright) !important;
}
body.theme-crt .qa-warn { background: #2a2410 !important; color: #f2dca6 !important; border-color: #6b5a1f !important; }
body.theme-crt .rs-soon { background: rgba(215,216,207,.08) !important; color: var(--phos-dim) !important; }
body.theme-crt .cv-axis { background: rgba(185,200,238,.12) !important; color: #b9c8ee !important; }
body.theme-crt .cv-stance.pos { background: #11301e !important; border-color: #2f6b46 !important; color: #bdf3cf !important; }
body.theme-crt .cv-stance.neg { background: #2a1414 !important; border-color: #7f3030 !important; color: #f3b0b0 !important; }
body.theme-crt .cv-stance.nul { background: #14181500 !important; }
body.theme-crt .vote-yes.on { background: #11301e !important; border-color: #2f6b46 !important; color: #bdf3cf !important; }
body.theme-crt .vote-no.on { background: #2a1414 !important; border-color: #7f3030 !important; color: #f3b0b0 !important; }

/* --- Couleurs définies en CLASSES dans les <style> de page (n'ont pas de
       style="" en ligne → échappent aux sélecteurs [style*] ci-dessus). --- */

/* Sidebar nœud : bouton « Explorer » = ancre à fond accent → texte blanc illisible. */
body.theme-crt .aside-explore { background: var(--accent) !important; color: var(--bg) !important; }
body.theme-crt .aside-explore:hover { background: var(--phos-bright) !important; color: var(--bg) !important; }

/* Onglets : pastille de compteur (fond accent/gris clair, texte blanc). */
body.theme-crt .tab-badge { background: var(--accent) !important; color: var(--bg) !important; }
body.theme-crt [role=tab][aria-selected=false] .tab-badge { background: var(--phos-faint) !important; color: var(--phos) !important; }

/* Controverses : textes des cartes (résumé, méta, citation verbatim) en couleurs
   sombres codées en dur → invisibles sur le tube. On les ramène en phosphore. */
body.theme-crt .cv-summary { color: var(--phos) !important; }
body.theme-crt .cv-meta, body.theme-crt .cv-claim figcaption, body.theme-crt .cv-claim-meta { color: var(--phos-dim) !important; }
body.theme-crt .cv-claim blockquote { background: rgba(0,0,0,.3) !important; color: var(--phos) !important; border-left-color: var(--phos-faint) !important; }

/* Revues de littérature : cartes (fond blanc) + boutons d'action (fond blanc). */
body.theme-crt .rev-item { background: #0e1310 !important; border-color: var(--line) !important; }
body.theme-crt .rev-actions a, body.theme-crt .rev-actions button { background: transparent !important; color: var(--accent) !important; border-color: var(--accent) !important; }
body.theme-crt .rev-actions a:hover, body.theme-crt .rev-actions button:hover { background: rgba(185,240,201,.12) !important; color: var(--phos-bright) !important; }
body.theme-crt .rev-actions .del { border-color: #7f3030 !important; color: #f3b0b0 !important; }
body.theme-crt .rev-actions .del:hover { background: #2a1414 !important; color: #f3b0b0 !important; }

/* Le bandeau ADMIN garde sa propre charte (déjà sombre, bleu clair lisible). */
body.theme-crt #admin-bar, body.theme-crt #admin-bar * { color: revert !important; background: revert !important; }
body.theme-crt #admin-bar { background: #0f172a !important; }


/* ===== Cadre « terminal » unifié sous CRT (cohérence avec les pages de
    présentation : barre TTY + bordure + largeur 1000px centrée). Scopé
    .theme-crt ; les variables --phos-* viennent de crt-theme.css. ===== */
/* Largeur pleine seulement quand le cadre terminal est présent (front).
    L'admin en CRT garde le centrage/padding sobres du body. */
body.theme-crt.crt-framed { max-width:none; margin:0; padding:0; }
body.theme-crt .crt-shell { max-width:75%; margin:0 auto; padding:1.2rem 1.4rem 4rem; position:relative; z-index:10; }
body.theme-crt .crt-termbar { display:flex; align-items:center; gap:.6rem; border:1px solid var(--phos-faint,#4d544c); border-bottom:none; padding:.35rem .7rem; background:#0c0f0d; font-size:.82rem; color:var(--phos-dim,#8f968c); letter-spacing:.08em; text-transform:uppercase; }
body.theme-crt .crt-termbar .dots { display:flex; gap:.35rem; }
body.theme-crt .crt-termbar .dots i { width:.62rem; height:.62rem; border:1px solid var(--phos-faint,#4d544c); border-radius:50%; display:inline-block; }
body.theme-crt .crt-term { border:1px solid var(--phos-faint,#4d544c); padding:1.4rem 1.6rem 1.8rem; box-shadow:inset 0 0 60px rgba(0,0,0,.5); min-height:60vh; }
/* En-tête sans bordure redondante dans le cadre. */
body.theme-crt .crt-term > header { border-top:none; }

/* ------------------------------ Accessibilité ------------------------------ */
@media (prefers-reduced-motion: reduce) {
    body.theme-crt .crt-flicker, body.theme-crt .crt-flicker::before { animation: none !important; }
}