/* ==========================================================================
   medias7 — jetons de design
   Repris du template output/style.css, complété des valeurs propres au site.
   ========================================================================== */

:root {
  color-scheme: dark;

  /* Fonds et surfaces */
  --bg: #070719;
  --bg-soft: #101534;
  --surface: rgba(19, 24, 55, 0.82);
  --surface-strong: rgba(27, 35, 78, 0.94);
  --surface-glass: rgba(43, 53, 113, 0.58);
  --line: rgba(157, 172, 235, 0.18);
  --line-strong: rgba(255, 255, 255, 0.18);

  /* Texte */
  --text: #ffffff;
  --muted: #aab1d0;
  --faint: #737da8;
  --link: #ff78a1;

  /* Couleurs d'intention */
  --accent: #ff0b58;
  --accent-2: #ff3b79;
  /* Fond d'un bouton a texte blanc : #ff0b58 n'y donnait que 3,86:1 et
     #ff3b79 3,41:1, sous les 4,5:1 d'un texte de 12,5 px. #e9004a est la
     meme teinte a la plus forte luminosite qui tienne 4,6:1 (calcul de
     contraste WCAG 2.x) ; le degrade ne s'en eloigne que vers le plus fonce,
     donc le plus contraste. */
  --accent-fond: #e9004a;
  --accent-fond-2: #c4003e;
  --success: #4cd6a8;
  --warning: #ffc15a;
  --danger: #ff4e63;

  /* Formes */
  --shadow: 0 28px 90px rgba(0, 0, 0, 0.55);
  --shadow-soft: 0 20px 50px rgba(0, 0, 0, 0.22);
  --radius-sm: 12px;
  --radius-md: 20px;
  --radius-lg: 34px;
  --radius-pill: 999px;

  /* Typographie */
  --font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

  /* Rythme */
  --space-1: 0.35rem;
  --space-2: 0.7rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2.2rem;
  /* Gouttiere laterale de la barre du haut, du corps et du pied de page.
     Elle montait a 102px sur grand ecran, ce qui volait pres de 15% de la
     largeur utile sans rien apporter : la coquille .page borne deja le contenu
     a 90rem. Le plancher de 1rem est celui du telephone, ou .page perd ses
     bords et ou la gouttiere est seule a ecarter le contenu de l ecran. */
  --gutter: clamp(1rem, 3vw, 2.5rem);

  /* Gabarits */
  /* Vignette en ligne (data-list). 4rem = 64px : la variante t/ d'une affiche
     2/3 fait 67px de large, elle couvre donc exactement la densite 1 et la
     variante moyenne ne prend le relais qu'au-dela. A 4.5rem, le navigateur
     montait d'un cran des la densite 1. */
  --cover-w: 4rem;
  --card-min: 15rem;          /* largeur mini d'une carte de collection */
  /* --cover-w et --card-min pilotent les largeurs de rendu des jaquettes.
     Application\View\Helper\MediaCover en dérive l'attribut sizes de chaque
     contexte : toute modification ici doit y être répercutée, sans quoi le
     navigateur choisira une variante trop petite (flou) ou trop grande. */
  --touch: 2.75rem;           /* cible tactile minimale (44px) */

  /* Empilement */
  --z-sticky: 20;
  /* Au-dessus de la barre d'actions collante, qui vaut --z-sticky et vient
     après dans le DOM : à niveau égal, c'est l'ordre du document qui tranche,
     et le menu d'un champ passait sous le bouton de validation. Sous le
     tiroir et la boîte de dialogue, qui doivent tout recouvrir. */
  --z-dropdown: 40;
  --z-drawer: 60;
  --z-dialog: 80;
}