document.addEventListener('DOMContentLoaded', () => {
  // Initialize any Bootstrap components that need JavaScript

  // Initialize dropdown menus
  const dropdownElementList = document.querySelectorAll('.dropdown-toggle');
  for (const dropdownToggleEl of dropdownElementList as NodeListOf<Element>) {
    // Initialize dropdown but don't need to store the reference
    void new bootstrap.Dropdown(dropdownToggleEl);
  }

  // Add scroll event listener for the navbar (make it sticky on scroll)
  const navbar = document.querySelector('.navbar');
  window.addEventListener('scroll', () => {
    if (window.scrollY > 50) {
      navbar?.classList.add('navbar-scrolled');
    } else {
      navbar?.classList.remove('navbar-scrolled');
    }
  });

  // Add smooth scrolling for anchor links
  const anchorLinks = document.querySelectorAll('a[href^="#"]');
  for (const anchor of anchorLinks as NodeListOf<HTMLAnchorElement>) {
    anchor.addEventListener('click', function(this: HTMLAnchorElement, e: Event) {
      e.preventDefault();

      const href = this.getAttribute('href');
      if (href) {
        document.querySelector(href)?.scrollIntoView({
          behavior: 'smooth'
        });
      }
    });
  }
});

// Types for Bootstrap
declare global {
  interface Window {
    bootstrap: {
      Dropdown: new (element: Element) => unknown;
    };
  }
}

const bootstrap = window.bootstrap;