{% extends 'panel/base.html' %}

{% block panel_title %}{{ active_tab.title }}{% endblock %}
{% block heading %}{{ active_tab.title }}{% endblock %}
{% block subheading %}<p class="text-sm text-slate-500 dark:text-slate-400">{{ active_tab.description }}</p>{% endblock %}

{% block content %}
<form method="post" enctype="multipart/form-data" novalidate class="max-w-3xl space-y-4">
  {% csrf_token %}

  {% if active_tab.intro %}
    <p class="text-sm leading-relaxed text-slate-600 dark:text-slate-300">{{ active_tab.intro }}</p>
  {% endif %}

  {% if groups %}
    {% for item in groups %}
      <section class="card">
        <div class="card-body space-y-4">
          <div class="space-y-1">
            <h2 class="text-sm font-semibold text-slate-900 dark:text-slate-100">{{ item.group.title }}</h2>
            {% if item.group.description %}<p class="help">{{ item.group.description }}</p>{% endif %}
          </div>
          <div class="{{ item.group.grid_class }}">
            {% for field in item.fields %}{% include 'panel/partials/field.html' %}{% endfor %}
          </div>
          {% if item.group.partial %}{% include item.group.partial %}{% endif %}
          {% if item.group.note %}
            <p class="help border-t border-slate-200 pt-3 dark:border-slate-800">{{ item.group.note }}</p>
          {% endif %}
        </div>
      </section>
    {% endfor %}
  {% else %}
    <div class="card">
      <div class="card-body">{% include 'panel/partials/form.html' %}</div>
    </div>
  {% endif %}

  <div class="card save-bar">
    <div class="card-body space-y-3">
      {% include "panel/partials/dirty-note.html" %}
      {% if form.instance.updated_at %}
        <p class="help">Ostatnia zmiana: {{ form.instance.updated_at|date:"d.m.Y H:i" }}</p>
      {% endif %}
      <button class="btn-primary" type="submit">Zapisz ustawienia</button>
    </div>
  </div>
</form>
{% endblock %}