/* ==========================================
   1. STYLES GÉNÉRAUX & STRUCTURE DU HEADER
   ========================================== */

/* Masquage des éléments doublons au sein du header */
.elementor-element-27d55f64 .elementor-widget-image, 
.elementor-element-27d55f64 .site-logo, 
.elementor-element-27d55f64 .custom-logo-link,
.elementor-element-27d55f64 .elementor-widget-woocommerce-menu-cart {
    display: none !important;
}

/* Rétro-éclairage néon vert sur le container d'en-tête */
.elementor-element-27d55f64,
.elementor-element-27d55f64.e-con {
    background: rgba(10, 10, 10, 0.92) !important;
    border-bottom: none !important;
    box-shadow: 0 4px 35px rgba(57, 255, 20, 0.85), 
                0 0 25px rgba(57, 255, 20, 0.65), 
                0 0 50px rgba(57, 255, 20, 0.45) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    transition: all 0.3s ease !important;
}

/* Style des liens par défaut (Desktop & Dropdown commun) */
.elementor-nav-menu .elementor-item,
.elementor-nav-menu a.elementor-item {
    font-family: inherit !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em !important;
    color: #ffffff !important;
    text-shadow: 0 0 4px rgba(0, 0, 0, 0.8) !important;
    transition: all 0.25s ease-in-out !important;
}

/* Effet Hover Néon Vert Électrique */
.elementor-nav-menu .elementor-item:hover,
.elementor-nav-menu .elementor-item.elementor-item-active,
.elementor-nav-menu .elementor-item.highlighted {
    color: #39FF14 !important;
    text-shadow: 0 0 8px #39FF14, 0 0 20px rgba(57, 255, 20, 0.35) !important;
}

/* ==========================================
   2. CONFIGURATION DESKTOP (Menu Horizontal)
   ========================================== */
