/* CFI CV Hub — design tokens (handoff Claude Design)
   Loaded BEFORE style.css; only declares fonts + new color tokens.
   Reset, body, button defaults intentionally omitted to preserve
   existing layout managed by style.css. */

@font-face { font-family: "SVHFlib"; src: url("fonts/SVHFlib-Regular.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face { font-family: "SVHFlib"; src: url("fonts/SVHFlib-Italic.woff2") format("woff2"); font-weight: 400; font-style: italic; font-display: swap; }
@font-face { font-family: "SVHFlib"; src: url("fonts/SVHFlib-Bold.woff2") format("woff2"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face { font-family: "SVHFlib"; src: url("fonts/SVHFlib-BoldItalic.woff2") format("woff2"); font-weight: 700; font-style: italic; font-display: swap; }
@font-face { font-family: "SVHFlib Soft"; src: url("fonts/SVHFlib-Soft.woff2") format("woff2"); font-weight: 400; font-style: normal; font-display: swap; }

:root {
  /* Palette etendue — handoff Claude Design (alignee Figma site global) */
  --cream: #FAF7F1;
  --cream-warm: #F2ECDF;
  --paper: #FFFFFF;
  --ink: #1D1D1B;             /* noir CFI officiel (Figma) */
  --ink-deep: #0A0A0A;        /* noir repo header */
  --ink-black: #000000;
  --ink-92: rgba(29, 29, 27, 0.92);
  --ink-15: rgba(29, 29, 27, 0.15);
  --grey-700: #5A5A55;
  --grey-500: #8E8E85;
  --grey-300: #C9C6BC;
  --grey-200: #EDEDED;
  --grey-100: #D0D0D0;
  --cream-25: rgba(250, 247, 241, 0.25);
  --cream-20: rgba(250, 247, 241, 0.20);

  /* Accents etendus */
  --yellow: #FFD600;
  --yellow-soft: #FFED00;
  --sky: #80D3FF;
  --sky-soft: #AFD7F7;
  --blue-active: #00AFEB;
  --blue-link: #0088FF;
  --green: #00B95A;
  --green-soft: #5CDC5C;
  --lilac: #EBD1FF;
  --lilac-bright: #9747FF;
  --purple-soft: #AE64DE;
  --orange-bright: #FF8D28;
  --orange-deep: #FF6C0A;
  --mint: #C8E8CC;
  --score-red: #FF383C;

  /* Motion editorial (handoff) */
  --ease-editorial: cubic-bezier(0.2, 0.8, 0.2, 1);
  --ease-stamp: cubic-bezier(0.5, -0.2, 0.3, 1.6);

  /* Font stacks (handoff) */
  --font-display: "Archivo Black", "SVHFlib", Impact, system-ui, sans-serif;
  --font-body: "SVHFlib", "Inter Tight", system-ui, sans-serif;
  --font-ui: "Inter Tight", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "SFMono-Regular", ui-monospace, Menlo, monospace;

  /* Accent runtime — fige sur jaune CFI, toutes variantes neutralisees */
  --arm: #FFD600;
  --arm-ink: var(--ink);
}

/* Accent brand CFI : chaque variante a sa propre teinte, selectionnee
   aleatoirement au chargement (voir <script> dans index.html). --arm est
   la couleur d'accent, --arm-ink la couleur de texte a poser dessus. */
:root[data-accent="yellow"] { --arm: #FFD600;            --arm-ink: var(--ink); }
:root[data-accent="blue"]   { --arm: var(--blue-active); --arm-ink: var(--ink); }
:root[data-accent="warm"]   { --arm: var(--orange-bright); --arm-ink: var(--ink); }
:root[data-accent="lilac"]  { --arm: var(--lilac-bright); --arm-ink: var(--cream); }
:root[data-accent="mint"]   { --arm: var(--green);       --arm-ink: var(--ink); }
:root[data-accent="red"]    { --arm: var(--score-red);   --arm-ink: var(--cream); }

/* ============================================================
   Palette CV (feature : l'étudiant peut recolorer les blocs
   sidebar + bandeau adresse + filets éditoriaux). Les 7 presets
   sont appliqués sur le container éditeur via data-cv-palette.
   5 slots par preset : sidebar-bg/text, address-bg/text, accent.
   ============================================================ */
:root {
  /* Defaults = Original (blue + yellow) pour préserver l'existant */
  --cv-sidebar-bg:   var(--blue-active);
  --cv-sidebar-text: var(--cream);
  --cv-address-bg:   #FFD600;
  --cv-address-text: var(--ink);
  --cv-accent:       var(--blue-active);
}

[data-cv-palette="original"] {
  --cv-sidebar-bg:   var(--blue-active);
  --cv-sidebar-text: var(--cream);
  --cv-address-bg:   #FFD600;
  --cv-address-text: var(--ink);
  --cv-accent:       var(--blue-active);
}
[data-cv-palette="lilas"] {
  --cv-sidebar-bg:   var(--lilac-bright);
  --cv-sidebar-text: var(--cream);
  --cv-address-bg:   #FFD600;
  --cv-address-text: var(--ink);
  --cv-accent:       var(--lilac-bright);
}
[data-cv-palette="braise"] {
  --cv-sidebar-bg:   var(--orange-bright);
  --cv-sidebar-text: var(--ink);
  --cv-address-bg:   var(--blue-active);
  --cv-address-text: var(--ink); /* WCAG AA : ink/blue-active 6.4:1 (cream 2.5:1 fail) */
  --cv-accent:       var(--orange-bright);
}
[data-cv-palette="rouge"] {
  --cv-sidebar-bg:   var(--score-red);
  --cv-sidebar-text: var(--ink); /* WCAG AA : ink/score-red 4.8:1 (cream 3.4:1 fail) */
  --cv-address-bg:   #FFD600;
  --cv-address-text: var(--ink);
  --cv-accent:       var(--score-red);
}
[data-cv-palette="citron"] {
  --cv-sidebar-bg:   #FFD600;
  --cv-sidebar-text: var(--ink);
  --cv-address-bg:   var(--lilac-bright);
  --cv-address-text: var(--cream);
  --cv-accent:       var(--ink); /* yellow trop clair pour filets sur cream */
}
[data-cv-palette="menthe"] {
  --cv-sidebar-bg:   var(--green);
  --cv-sidebar-text: var(--ink);
  --cv-address-bg:   #FFD600;
  --cv-address-text: var(--ink);
  --cv-accent:       var(--green);
}
[data-cv-palette="encre"] {
  --cv-sidebar-bg:   var(--ink);
  --cv-sidebar-text: var(--cream);
  --cv-address-bg:   var(--cream);
  --cv-address-text: var(--ink);
  --cv-accent:       var(--ink);
}