/* =====================================================
   Modo accesibilidad / dislexia — PsicoPro Selección
   Fuente: extraído de web/enfermeria.html (inline → módulo)
   Regla: las clases solo aplican bajo body.a11y-* (opt-in)
   ===================================================== */

/* Fuente Atkinson Hyperlegible — cargada por a11y-dyslexia.js */

/* --- Fondo crema: reduce deslumbramiento --- */
body.a11y-cream { background-color: #FFFDD0 !important; }
body.a11y-cream section.bg-white { background-color: #FFFDD0 !important; }

/* Cards glassmorphism dentro del hero: texto oscuro cuando bg crema los ilumina */
body.a11y-cream [class*="gradient"] .bg-white.bg-opacity-10,
body.a11y-cream [class*="gradient"] .bg-white.bg-opacity-10 * {
    color: #1f2937 !important;
}

/* --- Fuente Atkinson Hyperlegible + interlineado + letter-spacing --- */
body.a11y-font,
body.a11y-font * {
    font-family: 'Atkinson Hyperlegible', sans-serif !important;
    line-height: 1.8 !important;
    letter-spacing: 0.12em !important;
}

/* Móvil: reducir letter-spacing para evitar texto apretado en pantallas estrechas
   (hallazgo prueba viabilidad 14-jun-2026: iPhone 390px, texto rozaba el borde) */
@media (max-width: 430px) {
    body.a11y-font,
    body.a11y-font * {
        letter-spacing: 0.06em !important;
    }
}

/* --- Texto ampliado +15% --- */
body.text-large { font-size: 115%; }

/* El panel de accesibilidad se mantiene compacto aunque el modo esté activo */
body.a11y-font #a11y-toggle,
body.a11y-font #a11y-toggle * {
    letter-spacing: normal !important;
    line-height: 1.4 !important;
}

/* --- Botón TTS dentro de tarjetas de temario --- */
.tts-btn {
    transition: transform 0.2s ease, background-color 0.2s ease;
}
.tts-btn:hover { transform: scale(1.1); }
.tts-btn.speaking {
    background-color: #ef4444 !important;
    color: #ffffff !important;
    animation: pulse-tts 1.2s ease-in-out infinite;
}
@keyframes pulse-tts {
    0%, 100% { opacity: 1; }
    50%       { opacity: 0.6; }
}