const tabs = document.querySelectorAll(".tab");
const panes = document.querySelectorAll(".faq-pane");

tabs.forEach(tab => {
    tab.addEventListener("click", () => {

        tabs.forEach(t => t.classList.remove("active"));
        tab.classList.add("active");

        panes.forEach(p => p.classList.remove("active"));

        document.getElementById(tab.dataset.tab).classList.add("active");
    });
});

const faqItems = document.querySelectorAll(".faq-item");

faqItems.forEach(item => {
    const header = item.querySelector(".faq-header");

    header.addEventListener("click", () => {

        faqItems.forEach(i => {
            if (i !== item) {
                i.classList.remove("active");
                i.querySelector(".faq-icon").innerText = "+";
            }
        });

        item.classList.toggle("active");

        const icon = item.querySelector(".faq-icon");
        icon.innerText = item.classList.contains("active") ? "−" : "+";
    });
});