/*
 ---------------------------------------
 Inline Form Field Edit (iframe) - Start
 ---------------------------------------

 Edit the form field in an iframe,
 on the right side of the window,
 without redirecting to a new page.
*/
body.init-inline-iframe {
    width: 100%;
    transition: height .2s;
}

.init-inline-iframe {
    width: 0%;
    transition: height .2s;
}

.inline-iframe {
    background-color: #eaeaec;
    width: 100%;
    height: 50vh;
    box-sizing: border-box;
    position: relative;
    margin-top: 20px;
    margin-bottom: 20px;
    width: calc(100% - 30px);
    margin-left: 15px;
    margin-right: 15px;
}

.inline-iframe.hide-inline-iframe {
    width: 0%;
}

.inline-iframe .inline-iframe_header,
.inline-select-iframe .inline-iframe_header {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    background-color: #0F1C26;
    border-left: 1px solid #3a454d;
    box-sizing: border-box;
    width: 100%;
    height: 40px;
}

.inline-iframe .inline-iframe_close-btn {
    justify-self: end;
    padding: 11px;
    cursor: pointer;
    transition: background-color .3s ease;
}

.inline-iframe .inline-iframe_close-btn:hover {
    background-color: #3a454d;
}

.inline-iframe .inline-iframe_close-btn > img {
    display: block;
}

.inline-iframe_no-transition {
    -webkit-transition: none !important;
    -moz-transition: none !important;
    -o-transition: none !important;
    transition: none !important;
}


.tl_header {
    position: relative;
}

/* Move iframe header below Contao header */
@media (max-width: 991px) {
    .inline-iframe, .inline-iframe .inline-iframe_header {
        top: 40px;
    }
    .inline-iframe {
        height: calc(100vh - 40px);
    }
}

/* Iframe goes full screen here */
@media (max-width: 767px) {
    body.show-inline-iframe {
        width: 100%;
    }

    .inline-iframe, .inline-iframe .inline-iframe_header {
        width: 100%;
        border-left: none;
    }

    #inlineIframe.show-contao-navigation {
        width: calc(100% - 240px)
    }
}

/*
 ---------------------------------------
 Inline Form Field Edit (iframe) - End
 ---------------------------------------
*/