lychak_vlad

const accordions = document.querySelectorAll('.accordion');
const accordionsButtons = document.querySelectorAll(".accordion__tittle")
const accordionsDataboxes =  document.querySelectorAll(".accordion__content");

accordions.forEach(n => {
     const currentButton = n.querySelector(".accordion__tittle");
     const currentDatabox = n.querySelector(".accordion__content");

     const toggleActiveElements = () => {
          accordionsButtons.forEach(v => {
               if (v !== currentButton) {
                    v.classList.remove("open");
               }
          });

          accordionsDataboxes.forEach(v => {
               if (v !== currentDatabox) {
                    v.classList.remove("open");
                    v.style.setProperty("--height", "0px");
               }
          });

          currentButton.classList.toggle("open");
          currentDatabox.classList.toggle("open");

          currentDatabox.classList.contains("open")
               ? currentDatabox.style.setProperty("--height", `${currentDatabox.scrollHeight}px`)
               : currentDatabox.style.setProperty("--height", "0px");
     };

     currentButton.addEventListener("click", toggleActiveElements);
});

.accordion__content.open {
    max-height: var(--height, 0);
  }

const control = self.querySelector('.accordion__control');
const content = self.querySelector('.accordion__content');

new Swiper('.swiper', {
  navigation: {
    nextEl: '.my-awesome-slider-button-next',
    prevEl: '.my-awesome-slider-button-prev',
  },
});

.my-awesome-slider-button-prev { /* ...styles */ };
.my-awesome-slider-button-next { /* ...styles */ };