/* ========================================
   FlipIQ — Charte couleur centralisée
   Hiérarchie à 2 tons :
   - #5b236e : CTA et boutons (couleur d'action unique)
   - #8a4d9c : petits accents (badges, liens, étapes, icônes)
   Chargé par header.php (toutes les pages) + pages auth autonomes.
   ======================================== */

:root {
  --flipiq-purple: #5b236e;        /* CTA et boutons — couleur d'action unique */
  --flipiq-purple-hover: #6f2b87;  /* hover : un cran plus lumineux */
  --flipiq-purple-light: #8a4d9c;  /* petits accents : badges, liens, étapes, icônes */
  --flipiq-glow: 0 4px 18px rgba(91, 35, 110, 0.45);
  --flipiq-ghost-hover-bg: rgba(91, 35, 110, 0.25);
}

/* Focus clavier : outline violet visible sur tous les éléments interactifs */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[role="button"]:focus-visible {
  outline: 2px solid var(--flipiq-purple-light);
  outline-offset: 2px;
}