/*
  Extrait du fichier livré par le projet design (charte GrowOn v1.3) : seulement les variables.
  Les exemples de composants du fichier d'origine ne sont pas repris, app.css s'en charge.
*/
/*
  GrowOn by Kripa Conseil : design tokens, version 1.3 (23 octobre 2026), territoire C « Interrupteur ».
  Aucun outil de build requis : à charger tel quel avant la feuille de style de l'application.
  Thème clair par défaut, thème sombre via le réglage du système ou l'attribut data-theme sur <html>.
  Règle de la marque : aplats uniquement, aucun dégradé, aucune diagonale.
*/

:root {
  /* Palette de marque (valeurs brutes, à ne pas utiliser directement dans les composants) */
  --brand-graphite: #1B1F24;
  --brand-petrole: #1F4A55;
  --brand-menthe: #8FC7B2;
  --brand-sable: #CDB89A;
  --brand-os: #F2F3F0;
  --brand-gris: #565D64;

  /* Typographie */
  --font-sans: "Manrope", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --weight-title: 300;
  --weight-body: 400;
  --weight-strong: 600;

  --text-xs: 0.6875rem;   /* 11 px : étiquettes en majuscules espacées */
  --text-sm: 0.8125rem;   /* 13 px : texte secondaire, libellés de cartes */
  --text-md: 0.9375rem;   /* 15 px : texte courant */
  --text-lg: 1.375rem;    /* 22 px : titre d'écran */
  --text-xl: 1.75rem;     /* 28 px : titre de section */
  --text-2xl: 2.5rem;     /* 40 px : grand chiffre, page d'accueil */

  /* Espacements (base 4 px) */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;

  /* Formes */
  --radius-sm: 8px;       /* champs, puces */
  --radius-md: 14px;      /* cartes */
  --radius-lg: 22px;      /* feuilles, fenêtres */
  --radius-pill: 999px;   /* boutons, interrupteurs, navigation active */
  --stroke-icon: 1.8px;   /* épaisseur des icônes */
  --touch-min: 44px;      /* taille minimale d'une cible tactile */

  /* Thème clair */
  --color-bg: #F2F3F0;
  --color-surface: #FFFFFF;
  --color-surface-2: #E3E6E1;
  --color-border: #D5D9D3;
  --color-text: #1B1F24;
  --color-text-muted: #565D64;
  --color-accent: #1F4A55;
  --color-on-accent: #FFFFFF;
  --color-track: #D5D9D3;
  --color-progress: #1F4A55;
  --color-signature: #7A6035;

  /* Objectif atteint (100 % ou plus) : seul usage du vert. Toujours accompagné d'une icône et d'un libellé.
     En dessous de 100 %, la barre reste neutre (--color-text-muted), sans orange ni rouge. */
  --status-ok: #2F7D4F;
  --color-alert: #9E3224; /* erreur de saisie dans un formulaire */ 

  /* Quatre quarts de contribution (tableau des priorités d'accompagnement, vue manager uniquement).
     Chaque quart porte aussi une icône (disque plein, trois quarts, moitié, un quart) et un libellé.
     Q1 = menthe (top 25 %, contour vert profond en clair) ; Q4 = rouge brique (bottom 25 %, à accompagner en priorité). */
  --quart-1: #8FC7B2;
  --quart-1-rim: #2F6B58;
  --quart-2: #3F566B;
  --quart-3: #7A8FA3;
  --quart-4: #9E3224;

  /* Classement (top 3). Le rang est toujours écrit en chiffre dans la pastille. */
  --medal-gold: #CDB89A;
  --medal-silver: #DCE0E4;
  --medal-bronze: #B9805A;
  --medal-gold-rim: #8A7248;
  --medal-silver-rim: #6F7983;
  --medal-bronze-rim: #8A5634;
  --on-medal: #1B1F24;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-bg: #14181C;
    --color-surface: #1F252B;
    --color-surface-2: #2A3038;
    --color-border: #2F363E;
    --color-text: #F2F3F0;
    --color-text-muted: #A4ABB2;
    --color-accent: #8FC7B2;
    --color-on-accent: #14181C;
    --color-track: #2F363E;
    --color-progress: #8FC7B2;
    --color-signature: #CDB89A;
    --status-ok: #7CC38E;
    --color-alert: #E58A78;
    --quart-1: #8FC7B2;
    --quart-1-rim: #8FC7B2;
    --quart-2: #9FB6CC;
    --quart-3: #6F8499;
    --quart-4: #E58A78;
    --medal-gold-rim: #CDB89A;
    --medal-silver-rim: #DCE0E4;
    --medal-bronze-rim: #B9805A;
  }
}

:root[data-theme="dark"] {
  --color-bg: #14181C;
  --color-surface: #1F252B;
  --color-surface-2: #2A3038;
  --color-border: #2F363E;
  --color-text: #F2F3F0;
  --color-text-muted: #A4ABB2;
  --color-accent: #8FC7B2;
  --color-on-accent: #14181C;
  --color-track: #2F363E;
  --color-progress: #8FC7B2;
  --color-signature: #CDB89A;
  --status-ok: #7CC38E;
  --color-alert: #E58A78;
  --quart-1: #8FC7B2;
  --quart-1-rim: #8FC7B2;
  --quart-2: #9FB6CC;
  --quart-3: #6F8499;
  --quart-4: #E58A78;
  --medal-gold-rim: #CDB89A;
  --medal-silver-rim: #DCE0E4;
  --medal-bronze-rim: #B9805A;
}
