{% extends '_base.html' %}
{% load static %}
{% load card_multiselect %}

{% block title %}Create Trade Offer{% endblock title %}

{% block content %}
<h2>Create a Trade Offer</h2>
<form method="post" novalidate>
    {% csrf_token %}
    {# Render the non–Select2 field normally (e.g. initiated_by) #}
    <div class="mb-3">
      <label for="initiated_by" class="form-label">Initiated by</label>
      {{ form.initiated_by }}
    </div>
    <div class="mb-3">
      {% card_multiselect "have_cards" "Have:" available_cards "Select one or more cards..." form.have_cards.value %}
    </div>
    <div class="mb-3">
      {% card_multiselect "want_cards" "Want:" available_cards "Select one or more cards..." form.want_cards.value %}
    </div>
    
    <button type="submit" class="btn btn-primary">Submit</button>
</form>

{% if form.errors %}
    <div class="alert alert-danger">
        <strong>Please correct the errors below:</strong>
        <ul>
            {% for field in form %}
                {% for error in field.errors %}
                    <li>{{ error }}</li>
                {% endfor %}
            {% endfor %}
            {% for error in form.non_field_errors %}
                <li>{{ error }}</li>
            {% endfor %}
        </ul>
    </div>
{% endif %}
{% endblock content %}