/* ==============================================================
   a11y.css - Infinite Atom accessibility layer (IA 3.0)
   Loaded on every page. Contrast floors, focus rings, and the
   .easy-read mode for seniors / low-vision users.
   ============================================================== */

/* Contrast floor: theme.css 3.0 tokens already meet WCAG
   (--text-dim #93A1B5 is ~6.4:1 on --bg #080D18; light theme
   #4A5A6A is ~6.5:1 on #F4F3EE), so no :root override is needed.
   Keeping a dark-scoped safety net for pages that hardcode the
   old dim value. */
:root:not([data-theme="light"]) {
  --text-dim: #93A1B5;
}

/* Minimum font sizes - nothing should render below 12px */
body { font-size: 16px; line-height: 1.65; }

/* Focus rings - visible for keyboard/AT users */
:focus-visible {
  outline: 2px solid var(--accent, #2CE0C7);
  outline-offset: 3px;
  border-radius: 4px;
}
:focus:not(:focus-visible) { outline: none; }

/* Reduced motion preference */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* -- Easy Read mode ------------------------------------------- */
body.easy-read {
  font-size: 19px !important;
  line-height: 1.75 !important;
  letter-spacing: 0.02em;
}

:root:not([data-theme="light"]) body.easy-read {
  --text-dim: #AFC2D6 !important;
  --text: #E6EEF7 !important;
}

:root[data-theme="light"] body.easy-read {
  --text-dim: #3A4956 !important;
  --text: #16202B !important;
}

/* Larger headings */
body.easy-read h1 { font-size: 2.4rem !important; }
body.easy-read h2 { font-size: 1.9rem !important; }
body.easy-read h3 { font-size: 1.5rem !important; }

/* Larger body text throughout */
body.easy-read p,
body.easy-read li,
body.easy-read td,
body.easy-read span,
body.easy-read label,
body.easy-read input,
body.easy-read textarea,
body.easy-read select { font-size: 1.1rem !important; }

/* Bigger buttons and links for touch */
body.easy-read a.btn,
body.easy-read button,
body.easy-read input[type="submit"],
body.easy-read input[type="button"],
body.easy-read .nav-links a {
  min-height: 52px !important;
  padding-top: 0.85rem !important;
  padding-bottom: 0.85rem !important;
  font-size: 1rem !important;
}

/* Navigation labels */
body.easy-read .nav-links a {
  font-size: 0.98rem !important;
  letter-spacing: 0.01em !important;
}

/* Card text */
body.easy-read .ia-cat-label { font-size: 0.85rem !important; }
body.easy-read .ia-cat-card { padding: 1.5rem 1rem !important; }
body.easy-read .ia-cat-icon { font-size: 2.2rem !important; }

/* Search input */
body.easy-read .ia-search-input { font-size: 1.1rem !important; padding: 1rem !important; }
body.easy-read .ia-search-btn { font-size: 0.9rem !important; padding: 0 1.75rem !important; }

/* Trust strip */
body.easy-read .ia-trust-item strong { font-size: 0.85rem !important; }
body.easy-read .ia-trust-item span { font-size: 0.95rem !important; }

/* More line height for paragraph content */
body.easy-read .hero-desc,
body.easy-read .ia-trust-strip,
body.easy-read .ia-categories { letter-spacing: 0.01em; }

/* -- Easy Read toggle button (injected by a11y.js) ------------ */
.ia-a11y-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.45rem 0.85rem;
  background: var(--site-muted-surface, rgba(255, 255, 255, 0.04));
  border: 1px solid var(--border, rgba(44, 224, 199, 0.16));
  border-radius: 10px;
  color: var(--text-dim, #93A1B5);
  font-family: 'Inter', system-ui, sans-serif;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.01em;
  text-transform: none;
  cursor: pointer;
  transition: border-color 180ms ease, color 180ms ease, background 180ms ease, box-shadow 180ms ease;
  white-space: nowrap;
  min-height: 40px;
}
.ia-a11y-btn:hover {
  border-color: rgba(44, 224, 199, 0.4);
  color: var(--accent, #2CE0C7);
  background: rgba(44, 224, 199, 0.08);
}
.ia-a11y-btn.active {
  border-color: var(--accent, #2CE0C7);
  color: var(--accent, #2CE0C7);
  background: rgba(44, 224, 199, 0.12);
  box-shadow: 0 0 0 3px rgba(44, 224, 199, 0.1);
}
.ia-a11y-btn .ia-a11y-icon {
  font-size: 0.9rem;
  font-family: 'Sora', 'Inter', sans-serif;
  font-weight: 700;
}
