<script>
document.addEventListener('DOMContentLoaded', function () {
  const hexes = [
    {
      selector: '.hexbtn-tur',
      img: 'img.tn-atom__img',
      text: '.tabbtn1-1 .tn-atom',
      redSrc: 'https://static.tildacdn.one/tild3330-6161-4435-a362-623663663531/direction_6.svg',
      blackSrc: '',
      zeroblock: 'uc-tur'
    },
    {
      selector: '.hexbtn-tabata',
      img: 'img.tn-atom__img',
      text: '.tabbtn1-2 .tn-atom',
      blackSrc: 'https://static.tildacdn.one/tild3439-3534-4131-b936-393362303865/svg_1749838828235.svg',
      zeroblock: 'uc-tabata'
    },
    {
      selector: '.hexbtn-hiking',
      img: 'img.tn-atom__img',
      text: '.tn-elem__11042037161749564139092 .tn-atom',
      blackSrc: 'https://static.tildacdn.one/tild6437-6563-4262-b761-363565616537/svg_1749930344809.svg',
      zeroblock: 'uc-hiking'
    },
    {
      selector: '.hexbtn-skate',
      img: 'img.tn-atom__img',
      text: '.tn-elem__11042037161749564139100 .tn-atom',
      blackSrc: 'https://static.tildacdn.one/tild6631-6531-4761-b866-313666636663/svg_1749838895499.svg',
      zeroblock: 'uc-skate'
    },
    {
      selector: '.hexbtn-hiit',
      img: 'img.tn-atom__img',
      text: '.tn-elem__11042037161749564139108 .tn-atom',
      blackSrc: 'https://static.tildacdn.one/tild6233-3035-4631-a361-343466623263/svg_1749930354862.svg',
      zeroblock: 'uc-hiit'
    },
    {
      selector: '.hexbtn-strong',
      img: 'img.tn-atom__img',
      text: '.tn-elem__11042037161749564139119 .tn-atom',
      blackSrc: 'https://static.tildacdn.one/tild6365-3733-4435-a438-663031303436/svg_1749930358350.svg',
      zeroblock: 'uc-strong'
    },
    {
      selector: '.hexbtn-functional',
      img: 'img.tn-atom__img',
      text: '.tn-elem__11042037161749564139130 .tn-atom',
      blackSrc: 'https://static.tildacdn.one/tild3034-3230-4530-b437-613138313531/svg_1749930365215.svg',
      zeroblock: 'uc-functional'
    }
  ];

  const skateImgSrc = 'https://static.tildacdn.one/tild6631-6531-4761-b866-313666636663/svg_1749838895499.svg';
  const turRedSvg = 'https://static.tildacdn.one/tild3330-6161-4435-a362-623663663531/direction_6.svg';

  // Скрытие всех zeroblock, кроме нужного
  function showOnlyZeroBlock(activeClass) {
    const zeroBlockClasses = [
      'uc-tur', 'uc-tabata', 'uc-hiking', 'uc-skate', 'uc-hiit', 'uc-strong', 'uc-functional'
    ];
    zeroBlockClasses.forEach(c => {
      document.querySelectorAll('.' + c).forEach(el => {
        el.style.display = (c === activeClass) ? '' : 'none';
      });
    });
  }

  function setFontWeight(textEl, isBold) {
    if (!textEl) return;
    textEl.style.fontWeight = isBold ? "900" : "normal";
    var spans = textEl.querySelectorAll("span");
    spans.forEach(span => {
      span.style.fontWeight = isBold ? "900" : "normal";
      span.style.color = isBold ? "#fff" : "";
    });
    textEl.style.color = isBold ? "#fff" : "";
  }

  function activateHex(idx) {
    hexes.forEach((hex, i) => {
      var hexElem = document.querySelector(hex.selector);
      var imgElem = hexElem ? hexElem.querySelector(hex.img) : null;
      var textElem = document.querySelector(hex.text);

      // Авторские туры (0)
      if (i === 0) {
        if (idx === 0) {
          imgElem && (imgElem.src = turRedSvg);
          textElem && textElem.classList.add('hex-text-active');
          setFontWeight(textElem, true);
        } else {
          imgElem && (imgElem.src = skateImgSrc);
          textElem && textElem.classList.remove('hex-text-active');
          setFontWeight(textElem, false);
        }
      } else {
        if (i === idx) {
          imgElem && (imgElem.src = turRedSvg);
          textElem && textElem.classList.add('hex-text-active');
          setFontWeight(textElem, true);
        } else {
          imgElem && (imgElem.src = hex.blackSrc);
          textElem && textElem.classList.remove('hex-text-active');
          setFontWeight(textElem, false);
        }
      }
    });

    // Показать только нужный Zero Block
    showOnlyZeroBlock(hexes[idx].zeroblock);
  }

  // По умолчанию — Авторские туры (uc-tur)
  activateHex(0);

  // Навешиваем клики: и на hex, и на текст!
  hexes.forEach((hex, idx) => {
    var hexElem = document.querySelector(hex.selector);
    var textElem = document.querySelector(hex.text);

    if (hexElem) {
      hexElem.addEventListener('click', function () {
        activateHex(idx);
      });
    }
    if (textElem) {
      textElem.addEventListener('click', function (e) {
        e.stopPropagation();
        activateHex(idx);
      });
    }
  });
});
</script>