/* ============================================================================
   Accesibilidad y responsive global — se aplica a TODAS las páginas.
   Cargada en Site.master después del resto de hojas.
   Objetivo: mejor uso en móvil, objetivos táctiles cómodos, foco visible por
   teclado y respeto a las preferencias de accesibilidad del usuario.
   ========================================================================== */

/* --- Foco visible al navegar con teclado (accesibilidad) ------------------- */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid var(--marca-primario, #1e88e5);
    outline-offset: 2px;
    border-radius: 4px;
}
a:focus-visible { text-decoration: underline; }

/* No robar el foco con el highlight táctil azul por defecto en móvil */
a, button, .btn { -webkit-tap-highlight-color: transparent; }

/* --- Objetivos táctiles y legibilidad en móvil ---------------------------- */
@media (max-width: 576px) {
    /* Botones con altura mínima cómoda para el dedo */
    .btn { min-height: 42px; }
    .btn.btn-sm, .ea-actions .btn-sm { min-height: 34px; }

    /* Evita el zoom automático de iOS al enfocar un campo (fuentes < 16px) */
    input, select, textarea, .form-control { font-size: 16px; }

    /* Títulos algo más contenidos en pantallas pequeñas */
    h1, .ea-card h1 { font-size: 1.55rem; }
    h2, .ea-card h2 { font-size: 1.3rem; }

    /* Las barras de acciones y filtros bajan a bloque para no desbordar */
    .ea-actions .btn { margin-bottom: 4px; }
}

/* --- Tablas: siempre con scroll horizontal si no caben (no rompen el layout) */
.table-responsive, .ea-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }

/* --- Respeta a quien prefiere menos movimiento ----------------------------- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}

/* --- El contenido nunca desborda horizontalmente la pantalla -------------- */
html, body { max-width: 100%; overflow-x: hidden; }
img { max-width: 100%; height: auto; }

/* --- Utilidad: enlace de "saltar al contenido" para lectores de pantalla --- */
.skip-link {
    position: absolute; left: -9999px; top: 0; z-index: 2000;
    background: var(--marca-primario, #1e88e5); color: #fff; padding: 8px 14px; border-radius: 0 0 6px 0;
}
.skip-link:focus { left: 0; }
