document.addEventListener('DOMContentLoaded', () => {
    const root_elements = $$(".desktop-navbar-root");

    root_elements.forEach(root_element => {
        const dropdown = root_element.querySelector(".navbar-dropdown");
        if(dropdown) {
            function show_dropdown() {
                dropdown.classList.remove("hidden");
            }

            function hide_dropdown() {
                dropdown.classList.add("hidden");
            }

            root_element.addEventListener("mouseover", show_dropdown);
            root_element.addEventListener("mouseleave", hide_dropdown);
        }
    });
});