document.addEventListener('DOMContentLoaded', function() { const menuItems = document.querySelectorAll('.menu > li > a'); menuItems.forEach(function(link) { const li = link.parentElement; const submenu = li.querySelector('ul'); // Only add click handler if there's a submenu if (submenu) { link.addEventListener('click', function(e) { e.preventDefault(); // Close other open submenus document.querySelectorAll('.menu > li').forEach(function(item) { if (item !== li) { item.classList.remove('active'); } }); // Toggle current submenu li.classList.toggle('active'); }); } }); // Close submenu when clicking outside document.addEventListener('click', function(e) { if (!e.target.closest('.menu')) { document.querySelectorAll('.menu > li').forEach(function(item) { item.classList.remove('active'); }); } }); });