@import '../../common';

.rs-testimonial-slider {
	.swiper-slide-shadow-cards {
		display: none;
	}
	.testimonial-inner {
		position: relative;
	}
	.name,
	.title,
	.description,
	.quote_icon,
	.quote_icon	i,
	.quote_icon	svg path,
	.testi-designation {
		transition: $transition;
	}
	&.style1 {
		.testimonial-inner {
			padding: 30px;
			border: 1px solid rgba(0, 0, 0, 0.10);
			border-radius: 4px;
			transition: $transition;
			.quote_icon {
				i {
					font-size: 26px;
					color: $primaryColor;
				}
			}
			.description {
				margin: 15px 0;
			}
			.ratings {
				display: flex;
				align-items: center;
				gap: 2px;
				i {
					display: block;
				}
			}
			.testi-card-bottom {
				display: flex;
				align-items: center;
				flex-wrap: wrap;
				gap: 20px;
				> div {
					flex-shrink: 0;
				}
				&.border-effect {
					position: relative;
					> * {
						z-index: 1;
						position: relative;
					}
					&:after,
					&:before {
						position: absolute;
						content: '';
						left: 0;
						right: 0;
						height: 1px;
						background: linear-gradient(90deg, rgba(0,0,0,0) 0%, #D8D8D8 50%, rgba(0,0,0,0) 100%);
						transition: $transition;
					}
					&:after {
						top: 0;
					}
					&::before {
						bottom: 0;
					}
				}
			}
			.vendor-img {
				width: 60px;
				height: 60px;
				border: 1px solid rgba(33, 67, 212, 0.10);
				box-shadow: 0px 18px 26px -17px rgba(0, 0, 0, 0.24);
				background: #fff;
				border-radius: 50%;
				padding: 12px;
				img {
					width: 100%;
					height: auto;
				}
			}
			.content-part {
				.name {
					margin: 0;
				}
			}
			&:hover {
				box-shadow: 0px 23px 43px -40px rgba(0, 0, 0, 0.3);
			}
		}
		.grid-item {
			&.slick-center {
				.testi-card-bottom {
					&.border-effect {
						&:after,
						&:before {
							background: linear-gradient(90deg, rgba(0,0,0,0) 0%, $primaryColor 50%, rgba(0,0,0,0) 100%);
						}
					}
				}
			}
		}
	}
	&.style2 {
		.testimonial-inner {
			position: relative;
			.vendor-img {
				flex-shrink: 0;
			}
		}
	}
	&.clip-path-css {
		.testimonial-inner {
			clip-path: polygon(0% 0%, 90% 0, 100% 12%, 100% 100%, 0% 100%) !important;
		}
	}
}
.rs-testi-thumb-slider {
	display: flex;
	align-items: center;
	.rs-testimonial-slider {
		flex: 0 0 auto;
		width: 100%;
		max-width: calc(100% - 110px);
	}
	.thumb-sl-nav {
		flex: 0 0 auto;
		width: 100%;
		max-width: 110px;
		flex-shrink: 0;
		height: 320px;
		.vendor-img {
			opacity: 1;
			transition: $transition;
			border-radius: 50%;
			overflow: hidden;
			width: 100%;
			height: auto;
			aspect-ratio: 1/1;
			border: 2px solid transparent;
			img {
				width: 100%;
				height: 100%;
				object-fit: cover;
				object-position: center;
			}
		}
		.swiper-slide-thumb-active {
			.vendor-img {
				border-color: $primaryColor;
				transform: scale(1);
			}
		}
	}
}