script.js

const buttons = document.querySelectorAll('.lightbox-item');
const modals = document.querySelectorAll('.lightbox-modal');

let lastFocusedElement = null;

function showModal(id) {
  lastFocusedElement = document.activeElement;
  const m = document.getElementById(id);
  m.classList.add('show');
  document.body.style.overflow = 'hidden';

  // Fokus auf ersten interaktiven Button (meist Close)
  const focusable = getFocusableElements(m);
  if (focusable.length) {
    focusable[0].focus();
  }
}

function hideModals() {
  modals.forEach(m => m.classList.remove('show'));
  document.body.style.overflow = '';

  // Fokus zurückgeben
  if (lastFocusedElement) {
    lastFocusedElement.focus();
    lastFocusedElement = null;
  }
}

// Hilfsfunktion: Alle Fokus-Elemente im Modal finden
function getFocusableElements(container) {
  return Array.from(
    container.querySelectorAll(
      'a[href], button, textarea, input, select, [tabindex]:not([tabindex="-1"])'
    )
  ).filter(el => !el.disabled && el.offsetParent !== null);
}

// Event-Listener für Buttons
buttons.forEach(b => {
  b.addEventListener('click', () => {
    hideModals();
    showModal(b.dataset.modal);
  });
});

// Event-Listener für Modals
modals.forEach(m => {
  const closeBtn = m.querySelector('.close');
  if (closeBtn) {
    closeBtn.addEventListener('click', hideModals);
  }

  // Klick außerhalb → schließen
  m.addEventListener('click', event => {
    if (event.target === m) {
      hideModals();
    }
  });

  // Fokusfalle
  m.addEventListener('keydown', e => {
    if (e.key === 'Tab') {
      const focusable = getFocusableElements(m);
      if (!focusable.length) return;

      const first = focusable[0];
      const last = focusable[focusable.length - 1];

      if (e.shiftKey && document.activeElement === first) {
        e.preventDefault();
        last.focus();
      } else if (!e.shiftKey && document.activeElement === last) {
        e.preventDefault();
        first.focus();
      }
    }
  });
});

// ESC schließt Modal
document.addEventListener('keydown', e => {
  if (e.key === 'Escape') {
    hideModals();
  }
});