function loadHeader() {
  const headerHTML = `
    <!-- Top Contact Bar -->
    <div style="background-color: #fff4c9; padding: 9px;">
      <div class="mainHeader container d-flex justify-content-between align-items-center flex-wrap">
        <div class="contactbox">
          <img src="images/mail.png" alt="Email Icon" style="margin-right: 8px;">
          <a href="mailto:aswiniagro@gmail.com">aswiniagro@gmail.com</a> |
          <a href="mailto:contact@aswiniagrotech.com">contact@aswiniagrotech.com</a>
        </div>

        <div class="contactbox">
          <img src="images/call.png" alt="Phone Icon" style="margin-right: 8px;">
          <a href="tel:+919845223896">+91 98452 23896</a> |
          <a href="tel:+919632081896">+91 96320 81896</a> |
          <a href="tel:+918277329502">+91 82773 29502</a>
        </div>

        <div class="social-medi">
          <a href="https://www.facebook.com/share/p/1Gb4Av4G8Z/"  target="_blank" style="margin-left:5px"><img src="images/facebook 4.png" alt=""></a>
          <a href="https://youtu.be/oWwkq-JHob0?feature=shared" target="_blank" style="margin-left:5px"><img src="images/youtube 1.png" alt=""></a>
          <a href="https://www.instagram.com/p/DQWibguiBe5/?igsh=dW82ZWtocmkxM2hn" target="_blank" style="margin-left:5px"><img src="images/social 4.png" alt=""></a>
            <a  href="https://wa.me/9632081896" target="_blank" style="margin-left:5px"><img src="images/whatsappa.jpeg" alt="aa" width="30px"></a>
        </div>
      </div>
    </div>

    <!-- Navbar -->
    <header class="container">
      <nav class="navbar navbar-expand-lg navbar-light bg-light">
        <div class="container-fluid nav-cont">
          <!-- Logo -->
          <a href="index.html">
            <img src="images/ASWINI AGROTECH1.png" class="logoimg" alt="Aswini Agrotech Logo">
          </a>

          <!-- Mobile Toggler -->
          <button class="navbar-toggler" type="button" data-bs-toggle="collapse"
            data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown"
            aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
          </button>

          <!-- Navbar Links -->
          <div class="collapse navbar-collapse mainbar" id="navbarNavDropdown">
            <ul class="navbar-nav ">
              <li class="nav-item">
                <a class="nav-link headerlinks" href="index.html">Home</a>
              </li>

              <!-- Products Dropdown -->
              <li class="nav-item dropdown">
                <a class="nav-link headerlinks dropdown-toggle" href="#" role="button"
                  data-bs-toggle="dropdown" aria-expanded="false">Products</a>

                <ul class="dropdown-menu">
                  <!-- Cocopeat Products Submenu -->
                  <li class="dropdown-submenu">
                    <a class="dropdown-item dropdown-toggle" href="#">Cocopeat Products</a>
                    <ul class="dropdown-menu">
                      <li><a class="dropdown-item" href="SGB.html">Seed Germination Cocopeat bricks (SGB)</a></li>
                      <hr>
                      <li><a class="dropdown-item" href="WSG.html">Seed Germination Wet Cocopeat (WSG) Bags</a></li>
                    </ul>
                  </li>

                  <!-- Treatment Products Submenu -->
                  <li class="dropdown-submenu">
                    <a class="dropdown-item dropdown-toggle" href="#">Treatment Products</a>
                    <ul class="dropdown-menu">
                      <li><a class="dropdown-item" href="AwinSampoorn.html">Awin Sampooran</a></li>
                        <hr>
                      <li><a class="dropdown-item" href="AwinMagic.html">Awin Magic</a></li>
                        <hr>
                      <li><a class="dropdown-item" href="AwinWonder.html">Awin Wonder</a></li>
                    </ul>
                  </li>
                </ul>
              </li>

              <li class="nav-item">
                <a class="nav-link headerlinks" href="ContactUs.html">Contact</a>
              </li>
            </ul>
          </div>
        </div>
      </nav>
    </header>
  `;

  // Add header content to top of body
  document.body.insertAdjacentHTML("afterbegin", headerHTML);

  // Enable multi-level dropdown toggle behavior
  document.querySelectorAll(".dropdown-submenu > a").forEach(function (submenuLink) {
    submenuLink.addEventListener("click", function (e) {
      e.preventDefault();
      e.stopPropagation();
      const nextMenu = this.nextElementSibling;
      if (nextMenu) {
        nextMenu.classList.toggle("show");
      }
    });
  });
}

// Load header after DOM is ready
document.addEventListener("DOMContentLoaded", loadHeader);
