/*===========================================================================
    Slider Css ( Slider Skin zinest )
===========================================================================*/
.bdt-prime-slider-skin-zinest {
    position: relative;
    overflow: hidden;
    .bdt-overlay-default {
        background: rgba(0, 0, 0, 0.5);
    }
    .bdt-ps-zinest-container {
        margin: 0 clamp(1.875rem, 15vw, 11.25rem);
        width: 100%;
        max-width: 1200px;
    }
    .bdt-social-icon {
		position: absolute;
        right: clamp(1.875rem, 7vw, 4.375rem);
        z-index: 1;
        top: 50%;
        transform: translateY(-50%);
        display: flex;
        flex-direction: column;
        gap: 20px;
		a {
			display: flex;
			font-size: 16px;
			// margin: 20px 0;
		}
		i {
			color: #fff;
		}
		svg {
			width: 1em;
			height: 1em;
			fill: #fff;
		}
	}

    .bdt-main-title {
        display: inline-block;
    }
    .bdt-prime-slider-desc {
        // width: 100%;
        position: relative;
        .bdt-title-tag {
            font-size: clamp(1.563rem, 4vw, 2.5rem);
            font-weight: 700;
            margin: 0;
            padding-bottom: clamp(1.875rem, 4vw, 2.5rem);
            a {
                color: #fff;
                outline: none;
            }
        }
    }

    .bdt-ps-category-wrapper {
        padding-bottom: 10px;
    }

    .bdt-ps-category {
        display: inline-block;
        a {
            display: inline-block;
            color: #ddd;
            padding: 4px 12px 6px;
            background: rgba(255, 255, 255, 0.1);
            display: inline-flex;
            border-radius: 5px;
            font-size: 14px;
            transition: all .3s ease;
        }
    }

    .bdt-ps-blog-featured {
        display: none;
        padding: clamp(0.938rem, 2.5vw, 1.25rem);
        background: #fff;
        border-right: 1px solid #ddd;
        border-top-left-radius: 10px;
        max-height: 120px;
        min-height: 120px;
    }

    .bdt-ps-featured {
        .bdt-grid {
            .bdt-width-1-1 {
                margin-top: -10px;
            }
        }

        .bdt-ps-content {
            .bdt-ps-title {
                padding-bottom: 10px;
                line-height: 1.1;

                a {
                    color: #222;
                    font-weight: 600;
                    font-size: 13px;
                    transition: color .3s ease;

                    &:hover {
                        color: #fe506c;
                    }
                }
            }

            .bdt-ps-desc {
                * {
                    font-size: 12px;
                    color: #999;
                    margin: 0;
                    line-height: 1.2;
                    clear: both;
                    display: inline-block;
                    overflow: hidden;
                    white-space: nowrap;
                    max-width: 100%;
                    text-overflow: ellipsis;
                }
            }
        }

        .bdt-ps-featured-thumbnav {
            position: relative;
            height: 80px;
            img {
                border-radius: 10px;
                transition: transform .5s ease;
                overflow: hidden;
                height: 100%;
                width: 100%;
                object-fit: cover;

                &:hover {
                    transform: scale(0.95) rotate(3deg);
                }
            }
        }
    }

    .bdt-ps-meta {
        max-width: 750px;
        .bdt-meta-icon {
            height: clamp(2.25rem, 5vw, 3rem);
            width: clamp(2.25rem, 5vw, 3rem);
            display: flex;
            border: 1px solid rgba(255, 255, 255, .3);
            border-radius: 60px;
            justify-content: center;
            margin-right: clamp(0.375rem, 1vw, 0.625rem);
            overflow: hidden;
            svg {
                width: 12px;
                color: #fff;
            }
            img {
                width: 100%;
            }
        }
        .bdt-meta-text {
            * {
                display: block;
                color: #e5e5e5;
                font-size: clamp(0.75rem, 1.5vw, 0.875rem);
            }
        }
    }

    .bdt-slideshow-item {
        .bdt-ps-slide-img {
            max-width: inherit;
            height: 100%;
            width: 100%;
            position: absolute;
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;
        }
    }
}

/*===========================================================================
    Navigation Css ( Slider Zinest )
===========================================================================*/
.bdt-prime-slider-skin-zinest {
    .bdt-slidenav {
        position: relative
    }
    .bdt-navigation-arrows {
        bottom: 0px;
        z-index: 1;
        display: flex;
        flex-direction: row;
    }
    .bdt-prime-slider-next {
        &:hover svg {
            transform: scale(1.2) rotate(90deg);
        }
    }
    .bdt-prime-slider-previous {
        margin-right: -4px;
        &:hover svg {
            transform: scale(1.2) rotate(90deg);
        }
    }
    .bdt-prime-slider-next,
    .bdt-prime-slider-previous {
        padding: 0;
        height: 50px;
        width: 50px;
        display: inline-flex;
        align-items: center;
        background: #fff;
        justify-content: center;
        transition: all .3s ease;
        svg {
            color: #000;
            width: 8px;
            transition: all .3s ease-out;
        }
        &:hover {
            svg {
                color: #fe506c;
            }
        }
    }
}

/*===========================================================================
    Responsive Css ( Slider Blog )
===========================================================================*/
@media (min-width: 768px) {
    .bdt-prime-slider-skin-zinest {
        .bdt-ps-blog-container {
            max-width: clamp(35.625rem, 70vw, 60.625rem);
            margin-left: auto;
            margin-right: 59px;
        }
        // .bdt-prime-slider-desc {
        //     width: clamp(28.75rem, 60vw, 50rem);
        // }
        .bdt-ps-meta {
            margin-bottom: 100px;
        }
        .bdt-ps-blog-featured {
            display: inherit;
        }
        .bdt-navigation-arrows {
            flex-direction: column;
        }
        .bdt-prime-slider-next,
        .bdt-prime-slider-previous {
            height: 60px;
            width: 60px;
        }
    }
}