/* TODO: Move this into own BIW file system - fancybox is a viewport thing */

.dd-bolig-shop .sape-biw-viewport {
    background-color: var(--dd-color-viewport);
}

.dd-bolig-shop .dd-accordion-content p {
    color: var(--dd-color-text);
    margin: 1em 0;
}

.sape-fancybox-plandrawing-lightbox .fancybox__backdrop {
    background: var(--dd-color-viewport);
    /* opacity: 0.9; */
}

.sape-fancybox-plandrawing-lightbox .fancybox__viewport .has-image .fancybox__content {
    /* background: var(--dd-color-viewport); */
    background:transparent;
}

.sape-fancybox-plandrawing-lightbox .fancybox__viewport .has-image .fancybox__content img {
    padding: 10px;
}

@media screen AND (max-width:767px){
    .sape-fancybox-plandrawing-lightbox .fancybox__viewport .has-image .fancybox__content img {
        padding: 10px;
    }
}



/* FANCYBOX TOOLBAR */
.fancybox__toolbar {
    background: none;
}

.fancybox__container button:hover {
    color: unset;
    background-color: unset;
}

.fancybox__container :focus {
    box-shadow: none!important;
}

.fancybox__container button:focus,
.fancybox__container button:focus-visible {
    outline: 2px solid white;
    outline-offset: -7px;
}


/* FANCYBOX IN PLANDRAWING MODE */
.sape-fancybox-plandrawing-lightbox .carousel__button {
    padding: 0;
    background: unset;
    border-radius: 99px;
}
.sape-fancybox-plandrawing-lightbox .carousel__button:focus {
    background: unset;
}

.sape-fancybox-plandrawing-lightbox .carousel__button svg {
    color:black;
    filter:none;
}

.sape-fancybox-plandrawing-lightbox.fancybox__container button:focus,
.sape-fancybox-plandrawing-lightbox.fancybox__container button:focus-visible {
    outline: 2px solid black;
}