/* ============================================================
 * 19. ACCESSIBILITY OVERRIDES — RGAA 4.1 / WCAG 2.1 AA
 *     Corrections ciblees post-audit 2026-05-03 :
 *       - 3.2 contraste teal #008b92 -> #006b71 (palette existante)
 *       - 3.3 bordures champs (--color-border) 1.5:1 -> 3:1
 *       - 12.x lien "Accessibilite : <statut>" en pied de page
 *       - 7.x utilitaire .sr-only pour annonces lecteur d'ecran
 * ============================================================ */

/* === RGAA 3.3 — bordures champs visibles (3:1 minimum sur blanc) ===
   Ancienne valeur : #caced1 (~1.5:1, echec).
   Nouvelle valeur : #9ca3af (3.5:1) — au-dessus du seuil tout en restant discret. */
:root {
  --color-border: #9ca3af; /* anciennement #caced1 — RGAA 3.3 */
}

/* === RGAA 3.2 — contraste teal sur textes <18.5px / <24px gras ===
   #008b92 sur blanc = 4.11:1 (echec AA texte normal).
   #006b71 (--color-primary-hover, deja dans la palette) = 5.6:1. */

/* Filtre projets — titres de groupes et titre principal */
.project-filter-tabs-container .filter-title,
.project-filter-tabs-container .group-title {
  color: var(--color-primary-hover); /* anciennement var(--color-primary) #008b92 */
}

/* Cartes projet — categorie (Elementor) */
.elementor-project__category {
  color: var(--color-primary-hover); /* anciennement #008b92 */
}

/* Accordeons Elementor — page Votre Projet (texte teal sur blanc).
   !important requis : Elementor injecte color:#008b92 en style inline
   (#008b92 sur blanc = 4.11:1, echec WCAG AA texte normal 20px/500).
   #006b71 sur blanc = 5.6:1 (conforme). */
.elementor-toggle .elementor-toggle-item .elementor-tab-title,
.elementor-toggle .elementor-toggle-item .elementor-toggle-title,
.elementor-toggle-title {
  color: var(--color-primary-hover) !important; /* anciennement #008b92 */
}
#section-depot-projets-toggle-items .elementor-toggle-title {
  color: #FFF !important; /* anciennement #008b92 */
}

/* Accordeon ouvert : fond teal -> texte blanc.
   #006b71 + #fff = 5.6:1 (AA texte normal OK).
   Anciennement #008b92 + #fff = 4.11:1 (echec). */
.elementor-toggle .elementor-toggle-item .elementor-tab-title.elementor-active {
  background-color: var(--color-primary-hover) !important;
}

/* === Utilitaire .sr-only — annonces NVDA / JAWS / VoiceOver === */
.sr-only {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* === RGAA 12.7 — Skip-link visible au focus clavier ===
   Override local : .sr-only ci-dessus utilise position:absolute !important,
   ce qui defait partiellement la regle .sr-only-focusable:focus de critical.css.
   On redefinit explicitement l'etat focus pour le skip-link.
   Specificity .a11y-skip-nav .skip-link = (0,2,0) > .sr-only (0,1,0). */
.a11y-skip-nav .skip-link:focus,
.a11y-skip-nav .skip-link:focus-visible {
  position: fixed !important;
  top: 0;
  left: 0;
  width: auto !important;
  height: auto !important;
  padding: 12px 24px;
  margin: 0;
  clip: auto !important;
  overflow: visible !important;
  white-space: normal;
  background: #fff !important;
  color: var(--color-primary-hover);
  border: 3px solid var(--color-primary-hover);
  font-size: 1rem !important;
  font-weight: 700;
  text-decoration: none;
  z-index: 99999;
  outline: 3px solid var(--color-primary-hover);
  outline-offset: 2px;
}

/* === Pied de page : lien "Accessibilite : <statut>" ===
   Spec : sous menu existant, centre, taille minimum acceptee AA.
   Texte 12px sur fond #006b71 (footer copyright) : couleur #fff = 5.6:1 (AA OK).
   Couleur #fff sur #006b71 : conforme RGAA 3.2 pour texte normal. */
.footer-a11y {
  display: block;
  text-align: center;
  padding: 8px 16px 12px;
  background: var(--color-primary-hover);
}
.footer-a11y a {
  color: #fff;
  font-family: var(--ff-light), sans-serif;
  font-size: 12px;
  line-height: 1.5;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.footer-a11y a:hover,
.footer-a11y a:focus-visible {
  color: #fff;
  text-decoration-thickness: 2px;
}
.footer-a11y a:focus-visible {
  outline: 3px solid #fff;
  outline-offset: 2px;
}

/* === Filtre projets : panneau toggle controle par aria-expanded sur le header ===
   Selecteur ancien (sur section) reste compatible — celui-ci ajoute le pattern correct. */
.project-filter-tabs-container .filter-header[aria-expanded="false"] ~ #project-filter-panel { display: none; }
.project-filter-tabs-container .filter-header[aria-expanded="true"]  ~ #project-filter-panel { display: block; }
.project-filter-tabs-container .filter-header[aria-expanded="true"]::after { transform: rotate(-135deg); }

/* === Bouton Filtrer desactive : aria-disabled seul (focusable) === */
.project-filter-tabs-container .filter-cta.is-disabled {
  opacity: .55;
  cursor: not-allowed;
  filter: none;
  transform: none;
  box-shadow: none;
}

/* === RGAA 1.2 — SVG decoratifs Complianz : neutralisation pointeur === */
.cmplz-cookiebanner svg,
.cmplz-icon svg { pointer-events: none; }
