{{#let this.model.popup as |popup|}}
    <BsModal
        @open={{if popup true false}}
        @fade={{true}}
        @backdrop={{true}}
        @backdropClose={{false}}
        @size={{if popup.page.isLarge "xl lg modal-fullscreen-md-down" "lg modal-fullscreen-md-down"}}
        @scrollable={{true}}
        @onHidden={{this.content.closePopup}}
        @onShown={{this.content.setFocus}}
        as |Modal|
    >
        <Modal.header class="bg-secondary text-white" @closeButton={{false}}>
            <div class="container-fluid {{popup.page.className}}">
                <div class="row row-cols-1 row-cols-md-2 justify-content-between">
                    <div class="col-md-auto order-1 order-lg-0">
                        <h4 class="modal-title">
                            {{if popup.page.shortlabel popup.page.shortlabel popup.page.label}}
                        </h4>
                    </div>
                    <div class="col-md-auto order-0 order-lg-1">
                        {{! Page wide buttons }}
                        {{#each popup.page.buttons as |btn|}}
                            <OxiBase::Button @button={{btn}} />
                        {{/each}}

                        {{! Back button }}
                        {{#if this.popupBackButton}}
                            <BsButton
                                @type=""
                                class="btn-outline-light"
                                @onClick={{this.goBack}}
                            >
                                <i class="glyphicon glyphicon-chevron-left"></i> {{t 'site.back'}}
                            </BsButton>
                        {{/if}}
                    </div>
                </div>
            </div>
        </Modal.header>
        <Modal.body {{on-init (fn this.content.registerFocusElement true false)}} tabindex="0">
            <OxiBase::Status @def={{this.model.popupStatus}}/>

            {{#each popup.main as |mainEntry index|}}
                <OxiSection
                    @content={{mainEntry}}
                    @meta={{hash isPopup=true sectionNo=index}}
                />
            {{/each}}
        </Modal.body>
        <Modal.footer>
            <BsButton {{on "click" Modal.close}}>{{t 'site.close_popup'}}</BsButton>
        </Modal.footer>
    </BsModal>
{{/let}}
