{% set modal_id = modal_id | default("confirm-modal") %}
{% set modal_title = modal_title | default("Confirm") %}
{% set modal_body = modal_body | default("Are you sure?") %}
{% set modal_confirm_text = modal_confirm_text | default("Confirm") %}
{% set modal_confirm_class = modal_confirm_class | default("btn-danger") %}
{% set modal_desc = modal_desc | default("This action cannot be undone.") %}

<div class="modal" id="{{ modal_id }}" tabindex="-1" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title">{{ modal_title }}</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        <p class="mb-2">{{ modal_body | safe }}</p>
        <p class="text-muted mb-0">{{ modal_desc }}</p>
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">Cancel</button>
        <button type="button" class="btn {{ modal_confirm_class }}" data-confirm-action>{{ modal_confirm_text }}</button>
      </div>
    </div>
  </div>
</div>
{% if not modal_manual_submit %}
  <script>
    (function () {
      function initModal() {
        if (
          window.PearingScripts &&
          typeof window.PearingScripts.initConfirmModal === "function"
        ) {
          window.PearingScripts.initConfirmModal("{{ modal_id }}");
        }
      }

      if (document.readyState === "complete") {
        initModal();
      } else {
        window.addEventListener("load", initModal, { once: true });
      }
    })();
  </script>
{% endif %}