/*
 * Accessibility overrides
 * Loaded after app.css so these win without editing the compiled Tailwind
 * output. Keep this file limited to site-wide WCAG fixes (color contrast,
 * focus, etc.) that cannot be expressed per-template.
 */

/* --------------------------------------------------------------------------
   Contrast-fixed primary (WCAG 1.4.3)
   The brand primary (#3073F1) only reaches 4.33:1 on white, just under the
   4.5:1 minimum for normal-size text. This darkened variant (#256AE6,
   ≈4.9:1 on white) preserves the hue while meeting contrast. Defined once
   here and reused by any site-wide a11y rule that needs it.
     --color-primary-contrast          hex form (backgrounds, borders)
     --color-primary-contrast-rgb      space-separated channels for
                                       Tailwind's `rgb(... / <opacity>)` form
   -------------------------------------------------------------------------- */
:root {
  --color-primary-contrast: #256ae6;
  --color-primary-contrast-rgb: 37 106 230;
}

/* Darken *text* usage of the primary. Background/fill uses of `bg-primary`
   are intentionally left unchanged. */
.text-primary {
  --tw-text-opacity: 1;
  color: rgb(var(--color-primary-contrast-rgb) / var(--tw-text-opacity));
}

/* Dark mode keeps its own lighter primary (defined in dark-mode.css). */

/* --------------------------------------------------------------------------
   Skip navigation link (WCAG 2.4.1 — Bypass Blocks)
   Visually hidden until it receives keyboard focus, then it appears at the
   top-left so keyboard/AT users can jump past the sidebar + topbar straight
   to the main content.
   -------------------------------------------------------------------------- */
.skip-link {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2000;
  padding: 0.75rem 1rem;
  background: var(--color-primary-contrast);
  color: #ffffff;
  font-weight: 600;
  border-radius: 0 0 0.375rem 0;
  transform: translateY(-150%);
  transition: transform 0.15s ease-in-out;
}

.skip-link:focus {
  transform: translateY(0);
  outline: 2px solid #ffffff;
  outline-offset: 2px;
}

/* Respect users who prefer reduced motion — appear instantly. */
@media (prefers-reduced-motion: reduce) {
  .skip-link {
    transition: none;
  }
}