{% load crispy_forms_tags %}
<div class="card mb-0">
    <div class="card-header" id="headingCalculationFilters">
        <h5 class="m-0">
            <a class="custom-accordion-title d-block pt-2 pb-2"
               data-bs-toggle="collapse"
               href="#collapseCalculationFilters"
               aria-expanded="true"
               aria-controls="collapseCalculationFilters">
                By Calculation Info:
                <i class="mdi mdi-chevron-down accordion-arrow"></i>
            </a>
        </h5>
    </div>
    <div id="collapseCalculationFilters"
         class="collapse"
         aria-labelledby="headingCalculationFilters"
         data-bs-parent="#accordionExample">
        <div class="card-body">
            {{ form.run_id | as_crispy_field }}
            {{ form.directory | as_crispy_field }}
            {{ form.created_at__range | as_crispy_field }}
            {{ form.updated_at__range | as_crispy_field }}
            {{ form.workflow_name | as_crispy_field }}
            {{ form.computer_system | as_crispy_field }}
            {{ form.directory | as_crispy_field }}
            {{ form.total_time__range | as_crispy_field }}
            {{ form.queue_time__range | as_crispy_field }}
        </div>
    </div>
</div>
