<!-- Красивые URL-ссылки на стандартных табах на Тильде @Archakov -->
<!-- Размести внизу страницы -->


<script>
(function () {
  const hash2tabnum = {
    '#kitchen': 1,      // Таб 1 #kitchen замени на свой #svoi_variant
    '#place': 2,        // Таб 2 # замени на свой
    '#relax': 3         // Таб 3 # замени на свой
  };
  const tabnum2hash = {};
  for (const k in hash2tabnum) tabnum2hash[hash2tabnum[k]] = k;

  const blockId = 'rec1042748271'; // укажи recID блока ME603 
  const scrollOffset = 80; // Погрешность/отступ сверху в пикселях чтобы меню не перекрывало табы

  function scrollToTabs() {
    const el = document.getElementById(blockId);
    if (el) {
      // С учётом offset
      const rect = el.getBoundingClientRect();
      const top = window.pageYOffset + rect.top - scrollOffset;
      window.scrollTo({ top, behavior: 'smooth' });
    }
  }

  function openTabByPrettyHash(hash) {
    const tabnum = hash2tabnum[hash];
    if (!tabnum) return;
    const block = document.getElementById(blockId);
    if (!block) return;

    const tabBtn = block.querySelector('.t397__tab[data-tab-number="' + tabnum + '"] .t397__title');
    if (tabBtn) {
      tabBtn.click();
      setTimeout(scrollToTabs, 100);
    } else {
      setTimeout(function () { openTabByPrettyHash(hash); }, 120);
    }
  }

  function bindTabClicks() {
    const block = document.getElementById(blockId);
    if (!block) return;
    const tabs = block.querySelectorAll('.t397__tab');
    tabs.forEach(tab => {
      const tabnum = tab.getAttribute('data-tab-number');
      const prettyHash = tabnum2hash[tabnum];
      if (prettyHash) {
        const btn = tab.querySelector('.t397__title');
        if (btn) {
          btn.addEventListener('click', function () {
            setTimeout(() => {
              history.replaceState(null, '', prettyHash);
              scrollToTabs();
            }, 120);
          });
        }
      }
    });
  }

  function waitForTabsAndBind(cb) {
    let inited = false;
    function tryInit() {
      const block = document.getElementById(blockId);
      const tab = block && block.querySelector('.t397__tab');
      if (block && tab) {
        if (!inited) {
          inited = true;
          cb();
        }
      }
    }
    tryInit();
    const observer = new MutationObserver(tryInit);
    observer.observe(document.body, { childList: true, subtree: true });
    setTimeout(() => observer.disconnect(), 8000);
  }

  function handlePrettyHash() {
    const hash = window.location.hash;
    if (hash2tabnum[hash]) {
      openTabByPrettyHash(hash);
    }
  }
  window.addEventListener('hashchange', handlePrettyHash);

  waitForTabsAndBind(() => {
    bindTabClicks();
    setTimeout(handlePrettyHash, 100);
  });

  setTimeout(handlePrettyHash, 500);
})();
</script>