/* --- Main Wrapper --- */
.testimonial-slider-wrapper {
    padding: 60px 0;
    position: relative;
    overflow: hidden;
}

/* Container for content */
.testimonial-container {
    max-width: 1195px;
    margin: 0 auto;
    padding: 0 30px;
    box-sizing: border-box;
    position: relative;
}

/* --- Header Section --- */
.testimonial-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 60px;
}

.testimonial-title {
    color: #ffffff;
    font-size: var(--e-global-typography-08dbd2e-font-size);
    line-height: var(--e-global-typography-08dbd2e-line-height);
    font-weight: 300;
    margin: 0;
}
.testimonial-title b{
	font-weight:bold;
}

/* --- Top Navigation --- */
.testimonial-navigation { 
	display: flex; 
	gap: 15px;
	margin-right: 83px;
}

.testimonial-prev{content: url(https://aihm1.wpenginepowered.com/wp-content/uploads/2025/09/testimonial-prev.svg);}
.testimonial-next{content: url(https://aihm1.wpenginepowered.com/wp-content/uploads/2025/08/Campuses-next.svg);}


.testimonial-prev, .testimonial-next { 
	position: static; 
	width: 44px; 
	height: 44px; 
	margin: 0; 
	background-color: rgba(255, 255, 255, 0.1); 
	border-radius: 50%; 
	color: #fff; 
	transition: background-color 0.3s ease; 
}
/* .testimonial-prev:hover, .testimonial-next:hover { background-color: rgba(255, 255, 255, 0.2); } */
/* .testimonial-prev::after, .testimonial-next::after { font-size: 18px; } */

/* --- Swiper Container --- */
.testimonial-swiper {
    overflow: visible;
}

/* --- [หัวใจของการแก้ไข] Individual Slide & Card --- */
.testimonial-swiper .swiper-slide {
    height: auto;
    transition: transform 0.4s ease, opacity 0.4s ease;
}

.testimonial-swiper .swiper-slide-active {
    /* 4. ทำให้สไลด์ที่ Active "ขยายภาพกลับมา" ขนาดเต็ม */
/*     transform: scale(1); */
	min-width: 791px;
    opacity: 1;
    z-index: 10;
}

/* --- Card Styling --- */
.testimonial-card {
    display: flex;
    background-color: transparent;
    border-radius: 48px;
    height: 100%;
    overflow: hidden;
    transition: padding 0.4s ease; /* background-color 0.4s ease, */
    max-height: 451px;
}

.testimonial-swiper .swiper-slide-active .testimonial-card {
    background-color: #fff;
    padding: 30px 30px 0 30px;
}

/* --- Image Styling --- */
.student-image {
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    transition: width 0.4s ease;
	
	padding: 16px 0 0 0;
	border-radius: 48px;
    background: rgb(255 255 255 / 30%);
}

.testimonial-swiper .swiper-slide-active .student-image {
    width: 336px;
}

.student-image img {
    width: 100%; 
	height: 100%; 
	object-fit: cover; 
	border-radius: 15px;
	
	display: block;
    margin: auto;
	max-width:379px;
}

/* --- Content Styling --- */
.testimonial-content {
    position: relative;
    padding: 58px 0px 33px 18px;
    flex-grow: 1;
    min-width: 0;
    opacity: 0;
    transition: opacity 0.3s ease;
	
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	height: 100%;
}

.testimonial-swiper .swiper-slide-active .testimonial-content {
    opacity: 1;
    transition-delay: 0.15s;
}

/* --- สไตล์ของเนื้อหา (Quote Mark, Text, Name, Class) ไม่ต้องแก้ไข --- */
.testimonial-content::before {
    content: url(https://aihm1.wpenginepowered.com/wp-content/uploads/2025/08/comm.png);
    position: absolute;
    top: -10px;
    right: 0px;
    font-size: 120px;
    font-weight: 700;
    color: #f0f0f0;
    line-height: 1;
    z-index: 1;
}
.testimonial-text, .student-name, .student-class { z-index: 2; position: relative; }
.testimonial-text { 
	font-size: 18px; 
	line-height: 28px; 
	font-family: var(--e-global-typography-text-font-family), Sans-serif;
    font-weight: var(--e-global-typography-text-font-weight);
    color: var(--e-global-color-text);
}
.student-name { 
	font-size: 22px; 
	font-weight: 600; 
	font-family: var(--e-global-typography-text-font-family), Sans-serif;
    color: var(--e-global-color-primary);
	margin-block-end:0;
}
.student-class { 
	font-size: 12px;
	font-family: var(--e-global-typography-text-font-family), Sans-serif;
	color: var(--e-global-color-text);
	margin: 5px 0 0 0; 
}

.testimonial-titlebox{
	font-size: 23px;
    line-height: 28px;
    color: var(--e-global-color-primary);
	font-family: var(--e-global-typography-text-font-family), Sans-serif;
    font-weight: var(--e-global-typography-text-font-weight);
}

/* --- Bottom Pagination --- */
.testimonial-pagination {
    position: absolute;
    bottom: 30px;
    left: 60px;
    width: auto;
}
.testimonial-pagination .swiper-pagination-bullet { width: 20px; height: 4px; background-color: rgba(255, 255, 255, 0.3); border-radius: 2px; opacity: 1; transition: width 0.3s ease, background-color 0.3s ease; }
.testimonial-pagination .swiper-pagination-bullet-active { width: 40px; background-color: #fff; }

/* --- Responsive Adjustments --- */
@media (max-width: 1220px) {
	.testimonial-swiper .swiper-slide-active {
		min-width: 100%;
	}
}
@media (max-width: 768px) {
    .testimonial-slider-wrapper {
        padding: 30px;
    }
    .testimonial-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 50px;
		padding-bottom:50px;
    }
    h2.testimonial-title{
        font-size: 54px;
		line-height: 50px;
    }
    .testimonial-swiper .swiper-slide {
        width: 90%;
    }
    .testimonial-card {
        flex-direction: column-reverse;
        padding-right: 20px;
/*     	max-height: 622px; */
    	max-height: max-content;
    }
	
	.testimonial-swiper .swiper-slide-active .student-image {
		width: fit-content;
		
	align-self: center;
        margin-top: -40px;
	}
    .student-image {
        width: 100%;
        height: 289px;
        object-fit: cover;
    }
	
    .testimonial-pagination {
		padding-left:36px;
    }
	.testimonial-swiper{
		padding-bottom:30px;
	}
	.testimonial-content{
		padding-bottom:0px;
	}
	.student-image img {
		width: fit-content;
	}
	
	.testimonial-content::before {
/*     	right: -45px;
		scale: 0.62; */
		content: url(https://aihm1.wpenginepowered.com/wp-content/uploads/2025/09/Mobile.png);
	}
	
	.testimonial-titlebox,
	.student-name{
		font-size:20px;
	}
	.testimonial-text{
		font-size:16px;
	}

}