/*===========================================================================
    Slider Css
===========================================================================*/
.bdt-prime-slider-mount {
    position: relative;
    .bdt-slideshow-item .bdt-ps-slide-img {
        position: absolute;
        height: 100%;
        width: 100%;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .bdt-prime-slider-content {
        margin-left: clamp(1.875rem, 5vw, 3.125rem);;
        margin-right: 30px;
        z-index: 1;
        width: 100%;
        .bdt-title-tag {
            color: #fff;
            font-size: clamp(1.5rem, 4.5vw, 3rem);
            margin: 0;
            display: inline-block;
            a{
                color: inherit;
            }
        }
        .bdt-sub-title .bdt-sub-title-inner {
            color: #fff;
            font-size: clamp(1.125rem, 2.5vw, 1.5rem);
            margin: 0;
            margin-bottom: 10px;
            display: inline-block;
        }
    }

    .bdt-prime-slider-social-icon {
        position: absolute;
        bottom: clamp(1.875rem, 5vw, 3.125rem);
        right:  clamp(1.875rem, 5vw, 3.125rem);
        text-align: right;
        h3 {
            font-size: clamp(0.938rem, 3vw, 1.125rem);
            color: #fff;
            margin: 0;
            transform: translateY(25px);
            transition: all .3s ease;
        }
        a {
            font-size: clamp(0.875rem, 1vw, 0.938rem);
            font-weight: 600;
            color: #fff;
            margin-left: 10px;
            display: inline-block;
            transform: translateY(20px);
            transition: all .3s ease;
            opacity: 0;
            &:hover {
                color: #fe506c;
            }
        }
        &:hover {
            h3 {
                transform: translateY(-10px);
            }
            a {
                opacity: 1;
                transform: translateY(0);
            }
        }
    }

    .bdt-slideshow-item {
        .bdt-prime-slider-content {
            > * {
                opacity: 0;
                transform: translateY(25px);
                transition: all .3s;
            }
        }
        &.bdt-active.bdt-transition-active {
            .bdt-prime-slider-content {
                > * {
                    opacity: 1;
                    transform: none;
                }
            }
            .bdt-main-title {
                transition-delay: .3s;
            }
            .bdt-sub-title {
                transition-delay: .1s;
            }
        }
    }
}
/*===========================================================================
    Prime Slider Navigation Css
===========================================================================*/
.bdt-prime-slider-mount {
    .bdt-navigation-arrows {
        position: absolute;
        bottom: clamp(1.875rem, 5vw, 3.125rem);
        left: clamp(1.875rem, 5vw, 3.125rem);
        .bdt-prime-slider-next, 
        .bdt-prime-slider-previous {
            font-size: clamp(0.563rem, 1vw, 0.75rem);
            color: #fff;
            position: relative;
            transition: all .3s ease;
            svg {
                width: 1em;
            }
            &:before {
                content: '';
                position: absolute;
                height: 1px;
                width: 0px;
                background: #fff;
                top: 50%;
                transform: translateY(-50%);
                transition: all .3s ease;
                opacity: 0;
            }
        }
        .bdt-prime-slider-next {
            transform: translateX(0);
            &:before {
                left: 0;
            }
            &:hover {
                transform: translateX(10px);
                &:before {
                    opacity: 1;
                    width: 17px;
                    transition-delay: .1s;
                }
            }
        }
        .bdt-prime-slider-previous {
            transform: translateX(0);
            &:before {
                right: 0;
            }
            &:hover {
                transform: translateX(-10px);
                &:before {
                    opacity: 1;
                    width: 17px;
                    transition-delay: .1s;
                }
            }
        }
    }

    .bdt-ps-dotnav {
        bottom: clamp(1.875rem, 5vw, 3.125rem);
        left: ~'calc(50% + 30px)';
        margin: 0;
        position: absolute;
        transform: translateX(-50%);
        li {
            position: absolute;
            left: -55px;
            transition: opacity 400ms ease-out;
            transform: translateY(17px);
            transition: all .3s;
            a {
                font-size: clamp(1rem, 2vw, 1.125rem);
                color: #fff;
            }
            &.bdt-active {
                opacity: 1;
                transform: none;
                transition-delay: .3s;
            }
        }
        li:not(.bdt-active) {
            opacity: 0;
        }
        span {
            color: #fff;
            font-size: clamp(1rem, 2vw, 1.125rem);
            &:before {
                content: '';
                position: absolute;
                height: 2px;
                width: clamp(1.25rem, 4vw, 2.5rem);
                left: -30px;
                background: #f5f5f5;
                top: 50%;
            }
        }
    }
}

/*===========================================================================
    Responsive Css ( Slider )
===========================================================================*/
@media (min-width: 640px) {
    .bdt-prime-slider-mount {
        .bdt-navigation-arrows {
            .bdt-prime-slider-next, 
            .bdt-prime-slider-previous {
                &:before {
                    height: 2px;
                }
                &:hover {
                    &:before {
                        width: 20px;
                    }
                }
            }
        }
        .bdt-ps-dotnav {
            left: ~'calc(50% + 45px)';
            li {
                left: -100px;
            }
            span {
                &:before {
                    left: -60px;
                }
            }
        }
    }
}