/* ==========================================================================
   theclassicals.com — Accessibility Overrides Stylesheet
   ========================================================================== */

/* 1. HIGH CONTRAST MODE (WCAG AAA Gold Standard) */
.a11y-high-contrast {
  --bg-primary: #000000 !important;
  --bg-secondary: #000000 !important;
  --bg-card: #000000 !important;
  --text-primary: #FFFF00 !important; /* Yellow text */
  --text-muted: #FFFFFF !important; /* White text for muted/secondary */
  --accent-cyan: #FFFF00 !important;
  --accent-purple: #FFFF00 !important;
  --accent-rose: #FFFF00 !important;
  --border-glass: #FFFFFF !important;
  color-scheme: dark !important;
}

.a11y-high-contrast *:not(.a11y-ignore) {
  background-color: #000000 !important;
  background-image: none !important;
  color: #FFFF00 !important;
  border-color: #FFFFFF !important;
  text-shadow: none !important;
  box-shadow: none !important;
}

/* Ensure secondary texts are readable white in high contrast */
.a11y-high-contrast p:not(.a11y-ignore),
.a11y-high-contrast span:not(.a11y-ignore),
.a11y-high-contrast li:not(.a11y-ignore),
.a11y-high-contrast td:not(.a11y-ignore) {
  color: #FFFFFF !important;
}

.a11y-high-contrast a:not(.a11y-ignore),
.a11y-high-contrast button:not(.a11y-ignore) {
  color: #FFFF00 !important;
  text-decoration: underline !important;
  outline: 2px solid #FFFF00 !important;
  outline-offset: 2px !important;
}

.a11y-high-contrast img {
  filter: contrast(150%) brightness(90%) !important;
}

/* 2. GRayscale MODE */
.a11y-grayscale {
  filter: grayscale(100%) !important;
}

/* 3. DYSLEXIA FRIENDLY READABLE FONT */
.a11y-readable-font *:not(.a11y-ignore) {
  font-family: 'Comic Sans MS', 'Comic Sans', Arial, sans-serif !important;
}

/* 4. HIGHLIGHT LINKS */
.a11y-highlight-links a:not(.a11y-ignore) {
  text-decoration: underline !important;
  text-decoration-style: solid !important;
  text-decoration-thickness: 3px !important;
  background-color: #FFFF00 !important;
  color: #000000 !important;
  font-weight: bold !important;
  outline: 2px solid #000000 !important;
  outline-offset: 1px !important;
  padding-inline: 4px !important;
  border-radius: 2px !important;
}

/* 5. LARGE CURSOR */
.a11y-large-cursor,
.a11y-large-cursor * {
  cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cpath d='M0,0 L0,46 L13,33 L26,58 L37,53 L24,28 L38,28 Z' fill='white' stroke='black' stroke-width='3'/%3E%3C/svg%3E"), auto !important;
}

/* 6. ENHANCED FOCUS INDICATOR */
.a11y-enhanced-focus :focus-visible {
  outline: 4px solid #06D6A0 !important;
  outline-offset: 4px !important;
  box-shadow: 0 0 0 6px #000000, 0 0 0 10px #06D6A0 !important;
}

/* 7. REDUCED MOTION (Stop animations and transitions) */
.a11y-stop-animations,
.a11y-stop-animations * {
  animation-duration: 0.001s !important;
  animation-delay: 0s !important;
  animation-iteration-count: 1 !important;
  transition-duration: 0.001s !important;
  transition-delay: 0s !important;
  scroll-behavior: auto !important;
}

/* 8. READING RULER GUIDE */
.a11y-reading-guide-bar {
  position: fixed;
  left: 0;
  width: 100%;
  height: 28px;
  background-color: rgba(6, 214, 160, 0.25);
  border-top: 2px dashed #06D6A0;
  border-bottom: 2px dashed #06D6A0;
  pointer-events: none;
  z-index: 2147483647; /* Set to max z-index to overlay on everything */
  display: none;
  transform: translateY(-50%);
}

.a11y-reading-guide .a11y-reading-guide-bar {
  display: block;
}

/* 9. LINE HEIGHT INCREASE */
.a11y-line-height-increased p,
.a11y-line-height-increased li,
.a11y-line-height-increased span {
  line-height: 2.0 !important;
}

/* 10. LETTER SPACING INCREASE */
.a11y-letter-spacing-increased p,
.a11y-letter-spacing-increased li,
.a11y-letter-spacing-increased span,
.a11y-letter-spacing-increased h1,
.a11y-letter-spacing-increased h2,
.a11y-letter-spacing-increased h3 {
  letter-spacing: 0.15em !important;
}
