/* ============================================================
 * VECTRYS · A11y Tokens Shared (DRY anti-doublon)
 * Source unique : 4 toggles accessibilité visuelle universelle
 * Cohérent L4 #51 ANTI-RÉGRESSION + L4 #53 ITERATIVE-EDIT + L4 #97 strict 0/0/0
 * WCAG AAA ratio 7:1 visé · COGA recommended · Direction B canonical
 *
 * 4 toggles couverts :
 *   1. Police dyslexie (Atkinson Hyperlegible · COGA Web Content Accessibility)
 *   2. Densité confort (touch targets 48px+ · WCAG 2.5.5 Target Size AAA)
 *   3. Contraste élevé (tokens variables + bordures 2px renforcées)
 *   4. Réduire animations (JS handler · transition-duration / animation-duration 0.001s)
 *
 * Usage :
 *   <link rel="stylesheet" href="./a11y-tokens.css">
 *   ou injection dynamique via lens-tool-bundle.js
 * ============================================================ */

/* ── 1. Police dyslexie · Atkinson Hyperlegible (COGA recommended) ── */
[data-font="dys"] *, [data-font="dys"] {
  font-family: 'Atkinson Hyperlegible', 'Inter', sans-serif !important;
}

/* ── 2. Densité confort · touch targets 48px+ (WCAG 2.5.5 AAA) ── */
[data-dense="comfort"] body {
  font-size: 15px;
  line-height: 1.65;
}
[data-dense="comfort"] button:not(.a11y__toggle):not(.a11y__btn):not(.lens-shortcuts-overlay__close):not(.mobile-nav__item),
[data-dense="comfort"] .btn,
[data-dense="comfort"] [role="button"],
[data-dense="comfort"] a[role="button"] {
  min-height: 48px;
  min-width: 48px;
  padding: 12px 16px;
}
[data-dense="comfort"] input:not([type="range"]):not([type="checkbox"]):not([type="radio"]),
[data-dense="comfort"] select,
[data-dense="comfort"] textarea {
  min-height: 48px;
  padding: 10px 14px;
}
[data-dense="comfort"] .card__body { padding: 22px; }
[data-dense="comfort"] .card__hd { padding: 18px 20px; }
[data-dense="comfort"] .sb__item,
[data-dense="comfort"] .nav__item {
  padding: 11px 10px;
  min-height: 48px;
}
[data-dense="comfort"] .page { padding: 36px 40px 96px; }
[data-dense="comfort"] .stat { padding: 22px; gap: 6px; }
[data-dense="comfort"] .feed-item,
[data-dense="comfort"] .list-item,
[data-dense="comfort"] .prop-mini { padding: 14px; }
[data-dense="comfort"] .tbl td,
[data-dense="comfort"] td { padding: 14px; }

/* ── 3. Contraste élevé · WCAG AAA ratio 7:1 visé + bordures renforcées ── */
[data-contrast="high"] {
  --line: rgba(148,163,184,.5);
  --line-hi: rgba(148,163,184,.7);
  --mute: #cbd5e1;
  --ink-soft: #ffffff;
}
[data-contrast="high"] body { color: #ffffff; }
[data-contrast="high"] button:not(.a11y__toggle),
[data-contrast="high"] .btn,
[data-contrast="high"] input,
[data-contrast="high"] select,
[data-contrast="high"] textarea,
[data-contrast="high"] .card,
[data-contrast="high"] [role="button"],
[data-contrast="high"] [role="tab"] {
  border-width: 2px !important;
  border-style: solid !important;
}
[data-contrast="high"] *:focus-visible {
  outline: 3px solid var(--accent, #60a5fa) !important;
  outline-offset: 2px !important;
}
[data-contrast="high"] a,
[data-contrast="high"] a:visited {
  text-decoration: underline;
  text-underline-offset: 3px;
}

/* ── Extensions portail-spécifiques (app.html · console agence) ── */
/* Ces sélecteurs ne s'appliquent qu'aux portails qui ont ces classes · pas de side effect ailleurs */
[data-dense="comfort"] .sb { padding: 22px 12px; gap: 6px; }
[data-dense="comfort"] .page__hd { margin-bottom: 32px; }
[data-dense="comfort"] .page__hd h1 { font-size: 28px; }
[data-dense="comfort"] .stat__val { font-size: 30px; }
[data-dense="comfort"] .grid-2, [data-dense="comfort"] .grid-3, [data-dense="comfort"] .grid-4 { gap: 20px; }
[data-dense="comfort"] .dash-grid { gap: 20px; }
[data-dense="comfort"] .tbl th { padding: 14px; }
[data-dense="comfort"] .btn--sm { padding: 7px 12px; min-height: 32px; }

/* ── Lens canonical extensions cohérent owner-portal + bundle ── */
[data-contrast="high"] .lens { border-width: 4px; }
[data-contrast="high"] .a11y__panel { border-color: var(--ink, #f8fafc); }
[data-contrast="high"] .a11y__toggle { border-color: var(--ink-soft, #cbd5e1); }
[data-contrast="high"] .lens-target-highlight { outline-width: 4px !important; }