// out: ../../sections/slider.css, compress: true

@import (inline) "../../vendor/owl.carousel.min.css";

body {
    .slider-container {
        position: relative;
        .slider-content {
            position: absolute;
            top: 50%;
            z-index: 1;
            left: 50%;
            transform: translate(-50%, -50%);
            text-align: center;
            padding-top: 20px;
            padding-bottom: 20px;
            .slider-content-link {
                color: inherit;
                text-decoration: none;
            }
            &.alignement-left {
                left: 50px;
                transform: translateY(-50%);
                text-align: left;
            }
            &.alignement-right {
                left: unset;
                right: 50px;
                transform: translateY(-50%);
                text-align: right;
            }
        }
        .slider:not(.owl-loaded){
            picture:not(:first-child), .owl-item:not(:first-child), .slide:not(:first-child){
                display: none;
            }
        }
        .slider.owl-loaded {
            picture, .owl-item, .slider-image {
                display: block!important;
            }
        }
        .owl-dots {
            position: absolute;
            bottom: 10%;
            left: 50%;
            transform: translateX(-50%);
            .owl-dot {
                width: 10px;
                height: 10px;
                margin: 5px;
                background: #b1b1b1;
                border-radius: 10px;
            }
        }
        &.mobile, &.under-menu.mobile {
            .slider-content {
                position: static;
                transform: none;
                text-align: center;
            }
            .slider.slides-with-text {
                .owl-dots {
                    bottom: 0;
                }
            }
        }
        &.under-menu {
            .slider-content {
                transform: translate(-50%, ~"calc(-50% + 50px)");
                &.alignement-left {
                    transform: translateY(~"calc(-50% + 50px)");
                }
                &.alignement-right {
                    transform: translateY(~"calc(-50% + 50px)");
                }
            }
        }
        &.is-preview {
            .slider {
                img {
                    display: none;
                    &:first-child {
                        display: block;
                    }
                }
            }
        }
    }
}