html.apartment-gallery-open {
    overflow: hidden !important;
}

.apartment-lightbox {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    height: 100dvh;
    max-width: none;
    max-height: none;
    margin: 0;
    padding: 20px max(20px, env(safe-area-inset-right)) 20px max(20px, env(safe-area-inset-left));
    box-sizing: border-box;
    border: 0;
    color: #edf2fa;
    background: transparent;
    overflow: hidden;
}

.apartment-lightbox[open] {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr) auto;
    gap: 16px;
}

.apartment-lightbox:not([open]) { display: none; }
.apartment-lightbox::backdrop { background: rgba(5, 12, 25, .97); }

.apartment-lightbox-toolbar,
.apartment-lightbox-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    font-size: 14px;
}

.apartment-lightbox-toolbar > span { color: #c3d0e2; }
.apartment-lightbox-footer { min-height: 24px; color: #b2c0d5; }
.apartment-lightbox-footer p { margin: 0; font-size: 14px; }
.apartment-lightbox-footer [data-gallery-counter] { white-space: nowrap; }

.apartment-lightbox-stage {
    position: relative;
    min-height: 0;
    display: grid;
    place-items: center;
    padding: 0 64px;
}

.apartment-lightbox-image {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 0;
    object-fit: contain;
    grid-area: 1 / 1;
}

.apartment-lightbox[data-loading] .apartment-lightbox-image,
.apartment-lightbox[data-error] .apartment-lightbox-image { visibility: hidden; }
.apartment-lightbox-message { grid-area: 1 / 1; margin: 0; text-align: center; color: #b2c0d5; }
.apartment-lightbox-message:empty { display: none; }

.apartment-lightbox .apartment-lightbox-button {
    display: inline-grid;
    place-items: center;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    padding: 0;
    border: 1px solid rgba(171, 196, 232, .3);
    border-radius: 50%;
    background: #0f1d38;
    color: #edf2fa;
    cursor: pointer;
    box-shadow: none;
    touch-action: manipulation;
}

.apartment-lightbox .apartment-lightbox-button:hover { background: #1e3a63; }
.apartment-lightbox .apartment-lightbox-button:focus-visible { outline: 2px solid #8ec9ff; outline-offset: 4px; }
.apartment-lightbox-button svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; }
.apartment-lightbox-prev, .apartment-lightbox-next { position: absolute; top: calc(50% - 22px); }
.apartment-lightbox-prev { left: 0; }
.apartment-lightbox-next { right: 0; }

@media (max-width: 600px) {
    .apartment-lightbox { padding-top: max(12px, env(safe-area-inset-top)); padding-bottom: max(16px, env(safe-area-inset-bottom)); gap: 12px; }
    .apartment-lightbox-stage { padding: 0 0 60px; }
    .apartment-lightbox-prev, .apartment-lightbox-next { top: auto; bottom: 0; }
    .apartment-lightbox-prev { left: calc(50% - 54px); }
    .apartment-lightbox-next { right: calc(50% - 54px); }
    .apartment-lightbox-footer { align-items: flex-start; font-size: 12px; }
    .apartment-lightbox-footer p { font-size: 12px; line-height: 1.5; }
}
