/* Accessibility preferences (set in the Accessibility Center). Applied as body
   classes via the `a11y_class` context variable. Scoped so they only activate
   when the owner opts in. */

.a11y-large-text { font-size: 112.5%; }
.a11y-large-text .input,
.a11y-large-text .btn { font-size: 1rem; }

.a11y-contrast {
  --glass-border: rgba(255, 255, 255, 0.45);
}
.a11y-contrast .t-muted { color: #d7dde6 !important; }
.a11y-contrast .data-table th,
.a11y-contrast .data-table td { border-color: rgba(255, 255, 255, 0.35) !important; }
.a11y-contrast a { text-decoration: underline; }
.a11y-contrast .glass-panel { outline: 1px solid rgba(255, 255, 255, 0.25); }

.a11y-reduced-motion * {
  animation-duration: 0.001ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: 0.001ms !important;
  scroll-behavior: auto !important;
}

.a11y-dyslexia-font {
  letter-spacing: 0.03em;
  word-spacing: 0.12em;
  line-height: 1.7;
}
.a11y-dyslexia-font p,
.a11y-dyslexia-font .help-body { max-width: 70ch; }

/* Always-on baseline: visible keyboard focus for every interactive element. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 2px solid #8ab4ff;
  outline-offset: 2px;
}

/* Always-on baseline: form field text is white on the dark theme so what the
   user types is readable. Dropdown options stay dark because they render on the
   OS-controlled white menu. */
.input,
input.input,
select.input,
textarea.input,
input[type="text"],
input[type="search"],
input[type="number"],
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="url"],
input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"],
select,
textarea {
  color: #ffffff !important;
}
.input::placeholder,
input::placeholder,
textarea::placeholder {
  color: rgba(255, 255, 255, 0.55) !important;
}
select option,
select optgroup {
  color: #111111;
}
