/* ==========================================================================
   Jetons de design du site de l'église
   --------------------------------------------------------------------------
   Toutes les couleurs, rayons, ombres et dégradés du thème sont définis ici :
   changer d'identité graphique revient à remplacer ce fichier (et polices.css
   pour les polices). Les noms (--eg-…, pour « Église Grand Parc ») sont
   communs aux sites de l'église : site principal, UNIVERS et Parvis.

   Thème clair par défaut ; thème sombre sous [data-theme="dark"], posé avant
   le premier rendu par base.html.twig (préférence du téléphone ou choix du
   visiteur).

   Les transparences s'écrivent rgba(var(--eg-bleu-rgb), 0.1) : compatible
   avec tous les navigateurs, mais chaque couleur concernée existe deux fois,
   en hexadécimal et en canaux (-rgb). Les deux se changent ensemble.

   Hors de ce fichier, la couleur de la barre du navigateur sur téléphone
   (base.html.twig, manifest.webmanifest) et la page hors ligne (offline.html)
   reprennent ces valeurs à la main.
   ========================================================================== */

:root {
  /* Palette de marque, identique dans les deux thèmes */
  --eg-bleu:          #4361ee;
  --eg-bleu-rgb:      67, 97, 238;
  --eg-bleu-fonce:    #3451d1;
  --eg-bleu-nuit:     #2c3a8f;
  --eg-bleu-vif-rgb:  37, 99, 235;    /* halos des boutons et des champs actifs */
  --eg-indigo:        #4f46e5;
  --eg-mauve:         #6d4ac4;
  --eg-mauve-fonce:   #5b3fb0;
  --eg-violet:        #7c3aed;
  --eg-violet-rgb:    124, 58, 237;
  --eg-violet-fonce:  #6d28d9;
  --eg-encre:         #1c1c2e;
  --eg-blanc:         #fff;
  --eg-blanc-rgb:     255, 255, 255;
  --eg-noir:          #000;
  --eg-noir-rgb:      0, 0, 0;

  /* Couleurs des réseaux : celles de leurs marques */
  --eg-instagram: #e1306c;
  --eg-facebook:  #1877f2;
  --eg-whatsapp:  #25d366;
  --eg-youtube:   #ff0000;

  /* Rôles, thème clair */
  --eg-fond:          #ffffff;
  --eg-fond-2:        #f7f8fc;      /* bandes et blocs en retrait */
  --eg-surface:       #ffffff;      /* cartes */
  --eg-surface-2:     #f7f8fc;
  --eg-texte:         #1c1c2e;
  --eg-texte-doux:    #6b7080;
  --eg-trait:         #e2e5f0;
  --eg-action:        #4361ee;      /* liens, boutons, éléments actifs */
  --eg-action-survol: #3451d1;
  --eg-action-pale:   #eef1fd;
  --eg-accent:        #7c3aed;
  --eg-bandeau:       rgba(255, 255, 255, 0.95);   /* en-tête translucide */
  --eg-lecteur:       rgba(255, 255, 255, 0.98);   /* lecteur audio */
  --eg-sur-couleur:   var(--eg-blanc);             /* texte posé sur une couleur */
  --eg-survol-blanc:  #f0f4ff;      /* bouton blanc survolé, sur le bandeau d'accueil */
  --eg-fond-logo:     #f4f4f8;      /* reste clair en sombre : les logos d'activités sont foncés */

  /* États */
  --eg-succes:        #166534;
  --eg-succes-fond:   #f0fdf4;
  --eg-succes-trait:  #86efac;
  --eg-erreur:        #dc2626;
  --eg-erreur-fond:   #fef2f2;
  --eg-erreur-trait:  #fca5a5;
  --eg-danger:        #c0392b;      /* message d'erreur d'un champ */
  --eg-requis:        #e55;         /* astérisque des champs obligatoires */

  /* Bloc de dons HelloAsso */
  --eg-don-fond:           linear-gradient(135deg, #f3e8ff 0%, #faf0ff 100%);
  --eg-don-trait:          #d8b4fe;
  --eg-don-bouton-trait:   #c4b5fd;
  --eg-don-bouton-survol:  #f5f3ff;

  /* Dégradés de marque et voiles posés sur les photos */
  --eg-degrade:          linear-gradient(135deg, var(--eg-bleu-fonce) 0%, var(--eg-bleu) 55%, var(--eg-mauve) 100%);
  --eg-degrade-preches:  linear-gradient(135deg, var(--eg-bleu-nuit) 0%, var(--eg-bleu-fonce) 50%, var(--eg-mauve-fonce) 100%);
  --eg-voile-photo:      linear-gradient(135deg, rgba(52, 81, 209, 0.86), rgba(109, 74, 196, 0.86));
  --eg-voile-carrousel:  linear-gradient(135deg, rgba(33, 46, 110, 0.52) 0%, rgba(72, 44, 134, 0.48) 100%),
                         linear-gradient(to bottom, rgba(0, 0, 0, 0.08), rgba(0, 0, 0, 0.28));
  --eg-voile-entete:     linear-gradient(135deg, rgba(33, 46, 110, 0.55) 0%, rgba(72, 44, 134, 0.50) 100%),
                         linear-gradient(to bottom, rgba(0, 0, 0, 0.10), rgba(0, 0, 0, 0.32));
  --eg-voile-preches:    linear-gradient(100deg, rgba(22, 30, 80, 0.93) 0%, rgba(38, 36, 108, 0.82) 48%, rgba(72, 44, 134, 0.66) 100%);

  /* Typographie (fichiers et graisses dans polices.css) */
  --eg-police-texte: 'Inter', sans-serif;
  --eg-police-titre: 'Outfit', sans-serif;

  /* Formes, ombres, mouvement */
  --eg-rayon:    8px;
  --eg-rayon-s:  5px;
  --eg-rayon-xs: 3px;
  --eg-ombre-s:  0 1px 4px rgba(28, 28, 46, 0.06);
  --eg-ombre-m:  0 4px 16px rgba(28, 28, 46, 0.08);
  --eg-ombre-l:  0 12px 32px rgba(28, 28, 46, 0.10);
  --eg-transition: all 0.22s ease;
}

/* Thème sombre : seuls les rôles changent, la palette reste. */
[data-theme="dark"] {
  --eg-fond:          #0f1117;
  --eg-fond-2:        #171923;
  --eg-surface:       #171923;
  --eg-surface-2:     #1a1f2e;
  --eg-texte:         #e8eaf0;
  --eg-texte-doux:    #8891a8;
  --eg-trait:         #2a2d3e;
  --eg-action:        #748ffc;
  --eg-action-survol: #5c7cfa;
  --eg-action-pale:   #1a1f3a;
  --eg-accent:        #a78bfa;
  --eg-bandeau:       rgba(15, 17, 23, 0.96);
  --eg-lecteur:       rgba(23, 25, 35, 0.98);

  --eg-succes:        #86efac;
  --eg-succes-fond:   #052e16;
  --eg-succes-trait:  #166534;
  --eg-erreur-fond:   #3b1010;
  --eg-erreur-trait:  #7f1d1d;
}