/* FindLake Galerie-Lightbox -- siehe assets/js/findlake-lightbox.js */
.fl-gallery__main-img { cursor: zoom-in; }
.fl-gallery__main-img:focus-visible {
    outline: 3px solid var(--color-content-primary);
    outline-offset: 2px;
}

html.fl-lightbox-open { overflow: hidden; }

.fl-lightbox {
    position: fixed;
    inset: 0;
    z-index: 100000;
    background: rgba(0, 0, 0, .94);
    display: flex;
    align-items: center;
    justify-content: center;
}
.fl-lightbox[hidden] { display: none; }
.fl-lightbox__stage {
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 56px 72px;
    box-sizing: border-box;
}
.fl-lightbox__img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    display: block;
    user-select: none;
}
.fl-lightbox__btn {
    position: absolute;
    border: none;
    background: rgba(255, 255, 255, .14);
    color: var(--fl-white);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    transition: background .15s ease;
}
.fl-lightbox__btn:hover,
.fl-lightbox__btn:focus-visible { background: rgba(255, 255, 255, .3); }
.fl-lightbox__close,
.fl-lightbox__fs {
    top: 14px;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    font-size: 26px;
}
.fl-lightbox__close { right: 14px; }
.fl-lightbox__fs { right: 66px; font-size: 20px; }
.fl-lightbox__nav {
    top: 50%;
    transform: translateY(-50%);
    width: 48px;
    height: 48px;
    border-radius: 50%;
    font-size: 18px;
}
.fl-lightbox__prev { left: 14px; }
.fl-lightbox__next { right: 14px; }
.fl-lightbox__counter {
    position: absolute;
    left: 50%;
    bottom: 16px;
    transform: translateX(-50%);
    color: var(--fl-white);
    font-size: 14px;
    background: rgba(0, 0, 0, .5);
    padding: 4px 12px;
    border-radius: 999px;
}
.fl-lightbox.is-single .fl-lightbox__nav,
.fl-lightbox.is-single .fl-lightbox__counter { display: none; }

@media (max-width: 640px) {
    .fl-lightbox__stage { padding: 56px 8px; }
    .fl-lightbox__nav { width: 40px; height: 40px; }
    .fl-lightbox__prev { left: 6px; }
    .fl-lightbox__next { right: 6px; }
}
