// Beispielhafte Terminliste (du kannst sie später aus HTML oder JSON laden)
const rawTermine = [
    { date: '2025-11-09', text: 'St. Paulus Blues, Langenhagen' },
    { date: '2026-03-14', text: 'Wohnzimmerkonzert, Celle' },
    { date: '2025-06-28', text: 'Bluesfestival Barsinghausen' },
    { date: '2025-12-27', text: 'Zum Mühlengrund, Wienhausen' },
    { date: '2025-02-08', text: 'Rock- und Beatnacht, Ovelgönne' },
    { date: '2026-03-08', text: 'Clubhaus 06, Hannover' },
    { date: '2025-06-13', text: 'RIX, Hannover' }
];

// 🔍 Hilfsfunktionen
const today = new Date();
const parseDate = str => new Date(str);
const formatDate = date => date.toLocaleDateString('de-DE', { day: '2-digit', month: 'long', year: 'numeric' });

// 🔄 Sortieren & Gruppieren
const kommende = [];
const vergangene = [];
let nextTermin = null;

rawTermine.sort((a, b) => parseDate(a.date) - parseDate(b.date)).forEach(t => {
    const terminDate = parseDate(t.date);
    if (terminDate >= today) {
        if (!nextTermin) {
            nextTermin = t;
        } else {
            kommende.push(t);
        }
    } else {
        vergangene.push(t);
    }
});

// 🧱 DOM-Rendering
const container = document.getElementById('termine');
container.innerHTML = `
  <h2>Termine</h2>

  <div class="termin next">
    <strong>${formatDate(nextTermin.date)} – ${nextTermin.text}</strong>
  </div>

  <div class="kommende">
    <h3>Kommende Termine</h3>
    <ul>
      ${kommende.map(t => `<li>${formatDate(t.date)} – ${t.text}</li>`).join('')}
    </ul>
  </div>

  <div class="vergangen">
    <h3>Vergangene Termine ${today.getFullYear()}</h3>
    <ul>
      ${vergangene.map(t => `<li>${formatDate(t.date)} – ${t.text}</li>`).join('')}
    </ul>
  </div>

  <div class="archiv">
    <details>
      <summary>Termine 2024</summary>
      <ul><li>…</li></ul>
    </details>
    <details>
      <summary>Termine 2023</summary>
      <ul><li>…</li></ul>
    </details>
  </div>
`;