@media (min-width: 1025px) {
    .elementor-nav-menu--main {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        width: auto !important;
    }

    .elementor-nav-menu--main ul {
        display: flex !important;
        flex-direction: row !important;
        justify-content: center !important;
        align-items: center !important;
        flex-wrap: nowrap !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Intercalaires vert électrique entre les catégories */
    .elementor-nav-menu--main > ul > li:not(:last-child)::after {
        content: "|";
        color: #39FF14 !important;
        font-weight: 400 !important;
        opacity: 0.8 !important;
        margin: 0 10px !important;
        text-shadow: 0 0 5px #39FF14 !important;
    }

    /* Forcer l'en-tête à l'aligner proprement */
    .elementor-element-49d26c8b .elementor-widget-container {
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: center !important;
    }

    /* Masquer les flèches de sous-menu sur ordinateur pour éviter l'encombrement */
    .elementor-nav-menu--main .sub-arrow {
        display: none !important;
    }

    /* SOUS-MENUS DESKTOP (Glassmorphism & Délai de fermeture augmenté) */
    .elementor-nav-menu--main .sub-menu {
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        z-index: 9999 !important;
        display: flex !important;
        flex-direction: column !important;
        opacity: 0 !important;
        visibility: hidden !important;
        background: rgba(10, 10, 10, 0.88) !important;
        backdrop-filter: blur(18px) !important;
        -webkit-backdrop-filter: blur(18px) !important;
        border: 1.5px solid rgba(57, 255, 20, 0.35) !important;
        box-shadow: 0 8px 32px rgba(0, 0, 0, 0.9), 0 0 18px rgba(57, 255, 20, 0.35) !important;
        border-radius: 8px !important;
        padding: 10px 0 !important;
        min-width: 220px !important;
        transition: opacity 0.25s ease-in-out, visibility 0.25s ease-in-out !important;
        transition-delay: 0.6s !important;
    }

    /* Au survol du parent, le sous-menu apparaît immédiatement sans aucun délai */
    .elementor-nav-menu--main li:hover > .sub-menu {
        opacity: 1 !important;
        visibility: visible !important;
        transition-delay: 0s !important;
    }

    .elementor-nav-menu--main .sub-menu .elementor-sub-item {
        color: #ffffff !important;
        font-size: 13px !important;
        font-weight: 600 !important;
        padding: 12px 24px !important;
        transition: all 0.2s ease-in-out !important;
    }

    .elementor-nav-menu--main .sub-menu .elementor-sub-item:hover {
        background-color: rgba(57, 255, 20, 0.12) !important;
        color: #39FF14 !important;
        padding-left: 28px !important;
        text-shadow: 0 0 8px #39FF14 !important;
    }
}

/* ==========================================
   4. VERSION MOBILE ET TABLETTE (Dropdown & Burger)
   ========================================== */
@media (max-width: 1024px) {
    /* Masquer le menu principal standard */
    .elementor-widget-nav-menu .elementor-nav-menu--main {
        display: none !important;
    }

    /* Style du bouton Hamburger */
    .elementor-widget-nav-menu .elementor-menu-toggle {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: rgba(0, 0, 0, 0.6) !important;
        border: 1px solid rgba(57, 255, 20, 0.5) !important;
        box-shadow: 0 0 12px rgba(57, 255, 20, 0.35) !important;
        border-radius: 6px !important;
        padding: 8px 12px !important;
        min-height: 40px !important;
    }

    .elementor-widget-nav-menu .elementor-menu-toggle i,
    .elementor-widget-nav-menu .elementor-menu-toggle svg {
        fill: #ffffff !important;
        color: #ffffff !important;
    }

    .elementor-widget-nav-menu .elementor-menu-toggle.elementor-active {
        border-color: rgba(57, 255, 20, 0.9) !important;
        box-shadow: 0 0 18px rgba(57, 255, 20, 0.6) !important;
    }

    /* Force le conteneur dropdown */
    .elementor-widget-nav-menu .elementor-nav-menu--dropdown {
        display: none;
        flex-direction: column !important;
        width: 100% !important;
        position: absolute !important;
        left: 0 !important;
        z-index: 99999 !important;
        background-color: rgba(10, 30, 15, 0.96) !important;
        backdrop-filter: blur(12px) !important;
        -webkit-backdrop-filter: blur(12px) !important;
        border: 1px solid rgba(57, 255, 20, 0.4) !important;
        box-shadow: 0 8px 32px 0 rgba(57, 255, 20, 0.25) !important;
        border-radius: 8px !important;
        margin-top: 10px !important;
        padding: 15px 0 !important;
    }

    .elementor-widget-nav-menu .elementor-menu-toggle.elementor-active + .elementor-nav-menu--dropdown {
        display: flex !important;
    }

    .elementor-widget-nav-menu .elementor-nav-menu--dropdown ul,
    .elementor-widget-nav-menu .elementor-nav-menu--dropdown li {
        display: block !important;
        width: 100% !important;
        text-align: center !important;
        position: relative !important;
    }

    .elementor-widget-nav-menu .elementor-nav-menu--dropdown a {
        display: block !important;
        padding: 15px 20px !important;
        box-sizing: border-box !important;
    }

    /* Sous-menus mobiles masqués par défaut */
    .elementor-widget-nav-menu .elementor-nav-menu--dropdown .sub-menu {
        display: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        transition: none !important;
        transition-delay: 0s !important;
        background-color: rgba(5, 20, 10, 0.95) !important;
        border-top: 1px solid rgba(57, 255, 20, 0.2) !important;
        padding: 0 !important;
        position: static !important;
        width: 100% !important;
    }

    /* Classe dynamique pour ouvrir les sous-menus */
    .elementor-widget-nav-menu .elementor-nav-menu--dropdown li.is-open > .sub-menu {
        display: block !important;
    }

    /* Masquer complètement les flèches SVG d'origine pour mobile */
    .elementor-widget-nav-menu .sub-arrow svg,
    .elementor-widget-nav-menu .sub-arrow i {
        display: none !important;
    }

    /* Boutons +/- personnalisés pour Mobile */
    .elementor-widget-nav-menu .sub-arrow {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        position: absolute !important;
        right: 20px !important;
        top: 50% !important;
        transform: translateY(-50%) !important;
        z-index: 100 !important;
        cursor: pointer !important;
        width: 44px !important;
        height: 44px !important;
        border-radius: 50% !important;
        background: rgba(57, 255, 20, 0.1) !important;
        border: 1px solid rgba(57, 255, 20, 0.2) !important;
    }

    /* Construction propre par ::before uniquement */
    .elementor-widget-nav-menu .sub-arrow::before {
        content: "+" !important;
        display: block !important;
        font-family: monospace, sans-serif !important;
        font-size: 24px !important;
        font-weight: bold !important;
        color: #39FF14 !important;
        text-shadow: 0 0 5px #39FF14 !important;
    }

    /* Neutralisation totale de ::after pour éviter tout doublon résiduel */
    .elementor-widget-nav-menu .sub-arrow::after {
        display: none !important;
        content: "" !important;
    }

    /* État ouvert (Minus) */
    .elementor-widget-nav-menu li.is-open > .elementor-item .sub-arrow::before,
    .elementor-widget-nav-menu li.is-open > a .sub-arrow::before,
    .elementor-widget-nav-menu li.is-open > .sub-arrow::before {
        content: "-" !important;
    }
}
