{% load crispy_forms_tags %}
{% load widget_tweaks %}

<div class="table-area">
    <div class="table-header bg-white">
        <form method="post" id="personForm" data-cities-url="" novalidate>
        {% csrf_token %}
            <div class="row">
                <div class="col-md-12">
                    <div class="row">
                        <div class="row">
                            <div class="col-md-3 fw-bold">
                                {{form.fabric|as_crispy_field}}
                            </div> 
                            <div class="col-md-3 fw-bold">
                                {{form.fabric_application|as_crispy_field}}
                            </div> 
                            <div class="col-md-3 fw-bold">
                                {{form.mill_name|as_crispy_field}}
                            </div> 
                            <div class="col-md-3 fw-bold">
                                {{form.mill_type|as_crispy_field}}
                            </div> 
                  
                        </div>
                        <div class="row">
                            <div class="col-md-3 fw-bold">
                                {{form.mill_origin|as_crispy_field}}
                            </div> 
                            <div class="col-md-3 fw-bold">
                                {{form.cuttable_width|as_crispy_field}}
                            </div> 
                            <div class="col-md-3 fw-bold">
                                {{form.unit|as_crispy_field}}
                            </div> 
                            <div class="col-md-3 fw-bold">
                                {{form.consumption|as_crispy_field}}
                            </div>
                            <div class="col-md-3 fw-bold">
                                {{form.wastage|as_crispy_field}}
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-12" style="margin-top: 31px; float: right; padding-right: 5%;">
                                <button type="submit" style="float: right;" class="cus-btn">Add</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>


{% comment %} <form action="" method="POST" enctype="multipart/form-data" autocomplete="off">
{% csrf_token %}
    <div class="accordion-item">
        <div class="card">
            <div class="card-header">
                <h5 class="mb-0 fw-bold">Add New Fabric</h5>
                <h3 class="mb-0 fw-bold">{{style.style_number}}</h3>
            </div>
            <div class="card-body" id="after-add-more">
                <div class="row">
                    <div class="col-md-3 fw-bold">
                        {{form.fabric_type|as_crispy_field}}
                    </div>
                    <div class="col-md-3 fw-bold">
                        {{form.fabric_name|as_crispy_field}}
                    </div> 
                    <div class="col-md-3 fw-bold">
                        {{form.mill_name|as_crispy_field}}
                    </div> 
                    <div class="col-md-3 fw-bold">
                        {{form.mill_type|as_crispy_field}}
                    </div> 
                </div>
                <div class="row">
                    <div class="col-md-3 fw-bold">
                        {{form.mill_origin|as_crispy_field}}
                    </div> 
                    <div class="col-md-3 fw-bold">
                        {{form.reference|as_crispy_field}}
                    </div>
                    <div class="col-md-3 fw-bold">
                        {{form.composition|as_crispy_field}}
                    </div> 
                    <div class="col-md-3 fw-bold">
                        {{form.construction|as_crispy_field}}
                    </div> 
                </div>
                <div class="row">
                    <div class="col-md-3 fw-bold">
                        {{form.before_wash_weight|as_crispy_field}}
                    </div>
                    <div class="col-md-3 fw-bold">
                        {{form.after_wash_weight|as_crispy_field}}
                    </div> 
                    <div class="col-md-3 fw-bold">
                        {{form.shrinkage_length|as_crispy_field}}
                    </div> 
                    <div class="col-md-3 fw-bold">
                        {{form.shrinkage_width|as_crispy_field}}
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-3 fw-bold">
                        {{form.cuttable_width|as_crispy_field}}
                    </div> 
                    <div class="col-md-3 fw-bold">
                        {{form.unit|as_crispy_field}}
                    </div> 
                    <div class="col-md-3 fw-bold">
                        {{form.consumption|as_crispy_field}}
                    </div>
                    <div class="col-md-3 fw-bold">
                        {{form.wastage|as_crispy_field}}
                    </div>
                </div>
            </div>
        </div>
        
        <div class="row" style="margin-top: 10px;margin-bottom: 8px;">
            <div class="col-md-12 text-center">
                <button type="submit" class="cus-btn" >Add</button>
            </div>
        </div>
    </div>
</form>
 {% endcomment %}