let activeTooltipId = null;
let activeAnchorId = null;

// Tooltip anzeigen
function showProgressiveTooltip(tooltipId, anchorId) {
  const scrollPos = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop || 0;
  const a = document.getElementById(anchorId);
  const t = document.getElementById(tooltipId);

  t.children[0].innerHTML = a.dataset.tooltip ;
  document.getElementById('progressive-tooltip').classList.add("display-flex");
  
  t.classList.remove('leaving');
  const tooltipRect = t.getBoundingClientRect();
  const anchorRect = a.getBoundingClientRect();
  activeTooltipId = tooltipId;
  activeAnchorId = anchorId;
  
  if (anchorRect.top >= 100) {
    t.classList.add('tooltip-top');
    t.classList.remove('tooltip-bottom');
    t.style.top = anchorRect.top - tooltipRect.height + scrollPos - 6 + "px";
  } else {
    t.classList.remove('tooltip-top');
    t.classList.add('tooltip-bottom');
    t.style.top = anchorRect.bottom + scrollPos + 6 + "px";
  }
  const l = (anchorRect.right + anchorRect.left) / 2 - tooltipRect.width / 2;
  const left = Math.max(16, l);
  t.style.left = left + "px";
   
  const arrowLeft = l - left + tooltipRect.width / 2;
  document.documentElement.style.setProperty('--tooltip-arrow-left', `${arrowLeft}px`);

  // Event zum Schließen außerhalb hinzufügen (nur mobil)
  if (document.getElementById('pda')) {
    document.addEventListener('click', handleOutsideClick);
  }
}

function hideProgressiveTooltip(tooltipId) {
  document.getElementById(tooltipId).classList.add("leaving");
  activeTooltipId = null;
  activeAnchorId = null;

  // Event entfernen
  document.removeEventListener('click', handleOutsideClick);
}

// Klick außerhalb des Tooltips behandeln
function handleOutsideClick(event) {
  if (!activeTooltipId) return;

  const tooltip = document.getElementById(activeTooltipId);
  const anchor = document.getElementById(activeAnchorId);

  // Schließt den Tooltip nur, wenn außerhalb von Tooltip oder Anker geklickt wird
  if (tooltip && !tooltip.contains(event.target) && anchor && !anchor.contains(event.target)) {
    hideProgressiveTooltip(activeTooltipId);
  }
}