{% extends "admin_frontend/base.html" %}
{% load crispy_forms_tags breadcrumbs %}

{% block title %}CMS Posts{% endblock %}

{% block content %}
  {% render_breadcrumbs breadcrumbs %}
      {{ form.media }}
  <div class="bg-white rounded shadow p-4 mb-6">
    <h1 class="text-xl font-semibold mb-4">Create Post</h1>
    <form method="post" enctype="multipart/form-data" novalidate>
      {% csrf_token %}
      {{ form|crispy }}
      <div class="mt-3">
        <button type=submit class="px-4 py-2 bg-blue-600 text-white rounded hover:bg-blue-700">Create</button>
      </div>
    </form>
  </div>

  <div class="bg-white rounded shadow p-4">
    <div class="flex items-center justify-between mb-3">
      <h2 class="text-lg font-semibold">Posts</h2>
    </div>
    <form method="get" class="mb-4">
      {% if filter %}
        <div class="flex flex-wrap items-end gap-3">
          {% for f in filter.form %}
            <div class="min-w-[220px]">
              {{ f|as_crispy_field }}
            </div>
          {% endfor %}
          <div class="flex items-center gap-2">
            <button class="px-3 py-2 border rounded">Apply</button>
            <a href="?" class="px-3 py-2 border rounded">Reset</a>
          </div>
        </div>
      {% endif %}
    </form>
    <div class="overflow-x-auto">
      <table class="min-w-full text-sm">
        <thead>
          <tr class="text-left border-b">
            <th class="py-2 pr-4">Title</th>
            <th class="py-2 pr-4">Category</th>
            <th class="py-2 pr-4">Status</th>
            <th class="py-2 pr-4">Published</th>
            <th class="py-2 pr-4">Actions</th>
          </tr>
        </thead>
        <tbody>
          {% for p in posts %}
            <tr class="border-b">
              <td class="py-2 pr-4">{{ p.title }}</td>
              <td class="py-2 pr-4">{{ p.category }}</td>
              <td class="py-2 pr-4">{{ p.get_status_display }}</td>
              <td class="py-2 pr-4">{{ p.published_at|default:"–" }}</td>
              <td class="py-2 pr-4">
                <a class="text-blue-600 hover:underline" href="{% url 'cms:post_edit' p.pk %}">Edit</a>
                <form method="post" action="{% url 'cms:post_delete' p.pk %}" class="inline" onsubmit="return confirm('Delete this post?')">
                  {% csrf_token %}
                  <button class="text-red-600 hover:underline ml-3">Delete</button>
                </form>
              </td>
            </tr>
          {% empty %}
            <tr><td class="py-3" colspan="5">No posts found.</td></tr>
          {% endfor %}
        </tbody>
      </table>
    </div>

    {% include "admin_frontend/_pagination.html" %}
  </div>
{% endblock %}
