/* =============================================================================
   EduTrack — Variables de couleur
   =============================================================================

   Source unique de vérité pour toutes les couleurs de l'application.
   Avant ce fichier, l'application comptait 154 couleurs distinctes, dont 976
   valeurs écrites à la main dans les templates, et quatre bleus se disputaient
   le rôle de couleur principale.

   RÈGLE D'USAGE — deux variantes par teinte, ce n'est pas cosmétique :
     --et-<teinte>        aplat  → fonds, tuiles, bandeaux, icônes pleines
     --et-<teinte>-ink    encre  → TOUT texte, toute icône fine, toute bordure fine
     --et-<teinte>-wash   voile  → fonds discrets derrière du texte en encre

   Les aplats sont trop clairs pour porter du texte sur blanc (l'ambre tombe à
   1,78:1). Les statuts A / EC / NA s'affichant en toutes lettres dans la grille
   et sur les bulletins, l'encre est obligatoire dès qu'il s'agit de lecture.
   ========================================================================== */

:root {
  /* ---- Teintes de la charte ---- */
  --et-teal:        #2EB39A;   /* Acquis, réussite, bandeaux */
  --et-teal-ink:    #1B7160;   /* 5,87:1 sur blanc */
  --et-teal-wash:   #E4F5F1;

  --et-blue:        #1D4ED8;   /* Actions, liens, sélection — 6,70:1 sur blanc */
  --et-blue-ink:    #1A44BF;   /* 7,86:1 sur blanc */
  --et-blue-wash:   #E3EAFD;

  --et-amber:       #FDB528;   /* En cours, vigilance */
  --et-amber-ink:   #9F6A01;   /* 4,63:1 sur blanc */
  --et-amber-wash:  #FEF3DF;

  --et-rose:        #E8547C;   /* Non acquis, absences, alertes */
  --et-rose-ink:    #E12356;   /* 4,59:1 sur blanc */
  --et-rose-wash:   #FDE9EF;

  --et-violet:      #6C5DD3;   /* Graphiques, second plan */
  --et-violet-ink:  #6859D2;   /* 5,32:1 sur blanc */
  --et-violet-wash: #ECE9FA;

  /* ---- Neutres, légèrement tirés vers le bleu de la charte ---- */
  --et-ground:   #F5F6FA;   /* fond de page */
  --et-card:     #FFFFFF;   /* surface des cartes */
  --et-raise:    #EDEEF5;   /* surface secondaire, en-têtes de tableau */
  --et-rule:     #E4E5EE;   /* filets et bordures */
  --et-ink:      #171725;   /* texte principal */
  --et-ink-mid:  #5A5A72;   /* texte secondaire */
  --et-ink-low:  #8E8EA9;   /* texte tertiaire, libellés */
  --et-on-fill:  #FFFFFF;   /* texte posé sur un aplat sombre */
  --et-on-amber: #4A3000;   /* texte posé sur l'ambre, qui est clair */

  /* ---- Sémantique métier : statuts de compétence ---- */
  --et-acquis:        var(--et-teal);
  --et-acquis-ink:    var(--et-teal-ink);
  --et-acquis-wash:   var(--et-teal-wash);
  --et-encours:       var(--et-amber);
  --et-encours-ink:   var(--et-amber-ink);
  --et-encours-wash:  var(--et-amber-wash);
  --et-nonacquis:     var(--et-rose);
  --et-nonacquis-ink: var(--et-rose-ink);
  --et-nonacquis-wash:var(--et-rose-wash);

  /* ---- Élévation et rayons ---- */
  --et-shadow-sm: 0 1px 2px rgba(23, 23, 37, .05);
  --et-shadow:    0 1px 2px rgba(23, 23, 37, .04), 0 8px 24px -14px rgba(23, 23, 37, .18);
  --et-shadow-lg: 0 2px 4px rgba(23, 23, 37, .04), 0 16px 40px -20px rgba(23, 23, 37, .26);
  --et-radius-sm: 8px;
  --et-radius:    14px;
  --et-radius-lg: 20px;

  /* ---- Alias de compatibilité ----------------------------------------
     Certains gabarits déclaraient déjà leurs propres variables. On les
     raccorde ici plutôt que de les réécrire, pour éviter les régressions. */
  --primary-blue:        var(--et-blue);
  --primary-blue-light:  var(--et-blue-wash);
  --primary-blue-dark:   var(--et-blue-ink);
  --secondary-purple:    var(--et-violet);
  --secondary-green:     var(--et-teal);
  --secondary-orange:    var(--et-amber);
  --secondary-yellow:    var(--et-amber);
  --secondary-pink:      var(--et-rose);
  --background-primary:   var(--et-card);
  --background-secondary: var(--et-ground);
  --background-tertiary:  var(--et-raise);
  --text-primary:    var(--et-ink);
  --text-secondary:  var(--et-ink-mid);
  --text-tertiary:   var(--et-ink-low);
  --border-light:    var(--et-rule);
  --border-medium:   var(--et-rule);
  --border-dark:     var(--et-ink-low);
  --shadow-small:    var(--et-shadow-sm);
  --shadow-medium:   var(--et-shadow);
  --shadow-large:    var(--et-shadow-lg);
}
