document.addEventListener('DOMContentLoaded', function () {
    const nav = document.getElementById('mainNav');
    const toggle = document.getElementById('navToggle');

    // Toggle menu on mobile
    toggle.addEventListener('click', function () {
        nav.classList.toggle('open');
        toggle.classList.toggle('active');
    });

    // No need to add or remove sticky class here since CSS handles position: sticky
    // We simply rely on the CSS-based sticky behavior and reserved space via body padding.
    
    const submenuParents = document.querySelectorAll('.nav-item.has-submenu');
    submenuParents.forEach(parent => {
        parent.addEventListener('click', (e) => {
            if (window.innerWidth <= 992) {
                e.preventDefault();
                const subMenu = parent.querySelector('.sub-menu');
                if (subMenu) {
                    const isOpen = subMenu.style.display === 'block';
                    document.querySelectorAll('.sub-menu').forEach(sm => sm.style.display = 'none');
                    subMenu.style.display = isOpen ? 'none' : 'block';
                }
            }
        });
    });
});
