/* ============================================================
   FLUX — thème bordeaux profond          Lot 0
   ------------------------------------------------------------
   À DÉPOSER dans  frontend/css/theme.css
   puis à charger APRÈS la feuille existante, sur chaque page :

     index.html            <link rel="stylesheet" href="css/style.css">
                           <link rel="stylesheet" href="css/theme.css">
     landing.html          <link rel="stylesheet" href="css/landing.css">
                           <link rel="stylesheet" href="css/theme.css">
     confidentialite.html  idem landing
     admin.html            idem landing

   Ce fichier ne redéfinit QUE des jetons et la police. Aucune règle de
   structure, aucune sélection d'élément : il est donc réversible en
   retirant la ligne <link>, sans laisser de trace.

   Les deux feuilles du projet déclarent des jeux de jetons différents
   (style.css pour l'application, landing.css pour les pages publiques).
   Ils sont tous repris ci-dessous, y compris les quelques noms communs —
   c'est voulu : les deux univers partagent désormais la même encre.
   ============================================================ */

/* La police est déjà hébergée par le projet pour la landing. On la
   redéclare ici pour que l'application y ait accès elle aussi ; déclarer
   deux fois la même fonte au même chemin est sans effet de bord. */
@font-face {
  font-family: "Schibsted Grotesk";
  src: url("/vendor/fonts/schibsted-grotesk-var.woff2") format("woff2");
  font-weight: 400 700; font-style: normal; font-display: swap;
}

:root {
  /* ---- Surfaces (application) --------------------------------
     Le noir n'est pas neutre : il est teinté de la même rougeur que
     l'accent. Sans cela, les vignettes du catalogue paraissent posées
     sur du gris et l'ensemble perd sa profondeur. */
  --bg:         #120a0d;
  --surface:    #1a0f13;
  --tile:       #241419;
  --tile-hover: #2e191f;

  --border:   rgba(255, 255, 255, 0.08);
  --border-2: rgba(255, 255, 255, 0.14);

  /* ---- Encre -------------------------------------------------
     Quatre niveaux, du titre au détail. --text-dim est le plancher :
     il tient 4,9:1 sur --bg et 4,4:1 sur --tile, donc il reste lisible
     aux corps de 10 à 12 px où il sert le plus. Ne pas l'assombrir. */
  --text:     #f6eff0;
  --text-2:   #cbb8bd;
  --text-mut: #a3919a;
  --text-dim: #9c868d;

  /* ---- Accent ------------------------------------------------
     --accent porte les fonds, bordures et états ; il descend à 3,8:1
     sur le fond sombre, donc il ne convient PAS à du petit texte.
     Pour un libellé accentué, utiliser --accent-tx. */
  --accent:    #c33a52;
  --accent-2:  #e0778a;
  --accent-tx: #f0b8c2;   /* nouveau — accent lisible en texte */
  /* Composantes séparées, pour les dizaines d'endroits où style.css compose
     une transparence de l'accent. Sans ce jeton il faut écrire la couleur en
     dur dans chaque rgba(), et c'est exactement ce qui avait laissé cinquante
     violets hors de portée du thème. */
  --accent-rgb: 195 58 82;
  --grad: linear-gradient(135deg, #c33a52 0%, #7a1c30 100%);

  
  /* ---- États -------------------------------------------------- */
  --live: #e0778a;
  --ok:   #7fd6a8;
  --err:  #f43f5e;
  --warn: #f3cd86;

  /* ---- Décor -------------------------------------------------- */
  --backdrop: radial-gradient(130% 120% at 74% 20%, #5e1a2c, #26101a 58%, #120a0d);
  --sh-glow:  0 0 20px rgba(195, 58, 82, 0.35);
  --glass:    rgba(36, 20, 25, 0.7);

  /* ---- Pages publiques (jeu de landing.css) -------------------
     --or et --or-clair conservent leur nom : tout le laiton de la
     landing bascule ainsi en bordeaux sans toucher une seule règle.
     Les deux valeurs sont prises dans la moitié claire de la gamme,
     parce que ces jetons servent surtout à du texte de petit corps. */
  --ink:      #0a0507;
  --or:       #e0778a;
  --or-clair: #f0b8c2;
  --text-3:   #9c868d;
  --line:     rgba(246, 239, 240, 0.16);
  --line-2:   rgba(246, 239, 240, 0.30);

  /* ---- Typographie -------------------------------------------- */
  --display: "Schibsted Grotesk", ui-sans-serif, system-ui, -apple-system, sans-serif;
  --sans:    "Schibsted Grotesk", ui-sans-serif, system-ui, -apple-system, sans-serif;
}

/* L'application fixe sa police en dur sur body ; on la reprend ici.
   Même sélecteur, feuille chargée après : c'est cette règle qui gagne. */
body {
  font-family: "Schibsted Grotesk", ui-sans-serif, system-ui, -apple-system, sans-serif;
}

::selection { background: rgba(195, 58, 82, 0.32); }

/* ============================================================
   RESTE À FAIRE À LA MAIN — quatre valeurs écrites en dur dans les
   feuilles existantes, qu'aucun jeton ne peut atteindre. Elles sont
   listées ici plutôt que corrigées de force, pour que le fichier de
   thème reste purement déclaratif.

   1. landing.css, .btn-solid : fond var(--paper) et texte #0a0910.
      Le bouton principal doit passer au bordeaux —
        background: var(--grad); color: #fff;
      et --paper redevient ce qu'il est, un blanc de secours.

   2. landing.css, --voile-hero-v / --voile-hero-h : les deux voiles
      sont en rgba(4,4,8,…), un noir bleuté. À passer en rgba(10,5,7,…)
      pour s'accorder au nouveau fond.

   3. landing.css, .ruban : background rgba(224,178,92,.1) et bordure
      rgba(224,178,92,.2), deux restes de laiton en dur.
      → rgba(195,58,82,.12) et rgba(195,58,82,.24).

   4. landing.css, .bobine-n et .bobine::after : bordure et perforations
      en rgba(224,178,92,.34) → rgba(224,178,92,.34) devient
      rgba(224,119,138,.34).

   Une fois ces quatre points repris, plus aucun pixel doré ne subsiste.
   ============================================================ */