{% extends "base.html" %}

{% block title %}Brand Management{% endblock %}

{% block content %}
<main>
  <div class="header">
    <h1>Brand <span>Management</span></h1>
    <p>Add, edit, and manage brands in the system.</p>
  </div>

  <div class="brand-list-container">
    <div class="card-header">
        <h3>All Brands</h3>
        <a href="{% url 'brand-add' %}" class="btn btn-review">Add New Brand</a>
    </div>
    <div class="incident-card">
        <table class="brand-table">
            <thead>
                <tr>
                    <th>Name</th>
                    <th>Website</th>
                    <th>Created At</th>
                    <th>Actions</th>
                </tr>
            </thead>
            <tbody>
                {% for brand in brands %}
                <tr>
                    <td>{{ brand.name }}</td>
                    <td><a href="{{ brand.website }}" target="_blank">{{ brand.website }}</a></td>
                    <td>{{ brand.created_at|date:"Y-m-d" }}</td>
                    <td>
                        <a href="{% url 'brand-edit' brand.pk %}" class="btn btn-secondary">Edit</a>
                        <a href="{% url 'brand-delete' brand.pk %}" class="btn btn-danger">Delete</a>
                    </td>
                </tr>
                {% empty %}
                <tr>
                    <td colspan="4">No brands found.</td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
  </div>
</main>
{% endblock %}
