{% extends "base.html" %}

{% block title %}{{ page_title }} | Roadshow Calendar{% endblock %}

{% block content %}
<section class="section-shell page-top-space">
  <div class="container">
    <div class="row justify-content-center">
      <div class="col-xl-8">
        <div class="card-surface form-card">
          <div class="section-heading mb-4">
            <span class="eyebrow-pill">{% if form_mode == 'edit' %}Edit event{% else %}Create event{% endif %}</span>
            <h1 class="section-title">{{ form_title }}</h1>
            <p class="section-copy">{{ form_intro }}</p>
          </div>
          <form method="post" novalidate>
            {% csrf_token %}
            <div class="row g-3">
              <div class="col-md-6">
                <label class="form-label" for="{{ form.name.id_for_label }}">{{ form.name.label }}</label>
                {{ form.name }}
                {% if form.name.help_text %}<div class="form-help">{{ form.name.help_text }}</div>{% endif %}
                {% for error in form.name.errors %}<div class="field-error">{{ error }}</div>{% endfor %}
              </div>
              <div class="col-md-6">
                <label class="form-label" for="{{ form.location.id_for_label }}">{{ form.location.label }}</label>
                {{ form.location }}
                {% if form.location.help_text %}<div class="form-help">{{ form.location.help_text }}</div>{% endif %}
                {% for error in form.location.errors %}<div class="field-error">{{ error }}</div>{% endfor %}
              </div>
              <div class="col-md-6">
                <label class="form-label" for="{{ form.start.id_for_label }}">{{ form.start.label }}</label>
                {{ form.start }}
                {% if form.start.help_text %}<div class="form-help">{{ form.start.help_text }}</div>{% endif %}
                {% for error in form.start.errors %}<div class="field-error">{{ error }}</div>{% endfor %}
              </div>
              <div class="col-md-6">
                <label class="form-label" for="{{ form.end.id_for_label }}">{{ form.end.label }}</label>
                {{ form.end }}
                {% if form.end.help_text %}<div class="form-help">{{ form.end.help_text }}</div>{% endif %}
                {% for error in form.end.errors %}<div class="field-error">{{ error }}</div>{% endfor %}
              </div>
              <div class="col-md-6">
                <label class="form-label" for="{{ form.event_url.id_for_label }}">{{ form.event_url.label }}</label>
                {{ form.event_url }}
                {% if form.event_url.help_text %}<div class="form-help">{{ form.event_url.help_text }}</div>{% endif %}
                {% for error in form.event_url.errors %}<div class="field-error">{{ error }}</div>{% endfor %}
              </div>
              <div class="col-12">
                <label class="form-label" for="{{ form.summary.id_for_label }}">{{ form.summary.label }}</label>
                {{ form.summary }}
                {% if form.summary.help_text %}<div class="form-help">{{ form.summary.help_text }}</div>{% endif %}
                {% for error in form.summary.errors %}<div class="field-error">{{ error }}</div>{% endfor %}
              </div>
              <div class="col-12">
                <div class="form-check card-check">
                  {{ form.is_published }}
                  <label class="form-check-label" for="{{ form.is_published.id_for_label }}">Publish this event publicly</label>
                  {% if form.is_published.help_text %}<div class="form-help">{{ form.is_published.help_text }}</div>{% endif %}
                </div>
                {% for error in form.is_published.errors %}<div class="field-error">{{ error }}</div>{% endfor %}
              </div>
            </div>

            {% if form_mode == 'create' %}
            <div class="mt-4 pt-4 border-top">
              <div class="section-heading mb-3">
                <h2 class="h4 mb-2">Repeat weekly (optional)</h2>
                <p class="section-copy mb-0">Use the same event details and time range to create one event per week within a date window.</p>
              </div>
              <div class="row g-3">
                <div class="col-md-4">
                  <label class="form-label" for="{{ form.recurrence_start_date.id_for_label }}">{{ form.recurrence_start_date.label }}</label>
                  {{ form.recurrence_start_date }}
                  {% if form.recurrence_start_date.help_text %}<div class="form-help">{{ form.recurrence_start_date.help_text }}</div>{% endif %}
                  {% for error in form.recurrence_start_date.errors %}<div class="field-error">{{ error }}</div>{% endfor %}
                </div>
                <div class="col-md-4">
                  <label class="form-label" for="{{ form.recurrence_end_date.id_for_label }}">{{ form.recurrence_end_date.label }}</label>
                  {{ form.recurrence_end_date }}
                  {% if form.recurrence_end_date.help_text %}<div class="form-help">{{ form.recurrence_end_date.help_text }}</div>{% endif %}
                  {% for error in form.recurrence_end_date.errors %}<div class="field-error">{{ error }}</div>{% endfor %}
                </div>
                <div class="col-md-4">
                  <label class="form-label" for="{{ form.recurrence_weekday.id_for_label }}">{{ form.recurrence_weekday.label }}</label>
                  {{ form.recurrence_weekday }}
                  {% if form.recurrence_weekday.help_text %}<div class="form-help">{{ form.recurrence_weekday.help_text }}</div>{% endif %}
                  {% for error in form.recurrence_weekday.errors %}<div class="field-error">{{ error }}</div>{% endfor %}
                </div>
              </div>
            </div>
            {% endif %}

            {% if form.non_field_errors %}
            <div class="field-error mt-3">{{ form.non_field_errors }}</div>
            {% endif %}
            <div class="d-flex gap-2 flex-wrap mt-4">
              <button class="btn btn-primary-brand" type="submit">{{ submit_label }}</button>
              <a class="btn btn-ghost" href="{% if event %}{% url 'event_dashboard_detail' event.slug %}{% else %}{% url 'event_dashboard' %}{% endif %}">Cancel</a>
            </div>
          </form>
        </div>
      </div>
    </div>
  </div>
</section>
{% endblock %}