/* ========================================
   Colorblind Modes - CSS Variable Overrides
   Shared across all microsites and privacy policy pages
   ======================================== */

/* Normal mode (default) - no changes */
body.colorblind-normal {
    /* Uses default theme colors */
}

/* ========================================
   Protanopia (Red-blind)
   Uses blue/yellow instead of red/green
   ======================================== */

body.colorblind-protanopia {
    --primary-color: #0066cc;
    --primary-hover: #0052a3;
    --success-color: #0077b3;
    --danger-color: #cc6600;
    --warning-color: #996600;
}

[data-theme="dark"] body.colorblind-protanopia,
body.colorblind-protanopia[data-theme="dark"] {
    --primary-color: #4da6ff;
    --primary-hover: #3399ff;
    --success-color: #4dc3ff;
    --danger-color: #ff9933;
    --warning-color: #cc9933;
}

/* ========================================
   Deuteranopia (Green-blind)
   Similar to protanopia adjustments
   ======================================== */

body.colorblind-deuteranopia {
    --primary-color: #0066cc;
    --primary-hover: #0052a3;
    --success-color: #0088cc;
    --danger-color: #cc5500;
    --warning-color: #aa6600;
}

[data-theme="dark"] body.colorblind-deuteranopia,
body.colorblind-deuteranopia[data-theme="dark"] {
    --primary-color: #4da6ff;
    --primary-hover: #3399ff;
    --success-color: #4dc3ff;
    --danger-color: #ff8833;
    --warning-color: #cc9933;
}

/* ========================================
   Tritanopia (Blue-blind)
   Uses red/cyan instead of blue
   ======================================== */

body.colorblind-tritanopia {
    --primary-color: #cc3366;
    --primary-hover: #aa2850;
    --success-color: #009988;
    --danger-color: #cc3333;
    --warning-color: #cc6633;
}

[data-theme="dark"] body.colorblind-tritanopia,
body.colorblind-tritanopia[data-theme="dark"] {
    --primary-color: #ff6699;
    --primary-hover: #ff4d88;
    --success-color: #33ccbb;
    --danger-color: #ff6666;
    --warning-color: #ff9966;
}

/* ========================================
   High Contrast Mode
   Maximum readability for low vision
   ======================================== */

/* Light mode: white background, strong colors */
body.colorblind-high-contrast {
    --primary-color: #000000;
    --primary-hover: #333333;
    --success-color: #006600;
    --danger-color: #cc0000;
    --warning-color: #996600;
    --text-color: #000000;
    --text-primary: #000000;
    --text-secondary: #000000;
    --bg-color: #ffffff;
    --bg-primary: #ffffff;
    --bg-card: #ffffff;
    --bg-muted: #f0f0f0;
    --section-bg: #f0f0f0;
    --border-color: #000000;
    --border-input: #000000;
}

/* Dark mode: black background, yellow primary (WCAG pattern) */
[data-theme="dark"] body.colorblind-high-contrast,
body.colorblind-high-contrast[data-theme="dark"] {
    --primary-color: #ffff00;
    --primary-hover: #ffd700;
    --success-color: #00ff00;
    --danger-color: #ff6666;
    --warning-color: #ffa500;
    --text-color: #ffffff;
    --text-primary: #ffffff;
    --text-secondary: #ffffff;
    --bg-color: #000000;
    --bg-primary: #000000;
    --bg-card: #000000;
    --bg-muted: #1a1a1a;
    --section-bg: #1a1a1a;
    --border-color: #ffffff;
    --border-input: #ffffff;
}

/* ========================================
   High Contrast Header Adjustments
   Ensures header remains readable
   ======================================== */

body.colorblind-high-contrast .header {
    background: var(--primary-color);
    color: var(--bg-color);
}

body.colorblind-high-contrast .header a,
body.colorblind-high-contrast .header .accessibility-btn,
body.colorblind-high-contrast .header .btn-outline-light {
    color: var(--bg-color);
    border-color: var(--bg-color);
}

[data-theme="dark"] body.colorblind-high-contrast .header,
body.colorblind-high-contrast[data-theme="dark"] .header {
    background: var(--primary-color);
    color: #000000;
}

[data-theme="dark"] body.colorblind-high-contrast .header a,
body.colorblind-high-contrast[data-theme="dark"] .header a,
[data-theme="dark"] body.colorblind-high-contrast .header .accessibility-btn,
body.colorblind-high-contrast[data-theme="dark"] .header .accessibility-btn,
[data-theme="dark"] body.colorblind-high-contrast .header .btn-outline-light,
body.colorblind-high-contrast[data-theme="dark"] .header .btn-outline-light {
    color: #000000;
    border-color: #000000;
}