/*!
 * Navigation Fix - Correction complète des puces de menu
 * Thème ModelCreator - FMX 2025
 * Ce fichier corrige définitivement les problèmes de puces dans les menus
 */

/* ========================================
   RESET COMPLET POUR TOUS LES MENUS
======================================== */

/* Reset pour le menu principal desktop */
.main-navigation ul,
.main-navigation .menu,
.nav-wrapper ul,
.nav-wrapper .menu,
#primary-menu,
.site-navigation ul,
.site-navigation .menu {
    list-style: none !important;
    list-style-type: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    gap: var(--spacing-lg);
    align-items: center;
}

.main-navigation li,
.main-navigation .menu-item,
.nav-wrapper li,
.nav-wrapper .menu-item,
#primary-menu li,
.site-navigation li,
.site-navigation .menu-item {
    list-style: none !important;
    list-style-type: none !important;
    margin: 0 !important;
    padding: 0 !important;
    position: relative;
    display: flex;
    align-items: center;
}

/* Suppression TOTALE de tous les pseudo-éléments */
.main-navigation li::before,
.main-navigation .menu-item::before,
.nav-wrapper li::before,
.nav-wrapper .menu-item::before,
#primary-menu li::before,
.site-navigation li::before,
.site-navigation .menu-item::before,
.main-navigation ul li::before,
.nav-wrapper ul li::before,
.site-navigation ul li::before {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
    background: none !important;
    border: none !important;
    position: static !important;
    opacity: 0 !important;
    visibility: hidden !important;
}

.main-navigation li::after,
.main-navigation .menu-item::after,
.nav-wrapper li::after,
.nav-wrapper .menu-item::after,
#primary-menu li::after,
.site-navigation li::after,
.site-navigation .menu-item::after {
    display: none !important;
    content: none !important;
}

/* ========================================
   RESET POUR LE MENU MOBILE
======================================== */

.mobile-navigation ul,
.mobile-navigation .menu,
.mobile-nav-menu ul,
.mobile-nav-menu .menu,
#mobile-primary-menu,
.mobile-nav-content ul,
.mobile-nav-content .menu {
    list-style: none !important;
    list-style-type: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    flex-direction: column !important;
    gap: 0 !important;
}

.mobile-navigation li,
.mobile-navigation .menu-item,
.mobile-nav-menu li,
.mobile-nav-menu .menu-item,
#mobile-primary-menu li,
.mobile-nav-content li,
.mobile-nav-content .menu-item {
    list-style: none !important;
    list-style-type: none !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    width: 100%;
}

/* Suppression TOTALE des pseudo-éléments mobile */
.mobile-navigation li::before,
.mobile-navigation .menu-item::before,
.mobile-nav-menu li::before,
.mobile-nav-menu .menu-item::before,
#mobile-primary-menu li::before,
.mobile-nav-content li::before,
.mobile-nav-content .menu-item::before,
.mobile-navigation ul li::before,
.mobile-nav-menu ul li::before,
.mobile-nav-content ul li::before {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
    background: none !important;
    border: none !important;
    position: static !important;
    opacity: 0 !important;
    visibility: hidden !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
}

.mobile-navigation li::after,
.mobile-navigation .menu-item::after,
.mobile-nav-menu li::after,
.mobile-nav-menu .menu-item::after,
#mobile-primary-menu li::after,
.mobile-nav-content li::after,
.mobile-nav-content .menu-item::after {
    display: none !important;
    content: none !important;
}

/* ========================================
   STYLES PROPRES POUR LES LIENS
======================================== */

/* Liens du menu desktop */
.main-navigation a,
.nav-wrapper a,
#primary-menu a,
.site-navigation a {
    color: var(--text-primary);
    text-decoration: none;
    font-weight: 500;
    font-size: var(--font-size-base);
    padding: var(--spacing-sm) var(--spacing-lg);
    border-radius: var(--radius-md);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    position: relative;
    display: flex;
    align-items: center;
    white-space: nowrap;
    background: transparent;
    border: 1px solid transparent;
}

.main-navigation a:hover,
.nav-wrapper a:hover,
#primary-menu a:hover,
.site-navigation a:hover {
    background: var(--glass-bg);
    backdrop-filter: var(--glass-backdrop);
    -webkit-backdrop-filter: var(--glass-backdrop);
    border-color: var(--glass-border);
    transform: translateY(-2px);
    box-shadow: 0 4px 15px var(--primary);
    color: var(--text-primary);
}

/* Liens du menu mobile */
.mobile-navigation a,
.mobile-nav-menu a,
#mobile-primary-menu a,
.mobile-nav-content a {
    display: block !important;
    color: var(--secondary-color) !important;
    text-decoration: none !important;
    font-size: var(--font-size-lg) !important;
    font-weight: 500 !important;
    padding: var(--spacing-lg) var(--spacing-xl) !important;
    border-radius: var(--radius-lg) !important;
    background: rgba(255, 255, 255, 0.08) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    margin-bottom: var(--spacing-xs) !important;
    transition: all 0.3s ease !important;
    position: relative !important;
    overflow: hidden !important;
    width: 100% !important;
    box-sizing: border-box !important;
}

.mobile-navigation a:hover,
.mobile-nav-menu a:hover,
#mobile-primary-menu a:hover,
.mobile-nav-content a:hover {
    color: var(--secondary-color) !important;
    background: var(--primary) !important;
    border-color: var(--primary) !important;
    transform: translateX(5px) !important;
    box-shadow: 0 4px 20px var(--primary) !important;
}

