/* The lightbox wraps the actual image instead of showing empty side panels. */
.digital-media-lightbox {
    padding: 18px !important;
}

.digital-media-lightbox-backdrop {
    background: rgba(255, 255, 255, 0.04) !important;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
}

.digital-media-lightbox-dialog {
    width: fit-content !important;
    max-width: calc(100vw - 36px) !important;
    max-height: calc(100vh - 36px) !important;
    overflow: visible !important;
    background: transparent !important;
    box-shadow: none !important;
}

.digital-media-lightbox-media {
    width: fit-content !important;
    max-width: calc(100vw - 36px) !important;
    max-height: calc(100vh - 150px) !important;
    background: transparent !important;
}

.digital-media-lightbox-media img {
    width: auto !important;
    height: auto !important;
    max-width: calc(100vw - 36px) !important;
    max-height: calc(100vh - 150px) !important;
    background: transparent !important;
    object-fit: contain !important;
}

.digital-media-lightbox-footer {
    align-items: center !important;
    justify-content: center !important;
    flex-direction: column !important;
    padding: 12px 0 0 !important;
    background: transparent !important;
    text-align: center !important;
}

.digital-media-lightbox-footer > div:first-child {
    display: none !important;
}

.digital-media-lightbox-actions {
    justify-content: center !important;
    gap: 10px !important;
}

.digital-media-lightbox-actions button,
.digital-media-lightbox-actions a {
    border: 1px solid #d5dbe3 !important;
    background: #ffffff !important;
    color: #1f2937 !important;
    box-shadow: 0 3px 10px rgba(15, 23, 42, 0.2) !important;
    font-weight: 700 !important;
}

.digital-media-lightbox-actions button:hover,
.digital-media-lightbox-actions a:hover {
    border-color: #f36f21 !important;
    background: #fff5ed !important;
    color: #b84406 !important;
}