document.addEventListener('DOMContentLoaded', function() {
  const tabs = document.querySelectorAll('.tab');
  const panels = document.querySelectorAll('.tab-panel');
  const searchBar = document.querySelector('.search-bar');

  // Fonction pour retirer le surlignage de tous les items d'un panel
  function clearHighlights(panel) {
    panel.querySelectorAll('.checklist li').forEach(li => {
      li.classList.remove('highlight');
    });
  }

  // Gestion des onglets
  tabs.forEach((tab, idx) => {
    tab.addEventListener('click', function() {
      tabs.forEach(t => t.classList.remove('active'));
      this.classList.add('active');
      panels.forEach((panel, pIdx) => {
        if (idx === pIdx) {
          panel.classList.add('active');
          clearHighlights(panel);
        } else {
          panel.classList.remove('active');
        }
      });
      // Réinitialise la recherche lors du changement d'onglet
      searchBar.value = '';
    });
  });

  // Recherche avec surlignage et switch automatique d'onglet si besoin
  searchBar.addEventListener('input', function() {
    const query = this.value.toLowerCase();
    let foundInCurrent = false;
    let foundInOther = -1;

    panels.forEach((panel, idx) => {
      let found = false;
      panel.querySelectorAll('.checklist li').forEach(li => {
        const text = li.textContent.toLowerCase();
        if (query && text.includes(query)) {
          li.classList.add('highlight');
          found = true;
        } else {
          li.classList.remove('highlight');
        }
      });
      if (found && panel.classList.contains('active')) foundInCurrent = true;
      if (found && !panel.classList.contains('active') && foundInOther === -1) foundInOther = idx;
    });

    // Si pas trouvé dans l'onglet actif mais trouvé ailleurs, switch d'onglet
    if (!foundInCurrent && foundInOther !== -1) {
      tabs[foundInOther].click();
    }
  });
});