/*
  Lucerna App : jetons de design pour les pages web publiques
  (fiches paroisses et lieux de retraite indexables, espaces de gestion).
  Source : charte V2 + direction Vitrail. Mêmes valeurs que
  flutter/lib/theme/lucerna_colors.dart : toute modification se fait aux deux endroits.
*/
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@600;700;800&family=Noto+Sans:wght@400;500;600;700&display=swap");

:root {
  /* Marque */
  --bleu-lucerna: #3046C5;
  --violet: #7654B3;
  --ambre: #F6B843;
  --bleu-nuit: #192145;
  --blanc: #FFFFFF;

  /* Interface (clair) */
  --fond: #F5F6FB;
  --surface: #FFFFFF;
  --texte: #192145;
  --texte-secondaire: #596178;
  --action: #3046C5;
  --sur-action: #FFFFFF;
  --action-appui: #24369B;
  --ambre-texte: #8A5A00;
  --trait: #E3E6F0;
  --trait-controle: #7C849C;

  /* Vitrail : teintes pastel */
  --bleu-pale: #E4E8FF;
  --violet-pale: #EDE5F8;
  --ambre-pale: #FDEBC4;
  --vert-pale: #DDEFE5;
  --texte-sur-ambre-pale: #6B4600;
  --texte-sur-violet-pale: #5E3F99;

  /* États */
  --etat-verifie: #256047;
  --etat-verifie-fond: #EAF4EE;
  --etat-attention: #805000;
  --etat-attention-fond: #FFF1D0;
  --etat-erreur: #A53038;
  --etat-erreur-fond: #FCEDEF;
  --etat-info: #3046C5;
  --etat-info-fond: #EEF0FF;

  /* Couleur liturgique du jour (remplacée côté serveur selon le calendrier) */
  --liturgie: #256047;
  --sur-liturgie: #FFFFFF;

  /* Typographie */
  --police-titre: Manrope, "Segoe UI", system-ui, sans-serif;
  --police-texte: "Noto Sans", "Segoe UI", system-ui, -apple-system, sans-serif;

  /* Espacements (rythme de 4 et 8) */
  --espace-1: 4px;
  --espace-2: 8px;
  --espace-3: 12px;
  --espace-4: 16px;
  --espace-6: 24px;
  --espace-8: 32px;
  --espace-12: 48px;
  --espace-16: 64px;
  --largeur-contenu: 1200px;
  --cible-tactile: 48px;

  /* Arrondis Vitrail */
  --rayon-petit: 8px;
  --rayon-pastille: 14px;
  --rayon-carte: 16px;
  --rayon-grande-carte: 20px;
  --rayon-feuille: 28px;
  --rayon-pilule: 999px;

  --ombre-carte: 0 1px 3px rgba(25, 33, 69, 0.08);
}

@media (prefers-color-scheme: dark) {
  :root {
    --fond: #131A33;
    --surface: #1E2947;
    --texte: #F5F7FF;
    --texte-secondaire: #C4CCE0;
    --action: #A9B8FF;
    --sur-action: #192145;
    --action-appui: #C6D0FF;
    --ambre-texte: #F6B843;
    --trait: #2B3656;
    --trait-controle: #6F7AA0;
    --bleu-pale: #24305A;
    --violet-pale: #332B5C;
    --ambre-pale: #3A3020;
    --vert-pale: #183A33;
    --texte-sur-ambre-pale: #F6C66B;
    --texte-sur-violet-pale: #B9A2E6;
    --etat-verifie: #7FD1A6;
    --etat-verifie-fond: #183A33;
    --etat-attention: #F6C66B;
    --etat-attention-fond: #3A3020;
    --etat-erreur: #F2A0A6;
    --etat-erreur-fond: #43232D;
    --etat-info: #A9B8FF;
    --etat-info-fond: #24305A;
    --liturgie: #3FA278;
    --sur-liturgie: #131A33;
  }
}

body {
  margin: 0;
  background: var(--fond);
  color: var(--texte);
  font-family: var(--police-texte);
  font-size: 16px;
  line-height: 24px;
}

:focus-visible {
  outline: 2px solid var(--action);
  outline-offset: 2px;
  box-shadow: 0 0 0 2px var(--surface);
}
