/* Flair Admin, ambiance « Matrix » : noir profond teinté de vert, textes vert pâle, pluie de caractères verte en fond,
   halo émeraude en haut de page. Le vert fluo vif reste réservé aux actions (boutons, liens, onglets choisis, focus) ;
   les données (barres, jauges) prennent des verts sourds, pour ne jamais se confondre avec ce qui se clique.
   Seule exception : le rouge des actions qui effacent et des erreurs critiques.
   Toujours sombre : la page ignore le choix clair ou sombre. Chargé après flair.css, à spécificité égale il l'emporte. */
:root.matrix,
:root.matrix[data-pt="light"],
:root.matrix[data-pt="dark"]{
  --neon:#39ff9f; --neon-rgb:57,255,159; --on-neon:#00140a;
  --g0:#03110c; --g1:#062019; --g2:#0a3022; --g3:#0f4630; --g4:#165e40; --g5:#1f7a53; --g6:#2e9a6a; --g7:#4dbf88; --g8:#86e0b4; --g9:#c4f7dd;
  --grad-plein:linear-gradient(135deg,#0f4630,#39ff9f);
  --paliers:linear-gradient(90deg,#0a3022,#1f7a53 45%,#86e0b4);
  --c1:#165e40; --c2:#2e9a6a; --c3:#86e0b4; --c1-rgb:46,154,106;
  --grad:linear-gradient(90deg,#1f7a53,#86e0b4);
  --grad-btn:linear-gradient(var(--neon),var(--neon)); --on-grad:var(--on-neon);
  --grad-text:linear-gradient(90deg,#c4f7dd,#86e0b4);
  --focus:var(--neon); --plein:var(--neon); --on-plein:var(--on-neon); --on-marque:var(--on-neon);
  --bg:#010604; --bg-alt:#04130d; --text:#e6fff4; --text-rgb:230,255,244;
  --text-2:#a9cfbf; --text-3:#7fa898; --border:rgba(134,224,180,.16); --border-soft:rgba(134,224,180,.09);
  --card-bg:linear-gradient(170deg,rgba(9,40,28,.78),rgba(3,17,12,.82)); --card-border:rgba(134,224,180,.16); --card-shadow:0 0 0 1px rgba(0,0,0,.4),0 24px 48px -28px rgba(0,0,0,.9);
  --chip-bg:rgba(134,224,180,.08); --accent:var(--neon); --nav-glass:rgba(1,8,5,.74); --grid-line:rgba(134,224,180,.045);
  --glow:0; --ok:#c4f7dd; --ok-bg:rgba(134,224,180,.12); --warn:#a9cfbf; --warn-bg:rgba(134,224,180,.07);
  --bad:#ff5c6c; --bad-bg:rgba(255,92,108,.12);
  --sev-haute:#c4f7dd; --sev-faible:#5f8f7c;
  --ctl:#5f8f7c;
  --chevron:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%23a9cfbf' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  --font-display:ui-monospace,'SF Mono','SFMono-Regular',Menlo,Consolas,'Liberation Mono',monospace;
  color-scheme:dark;
}
.matrix body{background:#010604}

/* Fond : halo émeraude en haut, pluie de caractères verte (dessinée par admin.js ; rien si le mouvement est réduit),
   lignes d'écran cathodique très discrètes, et un voile qui assombrit les bords */
.matrix .bgfx::after{display:block;content:"";position:absolute;left:-10%;right:-10%;top:-30vh;height:90vh;opacity:1;filter:blur(30px);
  background:radial-gradient(48% 55% at 50% 35%,rgba(31,122,83,.42),transparent 70%),radial-gradient(30% 40% at 20% 20%,rgba(15,70,48,.5),transparent 70%),radial-gradient(30% 40% at 80% 25%,rgba(15,70,48,.45),transparent 70%)}
.matrix .bgfx::before{-webkit-mask-image:none;mask-image:none;background-size:auto;
  background-image:radial-gradient(120% 90% at 50% 20%,transparent 55%,rgba(0,0,0,.7)),repeating-linear-gradient(0deg,rgba(134,224,180,.025) 0 1px,transparent 1px 3px)}
.matrix .pluie{position:fixed;inset:0;z-index:0;width:100%;height:100%;pointer-events:none;opacity:.6}

/* Titres et chiffres en chasse fixe, à la console, avec une légère lueur */
.matrix h1,.matrix h2,.matrix .titre-bloc,.matrix .kpis b,.matrix .stats b,.matrix .funnel b{font-family:var(--font-display);letter-spacing:-.02em}
.matrix h1,.matrix h2{color:#e6fff4;text-shadow:0 0 22px rgba(var(--neon-rgb),.28)}
.matrix .kpis b{color:#c4f7dd;text-shadow:0 0 14px rgba(var(--neon-rgb),.22)}
.matrix .brand>span:not(.ic){font-family:var(--font-display);letter-spacing:-.03em;color:#e6fff4}
.matrix .brand .grad-text{background:none;-webkit-text-fill-color:currentColor;color:#e6fff4}
.matrix .brand .grad-text::after{content:"_" / "";color:var(--neon);animation:curseur 1.1s steps(1) infinite}
@keyframes curseur{50%{opacity:0}}
@media (prefers-reduced-motion: reduce){.matrix .brand .grad-text::after{animation:none}}
/* Logo tapé lettre à lettre (admin.js) : le curseur suit le texte */
.matrix .brand.tape-on .grad-text::after{content:none}
.matrix .brand-tape{display:inline-flex;font-family:var(--font-display);letter-spacing:-.03em;color:#e6fff4;white-space:pre}
.matrix .tape-cur{color:var(--neon)}
.matrix .brand .ic{background:radial-gradient(circle at 35% 30%,#86e0b4,#0f4630);color:#e6fff4;box-shadow:0 0 14px rgba(var(--neon-rgb),.35)}
.matrix .card,.matrix .carte,.matrix .kpis li,.matrix .panneau{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}

/* Actions : vert fluo */
.matrix a:not(.btn-p):not(.btn-s):not(.brand):not(.tab):not(.nav-cta){color:var(--neon)}
.matrix .btn-p{box-shadow:0 0 0 1px var(--neon),0 0 22px -4px rgba(var(--neon-rgb),.65)}
.matrix .btn-s{border-color:rgba(var(--neon-rgb),.5);background:rgba(1,8,5,.6);color:var(--neon)}
@media (hover:hover){.matrix .btn-s:hover{background:rgba(var(--neon-rgb),.1)}}
.matrix .tab[aria-selected="true"]{background:var(--neon);color:var(--on-neon);box-shadow:0 0 18px -4px rgba(var(--neon-rgb),.6)}
.matrix .pg.on{background:var(--neon);color:var(--on-neon);border-color:var(--neon)}
.matrix .nav-links a[aria-current],.matrix .nav-links a[aria-current="page"]{color:var(--neon);text-shadow:0 0 12px rgba(var(--neon-rgb),.5)}
.matrix :focus-visible{outline-color:var(--neon)}

/* Données : verts sourds, jamais le vert fluo des actions */
.matrix .piste span,.matrix .jauge span{background:linear-gradient(90deg,#1f7a53,#86e0b4)}
.matrix .barres span{background:linear-gradient(to top,#0f4630,#4dbf88 60%,#c4f7dd)}
.matrix .mk-barres .piste span{background:linear-gradient(90deg,#1f7a53,#86e0b4)}
.matrix .etat{border-color:rgba(134,224,180,.22);background:rgba(134,224,180,.06);color:var(--text-2)}
.matrix .etat.actif{color:#e6fff4;border-color:rgba(134,224,180,.5)}

/* Gravité des erreurs : du plus clair (haute) au plus sombre (faible) ; le rouge reste pour « critique » */
.matrix .g-critique{--sev:#ff5c6c}
.matrix .g-haute{--sev:#c4f7dd}
.matrix .g-moyenne{--sev:#86e0b4}
.matrix .g-faible{--sev:#5f8f7c}
.matrix .tab-grav[aria-selected="true"] .pt{background:var(--on-neon)}

/* Pas de choix clair ou sombre ici */
.matrix #theme-btn,.matrix .mnav-theme{display:none}

/* Grand mot du pied de page en chasse fixe : plus large, la taille suit (« Flair Job » fait environ 5 em, « Flair Admin » 6,1 em) */
.matrix .pied-mot-in{--fs:calc(100cqw / 5.09)}
.matrix .pied-mot-admin .pied-mot-in{--fs:calc(100cqw / 6.35)}

/* Pied de page : transparent, la pluie de caractères passe derrière comme sur le reste de la page */
.matrix footer.pied{background:none;position:relative;z-index:1}
/* Fonds continus des listes, onglets sur toute la largeur, pied centré */
.matrix .rep-boite{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
@media (min-width:861px){.matrix #pied-admin .pied-haut{grid-template-columns:repeat(3,max-content);justify-content:space-evenly}}
.matrix .cloche{color:var(--neon);border-color:rgba(var(--neon-rgb),.5);box-shadow:0 0 14px -4px rgba(var(--neon-rgb),.6)}

/* Téléphone : pas de flou derrière les cartes et les listes. Chaque goutte de pluie obligerait à recalculer le flou de
   toutes les cartes à l'écran ; leur fond, déjà presque opaque, l'est un peu plus pour garder le même rendu. */
@media (hover: none), (pointer: coarse){
  .matrix .card,.matrix .carte,.matrix .kpis li,.matrix .panneau,.matrix .rep-boite{-webkit-backdrop-filter:none;backdrop-filter:none}
  :root.matrix{--card-bg:linear-gradient(170deg,rgba(8,36,25,.9),rgba(3,15,10,.93))}
}
.matrix .tab[aria-current="true"]{background:var(--neon);color:var(--on-neon);box-shadow:0 0 18px -4px rgba(var(--neon-rgb),.6)}

/* Menu mobile : la police à chasse fixe prend plus de place, les libellés restent sur une ligne */
.matrix .mnav ul a,.matrix .mnav ul button{font-size:clamp(16px,4.4vw,19px);letter-spacing:-.02em}
.matrix .mnav ul.mnav-sous a{font-size:clamp(14px,3.9vw,16px)}

.matrix .ec-filtre[aria-pressed="true"]{background:var(--neon);color:var(--on-neon);box-shadow:0 0 18px -4px rgba(var(--neon-rgb),.6)}
@media (hover:hover){.matrix .aime-btn:hover{background:var(--neon);color:var(--on-neon)}}
.matrix .aime-btn[aria-pressed="true"]{background:var(--neon);color:var(--on-neon)}

/* Secondaires : la même règle néon pour toute la famille (pas seulement .btn-s) */
.matrix :is(.fold-btn,.ddbtn,.addc-btn,.graphe-detail,.rond,select.sel,.stw select,.sortw select){border-color:rgba(var(--neon-rgb),.5);background-color:rgba(1,8,5,.6);color:var(--neon)}
@media (hover:hover){.matrix :is(.fold-btn,.ddbtn,.addc-btn,.graphe-detail,.rond,select.sel,.stw select,.sortw select):hover{background-color:rgba(var(--neon-rgb),.1)}}
.matrix :is(.bascule button,.mnav-theme button,.ecg-per .tab)[aria-pressed="true"],.matrix .pastilles:not(.colonne):has(>label>input[type=radio]) label:has(input:checked){background:var(--neon);color:var(--on-neon);box-shadow:0 0 18px -4px rgba(var(--neon-rgb),.6)}

/* R2 : les statuts du suivi gardent leur couleur en Matrix */
.matrix .stw select[data-s="envoyee"],.matrix .stw select[data-s="relancee"]{background-color:var(--warn-bg);color:var(--warn);border-color:var(--warn)}
.matrix .stw select[data-s="entretien"]{background-color:var(--ok-bg);color:var(--ok);border-color:var(--ok)}
.matrix .stw select[data-s="refus"]{color:var(--text-3)}

/* Étiquettes d'état : « coupé » en rouge et « en pause » en rouge clair, aussi en Matrix */
.matrix .etat.desactive{background:var(--bad-bg);color:var(--bad);border-color:var(--bad)}
.matrix .etat.pause{background:var(--bad-bg);color:var(--bad);border-color:rgba(255,107,107,.4)}

/* Message éphémère lisible en Matrix */
.matrix .toast{background:#06140d;color:var(--neon);border:1px solid rgba(var(--neon-rgb),.5);box-shadow:0 0 24px -6px rgba(var(--neon-rgb),.5)}

/* « actif » en vert fluo */
.matrix .etat.actif{color:var(--neon);border-color:rgba(var(--neon-rgb),.6);background:rgba(var(--neon-rgb),.1)}