(function() {
    'use strict';
    
    const mobileMenuCSS = `
        @media (max-width: 1220px) {
            .side-panel {
                display: none !important;
            }
        }

        .FS-mobile-menu {
            display: none;
            position: fixed;
            top: 0;
            left: -100%;
            width: 90%;
            max-width: 320px;
            height: 100vh;
            background: linear-gradient(180deg, #0a0a0a 0%, #141414 100%);
            z-index: 999999;
            transition: left 0.35s cubic-bezier(0.4, 0, 0.2, 1);
            overflow-y: auto;
            overflow-x: hidden;
            border-right: 2px solid #41dc9c;
            box-shadow: 5px 0 40px rgba(0, 0, 0, 0.9);
        }

        @media (max-width: 1220px) {
            .FS-mobile-menu {
                display: block;
            }
        }

        .FS-mobile-menu.open {
            left: 0;
        }

        .FS-menu-overlay {
            display: none;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(0, 0, 0, 0.85);
            z-index: 999998;
            backdrop-filter: blur(8px);
        }

        .FS-menu-overlay.show {
            display: block;
        }

        .FS-menu-header {
            padding: 12px 15px;
            background: linear-gradient(180deg, #1a1a1a, #0f0f0f);
            border-bottom: 1px solid rgba(244, 134, 37, 0.3);
            position: sticky;
            top: 0;
            z-index: 10;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .FS-close-btn {
            width: 32px;
            height: 32px;
            background: rgba(244, 134, 37, 0.15);
            border: 1px solid rgba(244, 134, 37, 0.4);
            border-radius: 6px;
            color: #41dc9c;
            font-size: 16px;
            cursor: pointer;
            transition: all 0.2s ease;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .FS-close-btn:hover {
            background: #41dc9c;
            color: white;
            transform: scale(1.05);
        }

        .FS-mobile-search {
            padding: 12px 15px;
            border-bottom: 1px solid rgba(244, 134, 37, 0.2);
        }

        .FS-search-input-container {
            position: relative;
        }

        .FS-search-input {
            width: 100%;
            padding: 10px 40px 10px 12px;
            background: rgba(255, 255, 255, 0.08);
            border: 1px solid rgba(244, 134, 37, 0.3);
            border-radius: 8px;
            color: white;
            font-size: 13px;
            transition: all 0.2s ease;
            box-sizing: border-box;
        }

        .FS-search-input:focus {
            outline: none;
            border-color: #41dc9c;
            background: rgba(255, 255, 255, 0.12);
        }

        .FS-search-input::placeholder {
            color: rgba(255, 255, 255, 0.5);
        }

        .FS-search-btn {
            position: absolute;
            right: 5px;
            top: 50%;
            transform: translateY(-50%);
            width: 32px;
            height: 32px;
            background: linear-gradient(145deg, #41dc9c, #ff8533);
            border: none;
            border-radius: 6px;
            color: white;
            cursor: pointer;
            transition: all 0.2s ease;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        .FS-search-btn:hover {
            transform: translateY(-50%) scale(1.05);
        }

        .FS-mobile-suggestions {
            margin-top: 10px;
            background: rgba(0, 0, 0, 0.5);
            border: 1px solid rgba(244, 134, 37, 0.3);
            border-radius: 8px;
            padding: 10px;
            max-height: 350px;
            overflow-y: auto;
            display: none;
        }

        .FS-mobile-suggestions.show {
            display: block;
        }

        .FS-mobile-suggestions #search-results-content {
            display: grid;
            grid-template-columns: repeat(3, 1fr);
            gap: 8px;
            padding: 0;
        }

        .FS-mobile-suggestions .search-item {
            aspect-ratio: 2/3;
        }

        .FS-mobile-suggestions .search-title {
            font-size: 9px;
        }

        .FS-mobile-suggestions .search-year {
            font-size: 8px;
        }

        .FS-mobile-suggestions::-webkit-scrollbar {
            width: 4px;
        }

        .FS-mobile-suggestions::-webkit-scrollbar-track {
            background: rgba(0, 0, 0, 0.2);
        }

        .FS-mobile-suggestions::-webkit-scrollbar-thumb {
            background: linear-gradient(180deg, #41dc9c, #ff8533);
            border-radius: 4px;
        }

        .FS-user-actions {
            padding: 0;
        }

        .FS-user-btn-wrapper {
            border-bottom: 1px solid rgba(244, 134, 37, 0.1);
        }

        .FS-user-btn {
            width: 100%;
            padding: 14px 15px;
            background: linear-gradient(145deg, #2c2c2c, #1f1f1f);
            border: none;
            color: white;
            font-size: 12px;
            font-weight: 600;
            cursor: pointer;
            transition: all 0.2s ease;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .FS-user-btn-content {
            display: flex;
            align-items: center;
            gap: 10px;
        }

        .FS-user-btn:hover {
            background: linear-gradient(145deg, #41dc9c, #ff8533);
        }

        .FS-user-btn.active {
            background: rgba(244, 134, 37, 0.2);
            border-left: 3px solid #41dc9c;
        }

        .FS-user-panel-container {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease;
            background: rgba(0, 0, 0, 0.4);
        }

        .FS-user-panel-container.expanded {
            max-height: 500px;
        }

        .FS-panel-inner {
            padding: 15px 20px;
        }

        .FS-modal-container {
            display: none;
            background: rgba(0, 0, 0, 0.6);
            border-radius: 8px;
            margin: 12px 15px;
            padding: 15px;
            border: 1px solid rgba(244, 134, 37, 0.3);
        }

        .FS-modal-container.show {
            display: block;
        }

        .FS-modal-header {
            display: flex;
            justify-content: space-between;
            align-items: center;
            margin-bottom: 15px;
            padding-bottom: 10px;
            border-bottom: 1px solid rgba(244, 134, 37, 0.3);
        }

        .FS-modal-title {
            color: #41dc9c;
            font-size: 15px;
            font-weight: bold;
        }

        .FS-modal-close {
            background: none;
            border: none;
            color: #41dc9c;
            font-size: 16px;
            cursor: pointer;
            width: 24px;
            height: 24px;
            border-radius: 50%;
            transition: all 0.2s ease;
        }

        .FS-modal-close:hover {
            background: rgba(244, 134, 37, 0.2);
        }

        .FS-login-form {
            display: flex;
            flex-direction: column;
            gap: 12px;
        }

        .FS-input-group input {
            width: 100%;
            padding: 10px 12px;
            background: rgba(255, 255, 255, 0.08);
            border: 1px solid rgba(244, 134, 37, 0.3);
            border-radius: 6px;
            color: white;
            font-size: 13px;
            transition: all 0.2s ease;
            box-sizing: border-box;
        }

        .FS-input-group input:focus {
            outline: none;
            border-color: #41dc9c;
            background: rgba(255, 255, 255, 0.12);
        }

        .FS-input-group input::placeholder {
            color: rgba(255, 255, 255, 0.5);
        }

        .FS-checkbox-group {
            display: flex;
            align-items: center;
            gap: 8px;
        }

        .FS-checkbox-group input[type="checkbox"] {
            width: 16px;
            height: 16px;
            cursor: pointer;
            accent-color: #41dc9c;
        }

        .FS-checkbox-group label {
            color: #ccc;
            font-size: 12px;
            cursor: pointer;
        }

        .FS-submit-btn {
            padding: 12px;
            background: linear-gradient(145deg, #41dc9c, #ff8533);
            border: none;
            border-radius: 6px;
            color: white;
            font-weight: bold;
            font-size: 14px;
            cursor: pointer;
            transition: all 0.2s ease;
        }

        .FS-submit-btn:hover {
            transform: translateY(-1px);
        }

        .FS-form-links {
            display: flex;
            justify-content: space-between;
            margin-top: 10px;
        }

        .FS-form-links a {
            color: #41dc9c;
            font-size: 11px;
            text-decoration: none;
            transition: all 0.2s ease;
        }

        .FS-form-links a:hover {
            color: #ff8533;
        }

        .FS-nav-container {
            padding: 0;
        }

        .FS-nav-item-wrapper {
            border-bottom: 1px solid rgba(244, 134, 37, 0.1);
        }

        .FS-nav-button {
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: space-between;
            padding: 14px 15px;
            background: linear-gradient(145deg, #1a1a1a, #0f0f0f);
            border: none;
            color: #ccc;
            text-decoration: none;
            font-size: 13px;
            font-weight: 600;
            transition: all 0.2s ease;
            cursor: pointer;
            text-align: left;
        }

        .FS-nav-button:hover {
            background: rgba(244, 134, 37, 0.1);
            color: white;
        }

        .FS-nav-button.active {
            background: rgba(244, 134, 37, 0.2);
            border-left: 3px solid #41dc9c;
            color: white;
        }

        .FS-nav-button-content {
            display: flex;
            align-items: center;
            gap: 10px;
        }

        .FS-nav-button i {
            color: #41dc9c;
            font-size: 14px;
            width: 18px;
            text-align: center;
        }

        .FS-nav-chevron {
            color: #41dc9c;
            font-size: 12px;
            transition: transform 0.3s ease;
        }

        .FS-nav-button.active .FS-nav-chevron {
            transform: rotate(90deg);
        }

        .FS-submenu-container {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease;
            background: rgba(0, 0, 0, 0.4);
        }

        .FS-submenu-container.expanded {
            max-height: 1000px;
        }

        .FS-submenu-inner {
            padding: 8px 15px 8px 25px;
        }

        .FS-submenu-inner .menu-section {
            background: rgba(0, 0, 0, 0.2);
            margin: 6px 0;
            padding: 0;
            border-radius: 6px;
            border: 1px solid rgba(244, 134, 37, 0.1);
        }

        .FS-submenu-inner .menu-section-title {
            color: #41dc9c !important;
            font-size: 12px !important;
            font-weight: 600 !important;
            padding: 10px 12px !important;
            border: none !important;
            cursor: pointer !important;
            display: flex !important;
            align-items: center !important;
            justify-content: space-between !important;
            background: rgba(244, 134, 37, 0.05) !important;
            border-radius: 6px !important;
            transition: all 0.2s ease !important;
            margin: 0 !important;
        }

        .FS-submenu-inner .menu-section-title:hover {
            background: rgba(244, 134, 37, 0.12) !important;
        }

        .FS-submenu-inner .menu-section-title::after {
            content: '\\f105';
            font-family: 'Font Awesome 5 Free';
            font-weight: 900;
            color: #41dc9c;
            font-size: 11px;
            transition: transform 0.3s ease;
        }

        .FS-submenu-inner .menu-section-title.expanded::after {
            transform: rotate(90deg);
        }

        .FS-submenu-inner .menu-section-content {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease;
            padding: 0;
        }

        .FS-submenu-inner .menu-section-content.expanded {
            max-height: 600px;
            padding: 8px 10px;
        }

        .FS-submenu-inner .menu-section a {
            display: flex !important;
            align-items: center !important;
            padding: 7px 10px !important;
            color: #aaa !important;
            text-decoration: none !important;
            border-radius: 4px !important;
            transition: all 0.2s ease !important;
            margin-bottom: 3px !important;
            font-size: 11px !important;
            border-left: 2px solid transparent !important;
        }

        .FS-submenu-inner .menu-section a:hover {
            background: rgba(244, 134, 37, 0.08) !important;
            color: white !important;
            border-left-color: #41dc9c !important;
            padding-left: 14px !important;
        }

        .FS-main-nav {
            padding: 0 0 20px 0;
        }

        .FS-section-title {
            padding: 10px 15px;
            font-size: 11px;
            font-weight: bold;
            color: #888;
            text-transform: uppercase;
            letter-spacing: 1.5px;
            background: rgba(255, 255, 255, 0.03);
            border-bottom: 1px solid rgba(244, 134, 37, 0.15);
        }

        .FS-expandable {
            border-bottom: 1px solid rgba(255, 255, 255, 0.05);
        }

        .FS-expandable[data-category] {
            display: none;
        }

        .FS-submenu {
            background: rgba(0, 0, 0, 0.3);
        }

        .FS-main-nav .menu-section {
            background: rgba(0, 0, 0, 0.2);
            margin: 8px 12px;
            padding: 10px;
            border-radius: 8px;
            border: 1px solid rgba(244, 134, 37, 0.15);
        }

        .FS-main-nav .menu-section-title {
            color: #41dc9c !important;
            font-size: 12px !important;
            font-weight: bold !important;
            margin-bottom: 8px !important;
            padding: 8px 10px !important;
            border-bottom: 1px solid rgba(244, 134, 37, 0.3) !important;
            text-transform: uppercase;
            letter-spacing: 1px;
            cursor: pointer !important;
            display: flex !important;
            align-items: center !important;
            justify-content: space-between !important;
            background: rgba(244, 134, 37, 0.08) !important;
            border-radius: 6px !important;
            transition: all 0.2s ease !important;
        }

        .FS-main-nav .menu-section-title:hover {
            background: rgba(244, 134, 37, 0.15) !important;
        }

        .FS-main-nav .menu-section-title::after {
            content: '\\f105';
            font-family: 'Font Awesome 5 Free';
            font-weight: 900;
            color: #41dc9c;
            font-size: 12px;
            transition: transform 0.3s ease;
        }

        .FS-main-nav .menu-section-title.expanded::after {
            transform: rotate(90deg);
        }

        .FS-main-nav .menu-section-content {
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.3s ease;
        }

        .FS-main-nav .menu-section-content.expanded {
            max-height: 800px;
            margin-top: 8px;
        }

        .FS-main-nav .menu-section a {
            display: flex !important;
            align-items: center !important;
            padding: 8px 10px !important;
            color: #bbb !important;
            text-decoration: none !important;
            border-radius: 4px !important;
            transition: all 0.2s ease !important;
            margin-bottom: 4px !important;
            font-size: 12px !important;
            border-left: 2px solid transparent !important;
        }

        .FS-main-nav .menu-section a:hover {
            background: rgba(244, 134, 37, 0.12) !important;
            color: white !important;
            border-left-color: #41dc9c !important;
            padding-left: 14px !important;
        }

        .FS-main-nav .menu-section a i {
            margin-right: 8px !important;
            color: #41dc9c !important;
            width: 14px !important;
            text-align: center !important;
            font-size: 12px !important;
        }

        .FS-mobile-menu::-webkit-scrollbar {
            width: 4px;
        }

        .FS-mobile-menu::-webkit-scrollbar-track {
            background: rgba(0, 0, 0, 0.3);
        }

        .FS-mobile-menu::-webkit-scrollbar-thumb {
            background: linear-gradient(180deg, #41dc9c, #ff8533);
            border-radius: 4px;
        }

        @media (max-width: 768px) {
            .FS-mobile-menu {
                max-width: 280px;
            }

            .FS-mobile-suggestions #search-results-content {
                grid-template-columns: repeat(2, 1fr);
            }
        }

        @media (max-width: 480px) {
            .FS-mobile-menu {
                width: 85%;
                max-width: 260px;
            }

            .FS-quick-nav {
                grid-template-columns: repeat(2, 1fr);
            }
        }
    `;

    const style = document.createElement('style');
    style.textContent = mobileMenuCSS;
    document.head.appendChild(style);

    function checkUserStatus() {
        const loginButton = document.querySelector('#loginButtonContainer');
        const panelButton = document.querySelector('#panelButtonContainer');
        const userGroups = document.querySelector('[group="5"]') || document.querySelector('.group-5');
        
        return !!(panelButton || userGroups || document.querySelector('.user-logged-in'));
    }

    function scanAndCopyMenu() {
        const extractedItems = [];
        const navMenuItems = document.querySelectorAll('.nav-menu > li.submenu');
        
        navMenuItems.forEach(navItem => {
            const mainLink = navItem.querySelector('a');
            if (!mainLink) return;
            
            const linkText = mainLink.textContent.replace(/[|]/g, '').trim();
            const hiddenMenu = navItem.querySelector('.hidden-menu');
            
            let dataAttr = '';
            let icon = 'fas fa-list';
            
            if (linkText.toLowerCase().includes('film')) {
                dataAttr = 'films';
                icon = 'fas fa-film';
            } else if (linkText.toLowerCase().includes('série')) {
                dataAttr = 'series';
                icon = 'fas fa-tv';
            } else if (linkText.toLowerCase().includes('anime')) {
                dataAttr = 'animes';
                icon = 'fas fa-dragon';
            }

            if (hiddenMenu && dataAttr) {
                const menuContainer = hiddenMenu.querySelector('.menu-container');
                if (menuContainer) {
                    extractedItems.push({
                        type: 'nav-with-submenu',
                        dataAttr: dataAttr,
                        icon: icon,
                        text: linkText,
                        submenuContent: menuContainer.innerHTML
                    });
                }
            }
        });
        
        return extractedItems;
    }

    function createSearchBar() {
        return `
            <div class="FS-mobile-search">
                <div class="FS-search-input-container">
                    <input type="text" 
                           class="FS-search-input" 
                           placeholder="Rechercher..." 
                           autocomplete="off"
                           id="FS-mobile-search-input">
                    <button type="button" class="FS-search-btn" id="FS-mobile-search-btn">
                        <i class="fas fa-search"></i>
                    </button>
                </div>
                <div class="FS-mobile-suggestions" id="FS-mobile-suggestions"></div>
            </div>
        `;
    }

    function createQuickNav() {
        return '';
    }

    function createNavigation() {
        const menuItems = scanAndCopyMenu();
        const favLink = document.querySelector('a[href*="favorites"]');
        const contactLink = document.querySelector('a[href*="feedback"]');
        
        let navHTML = '<div class="FS-nav-container">';
        
menuItems.forEach((item, index) => {
    if (item.type === 'nav-with-submenu') {
        const isActive = item.dataAttr === 'films';
        navHTML += `
            <div class="FS-nav-item-wrapper">
                <button class="FS-nav-button ${isActive ? 'active' : ''}" data-category="${item.dataAttr}">
                    <div class="FS-nav-button-content">
                        <i class="${item.icon}"></i>
                        <span>${item.text}</span>
                    </div>
                </button>
                <div class="FS-submenu-container ${isActive ? 'expanded' : ''}" id="submenu-${item.dataAttr}">
                    <div class="FS-submenu-inner">
                        ${item.submenuContent}
                    </div>
                </div>
            </div>
        `;
    }
});

        if (favLink) {
            navHTML += `
                <div class="FS-nav-item-wrapper">
                    <a href="${favLink.getAttribute('href')}" class="FS-nav-button">
                        <div class="FS-nav-button-content">
                            <i class="fas fa-heart"></i>
                            <span>Favoris</span>
                        </div>
                    </a>
                </div>
            `;
        }
        
        if (contactLink) {
            navHTML += `
                <div class="FS-nav-item-wrapper">
                    <a href="${contactLink.getAttribute('href')}" class="FS-nav-button">
                        <div class="FS-nav-button-content">
                            <i class="fas fa-question-circle"></i>
                            <span>F.A.Q</span>
                        </div>
                    </a>
                </div>
            `;
        }
        
        navHTML += '</div>';
        return navHTML;
    }

    function createUserButtons() {
        const isLoggedIn = checkUserStatus();
        
        if (isLoggedIn) {
            return `
                <div class="FS-user-actions">
                    <div class="FS-user-btn-wrapper">
                        <button class="FS-user-btn" id="FS-panel-btn">
                            <div class="FS-user-btn-content">
                                <i class="fas fa-user-cog"></i>
                                <span>Mon Panel</span>
                            </div>
                           
                        </button>
                        <div class="FS-user-panel-container" id="FS-panel-container">
                            <div class="FS-panel-inner" id="FS-panel-content"></div>
                        </div>
                    </div>
                </div>
            `;
        } else {
            return `
                <div class="FS-user-actions">
                    <div class="FS-user-btn-wrapper">
                        <button class="FS-user-btn" id="FS-login-btn">
                            <div class="FS-user-btn-content">
                                <i class="fas fa-sign-in-alt"></i>
                                <span>Connexion</span>
                            </div>
                        </button>
                        <div class="FS-modal-container" id="FS-login-modal">
                            <div class="FS-modal-header">
                                <div class="FS-modal-title">Connexion</div>
                                <button class="FS-modal-close" id="FS-login-close">
                                    <i class="fas fa-times"></i>
                                </button>
                            </div>
                            <form class="FS-login-form" method="post" id="FS-login-form">
                                <div class="FS-input-group">
                                    <input type="text" name="login_name" placeholder="Votre pseudo" required>
                                </div>
                                <div class="FS-input-group">
                                    <input type="password" name="login_password" placeholder="Votre mot de passe" required>
                                </div>
                                <div class="FS-checkbox-group">
                                    <input type="checkbox" name="login_not_save" id="FS-stay-logged" value="1" checked>
                                    <label for="FS-stay-logged">Rester connecté</label>
                                </div>
                                <button type="submit" class="FS-submit-btn">Se connecter</button>
                                <input type="hidden" name="login" value="submit">
                            </form>
                            <div class="FS-form-links">
                                <a href="/index.php?do=lostpassword">Mot de passe oublié ?</a>
                                <a href="/inscription">Inscription</a>
                            </div>
                        </div>
                    </div>
                </div>
            `;
        }
    }

    function createLoginModal() {
        return '';
    }

    function createPanelModal() {
        return '';
    }

    function displayMobileRecentSearches() {
        const mobileSuggestions = document.getElementById('FS-mobile-suggestions');
        if (!mobileSuggestions) return;
        
        const searches = localStorage.getItem('recentSearches');
        const recentSearches = searches ? JSON.parse(searches) : [];
        
        if (recentSearches.length === 0) {
            mobileSuggestions.classList.remove('show');
            mobileSuggestions.innerHTML = '';
            return;
        }
        
        let html = `
            <div style="color: #41dc9c; font-size: 11px; font-weight: bold; margin-bottom: 10px; display: flex; align-items: center; gap: 6px;">
                <i class="fas fa-history"></i> Recherches récentes
            </div>
            <div id="search-results-content">
        `;
        
        recentSearches.forEach((search, index) => {
            html += `<div class="search-item recent-item" style="opacity: 0; animation: slideInUp 0.5s ease forwards; animation-delay: ${index * 0.05}s;" onclick="window.location.href='${search.link}'">`;
            html += `<div class="search-poster"><img src="${search.poster}" alt="${search.title}" loading="lazy"></div>`;
            html += `<div class="search-info">`;
            html += `<div class="search-title">${search.title}</div>`;
            if (search.year) {
                html += `<div class="search-year">${search.year}</div>`;
            }
            html += `</div></div>`;
        });
        
        html += '</div>';
        
        mobileSuggestions.innerHTML = html;
        mobileSuggestions.classList.add('show');
    }

    function createMobileMenu() {
        const searchBar = createSearchBar();
        const navigation = createNavigation();
        const userButtons = createUserButtons();

        let menuHTML = `
            <div class="FS-menu-overlay" id="FS-menu-overlay"></div>
            
            <div class="FS-mobile-menu" id="FS-mobile-menu">
                <div class="FS-menu-header">
                    <div></div>
                    <button class="FS-close-btn" id="FS-close-btn">
                        <i class="fas fa-times"></i>
                    </button>
                </div>
                
                ${searchBar}
                ${userButtons}
                ${navigation}
            </div>
        `;

        document.body.insertAdjacentHTML('beforeend', menuHTML);
    }

    function handleQuickNavClicks() {
        setTimeout(() => {
            const navButtons = document.querySelectorAll('.FS-nav-button[data-category]');
            
            navButtons.forEach(btn => {
                btn.addEventListener('click', function(e) {
                    e.preventDefault();
                    const targetCategory = this.getAttribute('data-category');
                    const targetSubmenu = document.getElementById(`submenu-${targetCategory}`);
                    const isActive = this.classList.contains('active');
                    
                    navButtons.forEach(b => {
                        b.classList.remove('active');
                        const submenu = document.getElementById(`submenu-${b.getAttribute('data-category')}`);
                        if (submenu) {
                            submenu.classList.remove('expanded');
                        }
                    });
                    
                    if (!isActive && targetSubmenu) {
                        this.classList.add('active');
                        targetSubmenu.classList.add('expanded');
                    }
                });
            });
            
            const submenuSections = document.querySelectorAll('.FS-submenu-inner .menu-section');
            
            submenuSections.forEach(section => {
                const title = section.querySelector('.menu-section-title');
                if (!title) return;
                
                const linksContainer = document.createElement('div');
                linksContainer.className = 'menu-section-content';
                
                const links = Array.from(section.querySelectorAll('a'));
                links.forEach(link => {
                    linksContainer.appendChild(link);
                });
                
                section.appendChild(linksContainer);
                
                title.addEventListener('click', function(e) {
                    e.preventDefault();
                    e.stopPropagation();
                    
                    this.classList.toggle('expanded');
                    linksContainer.classList.toggle('expanded');
                });
            });
            
       
        }, 600);
    }

    function setupEventListeners() {
        const overlay = document.getElementById('FS-menu-overlay');
        const menu = document.getElementById('FS-mobile-menu');
        const closeBtn = document.getElementById('FS-close-btn');
        const loginBtn = document.getElementById('FS-login-btn');
        const panelBtn = document.getElementById('FS-panel-btn');
        const loginModal = document.getElementById('FS-login-modal');
        const panelModal = document.getElementById('FS-panel-modal');
        const loginClose = document.getElementById('FS-login-close');
        const panelClose = document.getElementById('FS-panel-close');
        const loginForm = document.getElementById('FS-login-form');
        
        const existingMenuBtn = document.querySelector('.btn-menu');

        function setupMobileSearchIntegration() {
            const mobileSearchInput = document.getElementById('FS-mobile-search-input');
            const mobileSearchBtn = document.getElementById('FS-mobile-search-btn');
            const mobileSuggestions = document.getElementById('FS-mobile-suggestions');
            const desktopSearchInput = document.getElementById('story');
            let searchTimeout;
            
            if (mobileSearchInput && mobileSearchBtn && desktopSearchInput && mobileSuggestions) {
                
                mobileSearchInput.addEventListener('focus', function() {
                    if (!this.value.trim()) {
                        displayMobileRecentSearches();
                    }
                });
                
                mobileSearchInput.addEventListener('input', function() {
                    const query = this.value.trim();
                    
                    clearTimeout(searchTimeout);
                    
                    if (query.length === 0) {
                        displayMobileRecentSearches();
                        return;
                    }
                    
                    if (query.length >= 2) {
                        searchTimeout = setTimeout(() => {
                            performLiveSearch(query);
                        }, 300);
                    }
                });
                
                function performLiveSearch(query) {
                    mobileSuggestions.innerHTML = '<div style="color: white; text-align: center; padding: 20px;"><i class="fas fa-spinner fa-spin" style="font-size: 20px; color: #41dc9c;"></i></div>';
                    mobileSuggestions.classList.add('show');
                    
                    fetch('/engine/ajax/search.php', {
                        method: 'POST',
                        headers: {
                            'Content-Type': 'application/x-www-form-urlencoded',
                        },
                        body: 'query=' + encodeURIComponent(query) + '&page=1'
                    })
                    .then(response => response.text())
                    .then(data => {
                        if (mobileSearchInput.value.trim() === query) {
                            mobileSuggestions.innerHTML = '<div id="search-results-content">' + data + '</div>';
                            mobileSuggestions.classList.add('show');
                            
                            attachMobileClickHandlers();
                        }
                    })
                    .catch(error => {
                        mobileSuggestions.innerHTML = '<div style="color: #ff4444; text-align: center; padding: 15px;">Erreur</div>';
                    });
                }
                
                function attachMobileClickHandlers() {
                    const searchItems = mobileSuggestions.querySelectorAll('.search-item:not(.recent-item)');
                    searchItems.forEach(item => {
                        if (!item.hasAttribute('data-click-attached')) {
                            item.setAttribute('data-click-attached', 'true');
                            item.addEventListener('click', function(e) {
                                const img = this.querySelector('img');
                                const titleEl = this.querySelector('.search-title');
                                const yearEl = this.querySelector('.search-year');
                                const linkMatch = this.getAttribute('onclick')?.match(/'([^']+)'/);
                                
                                if (img && titleEl && linkMatch) {
                                    const movieData = {
                                        title: titleEl.textContent.replace(/\(\d{4}\)/, '').trim(),
                                        poster: img.src,
                                        year: yearEl ? yearEl.textContent.replace(/[()]/g, '') : '',
                                        link: linkMatch[1]
                                    };
                                    
                                    let searches = localStorage.getItem('recentSearches');
                                    searches = searches ? JSON.parse(searches) : [];
                                    searches = searches.filter(s => s.link !== movieData.link);
                                    searches.unshift(movieData);
                                    searches = searches.slice(0, 12);
                                    localStorage.setItem('recentSearches', JSON.stringify(searches));
                                }
                            });
                        }
                    });
                }
                
                function performSearch() {
                    const query = mobileSearchInput.value.trim();
                    if (query.length > 0) {
                        desktopSearchInput.value = query;
                        closeMenu();
                        
                        setTimeout(() => {
                            desktopSearchInput.focus();
                            const desktopForm = document.getElementById('quicksearch');
                            if (desktopForm) {
                                const event = new Event('submit', { bubbles: true, cancelable: true });
                                desktopForm.dispatchEvent(event);
                            }
                        }, 400);
                        
                    } else {
                        mobileSearchInput.style.borderColor = '#ff4444';
                        mobileSearchInput.style.boxShadow = '0 0 15px rgba(255, 68, 68, 0.5)';
                        setTimeout(() => {
                            mobileSearchInput.style.borderColor = 'rgba(244, 134, 37, 0.3)';
                            mobileSearchInput.style.boxShadow = '';
                        }, 1500);
                    }
                }
                
                mobileSearchBtn.addEventListener('click', performSearch);
                
                mobileSearchInput.addEventListener('keypress', function(e) {
                    if (e.key === 'Enter') {
                        e.preventDefault();
                        performSearch();
                    }
                });
            }
        }

        function initSubmenuToggles() {
            setTimeout(() => {
                const submenuSections = document.querySelectorAll('.FS-submenu .menu-section');
                
                submenuSections.forEach(section => {
                    const title = section.querySelector('.menu-section-title');
                    if (!title) return;
                    
                    const linksContainer = document.createElement('div');
                    linksContainer.className = 'menu-section-content';
                    
                    const links = Array.from(section.querySelectorAll('a'));
                    links.forEach(link => {
                        linksContainer.appendChild(link);
                    });
                    
                    section.appendChild(linksContainer);
                    
                    title.addEventListener('click', function(e) {
                        e.preventDefault();
                        e.stopPropagation();
                        
                        this.classList.toggle('expanded');
                        linksContainer.classList.toggle('expanded');
                    });
                });
            }, 500);
        }

        function openMenu() {
            overlay.classList.add('show');
            menu.classList.add('open');
            document.body.style.overflow = 'hidden';
        }

        function closeMenu() {
            overlay.classList.remove('show');
            menu.classList.remove('open');
            document.body.style.overflow = '';
            
            if (loginModal) loginModal.classList.remove('show');
            if (panelModal) panelModal.classList.remove('show');
            
            const mobileSuggestions = document.getElementById('FS-mobile-suggestions');
            if (mobileSuggestions) {
                mobileSuggestions.classList.remove('show');
                mobileSuggestions.innerHTML = '';
            }
            
            const mobileSearchInput = document.getElementById('FS-mobile-search-input');
            if (mobileSearchInput) {
                mobileSearchInput.value = '';
            }
        }

        function openLoginModal() {
            if (loginModal) {
                loginModal.classList.add('show');
                if (panelModal) panelModal.classList.remove('show');
            }
        }

        function closeLoginModal() {
            if (loginModal) {
                loginModal.classList.remove('show');
            }
        }

        function openPanelModal() {
            if (panelModal) {
                const originalLoginBox = document.getElementById('login-box');
                const panelContent = document.getElementById('FS-panel-content');
                
                if (originalLoginBox && panelContent) {
                    panelContent.innerHTML = '';
                    const loginBoxClone = originalLoginBox.cloneNode(true);
                    loginBoxClone.style.display = 'block';
                    panelContent.appendChild(loginBoxClone);
                }
                
                panelModal.classList.add('show');
                if (loginModal) loginModal.classList.remove('show');
            }
        }

        function closePanelModal() {
            if (panelModal) {
                panelModal.classList.remove('show');
            }
        }

        function handleLoginSubmit(e) {
            e.preventDefault();
            
            const formData = new FormData(loginForm);
            
            const originalLoginForm = document.querySelector('form[method="post"]');
            if (originalLoginForm) {
                const originalLoginName = originalLoginForm.querySelector('input[name="login_name"]');
                const originalLoginPassword = originalLoginForm.querySelector('input[name="login_password"]');
                const originalLoginNotSave = originalLoginForm.querySelector('input[name="login_not_save"]');
                
                if (originalLoginName) originalLoginName.value = formData.get('login_name');
                if (originalLoginPassword) originalLoginPassword.value = formData.get('login_password');
                if (originalLoginNotSave) originalLoginNotSave.checked = formData.get('login_not_save') === '1';
                
                originalLoginForm.submit();
            } else {
                loginForm.submit();
            }
        }

        if (existingMenuBtn) {
            existingMenuBtn.addEventListener('click', function(e) {
                if (window.innerWidth <= 1220) {
                    e.preventDefault();
                    e.stopPropagation();
                    openMenu();
                }
            });
        }
        
        if (closeBtn) closeBtn.addEventListener('click', closeMenu);
        if (overlay) overlay.addEventListener('click', closeMenu);

        menu.addEventListener('click', function(e) {
            const mobileSuggestions = document.getElementById('FS-mobile-suggestions');
            const mobileSearchInput = document.getElementById('FS-mobile-search-input');
            
            if (mobileSuggestions && 
                !mobileSuggestions.contains(e.target) && 
                !mobileSearchInput.contains(e.target) &&
                mobileSuggestions.classList.contains('show')) {
                mobileSuggestions.classList.remove('show');
                mobileSuggestions.innerHTML = '';
            }
        });

        if (loginBtn) {
            loginBtn.addEventListener('click', function(e) {
                e.preventDefault();
                e.stopPropagation();
                openLoginModal();
            });
        }

        if (panelBtn) {
            panelBtn.addEventListener('click', function(e) {
                e.preventDefault();
                e.stopPropagation();
                const panelContainer = document.getElementById('FS-panel-container');
                const isExpanded = panelContainer.classList.contains('expanded');
                
                if (isExpanded) {
                    panelContainer.classList.remove('expanded');
                    this.classList.remove('active');
                } else {
                    const originalLoginBox = document.getElementById('login-box');
                    const panelContent = document.getElementById('FS-panel-content');
                    
                    if (originalLoginBox && panelContent) {
                        panelContent.innerHTML = '';
                        const loginBoxClone = originalLoginBox.cloneNode(true);
                        loginBoxClone.style.display = 'block';
                        panelContent.appendChild(loginBoxClone);
                    }
                    
                    panelContainer.classList.add('expanded');
                    this.classList.add('active');
                }
            });
        }

        if (loginClose) loginClose.addEventListener('click', closeLoginModal);
        if (panelClose) panelClose.addEventListener('click', closePanelModal);

        if (loginForm) {
            loginForm.addEventListener('submit', handleLoginSubmit);
        }

        const yearInput = document.querySelector('.FS-main-nav #customYearInput');
        const yearBtn = document.querySelector('.FS-main-nav .year-go-btn');
        
        if (yearInput && yearBtn) {
            yearBtn.addEventListener('click', function() {
                const year = yearInput.value.trim();
                if (year && year.length === 4 && year >= 1900 && year <= 2030) {
                    window.location.href = `/xfsearch/date-de-sortie/${year}/`;
                }
            });
            
            yearInput.addEventListener('keypress', function(e) {
                if (e.key === 'Enter') {
                    yearBtn.click();
                }
            });
        }

        document.addEventListener('keydown', function(e) {
            if (e.key === 'Escape') {
                closeMenu();
            }
        });

        if (window.toggleLoginModal) {
            const originalToggleLogin = window.toggleLoginModal;
            window.toggleLoginModal = function() {
                if (window.innerWidth <= 1220 && menu && menu.classList.contains('open')) {
                    openLoginModal();
                } else {
                    originalToggleLogin();
                }
            };
        }

        if (window.togglePanelModal) {
            const originalTogglePanel = window.togglePanelModal;
            window.togglePanelModal = function() {
                if (window.innerWidth <= 1220 && menu && menu.classList.contains('open')) {
                    openPanelModal();
                } else {
                    originalTogglePanel();
                }
            };
        }

        setupMobileSearchIntegration();
        initSubmenuToggles();
        handleQuickNavClicks();
    }

    function init() {
        if (document.readyState === 'loading') {
            document.addEventListener('DOMContentLoaded', function() {
                setTimeout(() => {
                    createMobileMenu();
                    setupEventListeners();
                }, 100);
            });
        } else {
            setTimeout(() => {
                createMobileMenu();
                setupEventListeners();
            }, 100);
        }
    }

    init();

})();