/* Shared viewport sizing for images, inline content, videos and iframe forms. */
.glightbox-container {
    --portal-popup-width: 80vw;
    --portal-popup-height: 80vh;
    --portal-popup-height: 80dvh;
    --portal-popup-top: 10vh;
    --portal-popup-top: 10dvh;
    --portal-popup-right: 10vw;
}

.glightbox-container .gslide-inner-content {
    box-sizing: border-box;
    width: var(--portal-popup-width) !important;
    height: var(--portal-popup-height) !important;
    max-width: none !important;
    max-height: none !important;
    margin: auto;
    padding-top: 0;
    background: #fff;
    overflow: hidden;
}

/* Only media galleries reserve a toolbar strip. Dialogs use their own content. */
.glightbox-container.portal-gallery .gslide-inner-content { padding-top: 48px; }
.glightbox-container.portal-dialog .gslide-description,
.glightbox-container.portal-dialog .gnext,
.glightbox-container.portal-dialog .gprev { display: none !important; }

.glightbox-container .ginner-container {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    min-height: 0;
    flex-direction: column !important;
}

.glightbox-container .gslide-media {
    box-sizing: border-box;
    width: 100% !important;
    height: 100% !important;
    min-width: 0;
    min-height: 0;
    max-width: 100% !important;
    max-height: 100% !important;
    flex: 1 1 auto;
    margin: 0;
    box-shadow: none;
}

.glightbox-container .gslide-external { overflow: hidden; }
.glightbox-container .gslide-inline { overflow: auto; }
.glightbox-container .gslide-image { background: #111; overflow: hidden; }

.glightbox-container .gslide-image img {
    width: 100%;
    height: 100%;
    min-width: 0;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain;
}

.glightbox-container iframe {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 0;
    border: 0;
}

.glightbox-container .gslide-description {
    position: static !important;
    box-sizing: border-box;
    width: 100% !important;
    max-width: 100% !important;
    max-height: 25% !important;
    height: auto !important;
    padding: 0 !important;
    flex: 0 0 auto;
    overflow: auto;
    background: #fff !important;
}

.glightbox-container .gdesc-inner { padding: 12px 20px; }
.glightbox-container .gslide-title { color: #050c26 !important; margin: 0; }
.glightbox-container .gslide-desc { color: #626570 !important; }

.glightbox-container .gclose {
    position: absolute;
    top: calc(var(--portal-popup-top) + 4px);
    right: calc(var(--portal-popup-right) + 8px);
    width: 40px;
    height: 40px;
    padding: 10px;
    border-radius: 4px;
    background: #050c26;
    opacity: 1;
}

.glightbox-container .gclose path { fill: #fff; }
.glightbox-container .gnext, .glightbox-container .gprev { top: 45%; }
.glightbox-container .gnext { right: calc(var(--portal-popup-right) + 8px); }
.glightbox-container .gprev { left: calc(var(--portal-popup-right) + 8px); }
.glightbox-container .glightbox-button-hidden { display: none; }
.glightbox-portal-add .gnext, .glightbox-portal-add .gprev { display: none; }

.glightbox-container #mini_login,
.glightbox-container #message_block {
    display: block !important;
    position: static !important;
    width: 100% !important;
    height: auto !important;
    box-shadow: none;
}

.glightbox-container .ginlined-content > .g-container,
.glightbox-container #popup-system-messages .g-container { width: 100%; }
.glightbox-container #fiveday { width: 100%; max-width: 100%; }

@media only all and (max-width: 50.99rem), (hover: none) and (pointer: coarse) {
    .glightbox-container {
        --portal-popup-width: 100vw;
        --portal-popup-height: 100vh;
        --portal-popup-height: 100dvh;
        --portal-popup-top: env(safe-area-inset-top, 0px);
        --portal-popup-right: env(safe-area-inset-right, 0px);
    }
    .glightbox-container.portal-gallery .gslide-inner-content {
        padding-top: calc(48px + env(safe-area-inset-top, 0px));
    }
    .glightbox-container #fiveday .jlw-current-grid { grid-template-columns: 1fr; }
}