{% load i18n %}
{% load crispy_forms_tags %}
<div class="container">
    <div id="formset">
        {{ formset.management_form }}
        {% for form in formset %}
        <div id="form-0" class="formset pt-2">
            <div class="row">
                <div class="col-12">
                    <div class="input-group mb-3">
                      <div class="input-group-prepend">
                        <span class="input-group-text">{% trans "App Image" %}</span>
                      </div>
                      <div class="custom-file">
                          {{form.media}}
                      </div>
                    </div>
                </div>
                <div class="col-12">
                    {{form.title|as_crispy_field}}
                </div>
                <div class="col-12">
                    {{form.subtitle|as_crispy_field}}
                </div>
                <div class="col-12">
                    {{form.url|as_crispy_field}}
                </div>
            </div>
        </div>
        {% endfor %}
        <div id="empty-form" class="d-none">
            <div class="row">
                <div class="col-12">
                    <div class="input-group mb-3">
                        <div class="input-group-prepend">
                            <span class="input-group-text">{% trans "App Image" %}</span>
                        </div>
                        <div class="custom-file">
                            {{formset.empty_form.media}}
                        </div>
                    </div>
                </div>
                <div class="col-12">
                    {{form.title|as_crispy_field}}
                </div>
                <div class="col-12">
                    {{form.subtitle|as_crispy_field}}
                </div>
                <div class="col-12">
                    {{formset.empty_form.url|as_crispy_field}}
                </div>
            </div>
        </div>
    </div>
    <div class="d-flex justify-content-between my-3">
        <button class="btn-clear" onclick="addFormset()" type="button"><i class="fa-solid fa-plus"></i> {% trans "Add" %}</button>
        <button class="btn-clear" onclick="clearFormset()" type="button"><i class="fa-solid fa-minus"></i> {% trans "Remove" %}</button>
    </div> 
</div>
<p class="response-footer text-link fw-bold oxanium"></p>
<input type="hidden" name="form-id" value={{form_name}}>
<input type="hidden" name="section" value={{section}}> 