.fancybox__backdrop {
    opacity: 0.9;
}

.fancybox__container {
    --fancybox-color: #333;
    --fancybox-bg: #fff;

    --f-spinner-color-1: rgba(0, 0, 0, 0.1);
    --f-spinner-color-2: rgba(17, 24, 28, 0.8);
    z-index: 1000001;
}

.fancybox__nav {
    --f-button-next-pos: 12px;
    --f-button-prev-pos: 12px;

    --f-button-width: 48px;
    --f-button-height: 48px;

    --f-button-color: #333;
    --f-button-hover-color: #333;

    --f-button-bg: #e5e7eb;
    --f-button-hover-bg: #e5e7eb;
    --f-button-active-bg: #e5e7eb;

    --f-button-svg-height: 20px;
    --f-button-svg-width: 20px;

    --f-button-svg-stroke-width: 3;
    --f-button-svg-filter: none;
}

.fancybox__toolbar {
    --f-button-color: #0d0c22;
    --f-button-hover-color: #0d0c22;

    --f-button-bg: transparent;
    --f-button-hover-bg: transparent;
    --f-button-active-bg: transparent;

    --f-button-svg-stroke-width: 1.5;
    --f-button-svg-filter: none;

    background: #fff;
    border-bottom: 1px solid #e5e7eb;
    text-shadow: none;
}

.fancybox__slide {
    padding: 12px 0px;
}

.fancybox__thumbs.is-classic {
    --f-thumb-opacity: 1;
    --f-thumb-hover-opacity: 1;
    --f-thumb-selected-opacity: 1;

    --f-thumb-width: 68px;
    --f-thumb-height: 68px;
    --f-thumb-gap: 12px;
    --f-thumb-offset: 5px;
    --f-thumb-outline: 0;
}

.fancybox__thumbs.is-classic .f-thumbs__slide {
    border: 1px solid #d1d5db;
    border-radius: 4px;
    transition: all 0.2s;
}

.fancybox__thumbs.is-classic .f-thumbs__slide:hover,
.fancybox__thumbs.is-classic .f-thumbs__slide.is-nav-selected {
    border: 1px solid #6b7280;
}