document.addEventListener("DOMContentLoaded", function () {
    // Скрываем или показываем содержимое блока
    const toggleContentVisibility = (content, button) => {
        const isHidden = content.style.display === "none";
        content.style.display = isHidden ? "block" : "none";
        button.textContent = isHidden ? "▲" : "▼";
    };

    // Инициализируем все блоки с классом "check-form-tabs"
    document.querySelectorAll(".check-form-tabs").forEach((tab, index) => {
        const heading = tab.querySelector(".heading");
        const content = tab.querySelector(".table-scrollable");

        if (heading && content) {
            // Добавляем кнопку для визуального отображения состояния
            const toggleButton = document.createElement("button");
            toggleButton.textContent = index === 0 ? "▼" : "▲"; // Первая кнопка закрыта
            Object.assign(toggleButton.style, {
                padding: "0 0 0 4px",
                border: "none",
                background: "none",
                cursor: "pointer",
            });
            heading.appendChild(toggleButton);

            // Скрываем содержимое первого блока
            content.style.display = index === 0 ? "none" : "block";

            // Добавляем обработчик клика на заголовок
            heading.addEventListener("click", () => toggleContentVisibility(content, toggleButton));
        }
    });

    // Стилизация заголовков
    document.querySelectorAll(".heading").forEach((heading) => {
        Object.assign(heading.style, {
            display: "flex",
            alignItems: "center",
            cursor: "pointer", // Добавляем указатель для визуальной подсказки
        });
    });

    document.querySelectorAll(".media-heading").forEach((heading) => {
        heading.style.marginBottom = "3px";
    });
});