/* Mobile Navigation Styles */
@media (max-width: 992px) {    .menu-btn {
        display: flex;
        order: 2;
        position: relative;
        z-index: 1002;
        width: 44px;
        height: 44px;
        align-items: center;
        justify-content: center;
        background: transparent;
        border: none;
        cursor: pointer;
        color: var(--color-white);
        font-size: 1.8rem;
        padding: 0;
        margin: 0;
        -webkit-tap-highlight-color: transparent;
    }

    .utility-bar {
        order: 1;
        margin-right: 1rem;
    }
    
    .nav-links {
        position: fixed;
        top: 0;
        right: -100%;
        width: 280px;
        height: 100vh;
        background: linear-gradient(135deg, #2a2a2a, #333333);
        flex-direction: column;
        padding: 80px 20px 30px;
        transition: 0.4s ease-in-out;
        overflow-y: auto;
        border-radius: 0;
        box-shadow: -5px 0 15px rgba(0,0,0,0.2);
    }
    
    .nav-links.active {
        right: 0;
    }
    
    .nav-links li {
        margin: 0.5rem 0;
        width: 100%;
        position: relative;
        z-index: 1003;
    }

    .nav-links li a {
        padding: 12px 15px;
        width: 100%;
        border-radius: 8px;
        font-size: 1.1rem;
        justify-content: flex-start;
        position: relative;
        z-index: 1003;
        display: block !important;
        text-decoration: none;
        color: var(--color-white);
        -webkit-tap-highlight-color: transparent;
    }

    /* Make dropdown links work */
    .dropdown > a {
        pointer-events: auto !important;
        cursor: pointer !important;
        display: block !important;
    }

    /* Handle dropdowns in mobile */
    .dropdown-menu {
        display: none !important;
    }

    .dropdown > a {
        pointer-events: auto !important;
    }

    .dropdown-icon-wrapper,
    .dropdown-toggle,
    .dropdown i.fa-chevron-down {
        display: none !important;
    }

    /* Ensure links are clickable */
    .nav-links li a {
        pointer-events: auto;
        cursor: pointer;
    }

    /* Mejorar contraste y legibilidad */
    .nav-links li + li {
        border-top: 1px solid rgba(255, 255, 255, 0.08);
    }

    /* Hide search on mobile */
    .search-form {
        display: none;
    }

    /* Prevent body scroll when menu is open */
    body.menu-open {
        overflow: hidden;
        position: fixed;
        width: 100%;
    }

    /* Chatbot visibility */
    .tech-support {
        display: none !important;
    }
}

/* Extra small devices */
@media (max-width: 576px) {
    .navbar {
        padding: 1rem;
    }

    .logo h1 {
        font-size: 1.2rem;
    }

    .nav-links a {
        font-size: 1rem;
    }
}

/* Touch-specific improvements */
@media (hover: none) {
    .nav-links a:hover {
        background: none;
    }

    .nav-links a:active {
        background: linear-gradient(135deg, rgba(255,208,224,0.2), rgba(147,112,219,0.2));
    }
}