/* tokens.css — design system DEMATRUST Light / ICD International
 *
 * Source de vérité : archive « ICD International Design System.zip » conservée HORS dépôt par
 *                    l'équipe design (sortie du suivi git — T-BACK-016 CA-5 ; ni servie ni
 *                    chargée au runtime) -> colors_and_type.css (cf. ticket T-UX-001, sprint 04-bis)
 *
 * Note (arbitrage L11.b, roadmap 2026-06-13) :
 *   La police Plus Jakarta Sans du DS n'est PAS adoptée. La stack système est
 *   conservée (cf. --font-family). Cet écart est documenté en roadmap.
 *
 * Compatibilité : les anciens tokens --color-* sont préservés en alias vers
 * les nouveaux tokens --icd-* afin d'éviter toute régression visuelle sur les
 * classes existantes (app.css) non encore migrées par T-UX-002 et suivants.
 */

:root {
    /* =============================================================
       Marque ICD — Échelle bleue complète (DS officiel)
       ============================================================= */
    --icd-blue-50:  #F4F7FF;
    --icd-blue-100: #EBF0FF;
    --icd-blue-200: #D6E0FF;
    --icd-blue-300: #A9BDFF;
    --icd-blue-400: #6F8DFF;
    --icd-blue-500: #3B6BFF;
    --icd-blue-600: #2B4BEE; /* PRIMARY-2 — fin du gradient brand, CTA vif */
    --icd-blue-700: #0F50D2; /* PRIMARY — début du gradient brand */
    --icd-blue-800: #0B2E8C;
    --icd-blue-900: #0A1F4F; /* navy le plus profond, surfaces sombres */

    /* Accent cyan (logo "International") */
    --icd-cyan-500: #58B5DC;
    --icd-cyan-200: #C7E4F2;

    /* =============================================================
       Échelle neutre (cool-leaning, harmonisée avec les bleus)
       ============================================================= */
    --icd-neutral-0:   #FFFFFF;
    --icd-neutral-50:  #F7F9FC;
    --icd-neutral-100: #EEF1F6;
    --icd-neutral-200: #DDE3EC;
    --icd-neutral-300: #C2CAD6;
    --icd-neutral-400: #94A0B2;
    --icd-neutral-500: #6B7689;
    --icd-neutral-600: #4B566A;
    --icd-neutral-700: #2F384A;
    --icd-neutral-800: #1A2236;
    --icd-neutral-900: #0E1733;

    /* =============================================================
       Sémantique
       ============================================================= */
    --icd-success:    #16A34A;
    --icd-success-bg: #E7F7EC;
    --icd-warning:    #EAB308;
    --icd-warning-bg: #FEF7E0;
    --icd-warning-text: #92400e;  /* texte sur fond --icd-warning-bg */
    --icd-danger:     #DC2626;
    --icd-danger-bg:  #FCE8E8;
    --icd-info:       var(--icd-blue-600);
    --icd-info-bg:    var(--icd-blue-100);

    /* =============================================================
       Gradients brand
       ============================================================= */
    --icd-gradient-primary: linear-gradient(135deg, #0F50D2 0%, #2B4BEE 100%);
    --icd-gradient-soft:    linear-gradient(135deg, #EBF0FF 0%, #F7F9FC 100%);
    --icd-gradient-dark:    linear-gradient(135deg, #0A1F4F 0%, #0F50D2 100%);

    /* =============================================================
       Tokens sémantiques foreground / background
       ============================================================= */
    --fg-1: var(--icd-neutral-900); /* titres principaux */
    --fg-2: var(--icd-neutral-700); /* texte courant */
    --fg-3: var(--icd-neutral-500); /* secondaire / muted */
    --fg-4: var(--icd-neutral-400); /* désactivé / hints */
    --fg-inverse: var(--icd-neutral-0);

    /* Backoffice staff */
    --fg-staff-subheading: #1e3a5f; /* h3 sous-sections écrans staff */
    --fg-staff-th:         #6b7280; /* texte th tableaux staff */
    --border-staff-table:  #e0e0e0; /* séparateur en-tête tableau staff */
    --border-staff-row:    #f0f0f0; /* séparateur ligne tableau staff */

    --bg-1: var(--icd-neutral-0);    /* surface principale */
    --bg-2: var(--icd-neutral-50);   /* fond de page alternatif */
    --bg-3: var(--icd-neutral-100);  /* cartes / chips discrets */
    --bg-dark: var(--icd-blue-900);  /* hero / section sombre */
    --bg-brand: var(--icd-blue-700);

    --border-1: var(--icd-neutral-200);
    --border-2: var(--icd-neutral-300);
    --border-strong: var(--icd-neutral-400);

    --accent: var(--icd-blue-700);
    --accent-hover: var(--icd-blue-800);
    --accent-press: var(--icd-blue-900);

    /* =============================================================
       Typographie
       =============================================================
       Arbitrage L11.b : stack système conservée — Plus Jakarta Sans
       du DS NON adopté. Cet écart est documenté en roadmap.
    */
    --font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    --font-size-xs: 0.75rem;
    --font-size-sm: 0.875rem;
    --font-size-base: 1rem;
    --font-size-lg: 1.125rem;
    --font-size-xl: 1.25rem;
    --font-size-2xl: 1.5rem;
    --font-size-3xl: 1.875rem;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    /* =============================================================
       Espacements (grille 4 pt — alignée DS)
       ============================================================= */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.25rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;

    /* =============================================================
       Rayons de bordure (échelle DS complète)
       ============================================================= */
    --radius-xs: 6px;
    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 16px;   /* tuiles pictogrammes */
    --radius-xl: 24px;
    --radius-2xl: 32px;
    --radius-pill: 999px;
    --radius-full: 9999px; /* conservé pour rétro-compat */

    /* =============================================================
       Ombres bleutées (CDC §10 — "ombres bleutées douces")
       Aucune rgba(0, 0, 0, …) — toutes les ombres portent la teinte
       brand (#0F50D2 ≈ rgba(15, 80, 210)) ou navy (≈ rgba(15, 23, 51)).
       ============================================================= */
    --shadow-xs: 0 1px 2px rgba(15, 80, 210, 0.04);
    --shadow-sm: 0 2px 6px rgba(15, 80, 210, 0.06), 0 1px 2px rgba(15, 23, 51, 0.04);
    --shadow-md: 0 8px 24px rgba(15, 80, 210, 0.08), 0 2px 6px rgba(15, 23, 51, 0.04);
    --shadow-lg: 0 20px 48px rgba(15, 80, 210, 0.12), 0 4px 12px rgba(15, 23, 51, 0.06);
    --shadow-xl: 0 40px 80px rgba(10, 31, 79, 0.18);
    --shadow-brand-glow: 0 12px 32px rgba(43, 75, 238, 0.28);

    /* =============================================================
       Motion
       ============================================================= */
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
    --duration-fast: 150ms;
    --duration-base: 220ms;
    --duration-slow: 380ms;

    /* Conservés pour rétro-compatibilité (anciennes transitions app.css) */
    --transition-fast: 150ms ease;
    --transition-base: 200ms ease;

    /* =============================================================
       Rétro-compatibilité — anciens tokens
       =============================================================
       Ces variables sont consommées par app.css actuel (classes
       .btn--primary, .site-header, .card, .stepper, etc.). Elles
       restent définies tant que T-UX-002..007 n'ont pas terminé la
       migration vers les tokens --icd-*.

       Les valeurs sont laissées en hex (et non en `var(--icd-*)`)
       pour préserver les tests de non-régression existants
       (cf. tests/integration/LayoutTest::test_CA1_layout_tokens qui
       vérifie la chaîne exacte `--color-primary: #0F50D2`). Chaque
       valeur ci-dessous est strictement équivalente au token DS
       indiqué en commentaire.
    */
    --color-primary: #0F50D2;  /* = --icd-blue-700 */
    --color-navy: #0A1F4F;     /* = --icd-blue-900 */

    --color-success: #16A34A;  /* = --icd-success */

    --color-bg: #F7F9FC;       /* = --icd-neutral-50  */
    --color-text: #1A2236;     /* = --icd-neutral-800 */
    --color-text-muted: #6B7689; /* = --icd-neutral-500 */
    --color-text-light: #FFFFFF; /* = --icd-neutral-0   */
}
