{% extends 'base.html' %}
{% block title %}{% if product %}Edit{% else %}Add{% endif %} Product — PickkerMarket{% endblock %}
{% block content %}
<section class="content-section">
    <form class="auth-form" method="post" enctype="multipart/form-data" novalidate>
        {% csrf_token %}
        <h1>{% if product %}Edit{% else %}Add{% endif %} Product</h1>

        {% for field in form %}
            <label for="{{ field.id_for_label }}">{{ field.label }}</label>
            {{ field }}
            {% if field.help_text %}<small style="color: var(--muted);">{{ field.help_text }}</small>{% endif %}
            {% if field.errors %}<div class="field-error">{{ field.errors }}</div>{% endif %}
        {% endfor %}

        <button type="submit" class="btn-cta">Save Product</button>
    </form>

    {% if product %}
    <p class="auth-switch"><a href="{% url 'accounts:admin_product_measures' product.id %}">Manage measures (bucket, sack, sadolin, piece) &rarr;</a></p>
    {% endif %}

    <div class="category-manager">
        <h3 style="margin-bottom: 8px;">Registered categories</h3>
        <p style="color: var(--muted); font-size: 0.85rem; margin-bottom: 10px;">
            Categories offered above come from this registered list — add a new one here if it's missing.
        </p>
        {% if categories %}
        <div class="category-chip-row">
            {% for c in categories %}<span class="category-chip">{{ c.name }}</span>{% endfor %}
        </div>
        {% endif %}
        <form method="post" action="{% url 'accounts:admin_add_category' %}" class="category-add-form">
            {% csrf_token %}
            <input type="hidden" name="next" value="{{ request.path }}">
            <input type="text" name="new_category_name" placeholder="e.g. Dairy" maxlength="100" required>
            <button type="submit" class="btn-small">+ Add category</button>
        </form>
    </div>

    <p class="auth-switch"><a href="{% url 'accounts:admin_portal' %}">&larr; Back to admin portal</a></p>
</section>
{% endblock %}