/* =====================================================================
   COULEURS ET VARIABLES — fichier unique, à remplacer d'un bloc.
   Les pastels servent aux fonds et aux accents, JAMAIS au texte.
   Le texte est en bleu marine (clair) ou en blanc cassé (sombre).
   ===================================================================== */

/* Police de la charte Pédagora (Outfit, licence libre SIL OFL, voir polices/Outfit-OFL.txt), servie par le portail lui-même */
@font-face {
  font-family: "Outfit";
  src: url("polices/Outfit-VariableFont_wght.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

:root {
  /* Charte Pédagora, page 1-2 : le cadre (en-tête, boutons, liens, logo) */
  --marine: #1E3A8A;   /* Bleu nuit : réservé au cadre, jamais une rubrique */
  --bleu:   #4C86E8;   /* Bleu agora */
  --ciel:   #8DB6F7;   /* Bleu ciel */
  --corail: #F97360;   /* Corail : jamais pour du texte */

  /* Charte Pédagora, page 3 : couleurs des rubriques (repère vif ; le fond et le texte en sont déclinés) */
  --c-bleu:      #4C86E8;
  --c-indigo:    #5B6CE0;
  --c-violet:    #8B5CD6;
  --c-prune:     #B04FC4;
  --c-rose:      #D2559A;
  --c-corail:    #F97360;
  --c-orange:    #F08A2C;
  --c-ambre:     #E0B22E;
  --c-olive:     #8DAA2E;
  --c-vert:      #3FA66B;
  --c-turquoise: #14A3A3;
  --c-cyan:      #2A9BD8;
  --c-ardoise:   #64748B;

  /* Couleurs de sens (validé, en attente, annulé…) prises dans la même palette */
  --vert:   var(--c-vert);
  --jaune:  var(--c-ambre);
  --peche:  var(--c-orange);
  --rose:   var(--c-rose);
  --lilas:  var(--c-ardoise);
  --gris:   var(--c-ardoise);

  /* Une couleur par rubrique (page 3 de la charte) */
  --r-accueil:     var(--c-cyan);
  --r-infos:       var(--c-bleu);       /* Infos de l'école */
  --r-agenda:      var(--c-violet);     /* Agenda */
  --r-documents:   var(--c-ambre);      /* Démarches, documents */
  --r-formulaires: var(--c-olive);      /* Formulaires (rubrique Démarches) */
  --r-horaires:    var(--c-turquoise);  /* Horaires */
  --r-pedagogie:   var(--c-rose);       /* Projets */
  --r-eleves:      var(--c-indigo);     /* Dossier élève */
  --r-equipe:      var(--c-prune);      /* Réunions, concertations */
  --r-contacts:    var(--c-vert);       /* Contacts, partenaires */
  --r-absences:    var(--c-corail);     /* Absences, remplacements */
  --r-acces:       var(--c-ardoise);    /* Procédures, réglages */

  /* Catégories de l'agenda */
  --cat-reunion:   var(--c-prune);
  --cat-sortie:    var(--c-rose);
  --cat-formation: var(--c-indigo);
  --cat-conge:     var(--c-corail);
  --cat-evenement: var(--c-bleu);
  --cat-echeance:  var(--c-orange);

  /* Thème clair */
  --fond:          #F4F5F7;   /* Craie */
  --surface:       #FFFFFF;
  --surface-2:     #EAF0FB;
  --texte:         #111827;   /* Encre */
  --titre:         var(--marine);
  --texte-doux:    #4B5563;
  --bordure:       #DCE3EE;
  --base-teinte:   #FFFFFF;   /* couleur avec laquelle on mélange les pastels */
  --teinte:        12%;       /* fond très clair d'une rubrique (charte p. 3) */
  --teinte-forte:  22%;       /* pastille claire */
  --encre-melange: #000000;   /* texte d'étiquette : la couleur assombrie */
  --bouton-fond:   var(--marine);
  --bouton-texte:  #FFFFFF;
  --danger:        #A3262A;
  --focus:         var(--marine);
  --ombre:         0 2px 12px rgba(30, 58, 138, 0.08);

  /* Formes et typographie */
  --police: "Outfit", "Segoe UI", Arial, system-ui, sans-serif;
  --rayon: 18px;
  --rayon-petit: 12px;

  color-scheme: light;
}

/* Thème sombre : suit le réglage de l'appareil, sauf si on force le clair */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --fond:          #121B26;
    --surface:       #1B2735;
    --surface-2:     #243345;
    --texte:         #E9EFF6;
    --titre:         #A9C6F8;
    --texte-doux:    #AEBCCC;
    --bordure:       #31445A;
    --base-teinte:   #1B2735;
    --teinte:        22%;
    --teinte-forte:  34%;
    --encre-melange: #FFFFFF;
    --bouton-fond:   #8DB6F7;
    --bouton-texte:  #111827;
    --danger:        #C8474B;
    --focus:         #F5C953;
    --ombre:         0 2px 12px rgba(0, 0, 0, 0.35);
    color-scheme: dark;
  }
}

/* Thème sombre forcé (bouton de la maquette) */
:root[data-theme="dark"] {
  --fond:          #121B26;
  --surface:       #1B2735;
  --surface-2:     #243345;
  --texte:         #E9EFF6;
  --titre:         #A9C6F8;
  --texte-doux:    #AEBCCC;
  --bordure:       #31445A;
  --base-teinte:   #1B2735;
  --teinte:        22%;
  --teinte-forte:  34%;
  --encre-melange: #FFFFFF;
  --bouton-fond:   #8DB6F7;
  --bouton-texte:  #111827;
  --danger:        #C8474B;
  --focus:         #F5C953;
  --ombre:         0 2px 12px rgba(0, 0, 0, 0.35);
  color-scheme: dark;
}
