/* =========================================================
   CECATI 106 - Modo de Accesibilidad
   Widget flotante (abajo-izquierda) + temas oscuro y alto
   contraste + escalado de texto. Pensado para inclusión
   (alumnos CAED). No afecta a #chat-widget ni a sí mismo.
   ========================================================= */

/* ---------- Widget ---------- */
#a11y-widget {
    position: fixed;
    left: 22px;
    bottom: 25px;
    z-index: 1200;
    font-family: 'Montserrat', sans-serif;
}

.a11y-fab {
    width: 56px;
    height: 56px;
    padding: 0;
    border-radius: 50%;
    border: 2px solid #ffffff;
    background: #15557b;
    color: #ffffff;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.32);
    transition: transform 0.25s, box-shadow 0.25s;
}

.a11y-fab:hover {
    transform: scale(1.08);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.4);
}

.a11y-fab i {
    font-size: 26px;
}

.a11y-panel {
    position: absolute;
    bottom: 70px;
    left: 0;
    width: 252px;
    background: #ffffff;
    color: #1f2937;
    border-radius: 14px;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.28);
    padding: 16px;
    border: 1px solid #e5e7eb;
}

.a11y-panel[hidden] {
    display: none;
}

.a11y-panel-head {
    font-weight: 700;
    color: #15557b;
    margin-bottom: 14px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 1rem;
}

.a11y-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px;
    font-size: 0.9rem;
    font-weight: 600;
    color: #1f2937;
}

.a11y-font-btns {
    display: flex;
    gap: 6px;
}

.a11y-font-btns button {
    width: 34px;
    height: 34px;
    border-radius: 8px;
    border: 1px solid #cbd5e1;
    background: #f8fafc;
    cursor: pointer;
    font-weight: 800;
    color: #15557b;
    font-family: inherit;
    transition: all 0.2s;
}

.a11y-font-btns button:hover {
    background: #15557b;
    color: #ffffff;
}

.a11y-toggle,
.a11y-reset {
    width: 100%;
    text-align: left;
    padding: 11px 14px;
    border-radius: 10px;
    border: 1px solid #e5e7eb;
    background: #f8fafc;
    cursor: pointer;
    font-family: inherit;
    font-size: 0.92rem;
    font-weight: 600;
    color: #1f2937;
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
    transition: all 0.2s;
}

.a11y-toggle:hover,
.a11y-reset:hover {
    background: #eef2f7;
}

.a11y-toggle[aria-pressed="true"] {
    background: #15557b;
    color: #ffffff;
    border-color: #15557b;
}

.a11y-reset {
    color: #b91c1c;
    margin-bottom: 0;
    justify-content: center;
}

@media (max-width: 600px) {
    #a11y-widget { left: 16px; bottom: 18px; }
    .a11y-fab { width: 50px; height: 50px; }
    .a11y-fab i { font-size: 22px; }
}

/* =========================================================
   MODO OSCURO  (body.a11y-dark)
   ========================================================= */
body.a11y-dark { background: #121212; color: #e7e7e7; }

body.a11y-dark .bg-light { background: #181818; }
body.a11y-dark .top-bar { background: #181818; }
body.a11y-dark .top-phone,
body.a11y-dark .top-email { color: #d8d8d8; }

body.a11y-dark .content-card,
body.a11y-dark .download-card,
body.a11y-dark .step-card,
body.a11y-dark .req-card,
body.a11y-dark .location-card,
body.a11y-dark .quiz-card {
    background: #1e1e1e;
    color: #e7e7e7;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.55);
}

body.a11y-dark .address-info { background: #161616; }
body.a11y-dark .section-header h2 { color: #ff5a6e; }

body.a11y-dark .lead,
body.a11y-dark .step-content p,
body.a11y-dark .download-card p,
body.a11y-dark .quiz-intro p,
body.a11y-dark .quiz-result p,
body.a11y-dark .content-card .lead { color: #c2c2c2; }

body.a11y-dark .step-content h3,
body.a11y-dark .download-card h3,
body.a11y-dark .address-info h3,
body.a11y-dark .quiz-question { color: #ffffff; }

body.a11y-dark .hero-content h1 { color: #ffffff; }
body.a11y-dark .hero-content .highlight-text { color: var(--accent-gold); }
body.a11y-dark .announcement-box { background: #2a2412; color: #f0e6c8; }

body.a11y-dark .quiz-progress { background: #333333; }
body.a11y-dark .quiz-option { background: #262626; color: #e7e7e7; border-color: #3a3a3a; }
body.a11y-dark .quiz-option:hover { background: #33211f; border-color: var(--primary-red); }
body.a11y-dark .check-list li,
body.a11y-dark .step-list li { border-color: #333333; }

/* =========================================================
   ALTO CONTRASTE  (body.a11y-contrast)
   Negro / blanco / amarillo. Ámbito acotado a contenido.
   ========================================================= */
body.a11y-contrast { background: #000000 !important; }

body.a11y-contrast .top-bar,
body.a11y-contrast .navbar,
body.a11y-contrast .bg-light,
body.a11y-contrast main,
body.a11y-contrast .nav-links,
body.a11y-contrast #vinculacion,
body.a11y-contrast #vinculacion .news-article-card,
body.a11y-contrast .main-footer { background: #000000 !important; }

body.a11y-contrast .navbar { border-bottom: 2px solid #ffffff; }

body.a11y-contrast main :is(h1, h2, h3, h4, p, li, span, strong, .lead, .quiz-step),
body.a11y-contrast .top-bar :is(span, i),
body.a11y-contrast .main-footer :is(h4, p, li, span) { color: #ffffff !important; text-shadow: none !important; }

body.a11y-contrast :is(.content-card, .download-card, .step-card, .req-card,
.location-card, .address-info, .quiz-card, .quiz-option, .feature-item,
.program-card, .announcement-box, .news-article-card) {
    background: #000000 !important;
    border: 2px solid #ffffff !important;
    box-shadow: none !important;
}

body.a11y-contrast main a:not(.btn),
body.a11y-contrast .btn-link,
body.a11y-contrast .main-footer a,
body.a11y-contrast .quiz-note a { color: #ffff00 !important; text-decoration: underline !important; }

body.a11y-contrast .nav-link { color: #ffffff !important; }
body.a11y-contrast .nav-link:hover,
body.a11y-contrast .nav-link.active { color: #ffff00 !important; }

body.a11y-contrast .btn-primary { background: #ffff00 !important; color: #000000 !important; border: 2px solid #ffffff !important; }
body.a11y-contrast .btn-secondary { background: #000000 !important; color: #ffff00 !important; border: 2px solid #ffff00 !important; }
body.a11y-contrast .nav-links a[href="#requisitos"] { background: #ffff00 !important; color: #000000 !important; border: 2px solid #ffffff; }

body.a11y-contrast :is(.badge, .quiz-result-label, .card-status, .news-badge) { background: #ffff00 !important; color: #000000 !important; }
body.a11y-contrast :is(.divider, .quiz-progress-bar) { background: #ffff00 !important; }
body.a11y-contrast .feature-item i { opacity: 1 !important; color: #ffff00 !important; }
