/* ==========================================================================
   BLOOMEOR — ACCESSIBILITY ENHANCEMENTS
   Improves keyboard navigation, screen reader support, focus visibility,
   ARIA patterns, and motion preferences.
   ========================================================================== */

/* ── Skip Link ─────────────────────────────────────────────────────────────── */
.skip-link {
  position: absolute;
  left: 16px;
  top: -60px;
  z-index: 9999;
  padding: 10px 16px;
  border-radius: 8px;
  background: var(--brand, #2454d6);
  color: #ffffff;
  font-weight: 700;
  font-size: 0.9rem;
  text-decoration: none;
  transition: top 0.2s ease;
  white-space: nowrap;
}
.skip-link:focus {
  top: 12px;
  outline: 3px solid #facc15;
  outline-offset: 2px;
}

/* ── Focus Visible — global visible focus ring ─────────────────────────────── */
:focus-visible {
  outline: 3px solid var(--brand, #2454d6);
  outline-offset: 3px;
  border-radius: 4px;
}

/* Remove outline for mouse users, keep for keyboard */
:focus:not(:focus-visible) {
  outline: none;
}

/* ── High-contrast interactive elements ─────────────────────────────────────── */
a:focus-visible,
button:focus-visible,
[role="button"]:focus-visible,
[tabindex]:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid var(--brand, #2454d6);
  outline-offset: 3px;
}

/* Dark theme focus ring in yellow for better contrast */
[data-theme="dark"] a:focus-visible,
[data-theme="dark"] button:focus-visible,
[data-theme="dark"] [role="button"]:focus-visible,
[data-theme="dark"] [tabindex]:focus-visible {
  outline-color: #facc15;
}

/* ── Screen-reader only utility ─────────────────────────────────────────────── */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Makes sr-only elements visible when focused (for skip links, etc.) */
.sr-only-focusable:focus,
.sr-only-focusable:focus-within {
  position: static;
  width: auto;
  height: auto;
  padding: inherit;
  margin: inherit;
  overflow: visible;
  clip: auto;
  white-space: normal;
}

/* ── 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;
  }

  .reveal {
    opacity: 1 !important;
    transform: none !important;
  }

  .t-stagger-line {
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
  }

  .page-skeleton {
    display: none !important;
  }

  body.is-loading {
    overflow: auto !important;
  }
}

/* ── Color contrast improvements ────────────────────────────────────────────── */
/* Ensure muted text meets WCAG AA 4.5:1 on white backgrounds */
[data-theme="light"] .muted,
[data-theme="light"] p,
[data-theme="light"] .lead {
  color: #475569; /* passes AA on white */
}

/* ── FAQ Accordion accessibility ────────────────────────────────────────────── */
.faq-button[aria-expanded="true"] .faq-icon {
  transform: rotate(45deg);
}
.faq-button[aria-expanded="false"] .faq-icon {
  transform: rotate(0deg);
}

/* ── Dialog / Modal accessibility ────────────────────────────────────────────── */
.booking-popup[hidden] {
  display: none !important;
}
.booking-popup:not([hidden]) {
  display: grid;
}

/* ── Nav mobile: ensure focus trapped in open menu ─────────────────────────── */
.nav-links a[aria-current="page"] {
  color: var(--brand);
  font-weight: 800;
}

/* ── Interactive elements minimum tap target ────────────────────────────────── */
button,
[role="button"],
a {
  min-height: 44px;
  min-width: 44px;
}

/* Allow inline links to be smaller */
p a,
.footer-column a,
.nav-links a {
  min-height: unset;
  min-width: unset;
  display: inline;
}

/* ── Loading state ────────────────────────────────────────────────────────────── */
[aria-busy="true"] {
  cursor: wait;
}

/* ── Map & interactive regions ──────────────────────────────────────────────── */
#locations-map {
  /* Map container needs focusable elements inside — Leaflet handles this */
  position: relative;
}

.location-card:focus-visible {
  outline: 3px solid var(--brand, #2454d6);
  outline-offset: 2px;
  z-index: 2;
  position: relative;
}

/* ── Testimonial slider ──────────────────────────────────────────────────────── */
[data-slide]:focus-visible {
  outline: 3px solid var(--brand, #2454d6);
  outline-offset: 3px;
}

/* ── Forced-colors / Windows High Contrast mode ─────────────────────────────── */
@media (forced-colors: active) {
  .btn-primary {
    border: 2px solid ButtonText;
  }

  .skip-link {
    background: Highlight;
    color: HighlightText;
  }

  :focus-visible {
    outline: 3px solid Highlight;
  }
}
