document.addEventListener("DOMContentLoaded", function () {
  const buttons = document.querySelectorAll('.filter-btn');
  const cards = document.querySelectorAll('.chapter-listing-card');

  if (!buttons.length || !cards.length) {
    console.warn("Filter script loaded, but no buttons or cards found.");
    return;
  }

  buttons.forEach(btn => {
    btn.addEventListener('click', () => {
      // Update active button state
      buttons.forEach(b => b.classList.remove('active'));
      btn.classList.add('active');

      const day = btn.dataset.day;

      // Show/hide cards
      cards.forEach(card => {
        if (day === 'all' || card.dataset.day === day) {
          card.classList.remove('hidden');
        } else {
          card.classList.add('hidden');
        }
      });
    });
  });
});