{% extends "pos/base.html" %}
{% block title %}{% if is_edit %}Edit{% else %}Add{% endif %} Spec A Assignment{% endblock %}
{% block heading %}{% if is_edit %}Edit{% else %}Add{% endif %} Spec A Assignment{% endblock %}

{% block content %}
<div class="d-flex mb-3">
    <a class="btn btn-secondary font-weight-bold" href="{% url 'authentication:sub_tenant_spec_a_list' %}">
        <i class="fas fa-arrow-left"></i> Back to List
    </a>
</div>

<div class="card">
    <div class="card-header bg-primary text-white">
        <strong>
            <i class="fas fa-link"></i>
            {% if is_edit %}
                Edit Assignment: {{ assignment.sub_tenant.name }} ↔ {{ assignment.spec_a.name }}
            {% else %}
                New Spec A Assignment
            {% endif %}
        </strong>
    </div>
    <div class="card-body">
        <form method="post">
            {% csrf_token %}
            
            <div class="form-group row">
                <label class="col-md-3 col-form-label"><strong>Sub-Tenant</strong></label>
                <div class="col-md-6">
                    {{ form.sub_tenant }}
                    {% if form.sub_tenant.errors %}
                        <div class="text-danger small">{{ form.sub_tenant.errors }}</div>
                    {% endif %}
                </div>
            </div>
            
            <div class="form-group row">
                <label class="col-md-3 col-form-label"><strong>Spec A Term</strong></label>
                <div class="col-md-6">
                    {{ form.spec_a }}
                    {% if form.spec_a.errors %}
                        <div class="text-danger small">{{ form.spec_a.errors }}</div>
                    {% endif %}
                    <small class="text-muted">Select the Spec A term to attach to this sub-tenant.</small>
                </div>
            </div>
            
            <div class="form-group row">
                <div class="col-md-6 offset-md-3">
                    <div class="form-check">
                        {{ form.is_primary }}
                        <label class="form-check-label" for="{{ form.is_primary.id_for_label }}">
                            <strong>Set as Primary Spec A</strong>
                        </label>
                    </div>
                    <small class="text-muted">
                        If checked, this will be the main/default Spec A for this sub-tenant.
                    </small>
                </div>
            </div>
            
            {% if form.non_field_errors %}
                <div class="alert alert-danger">
                    {{ form.non_field_errors }}
                </div>
            {% endif %}
            
            <hr>
            
            <div class="form-group row">
                <div class="col-md-6 offset-md-3">
                    <button type="submit" class="btn btn-success font-weight-bold mr-2">
                        <i class="fas fa-save"></i> {% if is_edit %}Update{% else %}Create{% endif %} Assignment
                    </button>
                    <a href="{% url 'authentication:sub_tenant_spec_a_list' %}" class="btn btn-outline-secondary">
                        Cancel
                    </a>
                </div>
            </div>
        </form>
    </div>
</div>

<!-- Help Card -->
<div class="card mt-4">
    <div class="card-header bg-light">
        <i class="fas fa-info-circle"></i> <strong>About Spec A Assignments</strong>
    </div>
    <div class="card-body">
        <ul class="mb-0">
            <li><strong>One-to-Many:</strong> A sub-tenant can have multiple Spec A terms assigned.</li>
            <li><strong>Primary:</strong> Only one Spec A can be marked as "Primary" per sub-tenant.</li>
            <li><strong>Usage:</strong> When filtering products, only variants matching assigned Spec A will be shown.</li>
            <li><strong>Example:</strong> Sub-tenant "Counter 1" → Spec A "Red", "Blue" (Primary: Red)</li>
        </ul>
    </div>
</div>
{% endblock %}