/* =====================================================================
   Bamboo Home Support — Accessibility Enhancements
   WCAG 2.2 AA compliance additions
   ===================================================================== */

/* ─── Focus indicators ──────────────────────────────────────────────── */
:focus-visible {
  outline: 3px solid #2aa134;
  outline-offset: 3px;
  border-radius: 3px;
}

/* Ensure links have visible focus */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid #2aa134;
  outline-offset: 3px;
}

/* Remove default outline only when :focus-visible is supported */
*:focus:not(:focus-visible) { outline: none; }

/* ─── High Contrast Mode ─────────────────────────────────────────────── */
body.high-contrast {
  --clr-green:        #00aa00;
  --clr-green-dark:   #007700;
  --clr-green-light:  #ccffcc;
  --clr-purple:       #9900cc;
  --clr-purple-dark:  #660099;
  --clr-text:         #000000;
  --clr-text-muted:   #333333;
  --clr-bg:           #ffffff;
  --clr-border:       #000000;
  background: #fff;
  color: #000;
}

body.high-contrast .service-card,
body.high-contrast .blog-card,
body.high-contrast .why-card,
body.high-contrast .team-card {
  border: 2px solid #000;
}

body.high-contrast a { text-decoration: underline; }

body.high-contrast .btn-primary {
  background: #000;
  color: #fff;
  border: 2px solid #000;
}

/* ─── 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;
  }
}

/* ─── Large Text Mode ─────────────────────────────────────────────────── */
body.text-large { font-size: 1.2rem; }
body.text-large .form-label,
body.text-large .dropdown-item,
body.text-large .nav-link { font-size: 1.1rem; }

body.text-xlarge { font-size: 1.4rem; }

/* ─── Screen reader only ─────────────────────────────────────────────── */
.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;
}

/* ─── Accessible dropdown menus ─────────────────────────────────────── */
.navbar-nav .dropdown-menu[aria-hidden="true"] {
  display: none;
}

/* Keyboard accessible dropdown */
.navbar-nav .dropdown:focus-within .dropdown-menu {
  display: block;
  animation: dropIn .2s ease;
}

/* ─── Error message roles ────────────────────────────────────────────── */
[role="alert"] {
  padding: 1rem;
  border-radius: .5rem;
  margin-bottom: 1rem;
}

/* ─── Visible error summary ──────────────────────────────────────────── */
.error-summary {
  background: #fef2f2;
  border: 2px solid #dc3545;
  border-radius: .5rem;
  padding: 1.25rem 1.5rem;
  margin-bottom: 1.5rem;
}

.error-summary h2 {
  font-size: 1rem;
  color: #b91c1c;
  margin-bottom: .75rem;
}

.error-summary ul {
  margin: 0;
  padding-left: 1.25rem;
  color: #b91c1c;
  font-size: .9rem;
}

.error-summary a {
  color: #b91c1c;
  font-weight: 600;
  text-decoration: underline;
}

/* ─── Form field errors ──────────────────────────────────────────────── */
.field-error {
  color: #dc3545;
  font-size: .825rem;
  margin-top: .35rem;
  display: flex;
  align-items: center;
  gap: .35rem;
}

/* ─── Colour contrast helpers ────────────────────────────────────────── */
/* Ensure minimum 4.5:1 contrast ratio for small text */
.text-muted { color: #5a6472 !important; } /* #5a6472 on white = 5.3:1 */

/* ─── Keyboard navigation ────────────────────────────────────────────── */
/* Ensure all interactive elements are reachable by keyboard */
button, [role="button"] { cursor: pointer; }

/* ─── Print accessibility ────────────────────────────────────────────── */
@media print {
  .sr-only { display: none; }
  abbr[title]::after { content: " (" attr(title) ")"; }
}