document.addEventListener('DOMContentLoaded', () => {
  const tabs = document.querySelectorAll('.tab-item');
  const panes = document.querySelectorAll('.tab-pane');
  const pageKey = window.location.pathname;
  const storageKey = `activeTab-${pageKey}`;

  const isTabEnabled = (tab) =>
    !!tab && !tab.classList.contains('disabled') && tab.getAttribute('aria-disabled') !== 'true';

  // >>>> NEU: Pane darf nicht "locked" sein
  const isPaneUnlocked = (tab) => {
    const pane = document.getElementById(tab.dataset.tab);
    return pane && !pane.classList.contains('locked');
  };

  // >>>> NEU: alle aktivierbaren Tabs filtern
  const eligibleTabs = () =>
    Array.from(tabs).filter(t => isTabEnabled(t) && isPaneUnlocked(t));

  const activate = (tabId) => {
    const tab = document.querySelector(`.tab-item[data-tab="${tabId}"]`);
    const pane = document.getElementById(tabId);
    if (!isTabEnabled(tab) || !pane || pane.classList.contains('locked')) return false;

    tabs.forEach(t => t.classList.remove('active'));
    panes.forEach(p => p.classList.remove('show', 'active'));

    tab.classList.add('active');
    pane.classList.add('show', 'active');
    sessionStorage.setItem(storageKey, tabId);
    window.scrollTo({ top: 0, behavior: 'smooth' });
    return true;
  };

  // Restore: saved oder letzter erlaubter
  const saved = sessionStorage.getItem(storageKey);
  if (!saved || !activate(saved)) {
    const els = eligibleTabs();
    const last = els[els.length - 1];
    if (last) activate(last.dataset.tab);
  }

  // Click: ignoriert disabled
  tabs.forEach(tab => {
    tab.addEventListener('click', () => {
      if (!isTabEnabled(tab) || !isPaneUnlocked(tab)) return;
      activate(tab.getAttribute('data-tab'));
    });
  });

  const nextEnabled = (from, dir = 'next') => {
    let el = from;
    while (el = el?.[dir + 'ElementSibling']) {
      if (isTabEnabled(el) && isPaneUnlocked(el)) return el;
    }
    return null;
  };

  document.querySelectorAll('.nexttab').forEach(btn => {
    btn.addEventListener('click', () => {
      const currentTab = document.querySelector('.tab-item.active');
      const nextTab = nextEnabled(currentTab, 'next');
      if (nextTab) activate(nextTab.getAttribute('data-tab'));
    });
  });

  document.querySelectorAll('.prevtab').forEach(btn => {
    btn.addEventListener('click', () => {
      const currentTab = document.querySelector('.tab-item.active');
      const prevTab = nextEnabled(currentTab, 'previous');
      if (prevTab) activate(prevTab.getAttribute('data-tab'));
    });
  });

  document.querySelectorAll('.jumptotab').forEach(btn => {
    btn.addEventListener('click', () => {
      activate(btn.getAttribute('data-target'));
    });
  });
});