<!-- Bootstrap 4 modal dialog markup https://getbootstrap.com/docs/4.1/components/modal/ -->

<div class="modal  modal-box {{#if fullWidth}}modal-box_full{{/if}} {{#if wide}}modal-box_wide{{/if}}{{classMod}}"
     id="{{id}}" role="dialog" tabindex="-1" data-backdrop="{{backdrop}}" data-keyboard={{#if keyboard}}{{keyboard}}{{else}}false{{/if}}
>
  <div class="modal-dialog modal-box__container {{#if centered}}modal-dialog-centered{{/if}}" role="document">
    <div class="modal-box__row justify-content-center">
      <div class="modal-box__columns">
        <div class="modal-content modal-box__content">
          <div class="modal-header modal-box__header d-none {{#ifCond title '||' showCloseBtn}}d-block{{/ifCond}}">
            <div class="modal-box__inner-row justify-content-center">
              <div class="modal-box__inner-columns">
                {{#block "header"}}{{/block}}
                {{#if title}}
                  <h3 class="modal-title modal-box__title">
                    <span class="icon mr-3 link-secondary d-none {{#if classIconTitle}}d-inline-block{{/if}}" aria-hidden="true">
                      <span class="{{classIconTitle}}"></span>
                    </span>
                    {{title}}
                  </h3>
                {{/if}}
              </div>
            </div>
            <button class="close modal-box__btn-close d-print-none" type="button" data-dismiss="modal" aria-label="Close">
              <span class="icon" aria-hidden="true">
                  <span class="{{#if newIconCross}}fal{{else}}far{{/if}} fa-times"></span>
              </span>
            </button>
          </div>

          <div class="modal-body modal-box__body">

            {{!-- Use {{#content "body"}} by default in your components to pass body content
                  into 'modal-body-section' partial through 'this' context --}}
            {{!-- Use {{#content "sections"}} in case you need to separate blocks in body,
                  and manually insert needed number of 'modal-body-section' partials in your components --}}

            {{#block "sections"}}
              {{> modal-body-section this}}
            {{/block}}

          </div>
          <div class="modal-footer modal-box__footer">
            {{#block "footer"}}{{/block}}
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
