/* =========================================================
   JuliaTextile Feedbacks
   ========================================================= */

.jt-feedbacks-section {
	position: relative;
	overflow: hidden;
	background:
		radial-gradient(circle at 15% 10%, rgba(255, 134, 166, 0.18) 0, rgba(255, 134, 166, 0) 32%),
		radial-gradient(circle at 85% 35%, rgba(255, 103, 143, 0.14) 0, rgba(255, 103, 143, 0) 30%),
		linear-gradient(180deg, #ffffff 0%, #fff7fa 42%, #ffffff 100%);
}

.jt-feedbacks-section::before,
.jt-feedbacks-section::after {
	content: "";
	position: absolute;
	pointer-events: none;
	border-radius: 50%;
	filter: blur(2px);
	z-index: 0;
}

.jt-feedbacks-section::before {
	width: 420px;
	height: 420px;
	left: -180px;
	top: 120px;
	background: rgba(255, 134, 166, 0.14);
}

.jt-feedbacks-section::after {
	width: 460px;
	height: 460px;
	right: -220px;
	bottom: -160px;
	background: rgba(255, 202, 214, 0.45);
}

.jt-feedbacks-section .container {
	position: relative;
	z-index: 1;
}

.jt-feedbacks-heading {
	max-width: 760px;
	margin: 0 auto 28px;
	text-align: center;
}

.jt-feedbacks-summary {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 10px 14px;
	padding: 12px 20px;
	border: 1px solid rgba(255, 134, 166, 0.2);
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.86);
	box-shadow: 0 12px 30px rgba(90, 45, 60, 0.08);
}

.jt-feedbacks-summary__label {
	color: #555555;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.jt-feedbacks-summary .product-o__rating {
	margin: 0;
}

.jt-feedbacks-grid {
	column-count: 3;
	column-gap: 28px;
}

.jt-feedback-card {
	position: relative;
	display: inline-block;
	width: 100%;
	margin: 0 0 28px;
	padding: 24px;
	break-inside: avoid;
	border: 1px solid rgba(255, 134, 166, 0.22);
	border-radius: 24px;
	background: rgba(255, 255, 255, 0.88);
	box-shadow: 0 18px 40px rgba(90, 45, 60, 0.08);
	transition: transform 0.35s ease, box-shadow 0.35s ease, border-color 0.35s ease;
}

.jt-feedback-card::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: linear-gradient(135deg, rgba(255, 255, 255, 0.45), rgba(255, 196, 212, 0.14));
	opacity: 0;
	transition: opacity 0.35s ease;
	pointer-events: none;
}

.jt-feedback-card:hover {
	transform: translateY(-7px);
	border-color: rgba(255, 103, 143, 0.45);
	box-shadow: 0 24px 56px rgba(90, 45, 60, 0.16);
}

.jt-feedback-card:hover::before {
	opacity: 1;
}

.jt-feedback-card__header,
.jt-feedback-card__rating,
.jt-feedback-card__image,
.jt-feedback-card__message,
.jt-feedback-card__footer {
	position: relative;
	z-index: 1;
}

.jt-feedback-card__header {
	display: flex;
	align-items: center;
	gap: 14px;
	margin-bottom: 16px;
}

.jt-feedback-card__avatar {
	display: inline-flex;
	flex: 0 0 52px;
	align-items: center;
	justify-content: center;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	color: #ffffff;
	font-size: 17px;
	font-weight: 800;
	letter-spacing: 0.04em;
	background: linear-gradient(135deg, #ff86a6 0%, #ff4f83 100%);
	box-shadow: 0 12px 26px rgba(255, 103, 143, 0.34);
}

.jt-feedback-card__meta {
	min-width: 0;
}

.jt-feedback-card__name {
	margin: 0 0 4px;
	color: #333333;
	font-size: 16px;
	line-height: 1.35;
	font-weight: 800;
}

.jt-feedback-card__date {
	display: block;
	color: #999999;
	font-size: 13px;
	line-height: 1.35;
}

.jt-feedback-card__rating {
	margin-bottom: 16px;
}

.jt-feedback-card__rating .product-o__rating {
	margin: 0;
}

.jt-feedback-card__image {
	display: block;
	margin-bottom: 16px;
	border-radius: 18px;
	overflow: hidden;
	background: linear-gradient(135deg, #ffe6ee, #ffd1df);
}

.jt-feedback-card__image img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	height: auto;
	object-fit: cover;
	transition: transform 0.45s ease, filter 0.35s ease;
}

.jt-feedback-card__image:hover img {
	transform: scale(1.05);
	filter: saturate(1.06);
}

.jt-feedback-card__message {
	display: -webkit-box;
	margin: 0;
	overflow: hidden;
	color: #555555;
	font-size: 15px;
	line-height: 1.75;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	cursor: pointer;
}

.jt-feedback-card.is-expanded .jt-feedback-card__message {
	display: block;
	-webkit-line-clamp: unset;
	cursor: text;
}

.jt-feedback-card__footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 18px;
}

.jt-feedback-card__toggle {
	padding: 0;
	border: 0;
	color: #ff678f;
	background: transparent;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	cursor: pointer;
}

.jt-feedback-card__toggle:hover {
	color: #333333;
}

.jt-feedback-card__toggle[hidden] {
	display: none;
}

.jt-feedback-card__product-badge {
	display: inline-flex;
	align-items: center;
	max-width: 100%;
	padding: 7px 12px;
	border-radius: 999px;
	color: #8b3b52;
	background: rgba(255, 134, 166, 0.14);
	font-size: 12px;
	font-weight: 700;
	line-height: 1.25;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	transition: color 0.25s ease, background 0.25s ease;
}

.jt-feedback-card__product-badge:hover {
	color: #ffffff;
	background: #ff678f;
}

@media (max-width: 991px) {
	.jt-feedbacks-grid {
		column-count: 2;
	}

	.jt-feedback-card {
		border-radius: 20px;
	}
}

@media (max-width: 767px) {
	.jt-feedbacks-heading {
		margin-bottom: 20px;
	}

	.jt-feedbacks-summary {
		border-radius: 20px;
	}
}

@media (max-width: 575px) {
	.jt-feedbacks-grid {
		column-count: 1;
	}

	.jt-feedback-card {
		margin-bottom: 22px;
		padding: 20px;
		border-radius: 18px;
	}

	.jt-feedback-card__avatar {
		flex-basis: 46px;
		width: 46px;
		height: 46px;
		font-size: 15px;
	}

	.jt-feedback-card__message {
		font-size: 14px;
	}
}
