document.addEventListener("DOMContentLoaded", () => {
    const burgerButton = document.querySelector(".burger-button");
    const customOffcanvas = document.querySelector(".custom-offcanvas");

    if (burgerButton && customOffcanvas) {
        burgerButton.addEventListener("click", () => {
            customOffcanvas.classList.toggle("open");
        });

        document.addEventListener("click", (event) => {
            if (!burgerButton.contains(event.target) && !customOffcanvas.contains(event.target)) {
                customOffcanvas.classList.remove("open");
            }
        });

        document.querySelectorAll(".menu-link").forEach((link) => {
            link.addEventListener("click", function (e) {
                e.preventDefault();
                const targetId = this.getAttribute("href").substring(1);
                const targetElement = document.getElementById(targetId);

                if (targetElement) {
                    const offset = 100;  
                    const targetPosition = targetElement.getBoundingClientRect().top + window.scrollY - offset;

                    window.scrollTo({
                        top: targetPosition,
                        behavior: "smooth",
                    });
 
                    customOffcanvas.classList.remove("open");
                }
            });
        });
    }
});