/**
 * WCAG 2.1 AA - Correcciones específicas para los 4 problemas reportados
 * Versión conservadora que mantiene el diseño original
 */

/* ========================================
   9.2.4.1 - SKIP LINKS Y NAVEGACIÓN POR TECLADO
   ======================================== */

/* Skip links funcionales (ocultos hasta recibir foco) */
.skip-link {
    position: absolute !important;
    left: -9999px !important;
    top: 0 !important;
    z-index: 999999 !important;
    background: #000000 !important;
    color: #ffffff !important;
    padding: 12px 16px !important;
    text-decoration: none !important;
    font-size: 14px !important;
    font-weight: bold !important;
    border-radius: 0 0 4px 0 !important;
}

.skip-link:focus {
    left: 0 !important;
    outline: 2px solid #ffffff !important;
}

/* Indicador de foco visible para navegación por teclado */
a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
[role="button"]:focus {
    outline: 2px solid #0073aa !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 1px rgba(0, 115, 170, 0.3) !important;
}

/* ========================================
   9.2.5.8 - TAMAÑO Y ESPACIADO DE ÁREAS TÁCTILES
   ======================================== */

/* Tamaños mínimos táctiles SIN romper diseño visual */
a,
button,
input[type="submit"],
input[type="button"],
.button,
.btn {
    min-height: 44px !important;
    min-width: 44px !important;
    box-sizing: border-box !important;
}

/* Formularios con tamaños accesibles */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
select,
textarea {
    min-height: 44px !important;
    box-sizing: border-box !important;
}

/* En móvil, aumentar ligeramente */
@media (max-width: 768px) {
    a, button, input, select, textarea {
        min-height: 48px !important;
    }
}

/* ========================================
   9.2.4.4 - PROPÓSITO DE ENLACES
   ======================================== */

/* Mejorar contexto de enlaces problemáticos con CSS */
a[href*="pdf"]:not(.no-context)::after,
a[href*=".pdf"]:not(.no-context)::after {
    content: " (PDF)" !important;
    font-size: 0.85em !important;
    opacity: 0.8 !important;
    font-weight: normal !important;
}

a[href*="download"]:not(.no-context)::after {
    content: " (descarga)" !important;
    font-size: 0.85em !important;
    opacity: 0.8 !important;
}

a[target="_blank"]:not(.no-context)::after {
    content: " (nueva ventana)" !important;
    font-size: 0.85em !important;
    opacity: 0.8 !important;
}

a[href^="mailto:"]:not(.no-context)::after {
    content: " (email)" !important;
    font-size: 0.85em !important;
    opacity: 0.8 !important;
}

/* ========================================
   9.1.4.3 - CONTRASTE INSUFICIENTE
   ======================================== */

/* Solo corregir elementos que sabemos que tienen problemas */
/* NO aplicar globalmente, solo donde sea necesario */

/* Placeholders con mejor legibilidad */
::placeholder {
    opacity: 0.8 !important;
    color: #666666 !important;
}

/* Textos de error más visibles */
.error,
.error-message,
[role="alert"],
.form-error {
    color: #d63384 !important;
    font-weight: 600 !important;
}

/* Textos de éxito más visibles */
.success,
.success-message,
.form-success {
    color: #198754 !important;
    font-weight: 600 !important;
}

/* ========================================
   MEJORAS ADICIONALES MÍNIMAS
   ======================================== */

/* Campos requeridos más claros */
[required]:not([type="hidden"])::before,
.required::before {
    content: "* " !important;
    color: #d63384 !important;
    font-weight: bold !important;
}

/* Labels más interactivos */
label {
    cursor: pointer !important;
}

/* Mejorar legibilidad de texto muy pequeño */
small {
    font-size: 14px !important;
    line-height: 1.4 !important;
}

/* ========================================
   MODO ALTO CONTRASTE (Respetar preferencias)
   ======================================== */

@media (prefers-contrast: high) {
    *:focus {
        outline-width: 3px !important;
        outline-color: #000000 !important;
    }
}