/* Images and lightbox
/* ------------------------------------------------------------------------- */
.detail .field-image .form-control {
    background: transparent;
    border: 0;
    block-size: auto;
    padding: 0;
}

.ea-detail .field-image .ea-lightbox-thumbnail {
    display: block;
    max-inline-size: 400px;
}
.ea-detail .field-image img {
    border: 1px solid transparent;
    border-radius: var(--border-radius);
    max-block-size: 300px;
    padding: 8px;
}
.ea-detail .field-image img:hover {
    border-color: var(--datalist-border-color);
}

.ea-lightbox-thumbnail img:hover {
    cursor: zoom-in;
}

.ea-lightbox {
    display: none;
}

.ea-lightbox img {
    max-inline-size: 100%;
    inline-size: 100%;
}

/* below, the contents of basiclightbox/dist/basicLightbox.min.css */
.basicLightbox {
    position: fixed;
    display: flex;
    justify-content: center;
    align-items: center;
    inset-block-start: 0;
    inset-inline-start: 0;
    inline-size: 100%;
    block-size: 100vh;
    background: rgba(0, 0, 0, 0.8);
    opacity: 0.01;
    transition: opacity .4s ease;
    z-index: 1000;
    will-change: opacity;
}
.basicLightbox--visible {
    opacity: 1;
}
.basicLightbox__placeholder {
    max-inline-size: 100%;
    transform: scale(0.9);
    transition: transform .4s ease;
    z-index: 1;
    will-change: transform;
}
.basicLightbox__placeholder > iframe:first-child:last-child,
.basicLightbox__placeholder > img:first-child:last-child,
.basicLightbox__placeholder > video:first-child:last-child {
    display: block;
    position: absolute;
    inset-block-start: 0;
    inset-inline-end: 0;
    inset-block-end: 0;
    inset-inline-start: 0;
    margin: auto;
    max-inline-size: 95%;
    max-block-size: 95%;
}
.basicLightbox__placeholder > iframe:first-child:last-child,
.basicLightbox__placeholder > video:first-child:last-child {
    pointer-events: auto;
}
.basicLightbox__placeholder > img:first-child:last-child,
.basicLightbox__placeholder > video:first-child:last-child {
    inline-size: auto;
    block-size: auto;
}
.basicLightbox--iframe .basicLightbox__placeholder,
.basicLightbox--img .basicLightbox__placeholder,
.basicLightbox--video .basicLightbox__placeholder {
    inline-size: 100%;
    block-size: 100%;
    pointer-events: none;
}
.basicLightbox--visible .basicLightbox__placeholder {
    transform: scale(1);
}

.basicLightbox {
    background: rgba(0, 0, 0, 0.8);
    transition: opacity .3s ease;
    z-index: 10000;
}
.basicLightbox__placeholder {
    margin-inline-start: 5%;
    margin-inline-end: 5%;
    max-block-size: 95%;
    transition: opacity .3s ease;
}
.basicLightbox__placeholder img {
    background: white;
    padding: 25px;
}
.basicLightbox__placeholder img:hover {
    cursor: zoom-out;
}