/* === ACCESSIBILITY WIDGET === */
.a11y-toggle {
    position: fixed;
    left: 0;
    bottom: 140px;
    width: 44px;
    height: 44px;
    background: rgba(26,26,46,0.95);
    border: 2px solid var(--border, #333);
    border-left: none;
    border-radius: 0 10px 10px 0;
    color: #e0e0e0;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1050;
    transition: all 0.3s ease;
    box-shadow: 2px 2px 10px rgba(0,0,0,0.3);
    font-size: 1.2rem;
    padding: 0;
}
.a11y-toggle:hover {
    background: rgba(40,40,70,0.98);
    border-color: var(--secondary, #00d4ff);
    color: var(--secondary, #00d4ff);
}
.a11y-toggle svg { width: 22px; height: 22px; fill: currentColor; }

.a11y-panel {
    position: fixed;
    left: -320px;
    bottom: 80px;
    width: 300px;
    max-height: 80vh;
    background: rgba(26,26,46,0.98);
    border: 2px solid var(--border, #333);
    border-radius: 14px;
    z-index: 1051;
    box-shadow: 4px 4px 30px rgba(0,0,0,0.5);
    transition: left 0.3s ease;
    overflow-y: auto;
    padding: 0;
}
.a11y-panel.open { left: 10px; }

.a11y-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 18px;
    border-bottom: 1px solid var(--border, #333);
    position: sticky;
    top: 0;
    background: rgba(26,26,46,0.98);
    z-index: 1;
}
.a11y-panel-header h3 {
    font-family: 'Orbitron', sans-serif;
    font-size: 0.85rem;
    color: var(--secondary, #00d4ff);
    margin: 0;
    letter-spacing: 1px;
    text-transform: uppercase;
}
.a11y-panel-close {
    background: none;
    border: none;
    color: var(--text-muted, #9a9a9a);
    cursor: pointer;
    font-size: 1.2rem;
    padding: 4px;
    line-height: 1;
    transition: color 0.2s;
}
.a11y-panel-close:hover { color: var(--primary, #ff4444); }

.a11y-section {
    padding: 14px 18px;
    border-bottom: 1px solid rgba(51,51,51,0.5);
}
.a11y-section:last-child { border-bottom: none; }
.a11y-section-title {
    font-size: 0.75rem;
    color: var(--text-muted, #9a9a9a);
    text-transform: uppercase;
    letter-spacing: 1px;
    margin-bottom: 10px;
    font-weight: 600;
}

.a11y-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 0;
}
.a11y-option-label {
    font-size: 0.9rem;
    color: #e0e0e0;
    font-weight: 600;
}

/* Toggle switch */
.a11y-switch {
    position: relative;
    width: 44px;
    height: 24px;
    flex-shrink: 0;
}
.a11y-switch input {
    opacity: 0;
    width: 0;
    height: 0;
    position: absolute;
}
.a11y-switch-slider {
    position: absolute;
    inset: 0;
    background: rgba(255,255,255,0.1);
    border-radius: 24px;
    cursor: pointer;
    transition: all 0.3s;
    border: 1px solid rgba(255,255,255,0.15);
}
.a11y-switch-slider::before {
    content: '';
    position: absolute;
    width: 18px;
    height: 18px;
    left: 2px;
    bottom: 2px;
    background: #e0e0e0;
    border-radius: 50%;
    transition: transform 0.3s;
}
.a11y-switch input:checked + .a11y-switch-slider {
    background: var(--secondary, #00d4ff);
    border-color: var(--secondary, #00d4ff);
}
.a11y-switch input:checked + .a11y-switch-slider::before {
    transform: translateX(20px);
    background: #fff;
}
.a11y-switch input:focus-visible + .a11y-switch-slider {
    outline: 2px solid var(--secondary, #00d4ff);
    outline-offset: 2px;
}

/* Font size buttons */
.a11y-font-btns {
    display: flex;
    gap: 6px;
}
.a11y-font-btn {
    background: rgba(255,255,255,0.06);
    border: 1px solid var(--border, #333);
    color: #e0e0e0;
    width: 36px;
    height: 36px;
    border-radius: 8px;
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: 700;
    font-family: 'Rajdhani', sans-serif;
    transition: all 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
}
.a11y-font-btn:hover { border-color: var(--secondary, #00d4ff); color: var(--secondary, #00d4ff); }
.a11y-font-btn.active { background: var(--secondary, #00d4ff); color: #000; border-color: var(--secondary, #00d4ff); font-weight: 900; }

.a11y-reset-btn {
    width: 100%;
    padding: 10px;
    background: rgba(255,68,68,0.1);
    border: 1px solid rgba(255,68,68,0.3);
    color: var(--primary, #ff4444);
    border-radius: 8px;
    cursor: pointer;
    font-size: 0.85rem;
    font-weight: 600;
    font-family: 'Rajdhani', sans-serif;
    transition: all 0.2s;
    margin-top: 4px;
}
.a11y-reset-btn:hover { background: rgba(255,68,68,0.2); border-color: var(--primary, #ff4444); }

/* === ACCESSIBILITY BODY CLASSES === */
body.a11y-large-text { font-size: 1.15rem; }
body.a11y-larger-text { font-size: 1.3rem; }
body.a11y-high-contrast {
    --bg-dark: #000;
    --bg-card: #111;
    --bg-card-hover: #1a1a1a;
    --text: #fff;
    --text-muted: #ccc;
    --border: #666;
}
body.a11y-dyslexia * {
    font-family: 'OpenDyslexic', 'Comic Sans MS', 'Rajdhani', sans-serif !important;
    letter-spacing: 0.05em;
    word-spacing: 0.1em;
}
body.a11y-no-animations *, body.a11y-no-animations *::before, body.a11y-no-animations *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
}
body.a11y-underline-links a { text-decoration: underline !important; }
body.a11y-big-cursor, body.a11y-big-cursor * { cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cpath d='M4 4l20 8-8 4-4 8z' fill='%23fff' stroke='%23000' stroke-width='2'/%3E%3C/svg%3E") 4 4, auto !important; }
body.a11y-line-height { line-height: 2 !important; }
body.a11y-line-height p, body.a11y-line-height li, body.a11y-line-height td { line-height: 2 !important; }

@media (max-width: 768px) {
    .a11y-toggle { bottom: 90px; }
    .a11y-panel { bottom: 70px; width: 280px; }
}
