html.aw-image-lightbox-open,
body.aw-image-lightbox-open { overflow: hidden; }
html.aw-image-lightbox-open { scrollbar-gutter: stable; }

dialog.aw-image-lightbox {
    box-sizing: border-box;
    position: fixed;
    inset: 12px;
    width: min(1320px, calc(100vw - 24px));
    max-width: calc(100vw - 24px);
    height: min(960px, calc(100vh - 24px));
    height: min(960px, calc(100dvh - 24px));
    max-height: calc(100dvh - 24px);
    min-width: 0;
    min-height: 0;
    margin: auto;
    padding: 0;
    overflow: hidden;
    border: 1px solid #c8dce8;
    border-radius: 12px;
    background: #fff;
    color: #172f42;
    box-shadow: 0 20px 80px #102b494d;
    font: 400 14px/1.5 Roboto, Arial, sans-serif;
}
dialog.aw-image-lightbox:not([open]) { display: none; }
dialog.aw-image-lightbox[open] { display: grid; grid-template-rows: auto minmax(0, 1fr); }
dialog.aw-image-lightbox::backdrop { background: #102438b8; }
.aw-image-lightbox > .aw-image-lightbox__toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 8px 12px 8px 20px;
    border-bottom: 1px solid #e1eaf0;
    color: #172f42;
    font-size: 14px;
    font-weight: 500;
}
.aw-image-lightbox .aw-image-lightbox__close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    min-height: 44px;
    margin: 0;
    padding: 0;
    border: 1px solid #c9dce9;
    border-radius: 8px;
    background: #f3f8fc;
    color: #244a63;
    font: 400 28px/1 Arial, sans-serif;
    cursor: pointer;
}
.aw-image-lightbox .aw-image-lightbox__close:hover { background: #e4f1fb; }
.aw-image-lightbox .aw-image-lightbox__close:focus-visible { outline: 3px solid #3385ca; outline-offset: 2px; }
.aw-image-lightbox > .aw-image-lightbox__figure {
    display: grid;
    grid-template-rows: minmax(0, 1fr) auto;
    gap: 12px;
    min-height: 0;
    min-width: 0;
    margin: 0;
    padding: 16px;
}
.aw-image-lightbox .aw-image-lightbox__canvas {
    position: relative;
    display: grid;
    place-items: center;
    min-height: 0;
    min-width: 0;
    overflow: hidden;
    background: #f5f8fb;
}
.aw-image-lightbox .aw-image-lightbox__image {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
    min-width: 0;
    min-height: 0;
    margin: auto;
    object-fit: contain;
}
.aw-image-lightbox .aw-image-lightbox__caption {
    max-height: min(160px, 24dvh);
    margin: 0;
    padding: 0;
    overflow: auto;
    overscroll-behavior: contain;
    color: #24445c;
    font-size: 13px;
    line-height: 1.55;
    overflow-wrap: anywhere;
}
.aw-image-lightbox .aw-image-lightbox__status {
    position: absolute;
    inset: auto 12px 12px;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid #d2e2ee;
    border-radius: 7px;
    background: #fff;
    color: #24445c;
    font-size: 13px;
}
.aw-image-lightbox [hidden] { display: none !important; }
@media (max-width: 600px) {
    dialog.aw-image-lightbox {
        inset: 8px;
        width: calc(100vw - 16px);
        max-width: calc(100vw - 16px);
        height: calc(100vh - 16px);
        height: calc(100dvh - 16px);
        max-height: calc(100dvh - 16px);
        border-radius: 9px;
    }
    .aw-image-lightbox > .aw-image-lightbox__toolbar { padding: max(6px, env(safe-area-inset-top)) max(8px, env(safe-area-inset-right)) 6px max(12px, env(safe-area-inset-left)); }
    .aw-image-lightbox > .aw-image-lightbox__figure { gap: 10px; padding: 10px 10px max(10px, env(safe-area-inset-bottom)); }
}