/* ==========================================================================
   Candivio — tokens.css
   Seule source de vérité des valeurs visuelles.
   v4 : valeurs des maquettes v2 du 05/11/2026 (design-handoff/design-tokens.css),
   reprises sous le préfixe --cv-. Une seule couleur d'action : --cv-primary.
   Les anciens noms (--cv-blue-700, --cv-teal-700…) pointent vers les nouvelles
   valeurs : toute l'application suit la même palette.
   Aucune couleur, taille ou marge ne doit être écrite en dur ailleurs.
   ========================================================================== */

:root {
  /* ======================= Maquettes v2 ================================= */

  /* --- Typographie ------------------------------------------------------- */
  --cv-font: "Poppins", system-ui, -apple-system, "Segoe UI", sans-serif;
  --cv-fw-regular: 400;
  --cv-fw-medium: 500;
  --cv-fw-semibold: 600;
  --cv-fw-bold: 700;
  --cv-fs-11: 11px;  /* kbd, sigle source petit, libellés de la barre du bas */
  --cv-fs-12: 12px;  /* sur-titre, libellé de section, compteur */
  --cv-fs-13: 13px;  /* méta, pastille de score, sous-texte */
  --cv-fs-14: 14px;  /* corps, boutons secondaires, liens */
  --cv-fs-15: 15px;  /* navigation, titres de carte, boutons */
  --cv-fs-16: 16px;  /* bouton principal large */
  --cv-fs-18: 18px;  /* compteur à côté du H1 */
  --cv-fs-20: 20px;  /* H2 de carte */
  --cv-fs-26: 26px;  /* titre de l'offre (fiche), logo, chiffre de la jauge */
  --cv-fs-28: 28px;  /* chiffre KPI */
  --cv-fs-30: 30px;  /* H1 des pages Ma recherche */
  --cv-fs-32: 32px;  /* H1 Accueil */
  --cv-fs-44: 44px;  /* chiffre héros Accueil */
  --cv-ls-tight: -0.5px;   /* H1, logo */
  --cv-ls-title: -0.3px;   /* titre de l'offre */
  --cv-ls-tighter: -1px;   /* chiffre héros */
  --cv-ls-eyebrow: 1.2px;  /* sur-titre (date) */
  --cv-ls-label: 1px;      /* libellés de section (PERTINENTES…) */
  --cv-lh-list: 1.35;      /* titres d'offre en liste */
  --cv-lh-detail: 1.25;    /* titre de l'offre (fiche) */

  /* --- Couleurs : base ---------------------------------------------------- */
  --cv-navy: #142B4C;          /* en-tête, texte principal */
  --cv-text: #142B4C;
  --cv-text-2: #5A6B7F;        /* texte secondaire */
  --cv-text-3: #6B7A8C;        /* texte tertiaire, chevrons */
  --cv-text-body: #33445A;     /* paragraphes d'analyse */
  --cv-on-dark: #FFFFFF;       /* texte sur l'en-tête */
  --cv-nav-inactive: #D6DEE8;  /* liens de l'en-tête au repos */
  --cv-nav-active-bg: rgba(255, 255, 255, 0.12);
  --cv-drawer-card: rgba(255, 255, 255, 0.07);        /* menu mobile : carte du profil */
  --cv-drawer-line: rgba(255, 255, 255, 0.12);        /* menu mobile : trait de la sous-liste, séparateur du pied */
  --cv-drawer-border: rgba(255, 255, 255, 0.22);      /* menu mobile : bouton Fermer */
  --cv-drawer-count-soft: rgba(63, 209, 181, 0.16);   /* menu mobile : compteur à traiter (Mes tâches) */
  --cv-nav-hover-bg: rgba(255, 255, 255, 0.06);
  --cv-bg: #F4F7FA;            /* fond de page */
  --cv-surface: #FFFFFF;       /* cartes */
  --cv-surface-2: #F7F9FB;     /* en-têtes de section de liste */
  --cv-column: #EAEFF4;        /* colonnes du Kanban */
  --cv-segmented: #E9EEF3;     /* fond du contrôle Liste/Grille */
  --cv-chip: #EEF2F6;          /* pastilles neutres (Lyon (69)…) */
  --cv-border: #E1E7EE;        /* bordure de carte */
  --cv-border-input: #D5DDE6;  /* bordure de champ et de bouton secondaire */
  --cv-divider: #E8EDF2;       /* séparateur de liste */
  --cv-divider-soft: #EEF2F6;  /* séparateur de la liste de l'Accueil */
  --cv-kbd-border: #C9D3DE;
  --cv-kbd-border-on-primary: rgba(255, 255, 255, 0.5);
  --cv-track: #E6ECF2;         /* piste des barres de progression */

  /* --- Couleur d'action (unique) ------------------------------------------ */
  --cv-primary: #0F7B6C;
  --cv-primary-hover: #0A5C51;
  --cv-primary-soft: #EAF6F3;  /* élément de liste sélectionné */
  --cv-on-primary: #FFFFFF;
  --cv-brand-dot: #3FD1B5;     /* point du logo, avatar */

  /* --- Scores (3 niveaux, voir getScoreTier dans cv-ui.js) ----------------- */
  --cv-score-high-bg: #DDF3EB;  --cv-score-high-fg: #0B6148;  /* 60 et plus */
  --cv-score-mid-bg:  #FCEFD6;  --cv-score-mid-fg:  #7A4A00;  /* 50 à 59 */
  --cv-score-low-bg:  #EDF1F5;  --cv-score-low-fg:  #4A5568;  /* moins de 50 */
  --cv-score-high-ring: #0F7B6C; --cv-score-high-ring-track: #D3EDE6;
  --cv-score-mid-ring:  #D98A1E; --cv-score-mid-ring-track:  #F1E6D2;
  --cv-score-low-ring:  #8A97A8; --cv-score-low-ring-track:  #E6ECF2;

  /* --- Statuts ----------------------------------------------------------- */
  --cv-success-bg: #DDF3EB;  --cv-success-fg: #0B6148;
  --cv-danger-bg:  #FBE3DE;  --cv-danger-fg:  #9A2E1C;
  --cv-warning-bg: #FFF8EA;  --cv-warning-border: #F3DFB6;  --cv-warning-fg: #5C3A00;  --cv-warning-icon: #8A5300;
  --cv-action-required: #C2410C;

  /* --- Étapes du pipeline ------------------------------------------------- */
  --cv-stage-suggestion: #7C5CD6;
  --cv-stage-selection:  #5A7FA8;
  --cv-stage-to-apply:   #D98A1E;
  --cv-stage-applied:    #0F7B6C;
  --cv-suggestion-border: #DCD3F5;

  /* --- Sources (pastilles provisoires, en attendant les logos officiels) --- */
  --cv-src-hellowork-bg: #FFF1CC;  --cv-src-hellowork-fg: #6B4E00;
  --cv-src-linkedin-bg:  #E3ECF7;  --cv-src-linkedin-fg:  #1F446B;
  --cv-src-indeed-bg:    #E7EAFB;  --cv-src-indeed-fg:    #2E3A87;

  /* --- Rayons ------------------------------------------------------------- */
  --cv-r-4: 4px;    /* kbd, barre de progression */
  --cv-r-7: 7px;    /* segment actif */
  --cv-r-8: 8px;    /* navigation, sigle 32/36, petits boutons */
  --cv-r-10: 10px;  /* boutons, champs, sigle 40/44, compteurs */
  --cv-r-12: 12px;  /* cartes du Kanban, KPI, blocs d'analyse */
  --cv-r-13: 13px;  /* pastilles h26 */
  --cv-r-14: 14px;  /* colonnes du Kanban */
  --cv-r-16: 16px;  /* grandes cartes */
  --cv-r-22: 22px;  /* bouton-bascule « Action requise » */

  /* --- Dimensions --------------------------------------------------------- */
  --cv-header-h: 68px;
  --cv-control-h: 44px;      /* champs, boutons secondaires */
  --cv-btn-lg-h: 52px;       /* bouton principal large, boutons de tri */
  --cv-btn-primary-h: 48px;  /* Ajouter une opportunité */
  --cv-btn-sm-h: 40px;       /* boutons dans une carte */
  --cv-icon-btn: 32px;       /* boutons icône (⋯, ↗) */
  --cv-pill-h: 26px;
  --cv-pill-sm-h: 24px;
  --cv-avatar: 36px;
  --cv-segment-h: 36px;
  --cv-gauge: 88px;          /* anneau de score */
  --cv-gauge-inner: 70px;
  --cv-gauge-label: 120px;
  --cv-progress-h: 8px;
  --cv-stage-dot: 10px;
  --cv-dot: 6px;             /* point « Annonce active » */
  --cv-dot-md: 8px;          /* point « Action requise » */

  /* --- Coach IA (brief Coach V1 + V2, 06/11/2026) ------------------------- */
  --cv-fs-24: 24px;          /* chiffre des indicateurs de l'accueil du coach */
  --cv-lh-chat: 1.55;        /* messages de la conversation */
  --cv-r-18: 18px;           /* relances suggérées (hauteur 36) */
  --cv-coach-thread: 720px;  /* colonne de la conversation */
  --cv-coach-home: 760px;    /* colonne de l'accueil du coach */
  --cv-coach-bar-h: 60px;    /* barre de titre de la conversation */
  --cv-coach-followup-h: 36px;
  --cv-coach-send: 40px;     /* bouton Envoyer du champ de saisie */
  --cv-coach-send-mobile: 48px;
  /* Bulle du coach (brief « bulle Coach », 06/11/2026) */
  --cv-coach-bubble: 60px;            /* bulle ronde (56 px sur mobile) */
  --cv-coach-bubble-mobile: 56px;
  --cv-coach-edge: 24px;              /* distance aux bords (16 px sur mobile) */
  --cv-coach-panel-w: 400px;          /* panneau au-dessus de la bulle */
  --cv-coach-panel-h: 640px;
  --cv-coach-panel-bottom: 100px;
  --cv-coach-nudge-w: 320px;          /* suggestion spontanée */
  --cv-coach-nudge-close: 32px;       /* bouton « Masquer la suggestion » */
  --cv-coach-dot: 14px;               /* pastille de la bulle */
  --cv-coach-sheet-h: 86vh;           /* panneau mobile : 724 px sur 844 */
  --cv-coach-reserve: 96px;           /* marge basse des pages pour que la bulle ne couvre aucun bouton */
  --cv-coach-shadow-bubble: 0 8px 24px rgba(15, 123, 108, 0.35);  /* --cv-primary à 35 % */
  --cv-coach-shadow-panel: 0 16px 48px rgba(20, 43, 76, 0.18);    /* --cv-navy à 18 % */
  --cv-coach-scrim: rgba(20, 43, 76, 0.45);                       /* voile mobile, --cv-navy à 45 % */
  --cv-coach-nudge-dot: #F2A23A;      /* pastille orange de la suggestion spontanée */
  --cv-coach-chip-border: #A9DCD2;    /* questions suggérées du panneau (texte --cv-score-high-fg) */
  --cv-r-20: 20px;                    /* haut du panneau mobile */
  --cv-r-24: 24px;                    /* champ de saisie mobile du panneau */

  /* Guide de démarrage (brief du 06/11/2026) : tailles absentes du kit. Couleurs : tokens existants. */
  --cv-fs-17: 17px;                   /* H3 des temps et du bandeau coach */
  --cv-step-dot: 28px;                /* pastille numérotée des étapes */
  --cv-step-dot-sm: 26px;             /* même pastille, rangée mobile */
  --cv-howto-num: 32px;               /* numéro d'un temps (fond --cv-navy) */
  --cv-feature-icon: 36px;            /* carré d'icône d'une carte de fonctionnement */
  --cv-banner-icon: 48px;             /* carré d'icône du bandeau coach */
  --cv-accordion-h: 60px;             /* ligne d'accordéon mobile */
  --cv-textarea-h: 92px;              /* zone de texte de 3 lignes */
  --cv-field-h-mobile: 48px;          /* champs du guide sur mobile (police 16 px, pas de zoom iOS) */

  /* Pages publiques du compte (connexion, inscription, mot de passe) : couleurs du site de marque
     (style.css de www/candivio, maquette home v3, demande d'Emir du 12/11/2026). Lues seulement par pages/connexion.css. */
  --cv-site-ink: #092748;             /* bleu nuit du site : titres, texte, bandeau du logo */
  --cv-site-accent: #0582B0;          /* bleu du site : champ actif, anneau de focus */
  --cv-site-action: #046F9B;          /* boutons principaux (texte blanc 5,6:1) */
  --cv-site-action-hover: #02B7AB;    /* survol des boutons (turquoise du site, texte blanc : 2,5:1, choix d'Emir) */
  --cv-site-link: #046A91;            /* liens (6:1 sur blanc) */
  --cv-site-text-2: #4A6178;          /* texte secondaire */
  --cv-site-field: #CBD7E3;           /* bordure des cartes, des champs et des boutons de connexion */
  --cv-site-line: #E3ECF2;            /* séparateurs */
  --cv-site-hover: #F7FAFD;           /* fond des boutons de connexion au survol */
  --cv-site-bg-top: #EAF4FC;          /* dégradé du fond de page */
  --cv-site-bg-mid: #F5FAFE;
  --cv-site-card-border: 1.5px;       /* bordure de la carte, comme la carte d'inscription du site */
  --cv-site-logo: 20px;               /* logos Google, Microsoft, LinkedIn (chartes des fournisseurs) */

  /* ======================= Noms historiques ============================== */
  /* Gardés pour les pages existantes ; ils suivent la palette ci-dessus. */
  --cv-navy-900: var(--cv-navy);
  --cv-navy-800: var(--cv-text);
  --cv-navy-700: var(--cv-nav-active-bg);
  --cv-ink-600:  var(--cv-score-low-fg);
  --cv-ink-500:  var(--cv-text-2);
  --cv-line:     var(--cv-border);
  --cv-line-strong: var(--cv-border-input);
  --cv-canvas:   var(--cv-bg);
  --cv-subtle:   var(--cv-column);
  --cv-blue-600: var(--cv-primary);
  --cv-blue-700: var(--cv-primary);
  --cv-blue-800: var(--cv-primary-hover);
  --cv-blue-50:  var(--cv-primary-soft);
  --cv-teal-700: var(--cv-primary);
  --cv-teal-600: var(--cv-primary);
  --cv-teal-50:  var(--cv-success-bg);
  --cv-turquoise-400: var(--cv-brand-dot);
  --cv-turquoise-100: var(--cv-score-high-ring-track);
  --cv-turquoise-50:  var(--cv-primary-soft);
  --cv-amber-700: var(--cv-warning-icon);  --cv-amber-50: var(--cv-warning-bg);
  --cv-red-700:   var(--cv-danger-fg);     --cv-red-50:   var(--cv-danger-bg);
  --cv-violet-600: var(--cv-stage-suggestion);  --cv-violet-50: #F1ECFD;  /* tout ce qui vient de l'IA */
  --cv-grey-50:   var(--cv-score-low-bg);

  --cv-fs-display: var(--cv-fs-32);  /* H1 */
  --cv-fs-h2:      var(--cv-fs-20);  /* titre de section, H2 de carte */
  --cv-fs-h3:      var(--cv-fs-15);  /* titre de carte */
  --cv-fs-body:    var(--cv-fs-15);  /* texte courant */
  --cv-fs-small:   var(--cv-fs-13);  /* métadonnées */
  --cv-fs-eyebrow: var(--cv-fs-12);  /* sur-titre, badges */
  --cv-lh-text: 1.5;
  --cv-lh-ui: normal;   /* hauteur de ligne des maquettes v2 (arrondie par le navigateur) */
  --cv-lh-title: 1.2;

  /* --- Espacements -------------------------------------------------------- */
  --cv-space-1: 4px;
  --cv-space-2: 8px;
  --cv-space-3: 12px;
  --cv-space-4: 16px;
  --cv-space-5: 24px;
  --cv-space-6: 32px;
  --cv-space-7: 48px;
  --cv-space-8: 64px;
  --cv-sp-1: 1px; --cv-sp-2: 2px; --cv-sp-3: 3px; --cv-sp-6: 6px; --cv-sp-9: 9px; --cv-sp-10: 10px;
  --cv-sp-14: 14px; --cv-sp-18: 18px; --cv-sp-20: 20px; --cv-sp-28: 28px; --cv-sp-40: 40px;

  --cv-radius-sm: var(--cv-r-8);     /* champs, boutons */
  --cv-radius-md: var(--cv-r-12);    /* cartes */
  --cv-radius-lg: var(--cv-r-16);    /* blocs de section, modales */
  --cv-radius-pill: 999px;           /* badges, pastilles */
  --cv-shadow-1: none;               /* cartes : bordure seule, sans ombre */
  --cv-shadow-2: 0 8px 24px rgba(15, 31, 51, 0.12);  /* menus, panneaux, modales */

  /* --- Mise en page ------------------------------------------------------ */
  --cv-container: 1200px;
  --cv-container-wide: 1360px;
  --cv-gutter: 32px;
  --cv-bottomnav-h: 64px;
  --cv-touch: 44px;

  /* --- Interaction ------------------------------------------------------- */
  --cv-focus-ring: 0 0 0 2px var(--cv-surface), 0 0 0 4px var(--cv-primary);
  --cv-transition: 150ms ease;
}

/* Points de rupture (à recopier tels quels dans les media queries) :
   --bp-sm 600px · --bp-md 900px · --bp-lg 1200px */
@media (max-width: 899px) {
  :root {
    --cv-fs-display: 1.625rem; /* 26 px */
    --cv-fs-30: 26px;
    --cv-fs-32: 26px;
    --cv-fs-26: 22px;
    --cv-gutter: 16px;
    --cv-header-h: 56px;
  }
}