{% extends 'base.html' %}
{% block title %}Categories{% endblock %}
{% block content %}
<div class="content-card">
    <div class="content-card-header">
        <strong class="text-white">Categories</strong>
        <a href="{% url 'category_create' %}" class="btn btn-success btn-sm"><i class="fas fa-plus"></i> Add Category</a>
    </div>
    <div class="content-card-body p-0">
        <div class="table-responsive">
        <table class="table mb-0">
            <thead><tr><th>Name</th><th>Status</th><th></th></tr></thead>
            <tbody>
            {% for c in categories %}
                <tr>
                    <td class="text-white">{{ c.name }}</td>
                    <td>{% if c.is_active %}<span class="badge bg-success">Active</span>{% else %}<span class="badge bg-secondary">Inactive</span>{% endif %}</td>
                    <td>
                        <a href="{% url 'category_update' c.pk %}" class="btn btn-outline-light btn-sm"><i class="fas fa-pen"></i></a>
                        <form method="POST" action="{% url 'category_delete' c.pk %}" class="d-inline" onsubmit="return confirm('Delete this category?');">{% csrf_token %}
                            <button class="btn btn-danger btn-sm"><i class="fas fa-trash"></i></button>
                        </form>
                    </td>
                </tr>
            {% empty %}
                <tr><td colspan="3" class="text-center text-secondary py-4">No categories yet.</td></tr>
            {% endfor %}
            </tbody>
        </table>
        </div>
    </div>
</div>
{% endblock %}