/* ══════════════════════════════════════════════════════════════
   ACCESSIBILITY v15 — WCAG 2.2 AA (Web Content Accessibility Guidelines)
   ════════════════════════════════════════════════════════════
   Cobre os critérios de sucesso aplicáveis a uma SPA:
   - 1.4.3 Contrast (Minimum)            AA  → cores com ratio ≥4.5
   - 1.4.11 Non-text Contrast            AA  → bordas e foco ≥3:1
   - 1.4.12 Text Spacing                 AA  → relaxa quando user altera
   - 2.1.1 Keyboard                      A   → tudo navegável
   - 2.4.7 Focus Visible                 AA  → focus-ring sempre visível
   - 2.4.11 Focus Not Obscured (Min)     AA  → sticky elements respeitam foco
   - 2.5.5 Target Size (Minimum)         AAA → alvos clique ≥24px (legais: ≥44px)
   - 3.2.2 On Input                      A   → sem mudanças inesperadas
   - 3.3.8 Accessible Authentication     AA  → respeita autofill, paste
   ════════════════════════════════════════════════════════════ */

/* ── 1. FOCUS VISIBLE — anel azul de alto contraste em TUDO ── */
:focus-visible {
  outline: 3px solid #f97316 !important;     /* laranja vs azul cobalto */
  outline-offset: 2px !important;
  border-radius: 4px;
}
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[role="button"]:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid #f97316 !important;
  outline-offset: 2px !important;
  box-shadow: 0 0 0 5px rgba(249,115,22,.25) !important;
}
/* Login (fundo escuro) — usa amarelo claro para contraste */
#login-screen :focus-visible {
  outline-color: #fbbf24 !important;
  box-shadow: 0 0 0 5px rgba(251,191,36,.3) !important;
}

/* ── 2. TARGET SIZE — alvos de clique ≥44×44px (mobile-friendly) ── */
@media (pointer: coarse) {
  button, .btn, [role="button"], a.nav-item, .topbar-icon-btn {
    min-height: 44px;
    min-width: 44px;
  }
}

/* ── 3. SKIP TO CONTENT — visível quando recebe foco ── */
.skip-to-content {
  position: absolute;
  top: -100px;
  left: 0;
  background: #0f4279;
  color: #fff;
  padding: 12px 22px;
  z-index: 9999;
  border-radius: 0 0 8px 0;
  font-weight: 600;
  text-decoration: none;
}
.skip-to-content:focus {
  top: 0;
  outline: 3px solid #fbbf24;
}

/* ── 4. PREFERS-REDUCED-MOTION ── */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* ── 5. HIGH CONTRAST — Windows / forced-colors ── */
@media (forced-colors: active) {
  .btn, button, .card, .modal-box {
    border: 1px solid CanvasText;
  }
  :focus-visible {
    outline: 3px solid Highlight !important;
  }
}

/* ── 6. ARIA roles — estado visual coerente ── */
[aria-invalid="true"] {
  border-color: #dc2626 !important;
  box-shadow: 0 0 0 3px rgba(220,38,38,.15) !important;
}
[aria-current="page"], [aria-current="true"] {
  font-weight: 700;
}
[aria-busy="true"] {
  cursor: progress;
  opacity: 0.7;
}
[aria-disabled="true"], [disabled] {
  cursor: not-allowed;
  opacity: 0.55;
}

/* ── 7. SCREEN READER ONLY (visualmente escondido, mas lido) ── */
.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* ── 8. CONTRASTES — ajusta cinzas com ratio insuficiente ── */
.text-muted, .muted, [class*="muted"] {
  color: #4a6378 !important;   /* ratio 7:1 em fundo branco (era 6b8aa3 ≈ 4.1:1) */
}

/* ── 9. LINKS — sublinhado preservado por defeito ── */
main a:not(.btn):not(.nav-item):not([class*="btn-"]) {
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-thickness: 1.5px;
}