(function() {
  var container = document.getElementById('longform-content');
  var tocList = document.getElementById('toc-list');
  if (!container || !tocList) return;

  var sections = container.querySelectorAll('section[id]');
  var allLinks = [];

  if (sections.length > 0) {
    // composite page (manual, spec): section-level ToC with disclosure
    var lastGroup = null;
    sections.forEach(function(sec) {
      // Insert group header when group changes
      var group = sec.dataset.tocGroup;
      if (group && group !== lastGroup) {
        var gh = document.createElement('li');
        gh.className = 'toc-group-header';
        gh.textContent = group;
        tocList.appendChild(gh);
        lastGroup = group;
      }

      var li = document.createElement('li');
      li.className = 'toc-section';
      var a = document.createElement('a');
      a.href = '#' + sec.id;
      a.textContent = sec.dataset.tocTitle || sec.id;

      var h2s = sec.querySelectorAll('h2');
      if (h2s.length > 0) {
        var toggle = document.createElement('span');
        toggle.className = 'toc-arrow';
        toggle.textContent = '\u25B8';
        li.appendChild(toggle);
        li.appendChild(a);

        var sub = document.createElement('ul');
        sub.className = 'toc-sub';
        h2s.forEach(function(h) {
          if (!h.id) return;
          var sli = document.createElement('li');
          var sa = document.createElement('a');
          sa.href = '#' + h.id;
          sa.textContent = h.textContent;
          sli.appendChild(sa);
          sub.appendChild(sli);
        });
        li.appendChild(sub);

        toggle.addEventListener('click', function(e) {
          e.preventDefault();
          li.classList.toggle('open');
        });
      } else {
        li.appendChild(a);
      }

      allLinks.push({el: sec, link: a, parent: li});
      tocList.appendChild(li);
    });

    var currentSection = null;
    var observer = new IntersectionObserver(function(entries) {
      entries.forEach(function(entry) {
        if (entry.isIntersecting) {
          if (currentSection) currentSection.classList.remove('active');
          var item = allLinks.find(function(i) { return i.el === entry.target; });
          if (item) {
            item.link.classList.add('active');
            currentSection = item.link;
            item.parent.classList.add('open');
          }
        }
      });
    }, {rootMargin: '0px 0px -70% 0px', threshold: 0});

    sections.forEach(function(sec) { observer.observe(sec); });
  } else {
    // standalone page (cli, contributing): flat h2-only ToC
    var headings = container.querySelectorAll('h2');
    if (headings.length === 0) return;

    headings.forEach(function(h) {
      var li = document.createElement('li');
      li.className = 'toc-section';
      var a = document.createElement('a');
      a.href = '#' + h.id;
      a.textContent = h.textContent;
      li.appendChild(a);
      tocList.appendChild(li);
      allLinks.push({el: h, link: a});
    });

    var current = null;
    var obs = new IntersectionObserver(function(entries) {
      entries.forEach(function(entry) {
        if (entry.isIntersecting) {
          if (current) current.classList.remove('active');
          var item = allLinks.find(function(i) { return i.el === entry.target; });
          if (item) {
            item.link.classList.add('active');
            current = item.link;
          }
        }
      });
    }, {rootMargin: '0px 0px -70% 0px', threshold: 0});

    headings.forEach(function(h) { obs.observe(h); });
  }
})();
