</div>
    </div>

    <script src="https://code.jquery.com/jquery-3.7.0.js"></script>
    <script src="https://cdn.datatables.net/1.13.6/js/jquery.dataTables.min.js"></script>
    <script src="https://cdn.datatables.net/1.13.6/js/dataTables.bootstrap5.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
    <script>
        document.addEventListener("DOMContentLoaded", function() {
            var hasSubmenu = document.querySelectorAll(".has-submenu > a");
            for (var i = 0; i < hasSubmenu.length; i++) {
                hasSubmenu[i].addEventListener("click", function(e) {
                    e.preventDefault();
                    var parent = this.parentElement;
                    if (parent.classList.contains("open")) {
                        parent.classList.remove("open");
                    } else {
                        // Close other open submenus
                        var openSubmenus = document.querySelectorAll(".has-submenu.open");
                        for (var j = 0; j < openSubmenus.length; j++) {
                            openSubmenus[j].classList.remove("open");
                        }
                        parent.classList.add("open");
                    }
                });
            }
        });
    </script>
</body>
</html>