/*!
* Visual Designer JQuery Plugin
* Author: Sam Zielke-Ryner
* Licensed under ...
*/

.vd-slider-widget {
    .vd-widget;
    position: relative;

    >.vd-row-widget {
        position: relative;
        width: 100%;
        flex-direction: row;
        flex-flow: nowrap;
        justify-content: initial;
        /* Must override row widget styling */
        overflow-x: scroll;
        scroll-behavior: smooth;
        -ms-overflow-style: none;
        /* IE and Edge */
        scrollbar-width: none;
        /* Firefox */
        transition-duration: 500ms;
        scroll-snap-type: x mandatory;
        /*border: solid 1px blue;*/
        padding: 0px !important; // IF row has a padding then the last slide is not centred

        -webkit-overflow-scrolling: touch;
        -ms-overflow-style: -ms-autohiding-scrollbar;

        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;

        &::-webkit-scrollbar {
            display: none;
        }

        &.vd-vert,
        &.vd-sm-vert,
        &.vd-xs-vert {
            flex-direction: column;
            scroll-snap-type: y mandatory;
            overflow-y: scroll;
            height: 200px;

            >.vd-column-widget {
                min-width: 100% !important;
                height: 100% !important;
                min-height: 100% !important;
            }
        }

        &:not(.vd-vert):not(.vd-sm-vert):not(.vd-xs-vert) {
            >.vd-column-widget {
                height: auto;
                min-height: auto;
            }
        }

        >[vd-type] {
            scroll-snap-align: center;
        }
    }

    .vd-overlay {
        background-color: transparent;
    }

    .vd-slider-bullets {
        cursor: pointer;

        &.vd-force-dimensions {
            min-height: 50px !important;
        }
    }

    .vd-slider-ar {
        cursor: pointer;
        margin: 0 5px;
        font-size: 35px;
    }

    &.vd-fullpage {
        >.vd-row-widget {
            height: 100vh;
            min-height: 100vh !important;

            >.vd-column-widget {
                min-width: 100% !important;
                height: 100vh;
                min-height: 100vh !important;
            }
        }
    }
}

.vd-bullet-cnt-widget:extend(.vd-container-widget all) {

    &.vd-abs-left,
    &.vd-abs-right {
        width: auto !important;
        height: 100% !important;
    }

    >[vd-type] {
        margin: 5px 10px;
        padding: 3px;
    }
}


.vd-slide:extend(.vd-column-widget all) {
    padding: 100px 40px;
    position: relative;
    /* So that vd-overlay's show correctly */
}

.vd-skip {
    display: none !important;
}