{% extends "admin/layout.html" %}
{% block content %}
<h2 class="text-xl font-bold text-slate-800 mb-4">{{ legend }}</h2>
<form method="POST" action="" enctype="multipart/form-data">
  {{ form.hidden_tag() }}
  <div class="space-y-4 max-w-xl">
    <div>
      {{ form.title.label(class="label-field") }}
      {% if form.title.errors %}{{ form.title(class="input-field border-red-400") }}
      {% else %}{{ form.title(class="input-field") }}{% endif %}
      {% for error in form.title.errors %}<p class="text-xs text-red-500 mt-1">{{ error }}</p>{% endfor %}
    </div>

    <div>
      {{ form.content.label(class="label-field") }}
      {{ form.content(class="input-field", rows=4) }}
    </div>

    <div>
      {{ form.thumbnail.label(class="label-field") }}
      {{ form.thumbnail(class="input-field") }}
      <p class="text-xs text-slate-400 mt-1">Format: jpg, jpeg, png, gif, webp.</p>
    </div>

    <div class="flex items-center gap-2">
      {{ form.is_active(class="w-4 h-4") }}
      {{ form.is_active.label(class="text-sm text-slate-600") }}
    </div>

    <div>{{ form.submit(class="btn-primary") }}</div>
  </div>
</form>
{% endblock content %}