/* Accessibility Styles */

/* 1. Dyslexia Mode */
@font-face {
    font-family: 'OpenDyslexic';
    src: url('../fonts/OpenDyslexic-Regular.woff2') format('woff2');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}

body.dyslexic-mode {
    font-family: 'OpenDyslexic', sans-serif !important;
    line-height: 2 !important;
    letter-spacing: 0.05em !important;
    word-spacing: 0.15em !important;
}

body.dyslexic-mode h1,
body.dyslexic-mode h2,
body.dyslexic-mode h3,
body.dyslexic-mode h4,
body.dyslexic-mode p,
body.dyslexic-mode a,
body.dyslexic-mode span,
body.dyslexic-mode button {
    font-family: 'OpenDyslexic', sans-serif !important;
}

/* 2. Visual Comfort (Sepia) */
html.sepia-mode {
    filter: sepia(0.3) contrast(0.9) !important;
    /* Full Sepia Theme Overrides */
    --bg-color: #f4ecd8 !important;
    /* Warm Paper */
    --bg-gradient: #f4ecd8 !important;
    /* Hide spotlight */
    --card-bg: #eaddcf !important;
    /* Darker Paper */
    --card-hover: #e3d3c2 !important;
    --text-primary: #433422 !important;
    /* Dark Brown */
    --text-secondary: #6d5843 !important;
    --border-color: #c7b299 !important;
    --accent-color: #a67c52 !important;
    /* Leather/Bronze */
    --social-btn-bg: #eaddcf !important;
}

html.sepia-mode body {
    background-image: none !important;
}

/* 3. High Contrast */
body.high-contrast {
    --bg-color: #000000 !important;
    --bg-gradient: #000000 !important;
    --text-primary: #FFFFFF !important;
    --text-secondary: #FFFF00 !important;
    /* Yellow for secondary */
    --accent-color: #00FFFF !important;
    /* Cyan for accents */
    --card-bg: #000000 !important;
    --card-hover: #000000 !important;
    /* Prevent white hover */
    --social-btn-bg: #000000 !important;
    --border-color: #FFFFFF !important;
    background-image: none !important;
}

body.high-contrast .card {
    border: 2px solid #FFFFFF !important;
    box-shadow: none !important;
}

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

/* 4. Daltonian Filters (SVG Filters referenced by ID) */
html.protanopia {
    filter: url('#protanopia-filter');
}

html.deuteranopia {
    filter: url('#deuteranopia-filter');
}

html.tritanopia {
    filter: url('#tritanopia-filter');
}

/* 5. Low 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;
    }
}

body.low-motion *,
body.low-motion *::before,
body.low-motion *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
}

/* 6. Reading Mode (Zen) */
body.reading-mode .social-sidebar,
body.reading-mode footer,
body.reading-mode .nav-right,
body.reading-mode .logo {
    opacity: 0.1;
    transition: opacity 0.3s;
}

body.reading-mode .social-sidebar:hover,
body.reading-mode footer:hover,
body.reading-mode .nav-right:hover,
body.reading-mode .logo:hover {
    opacity: 1;
}

body.reading-mode main {
    max-width: 65ch;
    margin: 0 auto;
}

/* Zoom Variable Support */
html {
    font-size: var(--root-font-size, 16px);
}