/**
 * بخش نظرات محصول — مینیمال، با سایه.
 *
 * رنگ اصلی از تنظیمات به‌صورت متغیر درون‌خطی می‌آید (--rd-accent)، پس این
 * فایل ثابت است و مرورگر یک بار کشش می‌کند.
 *
 * ساختار: توکن‌ها ← خلاصه و نمودار ← نوار عکس ← ابزار ← اسلایدر ← کارت
 * ← لایت‌باکس ← واکنش‌گرا.
 */

/* =========================================================================
 * ۱) توکن‌ها
 * ====================================================================== */

.rd {
	--rd-card: #fff;
	--rd-border: #e8eaee;
	--rd-text: #1a1d23;
	--rd-muted: #6b7280;
	--rd-track: #eef1f5;
	--rd-star: #f5a623;
	--rd-star-off: #dde1e7;
	--rd-radius: 16px;
	--rd-radius-sm: 10px;
	--rd-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 10px 28px -12px rgba(16, 24, 40, .16);
	--rd-shadow-soft: 0 1px 2px rgba(16, 24, 40, .04), 0 4px 14px -8px rgba(16, 24, 40, .16);

	box-sizing: border-box;
	display: block;
	margin: 0 0 28px;
	color: var(--rd-text);
	line-height: 1.9;
}

.rd *,
.rd *::before,
.rd *::after {
	box-sizing: border-box;
}

.rd-heading {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 12px;
	font-size: 15px;
	font-weight: 700;
	color: var(--rd-text);
}

.rd-heading__count {
	padding: 1px 8px;
	border-radius: 999px;
	background: var(--rd-track);
	color: var(--rd-muted);
	font-size: 12px;
	font-weight: 600;
}

/* =========================================================================
 * ۲) ستاره‌ها
 * ====================================================================== */

.rd-stars {
	display: inline-flex;
	align-items: center;
	gap: 2px;
	vertical-align: middle;
}

