Untitled

<script>
  const tabs = document.querySelectorAll(".tab-item");
  const panes = document.querySelectorAll(".tab-pane");

  tabs.forEach((tab, index) => {
    tab.addEventListener("click", function () {
      // Remove active class from all tabs and panes
      tabs.forEach((tab) => tab.classList.remove("active"));
      panes.forEach((pane) => pane.classList.remove("active"));

      // Add active class to clicked tab
      this.classList.add("active");

      // Show corresponding pane
      panes[index].classList.add("active");
    });
  });
</script>