{% load i18n %}

<form action="." method="get">
  <div class="card">
    <div class="card-body overflow-visible py-3">
      {% for field in filter_form.hidden_fields %}
        {{ field }}
      {% endfor %}
      {% for field in filter_form.visible_fields %}
        <div class="mb-3">
          {% if field.field.widget.input_type == 'checkbox' %}
            <div class="form-check">
              {{ field }}
              <label class="form-check-label" for="{{ field.id_for_label }}">{{ field.label }}</label>
            </div>
          {% else %}
            <label class="form-label" for="{{ field.id_for_label }}">{{ field.label }}</label>
            {{ field }}
          {% endif %}
          {% if field.help_text %}
            <div class="form-text">{{ field.help_text }}</div>
          {% endif %}
          {% if field.errors %}
            <div class="invalid-feedback d-block">
              {% for error in field.errors %}{{ error }}{% endfor %}
            </div>
          {% endif %}
        </div>
      {% endfor %}
    </div>
  </div>
  <div class="d-flex gap-2 mt-3">
    <a href="." class="btn btn-outline-danger">
      <i class="mdi mdi-backspace" aria-hidden="true"></i> {% trans "Reset" %}
    </a>
    <button type="submit" class="btn btn-primary">
      <i class="mdi mdi-magnify" aria-hidden="true"></i> {% trans "Search" %}
    </button>
  </div>
</form>