/* Estilos adicionales para el botón de cierre del menú móvil compartido */

.close-menu {
    display: none;
    position: absolute;
    top: 20px;
    right: 20px;
    background: none;
    border: none;
    color: var(--light, #ffffff);
    cursor: pointer;
    padding: 10px;
    z-index: 1001;
}

@media (max-width: 992px) {
    /* El botón solo se muestra cuando el menú está activo en móvil */
    .nav-links.show .close-menu {
        display: block;
    }

    /* Asegurar que nav-links tenga posición relativa para el botón absoluto */
    .nav-links {
        position: fixed;
        right: -100%;
        top: 0;
        height: 100vh;
        width: 250px;
        background: var(--dark, #1a1a1a);
        flex-direction: column;
        padding: 80px 20px;
        transition: 0.4s;
        z-index: 1000;
    }

    .nav-links.show {
        right: 0;
    }

    /* Mejora de área táctil en menú móvil */
    .nav-links li {
        width: 100%;
        display: block;
    }

    .nav-links a {
        display: block;
        width: 100%;
        padding: 15px 0; /* Aumenta el área de clic vertical */
    }
}