/* =============================================================================
   ADA Compliance Fix — Frontend Styles
   Covers: focus indicators, sticky header offset, skip link
   ============================================================================= */

/* ── Skip navigation link ───────────────────────────────────────────────────── */

.ada-skip-link {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
}

.ada-skip-link:focus {
  position: fixed;
  top: 0;
  left: 0;
  width: auto;
  height: auto;
  padding: 12px 24px;
  background: #000000;
  color: #ffffff;
  font-size: 16px;
  font-weight: bold;
  z-index: 999999;
  text-decoration: none;
  outline: 3px solid #ffffff;
  outline-offset: 2px;
}

/* ── Visible focus indicators ───────────────────────────────────────────────── */
/* WCAG 2.1 SC 2.4.7 requires a visible focus indicator on all interactive elements.
   Many themes suppress the default browser outline — this restores it universally. */

*:focus,
*:focus-visible {
  outline: 3px solid #005fcc !important;
  outline-offset: 2px !important;
}

/* Divi buttons and links */
.et_pb_button:focus,
.et_pb_button:focus-visible,
.et_pb_menu .et_mobile_menu a:focus,
.et_pb_menu .et_mobile_menu a:focus-visible {
  outline: 3px solid #005fcc !important;
  outline-offset: 3px !important;
}

/* Elementor */
.elementor-button:focus,
.elementor-button:focus-visible {
  outline: 3px solid #005fcc !important;
  outline-offset: 3px !important;
}

/* Cornerstone */
.x-btn:focus,
.x-btn:focus-visible {
  outline: 3px solid #005fcc !important;
  outline-offset: 3px !important;
}

/* Thrive */
.tve-btn:focus,
.tve-btn:focus-visible {
  outline: 3px solid #005fcc !important;
  outline-offset: 3px !important;
}

/* ── Sticky header offset ───────────────────────────────────────────────────── */
/* WCAG 2.4.11: When a sticky header is present, focused elements must not be
   obscured by it. scroll-padding-top reserves space equal to the header height.
   Divi's sticky header is typically 100-130px. Using 140px covers most cases.
   Site-specific override: add a more precise value in the theme's custom CSS. */

html {
  scroll-padding-top: 140px;
}

/* ── Divi tab inactive text contrast ────────────────────────────────────────── */
/* WCAG 1.4.3: inactive tab text uses rgba(24,71,143,0.5) → ~rgb(140,163,199) on
   white which is only 1.7:1. Force full-opacity dark blue = 8:1 on white. */

.et_pb_tabs_controls li a,
.et_pb_tabs_controls [role="tab"] a {
  color: #18478f !important;
  opacity: 1 !important;
}

/* ── Divi button contrast ────────────────────────────────────────────────────── */
/* White text on #3d89df = 3.60:1 (fails 4.5:1). Darken bg to #1565c0 → 5.83:1.
   Note: Divi's dynamic !important CSS overrides this — JS fixColorContrast() is
   the real fix; this CSS is a fallback for cached/static pages. */

.et_pb_button {
  background-color: #1565c0 !important;
  color: #ffffff !important;
}

/* ── Secondary nav link contrast ────────────────────────────────────────────── */
/* #et-secondary-nav uses brand blue #3d89df on white = 3.59:1 (fails 4.5:1).
   #005fcc on white = 6.02:1, passes AA. */

#et-secondary-nav a {
  color: #005fcc !important;
}

/* ── Testimonials section — white text on #3d89df = 3.59:1 (fails 4.5:1) ──────── */
/* Divi generates .et_pb_section_3 with background-color:#3d89df. White text on
   that mid-tone blue fails AA. Darken to #1565c0 → white text = 5.83:1, passes. */

.et_pb_section_3 {
  background-color: #1565c0 !important;
}

/* ── Placeholder text contrast ──────────────────────────────────────────────── */
/* WCAG 1.4.3: browser default placeholder (#9e9e9e on white = 2.85:1) fails.
   #767676 on white = 4.54:1, the minimum passing gray. */

input::placeholder,
textarea::placeholder {
  color: #767676 !important;
  opacity: 1 !important;
}

/* ── Prevent focus trap on hidden Slick slides ──────────────────────────────── */
/* Slick sets aria-hidden="true" on off-screen slides. Hide the entire slide
   so axe doesn't evaluate color contrast of visually-hidden text inside them. */

.slick-slide[aria-hidden="true"] {
  visibility: hidden;
}

.slick-slide[aria-hidden="true"].slick-current,
.slick-slide.slick-active {
  visibility: visible;
}

.slick-slide[aria-hidden="true"]:not(.slick-current) {
  pointer-events: none;
}

/* ── Reduce motion for users who prefer it ──────────────────────────────────── */
/* WCAG 2.3.3: Animations can trigger vestibular disorders. */

@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;
  }
}