/* ==========================================================================
   O2Dashboard — SOCLE DE MARQUE (source de vérité unique)
   --------------------------------------------------------------------------
   Polices + couleurs iDEAE, pour TOUTES les pages des deux domaines
   (dashboard.ideae.fr et espace.ideae.fr).

   RÈGLE : on ne redéfinit jamais une couleur ou une police ailleurs.
   Pour changer le rouge de la marque → --red ici, et c'est tout.

   À charger AVANT la feuille de la page :
     <link rel="stylesheet" href="tokens.css?v=1">
   app.css (habillage du dashboard) et les <style> de page ne contiennent plus
   que des règles de mise en page, jamais de palette.

   Seule exception admise : des tokens réellement spécifiques à une page
   (ex. --pill-* / --track dans l'espace client), déclarés en local.

   Déployé à l'identique dans :
     ~/public_html/dashboard.ideae.fr/web/tokens.css
     ~/public_html/espace.ideae.fr/web/tokens.css
   ========================================================================== */

/* --- Polices de marque (self-hosted, mêmes fichiers que ideae.fr) --- */
@font-face{font-family:'Archivo';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/archivo.woff2') format('woff2')}
@font-face{font-family:'Archivo';font-style:normal;font-weight:800;font-display:swap;src:url('fonts/archivo.woff2') format('woff2')}
@font-face{font-family:'Open Sans';font-style:normal;font-weight:400;font-display:swap;src:url('fonts/open-sans.woff2') format('woff2')}
@font-face{font-family:'Open Sans';font-style:normal;font-weight:600;font-display:swap;src:url('fonts/open-sans.woff2') format('woff2')}
@font-face{font-family:'Open Sans';font-style:normal;font-weight:700;font-display:swap;src:url('fonts/open-sans.woff2') format('woff2')}

:root{
  /* ---- Marque (identiques dans les deux thèmes) ---- */
  --navy:#0033a0;            /* bleu iDEAE sur fond clair */
  --navy-2:#1a4fc4;
  --red:#ef2b23;             /* rouge iDEAE — jamais #dc2626 ni #ef4444 */
  --red-dark:#c81e10;
  --orange:#f97316;          /* niveau « moyen » (l'ambre a été écarté par Xavier) */

  /* ---- Surfaces claires : écrans d'authentification, documents imprimables ---- */
  --paper:#ffffff;
  --mist:#f2f6fd;            /* fond de page clair */
  --ink:#0b1633;             /* texte principal */
  --slate:#586591;           /* texte secondaire */
  --line:#e2e9f7;            /* filets et bordures */
  --soft:#f7f9fc;            /* fond de champ de saisie */

  /* ---- Typographie, formes, mouvement ---- */
  --display:'Archivo',system-ui,-apple-system,sans-serif;
  --body:'Open Sans',system-ui,-apple-system,sans-serif;
  --elev:0 18px 40px -24px rgba(0,0,0,.55);
  --dur:.22s; --ease:cubic-bezier(.22,.61,.36,1);
  --r:14px; --r-sm:10px; --r-btn:8px;   /* arrondi unique de TOUS les boutons */

  /* ---- Surfaces de l'application — thème SOMBRE (défaut) ----
         « Encre pure » : canevas #0c0c0c → cartes #171717, neutre, le rouge de marque ressort.
         --blue = gris moyen (accent monochrome : lisible en texte blanc dessus + barres visibles). */
  --bg:#0c0c0c; --card:#171717; --border:#262626; --text:#f0f0f2; --muted:#8b8f98;
  --blue:#5b5b63; --green:#2ad86b; --amber:#f97316;
  --subtle:rgba(255,255,255,.06);   /* teinte de survol / badges */
  --panel:rgba(0,0,0,.35);          /* fond de panneau interne */
  --ok:#2ad86b; --warn:#fcd34d; --bad:#ff6b6b;
  --track:rgba(255,255,255,.09);   /* piste de jauge / barre de progression */
  --hover:rgba(255,255,255,.04);   /* survol discret de ligne */
  --purple:#a855f7; --php:#c4b5fd;  /* accents : versions PHP, badges */
  --faint:#6a6a70;                 /* texte très discret (actions secondaires) */

  /* ---- Surfaces élevées (hero d'accueil, tuile KPI active, pastille d'icône) ----
         RÈGLE : ces couleurs ne vivent QUE ici. Les pages n'utilisent que ces variables. */
  --hero-bg:
    radial-gradient(130% 130% at 28% 0%, rgba(255,255,255,.06) 0%, rgba(255,255,255,0) 58%),
    radial-gradient(90% 110% at 88% 8%, rgba(255,255,255,.03) 0%, rgba(255,255,255,0) 62%),
    linear-gradient(160deg,#1b1b1d 0%,#101010 60%,#0c0c0c 100%);
  --hero-grid:rgba(255,255,255,.06);   /* lignes de la grille du hero */
  --hero-border:var(--border);
  --tile-active-bg:linear-gradient(150deg,#26262a,#191919);  /* tuile KPI sélectionnée */
  --tile-active-border:#33333a;
  --cta-bg:linear-gradient(150deg,#26262a,#191919); --cta-border:#33333a;
  --viz:#2a78d6; --viz-2:#5da2f0;   /* data-viz (courbe, barres) */
  --icon-chip:rgba(255,255,255,.06);   /* fond des pastilles d'icônes */
}

/* ---- Surfaces de l'application — thème CLAIR ---- */
html[data-theme="light"]{
  --bg:#f2f6fd; --card:#ffffff; --border:#e2e9f7; --text:#0b1633; --muted:#586591;
  --blue:#0033a0; --green:#16a34a; --amber:#d97706;
  --subtle:#eef3fd; --panel:#eef3fd;
  --ok:#16a34a; --warn:#b45309; --bad:#dc2626;
  --track:rgba(11,22,51,.08);
  --hover:rgba(0,0,0,.03);
  --purple:#7c3aed; --php:#6d28d9;
  --faint:#8a94b3;
  /* Surfaces élevées — thème clair (hero navy de marque conservé) */
  --hero-bg:linear-gradient(160deg,#0033a0 0%,#002163 55%,#00102e 100%);
  --hero-grid:#123a9e;
  --hero-border:transparent;
  --tile-active-bg:linear-gradient(150deg,var(--navy),#2b50b8);
  --tile-active-border:transparent;
  --cta-bg:#eef3fd; --cta-border:#cfdcf5;
  --viz:#0033a0; --viz-2:#0033a0;
  --icon-chip:rgba(0,51,160,.08);
}