{% extends shell_base %}

{% block title %}Planung · CheckPoint Ehrenamt{% endblock %}

{% block content %}
  <h1>Planung</h1>

  <div class="cp-actions">
    <a class="cp-btn cp-btn--ghost" href="{{ url_for('planung.einzeltermine') }}">Einzeltermine</a>
  </div>

  <form method="post" action="{{ url_for('planung.liste') }}" class="cp-form">
    <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">

    <div class="cp-field">
      <label for="name">Name des Zeitraums</label>
      <input type="text" id="name" name="name" placeholder="z. B. Herbst 2026" required>
    </div>

    <div class="cp-field">
      <label for="start_datum">Start</label>
      <input type="date" id="start_datum" name="start_datum" required>
    </div>

    <div class="cp-field">
      <label for="end_datum">Ende</label>
      <input type="date" id="end_datum" name="end_datum" required>
      <small class="cp-muted">Mindestens 2 Monate.</small>
    </div>

    <button type="submit" class="cp-btn cp-btn--primary">Zeitraum anlegen</button>
  </form>

  <h2>Zeiträume</h2>
  <ul class="cp-list">
    {% for zr in zeitraeume %}
      <li class="cp-card">
        <a href="{{ url_for('planung.detail', zeitraum_id=zr.id) }}">
          <strong>{{ zr.name }}</strong>
        </a>
        <div class="cp-muted">
          {{ zr.start_datum.strftime('%d.%m.%Y') }} – {{ zr.end_datum.strftime('%d.%m.%Y') }}
        </div>
        <span class="cp-tag">
          {{ "Veröffentlicht" if zr.ist_veroeffentlicht else "In Planung" }}
        </span>
      </li>
    {% else %}
      <li class="cp-muted">Noch keine Planungszeiträume.</li>
    {% endfor %}
  </ul>
{% endblock %}