/* Estilos para elementos ARIA y accesibilidad */

/* Elementos con aria-hidden no deben ser focusables */
[aria-hidden="true"] {
    pointer-events: none;
}

/* Mejorar visibilidad de elementos con aria-expanded */
[aria-expanded="true"] {
    background-color: rgba(245, 158, 11, 0.1);
}

/* Estilos para elementos con aria-invalid */
[aria-invalid="true"] {
    border-color: #ef4444;
    box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.2);
}

/* Estilos para elementos requeridos */
[aria-required="true"]::after {
    content: " *";
    color: #ef4444;
    font-weight: bold;
}

/* Mejorar contraste para elementos focusados con ARIA */
[role="button"]:focus,
[role="link"]:focus {
    outline: 3px solid #f59e0b;
    outline-offset: 2px;
    background-color: rgba(245, 158, 11, 0.1);
}

/* Landmarks ARIA */
[role="main"] {
    scroll-margin-top: 2rem;
}

[role="navigation"] {
    position: relative;
}

[role="banner"] {
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

[role="contentinfo"] {
    border-top: 1px solid rgba(0, 0, 0, 0.1);
}

/* Tooltips y descripciones */
[aria-describedby] {
    position: relative;
}

/* Estados de elementos interactivos */
[aria-expanded="false"] .dropdown-content,
[aria-expanded="false"] .menu-content {
    display: none;
}

[aria-expanded="true"] .dropdown-content,
[aria-expanded="true"] .menu-content {
    display: block;
}

/* Mejorar accesibilidad de modales */
[role="dialog"] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1000;
    background: white;
    border: 2px solid #f59e0b;
    border-radius: 8px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3);
}

[role="dialog"]:focus {
    outline: none;
}

/* Overlay para modales */
.modal-overlay[aria-hidden="false"] {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 999;
}

/* Mejorar accesibilidad de menús */
[role="menu"] {
    list-style: none;
    padding: 0;
    margin: 0;
}

[role="menuitem"] {
    display: block;
    padding: 0.5rem 1rem;
    text-decoration: none;
    color: inherit;
}

[role="menuitem"]:focus,
[role="menuitem"]:hover {
    background-color: rgba(245, 158, 11, 0.1);
    outline: 2px solid #f59e0b;
    outline-offset: -2px;
}

/* Estados de carga con ARIA */
[aria-busy="true"] {
    opacity: 0.6;
    pointer-events: none;
    position: relative;
}

[aria-busy="true"]::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    margin: -10px 0 0 -10px;
    border: 2px solid #f59e0b;
    border-radius: 50%;
    border-top-color: transparent;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

/* Respeta preferencias de movimiento reducido */
@media (prefers-reduced-motion: reduce) {
    [aria-busy="true"]::after {
        animation: none;
    }
}