{% if style_costing_list %}
  <div class="tables table-responsive" id="style_costing_list">
    <table class="table  table-striped table-hover">
      <thead>
        <tr>
          <th class="text-center">SL No</th>
          <th>Style Number</th>
          <th>Fabrics</th>
          <th>Trims</th>
          <th>Thread</th>
          <th>Washing</th>
          <th>CM</th>
          <th>Commereical & Other</th>
          <th>Team</th>
          <th>Status</th>
          <th>Preview & Finalize</th>
        </tr>
      </thead>
      <tbody>
        {% for costing_style in style_costing_list  %}
        <tr>
          <td class="text-center">{{forloop.counter}}</td>
          {% comment %} <td>{{ costing_style.style.branch.name_en }}</td> {% endcomment %}
          <td style = "color:#337ab7 !important">{{ costing_style.style.style_number }}</td> 
          <td>
            {% if costing_style.fabric_status == 'complete' %}
              <a href="{% url 'merchant-fabric-cost' costing_style.style.id %}" class="text-success">Complete</a>
            {% else %}
              <a href="{% url 'merchant-fabric-cost' costing_style.style.id %}" class="text-danger">Incomplete</a>
            {% endif %}
          </td> 
          <td>
            {% if costing_style.trim_status == 'complete' %}
            <a href="{% url 'merchant-trim-cost' costing_style.style.id %}" class="text-success">Complete</a>
            {% else %}
            <a href="{% url 'merchant-trim-cost' costing_style.style.id %}" class="text-danger">Incomplete</a>
            {% endif %}
          </td>
           <td>
            {% if costing_style.thread_status == 'complete' %}
            <a href="{% url 'merchant-thread-cost' costing_style.style.id %}" class="text-success">Complete</a>
            {% else %}
            <a href="{% url 'merchant-thread-cost' costing_style.style.id %}" class="text-danger">Incomplete</a>
            {% endif %}
          </td> 
         <td>
            {% if costing_style.washing_status == 'complete' %}
            <a href="{% url 'merchant-washing-cost-create' costing_style.style.id %}" class="text-success">Complete</a>
            {% else %}
            <a href="{% url 'merchant-washing-cost-create' costing_style.style.id %}" class="text-danger">Incomplete</a>
            {% endif %}
          </td> 
           <td>
            {% if costing_style.cm_status == 'complete' %}
            <a href="{% url 'merchant-cm-cost-create' costing_style.style.id %}" class="text-success">Complete</a>
            {% else %}
            <a href="{% url 'merchant-cm-cost-create' costing_style.style.id %}" class="text-danger">Incomplete</a>
            {% endif %}
          </td> 
          <td>
            {% if costing_style.commercial_and_other_status == 'complete' %}
            <a href="{% url 'merchant-commercial-and-other-cost-create' costing_style.style.id %}" class="text-success">Complete</a>
            {% else %}
            <a href="{% url 'merchant-commercial-and-other-cost-create' costing_style.style.id %}" class="text-danger">Incomplete</a>
            {% endif %}
          </td> 
          <td>{{ costing_style.style.team.team}}</td> 
          {% if costing_style.style.is_cost_submit_status == "Approved" %}
          <td style="background-color:green !important; color:white">{{ costing_style.style.is_cost_submit_status }}</td> 
          {% elif costing_style.style.is_cost_submit_status == "Not Submit" %}
          <td style="background-color:#cc3300 !important; color:white">{{ costing_style.style.is_cost_submit_status }}</td> 
          {% else %}
          <td style="background-color:red !important; color:white">{{ costing_style.style.is_cost_submit_status }}</td> 
          {% endif %}
           <td>
            <ul class="action">
              <li>
                <a href="{% url 'merchant-privew-cost-create' costing_style.style.id %}">
                  <button type="button" class="cus-btn">Preview</button>
                </a>
              </li>
            </ul>
          </td> 
        </tr> 
        {% endfor %}
      </tbody>
    </table>
</div>
{% else %}
  <div class="tables table-responsive" id="style_costing_list">
    <table class="table  table-striped table-hover">
      <thead>
        <tr>
          <th class="text-center">SL No</th>
          <th>Style Number</th>
          <th>Fabrics</th>
          <th>Trims</th>
          <th>Thread</th>
          <th>Washing</th>
          <th>CM</th>
          <th>Commereical & Other</th>
          <th>Team</th>
          <th>Status</th>
          <th>Preview & Finalize</th>
        </tr>
      </thead>
      <tbody>
        <tr>
          <td class="text-center" colspan="11">No Data Found</td>
        </tr> 
       
      </tbody>
    </table>
</div>

{% endif %}