{% load i18n crispy_forms_tags %}
<form id="modal-form" hx-post="{{ request.path }}" class="modal-content">
  {% csrf_token %}
  <div class="modal-header">
      {% block header %}
        <h5 class="modal-title">{% block title %}{{ modal_title }}{% endblock %}</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Cancel"></button>
      {% endblock %}
    </div>

    <div class="modal-body">
      {% block body %}
        {% crispy form %}
      {% endblock %}
    </div>

    <div class="modal-footer">
      <button type="button" class="btn me-auto" data-bs-dismiss="modal">{% translate 'Cancel' %}</button>
      {% block footer %}
        <button hx-post="{{ request.path }}"  class="btn btn-primary" type="submit" title="{% translate 'Save' %}">
          <i class="bi bi-check-lg"></i>
          {% translate 'Save' %}
        </button>
      {% endblock %}
    </div>
</form>