.rd-star {
	width: 16px;
	height: 16px;
	display: inline-block;
	background: var(--rd-star-off);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.rd-star.is-full {
	background: var(--rd-star);
}

/* نیمهٔ پرشده از سمت شروع، پس در راست‌چین از راست */
.rd-star.is-half {
	background: linear-gradient(to left, var(--rd-star) 50%, var(--rd-star-off) 50%);
}

[dir="ltr"] .rd-star.is-half {
	background: linear-gradient(to right, var(--rd-star) 50%, var(--rd-star-off) 50%);
}

/* =========================================================================
 * ۳) خلاصه و نمودار
 * ====================================================================== */

.rd-summary {
	display: grid;
	grid-template-columns: minmax(150px, 1fr) minmax(240px, 2fr) minmax(150px, 1fr);
	gap: 20px;
	align-items: center;
	padding: 22px 24px;
	margin-bottom: 22px;
	background: var(--rd-card);
	border: 1px solid var(--rd-border);
	border-radius: var(--rd-radius);
	box-shadow: var(--rd-shadow);
}

.rd-score {
	text-align: center;
}

.rd-score__value {
	font-size: 40px;
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -.02em;
}

.rd-score__count {
	margin-top: 4px;
	font-size: 13px;
	color: var(--rd-muted);
}

.rd-bars {
	display: grid;
	gap: 7px;
}

.rd-bar {
	display: grid;
	grid-template-columns: 34px 1fr 40px;
	align-items: center;
	gap: 10px;
	font-size: 12.5px;
	color: var(--rd-muted);
}

.rd-bar__label {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	justify-content: flex-end;
	font-weight: 600;
	color: var(--rd-text);
}

.rd-bar__star {
	width: 12px;
	height: 12px;
	background: var(--rd-star);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.rd-bar__track {
	height: 8px;
	border-radius: 999px;
	background: var(--rd-track);
	overflow: hidden;
}

.rd-bar__fill {
	display: block;
	height: 100%;
	border-radius: 999px;
	background: var(--rd-accent, #0f834d);
}

.rd-bar__count {
	text-align: start;
	font-variant-numeric: tabular-nums;
}

.rd-recommend {
	text-align: center;
	padding-inline-start: 20px;
	border-inline-start: 1px solid var(--rd-border);
}

.rd-recommend__value {
	font-size: 28px;
	font-weight: 800;
	color: var(--rd-accent, #0f834d);
	line-height: 1.3;
}

.rd-recommend__text {
	margin: 2px 0 0;
	font-size: 12.5px;
	line-height: 1.8;
	color: var(--rd-muted);
}

/* =========================================================================
 * ۴) نوار عکس خریداران
 * ====================================================================== */

.rd-gallery {
	margin-bottom: 22px;
}

.rd-gallery__strip {
	display: flex;
	gap: 8px;
	overflow-x: auto;
	padding-bottom: 4px;
	scrollbar-width: thin;
	overscroll-behavior-x: contain;
}

.rd-gallery__strip::-webkit-scrollbar {
	height: 6px;
}

.rd-gallery__strip::-webkit-scrollbar-thumb {
	background: var(--rd-border);
	border-radius: 999px;
}

/* =========================================================================
 * ۵) ابزار: ترتیب و فیلتر
 * ====================================================================== */

.rd-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	flex-wrap: wrap;
	margin-bottom: 14px;
}

.rd-chips {
	display: flex;
	gap: 6px;
	flex-wrap: wrap;
}

.rd-chip {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 14px;
	border: 1px solid var(--rd-border);
	border-radius: 999px;
	background: var(--rd-card);
	color: var(--rd-muted);
	font-size: 13px;
	font-weight: 500;
	text-decoration: none;
	box-shadow: var(--rd-shadow-soft);
	transition: color .15s ease, border-color .15s ease, background-color .15s ease;
}

.rd-chip:hover {
	color: var(--rd-text);
	border-color: var(--rd-muted);
}

.rd-chip.is-active {
	color: var(--rd-accent, #0f834d);
	border-color: var(--rd-accent, #0f834d);
	background: var(--rd-accent-soft, #eef6f1);
	font-weight: 700;
}

.rd-chip__tick {
	width: 14px;
	height: 14px;
	border: 1px solid currentColor;
	border-radius: 4px;
	opacity: .5;
}

.rd-chip.is-active .rd-chip__tick {
	opacity: 1;
	background: currentColor no-repeat center / 10px 10px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E");
}

/* =========================================================================
 * ۶) اسلایدر
 * ====================================================================== */

.rd-slider-wrap {
	position: relative;
}

.rd-slider {
	display: flex;
	gap: 12px;
	overflow-x: auto;
	padding: 4px 2px 14px;
	scroll-snap-type: x proximity;
	scroll-behavior: smooth;
	overscroll-behavior-x: contain;
	scrollbar-width: none;
}

.rd-slider::-webkit-scrollbar {
	display: none;
}

/* چند کارت که جا دارند، وسط بنشینند نه چسبیده به یک طرف. */
.rd-slider.is-static {
	justify-content: center;
}

.rd-slider:focus-visible {
	outline: 2px solid var(--rd-accent, #0f834d);
	outline-offset: 4px;
	border-radius: var(--rd-radius);
}

/* دکمه‌های چپ و راست — روی دستگاه لمسی جایی ندارند */
.rd-nav {
	position: absolute;
	top: 50%;
	z-index: 2;
	width: 38px;
	height: 38px;
	margin: 0;
	padding: 0;
	transform: translateY(-50%);
	border: 1px solid var(--rd-border);
	border-radius: 50%;
	background: var(--rd-card);
	box-shadow: var(--rd-shadow);
	cursor: pointer;
	transition: opacity .15s ease, background-color .15s ease;
}

.rd-nav::before {
	content: "";
	position: absolute;
	inset: 0;
	background: var(--rd-text);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 18l-6-6 6-6'/%3E%3C/svg%3E") center / 18px 18px no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 18l-6-6 6-6'/%3E%3C/svg%3E") center / 18px 18px no-repeat;
}

.rd-nav--prev {
	inset-inline-start: -14px;
}

.rd-nav--next {
	inset-inline-end: -14px;
}

.rd-nav--next::before {
	transform: rotate(180deg);
}

.rd-nav:hover {
	background: #f7f8fa;
}

.rd-nav[disabled] {
	opacity: 0;
	pointer-events: none;
}

@media (hover: none) {
	.rd-nav {
		display: none;
	}
}

/* =========================================================================
 * ۷) کارت نظر
 * ====================================================================== */

.rd-card {
	flex: 0 0 300px;
	max-width: 300px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 16px 18px;
	background: var(--rd-card);
	border: 1px solid var(--rd-border);
	border-radius: var(--rd-radius);
	box-shadow: var(--rd-shadow-soft);
	scroll-snap-align: start;
	transition: box-shadow .18s ease, transform .18s ease;
}

.rd-card:hover {
	box-shadow: var(--rd-shadow);
	transform: translateY(-2px);
}

.rd-card__head {
	display: flex;
	align-items: center;
	gap: 10px;
}

.rd-avatar {
	flex: 0 0 auto;
	width: 38px;
	height: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	font-size: 16px;
	font-weight: 700;
	color: hsl(var(--rd-hue, 200) 55% 32%);
	background: hsl(var(--rd-hue, 200) 65% 94%);
}

.rd-avatar--img {
	object-fit: cover;
}

.rd-card__who {
	display: flex;
	flex-direction: column;
	min-width: 0;
	line-height: 1.5;
}

.rd-card__name {
	font-size: 14px;
	font-weight: 700;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.rd-card__date {
	font-size: 12px;
	color: var(--rd-muted);
}

.rd-card__rate {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: wrap;
}

.rd-verified {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	font-size: 11.5px;
	font-weight: 600;
	color: var(--rd-accent, #0f834d);
}

.rd-verified__tick {
	width: 13px;
	height: 13px;
	background: currentColor;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l2.4 1.8 3-.3 1 2.8 2.5 1.6-1 2.9 1 2.9-2.5 1.6-1 2.8-3-.3L12 22l-2.4-1.8-3 .3-1-2.8L3.1 16l1-2.9-1-2.9 2.5-1.6 1-2.8 3 .3L12 2zm-1 13.4l5-5-1.4-1.4-3.6 3.6-1.6-1.6L8 12.4l3 3z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2l2.4 1.8 3-.3 1 2.8 2.5 1.6-1 2.9 1 2.9-2.5 1.6-1 2.8-3-.3L12 22l-2.4-1.8-3 .3-1-2.8L3.1 16l1-2.9-1-2.9 2.5-1.6 1-2.8 3 .3L12 2zm-1 13.4l5-5-1.4-1.4-3.6 3.6-1.6-1.6L8 12.4l3 3z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.rd-card__text {
	flex: 1 1 auto;
	font-size: 13.5px;
	line-height: 2;
	color: var(--rd-text);
}

.rd-card__text p {
	margin: 0;
}

.rd-readmore {
	margin-top: 4px;
	padding: 0;
	border: 0;
	background: none;
	color: var(--rd-accent, #0f834d);
	font: inherit;
	font-size: 12.5px;
	font-weight: 700;
	cursor: pointer;
}

.rd-readmore:hover {
	text-decoration: underline;
}

.rd-card__shots {
	display: flex;
	gap: 6px;
	flex-wrap: wrap;
}

/* بندانگشتی مشترک نوار عکس و کارت */
.rd-shot {
	width: 62px;
	height: 62px;
	padding: 0;
	border: 1px solid var(--rd-border);
	border-radius: var(--rd-radius-sm);
	background: var(--rd-track);
	overflow: hidden;
	cursor: pointer;
	flex: 0 0 auto;
	transition: border-color .15s ease, transform .15s ease;
}

.rd-shot:hover {
	border-color: var(--rd-accent, #0f834d);
	transform: scale(1.03);
}

.rd-shot img {
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
}

.rd-gallery__strip .rd-shot {
	width: 78px;
	height: 78px;
}

/* =========================================================================
 * ۸) خالی و «همهٔ نظرها»
 * ====================================================================== */

.rd-empty {
	padding: 18px;
	text-align: center;
	color: var(--rd-muted);
	font-size: 13.5px;
	border: 1px dashed var(--rd-border);
	border-radius: var(--rd-radius);
}

.rd-more {
	margin-top: 6px;
	text-align: center;
}

.rd-more__btn {
	padding: 9px 22px;
	border: 1px solid var(--rd-border);
	border-radius: 999px;
	background: var(--rd-card);
	color: var(--rd-text);
	font: inherit;
	font-size: 13.5px;
	font-weight: 700;
	cursor: pointer;
	box-shadow: var(--rd-shadow-soft);
	transition: border-color .15s ease, color .15s ease;
}

.rd-more__btn:hover {
	color: var(--rd-accent, #0f834d);
	border-color: var(--rd-accent, #0f834d);
}

/*
 * فهرست همیشگی ووکامرس فقط وقتی پنهان می‌شود که جاوااسکریپت این کلاس را
 * گذاشته باشد — بی‌جاوااسکریپت، همان‌جا زیر اسلایدر می‌ماند.
 */
.rd-hidden-list #comments .commentlist,
.rd-hidden-list #comments .woocommerce-pagination,
.rd-hidden-list #comments .woocommerce-Reviews-title {
	display: none;
}

/* =========================================================================
 * ۹) لایت‌باکس
 * ====================================================================== */

.rd-lightbox {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: rgba(8, 10, 16, .88);
	-webkit-backdrop-filter: blur(2px);
	backdrop-filter: blur(2px);
}

.rd-lightbox img {
	max-width: 100%;
	max-height: 100%;
	border-radius: var(--rd-radius-sm);
	box-shadow: 0 24px 60px -20px rgba(0, 0, 0, .8);
}

.rd-lightbox__btn {
	position: absolute;
	width: 44px;
	height: 44px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, .14);
	cursor: pointer;
}

.rd-lightbox__btn::before {
	content: "";
	position: absolute;
	inset: 0;
	background: #fff;
	-webkit-mask: center / 20px 20px no-repeat;
	mask: center / 20px 20px no-repeat;
}

.rd-lightbox__btn:hover {
	background: rgba(255, 255, 255, .26);
}

.rd-lightbox__close {
	top: 16px;
	inset-inline-end: 16px;
}

.rd-lightbox__close::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M18 6L6 18M6 6l12 12'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round'%3E%3Cpath d='M18 6L6 18M6 6l12 12'/%3E%3C/svg%3E");
}

.rd-lightbox__prev,
.rd-lightbox__next {
	top: 50%;
	transform: translateY(-50%);
}

.rd-lightbox__prev {
	inset-inline-start: 16px;
}

.rd-lightbox__next {
	inset-inline-end: 16px;
}

.rd-lightbox__prev::before,
.rd-lightbox__next::before {
	-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 18l-6-6 6-6'/%3E%3C/svg%3E");
	mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 18l-6-6 6-6'/%3E%3C/svg%3E");
}

.rd-lightbox__next::before {
	transform: rotate(180deg);
}

body.rd-lightbox-open {
	overflow: hidden;
}

/* =========================================================================
 * ۱۰) واکنش‌گرا و کاهش حرکت
 * ====================================================================== */

@media (max-width: 900px) {
	.rd-summary {
		grid-template-columns: 1fr;
		gap: 16px;
		padding: 18px;
	}

	.rd-recommend {
		padding-inline-start: 0;
		padding-top: 14px;
		border-inline-start: 0;
		border-top: 1px solid var(--rd-border);
	}
}

@media (max-width: 560px) {
	.rd-card {
		flex-basis: 82vw;
		max-width: 82vw;
	}

	.rd-score__value {
		font-size: 34px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.rd *,
	.rd-lightbox * {
		transition: none !important;
	}

	.rd-slider {
		scroll-behavior: auto;
	}
}

/* =========================================================================
 * حالت خالی — محصولی که هنوز نظری ندارد
 * ====================================================================== */

.rd--empty {
	margin-bottom: 18px;
}

.rd-blank {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	padding: 30px 20px;
	text-align: center;
	background: var(--rd-card);
	border: 1px solid var(--rd-border);
	border-radius: var(--rd-radius);
	box-shadow: var(--rd-shadow-soft);
}

.rd-blank__star {
	width: 32px;
	height: 32px;
}

.rd-blank__title {
	margin: 0;
	font-size: 15px;
	font-weight: 700;
	color: var(--rd-text);
}

.rd-blank__text {
	margin: 0;
	max-width: 46ch;
	font-size: 13px;
	color: var(--rd-muted);
}

.rd-blank__btn {
	margin-top: 6px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 38px;
	padding: 0 22px;
	border-radius: var(--rd-radius-sm);
	background: var(--rd-accent);
	color: #fff;
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
	transition: filter .15s ease;
}

.rd-blank__btn:hover,
.rd-blank__btn:focus {
	color: #fff;
	filter: brightness(1.08);
}