/* Couleurs marque (HEX) */
:root{
  --brand-primary: #1f5eff;   /* bleu principal */
  --brand-secondary: #111827; /* noir/anthracite */
  --brand-success: #16a34a;
  --brand-warning: #f59e0b;
  --brand-danger:  #dc2626;

  /* RGB (obligatoire pour certaines ombres Bootstrap) */
  --brand-primary-rgb: 31, 94, 255;
  --brand-secondary-rgb: 17, 24, 39;
  --brand-success-rgb: 22, 163, 74;
  --brand-warning-rgb: 245, 158, 11;
  --brand-danger-rgb: 220, 38, 38;
}

/* =========================
   Bootstrap overrides
   ========================= */
:root{
  --bs-primary: var(--brand-primary);
  --bs-primary-rgb: var(--brand-primary-rgb);

  --bs-secondary: var(--brand-secondary);
  --bs-secondary-rgb: var(--brand-secondary-rgb);

  --bs-success: var(--brand-success);
  --bs-success-rgb: var(--brand-success-rgb);

  --bs-warning: var(--brand-warning);
  --bs-warning-rgb: var(--brand-warning-rgb);

  --bs-danger: var(--brand-danger);
  --bs-danger-rgb: var(--brand-danger-rgb);

  --bs-link-color: var(--brand-primary);
  --bs-link-hover-color: var(--brand-primary);
}

/* Petits réglages UI (optionnel) */
.btn-primary{
  box-shadow: 0 6px 18px rgba(var(--bs-primary-rgb), .18);
}
.navbar-dark{
  background-color: var(--bs-secondary) !important;
}

/* =========================
   Écrans de l'application (26/09/2026)
   Ces classes étaient recopiées dans chaque vue, avec des couleurs différentes
   à chaque fois. Elles vivent ici maintenant : une liste, une fiche et un
   formulaire se ressemblent d'un écran à l'autre.
   ========================= */

/* Bandeau de titre en haut de l'écran */
.ecran-entete{
  background: linear-gradient(135deg, var(--brand-secondary) 0%, #1b2434 100%);
  border-radius: .9rem;
  color: #e5e9ef;
  padding: 1.25rem 1.5rem;
}
.ecran-entete h1{ color: #fff; }

/* Bloc blanc : carte d'information, tableau, filtres */
.ecran-carte{
  background: #fff;
  border: 1px solid #e9ecef;
  border-radius: .9rem;
}

/* Chiffre clé, avec sa pastille d'icône */
.ecran-indicateur .icone{
  width: 42px; height: 42px; border-radius: .7rem;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 1.1rem;
  background: rgba(var(--brand-primary-rgb), .10);
  color: var(--brand-primary);
}

/* Lien encadré vers un autre écran */
.ecran-lien{
  display: flex; align-items: center; gap: .75rem;
  border: 1px solid #e9ecef; border-radius: .7rem;
  padding: .7rem .9rem;
  text-decoration: none; color: inherit;
}
.ecran-lien:hover{
  border-color: var(--brand-primary);
  background: rgba(var(--brand-primary-rgb), .04);
}
.ecran-lien i{ color: var(--brand-primary); font-size: 1.1rem; }

/* Liste de couples « libellé / valeur » */
.ecran-infos dt{ font-weight: 600; color: #6c757d; padding-bottom: .4rem; }
.ecran-infos dd{ padding-bottom: .4rem; }

/* Tableau d'une liste */
.ecran-tableau thead th{
  background: #f8fafc; color: #495057;
  font-weight: 600; font-size: .9rem;
  border-bottom: 1px solid #e9ecef;
  white-space: nowrap;
}
.ecran-tableau tbody tr:hover{ background: rgba(var(--brand-primary-rgb), .03); }

/* Barre d'avancement fine */
.ecran-jauge{
  height: 7px; border-radius: 999px; overflow: hidden; background: #edf2f7;
}