/* ========================================
   SOUS-MENUS (DROPDOWN)
======================================== */

.main-navigation .sub-menu,
.nav-wrapper .sub-menu,
.site-navigation .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    background: var(--glass-bg);
    backdrop-filter: var(--glass-backdrop);
    -webkit-backdrop-filter: var(--glass-backdrop);
    border: 1px solid var(--glass-border);
    border-radius: var(--radius-lg);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
    padding: var(--spacing-sm);
    min-width: 200px;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    z-index: 1000;
    display: flex !important;
    flex-direction: column !important;
    gap: 0;
    list-style: none !important;
}

.main-navigation .menu-item:hover .sub-menu,
.nav-wrapper .menu-item:hover .sub-menu,
.site-navigation .menu-item:hover .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.main-navigation .sub-menu li,
.nav-wrapper .sub-menu li,
.site-navigation .sub-menu li {
    width: 100%;
    margin: 0 !important;
    list-style: none !important;
}

.main-navigation .sub-menu li::before,
.nav-wrapper .sub-menu li::before,
.site-navigation .sub-menu li::before {
    display: none !important;
    content: none !important;
}

.main-navigation .sub-menu a,
.nav-wrapper .sub-menu a,
.site-navigation .sub-menu a {
    width: 100%;
    padding: var(--spacing-sm) var(--spacing-md);
    border-radius: var(--radius-sm);
    border: none;
    margin: 2px 0;
}

.main-navigation .sub-menu a:hover,
.nav-wrapper .sub-menu a:hover,
.site-navigation .sub-menu a:hover {
    background: var(--primary);
    transform: translateX(5px);
}

/* ========================================
   SURCHARGES SPÉCIFIQUES WORDPRESS
======================================== */

/* Menu généré par wp_nav_menu */
.menu li::before,
#menu-primary li::before,
#menu-main li::before,
.primary-menu li::before {
    display: none !important;
    content: none !important;
}

.menu,
#menu-primary,
#menu-main,
.primary-menu {
    list-style: none !important;
    list-style-type: none !important;
}

/* Fallback pour tous les ul dans les zones de navigation */
nav ul,
.navigation ul,
.nav ul,
#navigation ul,
#nav ul {
    list-style: none !important;
    list-style-type: none !important;
}

nav li,
.navigation li,
.nav li,
#navigation li,
#nav li {
    list-style: none !important;
    list-style-type: none !important;
}

nav li::before,
.navigation li::before,
.nav li::before,
#navigation li::before,
#nav li::before {
    display: none !important;
    content: none !important;
}

/* ========================================
   ACCESSIBILITÉ ET FOCUS
======================================== */

.main-navigation a:focus,
.nav-wrapper a:focus,
#primary-menu a:focus,
.mobile-navigation a:focus,
.mobile-nav-menu a:focus,
#mobile-primary-menu a:focus {
    outline: 2px solid var(--primary-color);
    outline-offset: 2px;
    background: var(--glass-bg);
    color: var(--text-primary);
}

/* ========================================
   RESPONSIVE BREAKPOINTS
======================================== */

@media (max-width: 768px) {
    /* Cache le menu desktop */
    .main-navigation,
    .nav-wrapper {
        display: none !important;
    }
    
    /* Assure que le mobile menu est visible */
    .mobile-menu-toggle {
        display: block !important;
    }
}

@media (min-width: 769px) {
    /* Cache le menu mobile */
    .mobile-navigation,
    .mobile-nav-menu,
    .mobile-menu-toggle {
        display: none !important;
    }
    
    /* Assure que le menu desktop est visible */
    .main-navigation,
    .nav-wrapper {
        display: flex !important;
    }
}

/* ========================================
   RÈGLES DE SURCHARGE FINALE
======================================== */

/* Surcharge absolue pour éliminer toute puce */
.main-navigation *::before,
.nav-wrapper *::before,
.mobile-navigation *::before,
.mobile-nav-menu *::before,
#primary-menu *::before,
#mobile-primary-menu *::before {
    content: none !important;
    display: none !important;
}

/* Assurance que les listes de menu sont toujours sans style */
ul.menu,
ul#primary-menu,
ul#mobile-primary-menu,
.main-navigation ul,
.nav-wrapper ul,
.mobile-nav-menu ul {
    list-style: none !important;
    list-style-type: none !important;
    list-style-image: none !important;
    list-style-position: outside !important;
}

/* Force le reset sur tous les li dans les menus */
.menu li,
#primary-menu li,
#mobile-primary-menu li,
.main-navigation li,
.nav-wrapper li,
.mobile-nav-menu li {
    list-style: none !important;
    list-style-type: none !important;
    list-style-image: none !important;
    list-style-position: outside !important;
    text-indent: 0 !important;
    padding-left: 0 !important;
}

/* Priorité absolue */
ul.menu li::before,
ul#primary-menu li::before,
ul#mobile-primary-menu li::before,
.main-navigation ul li::before,
.nav-wrapper ul li::before,
.mobile-nav-menu ul li::before {
    display: none !important;
    content: "" !important;
    width: 0 !important;
    height: 0 !important;
    position: absolute !important;
    left: -9999px !important;
    visibility: hidden !important;
    opacity: 0 !important;
}