/* MOBILE MENU - NOIR NETWORKX EVENT */
/* Ce fichier transforme le menu mobile en NOIR pour correspondre au design NetworkX Event */
/* Charge en DERNIER pour override tous les autres CSS */

@media (max-width: 768px) {
    /* Container principal - Backdrop très sombre */
    .mega-mobile-nav {
        background: rgba(0, 0, 0, 0.85) !important;
        backdrop-filter: blur(10px) !important;
    }

    /* Panel interne - NOIR ABSOLU NetworkX */
    .mega-mobile-inner,
    .mega-mobile-nav .mega-mobile-inner,
    nav .mega-mobile-inner,
    #mega-mobile-nav .mega-mobile-inner {
        background: #000000 !important;
        background-color: #000000 !important;
    }

    /* Navigation content - NOIR */
    .mobile-nav-content,
    .mega-mobile-nav .mobile-nav-content {
        background: #000000 !important;
        background-color: #000000 !important;
    }

    /* Sections submenu - NOIR LÉGER */
    .mobile-submenu-section,
    .mega-mobile-submenu {
        background: #1a1a1a !important;
        background-color: #1a1a1a !important;
    }

    /* Footer menu - NOIR LÉGER */
    .mobile-menu-footer {
        background: #1a1a1a !important;
        background-color: #1a1a1a !important;
    }

    /* Items menu - NOIR avec hover cyan transparent */
    .mega-mobile-item {
        background: #000000 !important;
    }

    .mega-mobile-trigger:hover,
    .mega-mobile-link:hover {
        background: rgba(0, 185, 249, 0.08) !important;
    }

    .mega-mobile-trigger:active,
    .mega-mobile-link:active {
        background: rgba(0, 185, 249, 0.15) !important;
    }

    /* Textes - BLANC pour contraste sur noir */
    .mega-mobile-trigger,
    .mega-mobile-link,
    .mobile-submenu-section h4,
    .mobile-submenu-section a,
    .mobile-menu-footer,
    .mobile-menu-footer p {
        color: #ffffff !important;
    }

    /* Textes secondaires - Blanc 80% */
    .mobile-arrow,
    .mobile-menu-footer {
        color: rgba(255, 255, 255, 0.8) !important;
    }

    /* Liens submenu - blanc sur noir léger */
    .mobile-submenu-section a {
        color: rgba(255, 255, 255, 0.9) !important;
    }

    .mobile-submenu-section a:hover,
    .mobile-submenu-section a:active {
        background: linear-gradient(135deg, rgba(0, 185, 249, 0.15) 0%, rgba(183, 146, 252, 0.1) 100%) !important;
        color: #00b9f9 !important;
    }

    /* Header du menu - Gradient NetworkX (PRESERVE) */
    .mobile-menu-header {
        background: linear-gradient(135deg, #00b9f9 0%, #b792fc 100%) !important;
        color: white !important;
    }

    /* CTA Contact - Gradient NetworkX (PRESERVE) */
    .mega-mobile-cta {
        background: linear-gradient(135deg, #00b9f9 0%, #b792fc 100%) !important;
        color: white !important;
    }

    /* Bouton close - Blanc sur gradient (PRESERVE) */
    .mobile-menu-close {
        background: rgba(255, 255, 255, 0.2) !important;
        color: white !important;
    }

    /* Section headers - Cyan NetworkX (PRESERVE) */
    .mobile-submenu-section h4 {
        color: #00b9f9 !important;
    }

    /* Bordures - Cyan transparent NetworkX */
    .mega-mobile-item {
        border-bottom: 1px solid rgba(0, 185, 249, 0.15) !important;
    }

    .mega-mobile-item.active .mega-mobile-submenu {
        border-top: 2px solid #00b9f9 !important;
    }

    .mobile-menu-footer {
        border-top: 1px solid rgba(0, 185, 249, 0.2) !important;
    }

    /* Scrollbar personnalisée - Noir avec thumb cyan */
    .mega-mobile-inner::-webkit-scrollbar-track {
        background: #1a1a1a !important;
    }

    .mega-mobile-inner::-webkit-scrollbar-thumb {
        background: rgba(0, 185, 249, 0.3) !important;
        border-radius: 3px;
    }

    .mega-mobile-inner::-webkit-scrollbar-thumb:hover {
        background: rgba(0, 185, 249, 0.5) !important;
    }
}