/**
 * استایل فرانت جشنواره تالیسا
 */

.tf-festival {
	--tf-primary: #8a1538;
	--tf-primary-dark: #6d0f2b;
	--tf-accent: #f0a500;
	--tf-sale: #e63950;
	--tf-text: #2b2b2b;
	--tf-muted: #8a8a8a;
	--tf-card-bg: #ffffff;
	--tf-radius: 18px;
	--tf-shadow: 0 10px 30px rgba(138, 21, 56, 0.10);
	--tf-shadow-hover: 0 18px 44px rgba(138, 21, 56, 0.20);

	position: relative;
	width: 100%;
	padding: 10px 0 30px;
	font-family: inherit;
	box-sizing: border-box;
}

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

/* ---------- سربرگ ---------- */
.tf-festival__header {
	text-align: center;
	margin-bottom: 26px;
}

.tf-festival__title {
	display: inline-block;
	margin: 0;
	position: relative;
}

.tf-festival__title span {
	display: inline-block;
	position: relative;
	padding: 10px 34px;
	font-size: 26px;
	font-weight: 800;
	color: #fff;
	background: linear-gradient(135deg, var(--tf-primary) 0%, var(--tf-primary-dark) 100%);
	border-radius: 40px;
	box-shadow: 0 8px 22px rgba(138, 21, 56, 0.28);
	letter-spacing: -0.2px;
}

.tf-festival__title span::before,
.tf-festival__title span::after {
	content: "";
	position: absolute;
	top: 50%;
	width: 40px;
	height: 2px;
	background: linear-gradient(90deg, var(--tf-accent), transparent);
	transform: translateY(-50%);
}

.tf-festival__title span::before { right: -48px; }
.tf-festival__title span::after {
	left: -48px;
	background: linear-gradient(270deg, var(--tf-accent), transparent);
}

/* ---------- تایمر ---------- */
.tf-countdown {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 14px;
	margin: 0 auto 26px;
	padding: 14px 22px;
	max-width: fit-content;
	background: linear-gradient(135deg, rgba(138, 21, 56, 0.06), rgba(240, 165, 0, 0.06));
	border: 1px dashed rgba(138, 21, 56, 0.3);
	border-radius: 16px;
}

.tf-countdown__label {
	font-size: 15px;
	font-weight: 700;
	color: var(--tf-primary);
}

.tf-countdown__timer {
	display: flex;
	align-items: center;
	gap: 8px;
}

.tf-countdown__unit {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	min-width: 56px;
	padding: 8px 6px;
	background: linear-gradient(135deg, var(--tf-primary), var(--tf-primary-dark));
	border-radius: 12px;
	box-shadow: 0 6px 14px rgba(138, 21, 56, 0.25);
}

.tf-countdown__val {
	font-size: 22px;
	font-weight: 800;
	line-height: 1;
	color: #fff;
	font-variant-numeric: tabular-nums;
}

.tf-countdown__cap {
	margin-top: 4px;
	font-size: 11px;
	color: rgba(255, 255, 255, 0.8);
}

.tf-countdown__sep {
	font-size: 22px;
	font-weight: 800;
	color: var(--tf-primary);
	align-self: flex-start;
	margin-top: 6px;
}

/* ---------- محفظه کاروسل ---------- */
.tf-festival__carousel-wrap {
	position: relative;
	padding: 0 8px;
}

.tf-swiper {
	overflow: hidden;
	padding: 12px 6px 40px;
}

.tf-swiper .swiper-slide {
	height: auto;
	display: flex;
}

/* ---------- کارت ---------- */
.tf-card {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	background: var(--tf-card-bg);
	border-radius: var(--tf-radius);
	overflow: hidden;
	box-shadow: var(--tf-shadow);
	transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.35s ease;
}

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

/* ---------- مدیا ---------- */
.tf-card__media {
	position: relative;
	padding: 18px;
	background: linear-gradient(180deg, #fafafa 0%, #fff 100%);
	overflow: hidden;
}

.tf-card__img-link {
	display: block;
	text-align: center;
}

.tf-card__media img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	transition: transform 0.4s ease;
}

.tf-card:hover .tf-card__media img {
	transform: scale(1.06);
}

/* ---------- علاقه‌مندی ---------- */
.tf-card__wishlist {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	padding: 0;
	color: var(--tf-muted);
	background: rgba(255, 255, 255, 0.9);
	border: none;
	border-radius: 50%;
	cursor: pointer;
	box-shadow: 0 3px 10px rgba(0, 0, 0, 0.08);
	transition: color 0.25s ease, transform 0.25s ease;
}

.tf-card__wishlist:hover {
	color: var(--tf-sale);
	transform: scale(1.12);
}

/* ---------- بج تخفیف ---------- */
.tf-badge {
	position: absolute;
	z-index: 4;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-weight: 800;
	line-height: 1;
}

/* ریبون */
.tf-badge--ribbon {
	top: 14px;
	left: 0;
	flex-direction: column;
	gap: 2px;
	padding: 7px 14px 7px 12px;
	background: linear-gradient(135deg, var(--tf-sale), #c81e3c);
	border-radius: 0 8px 8px 0;
	box-shadow: 0 6px 14px rgba(230, 57, 80, 0.4);
}

.tf-badge--ribbon::after {
	content: "";
	position: absolute;
	top: 0;
	right: -10px;
	border-width: 0 0 100% 10px;
	border-style: solid;
	border-color: transparent transparent transparent #c81e3c;
	height: 100%;
}

.tf-badge--ribbon .tf-badge__num { font-size: 16px; }
.tf-badge--ribbon .tf-badge__off { font-size: 10px; opacity: 0.9; }

/* دایره‌ای */
.tf-badge--circle {
	top: 14px;
	left: 14px;
	flex-direction: column;
	gap: 1px;
	width: 52px;
	height: 52px;
	border-radius: 50%;
	background: radial-gradient(circle at 30% 30%, var(--tf-sale), #b81834);
	box-shadow: 0 6px 16px rgba(230, 57, 80, 0.45);
	border: 2px solid rgba(255, 255, 255, 0.6);
}

.tf-badge--circle .tf-badge__num { font-size: 16px; }
.tf-badge--circle .tf-badge__off { font-size: 9px; opacity: 0.9; }

/* شعله */
.tf-badge--flame {
	top: 14px;
	left: 14px;
	gap: 4px;
	padding: 8px 13px;
	background: linear-gradient(135deg, #ff6a00, var(--tf-sale));
	border-radius: 30px;
	box-shadow: 0 6px 16px rgba(255, 106, 0, 0.4);
	animation: tf-flame-pulse 1.8s ease-in-out infinite;
}

.tf-badge--flame .tf-badge__num { font-size: 15px; }
.tf-badge--flame .tf-badge__flame-icon { animation: tf-flicker 0.9s ease-in-out infinite alternate; }

@keyframes tf-flame-pulse {
	0%, 100% { box-shadow: 0 6px 16px rgba(255, 106, 0, 0.4); }
	50% { box-shadow: 0 6px 22px rgba(255, 106, 0, 0.65); }
}

@keyframes tf-flicker {
	from { transform: scale(1) rotate(-3deg); }
	to { transform: scale(1.15) rotate(3deg); }
}

/* ---------- بدنه کارت ---------- */
.tf-card__body {
	display: flex;
	flex-direction: column;
	flex: 1;
	padding: 16px 18px 18px;
}

.tf-card__title {
	margin: 0 0 8px;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.5;
}

.tf-card__title a {
	color: var(--tf-text);
	text-decoration: none;
	transition: color 0.25s ease;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.tf-card__title a:hover { color: var(--tf-primary); }

.tf-card__cat {
	margin-bottom: 14px;
	font-size: 12px;
	color: var(--tf-muted);
	line-height: 1.6;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

/* ---------- فوتر کارت ---------- */
.tf-card__footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	margin-top: auto;
	padding-top: 12px;
	border-top: 1px solid #f0f0f0;
}

.tf-card__price {
	font-size: 15px;
	font-weight: 800;
	color: var(--tf-sale);
	line-height: 1.4;
}

.tf-card__price del {
	display: block;
	font-size: 12px;
	font-weight: 500;
	color: var(--tf-muted);
	opacity: 0.8;
}

.tf-card__price ins {
	text-decoration: none;
}

.tf-card__cart {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	flex-shrink: 0;
	color: #fff;
	background: linear-gradient(135deg, var(--tf-primary), var(--tf-primary-dark));
	border-radius: 12px;
	text-decoration: none;
	transition: transform 0.25s ease, box-shadow 0.25s ease;
	box-shadow: 0 6px 14px rgba(138, 21, 56, 0.28);
}

.tf-card__cart:hover {
	transform: translateY(-2px) scale(1.05);
	box-shadow: 0 10px 20px rgba(138, 21, 56, 0.4);
	color: #fff;
}

.tf-card__cart.loading { opacity: 0.6; pointer-events: none; }
.tf-card__cart.added::after { display: none; }

/* ---------- حالت تمام شد ---------- */
.tf-card--soldout .tf-card__media img {
	filter: grayscale(0.9) opacity(0.55);
}

.tf-card--soldout:hover {
	transform: none;
}

.tf-card__soldout-overlay {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 5;
	pointer-events: none;
}

.tf-card__soldout-stamp {
	transform: rotate(-14deg);
	padding: 10px 30px;
	font-size: 22px;
	font-weight: 900;
	color: var(--tf-sale);
	background: rgba(255, 255, 255, 0.85);
	border: 4px solid var(--tf-sale);
	border-radius: 12px;
	letter-spacing: 2px;
	box-shadow: 0 4px 14px rgba(230, 57, 80, 0.25);
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
}

.tf-card--soldout .tf-card__title a { color: var(--tf-muted); }
.tf-card--soldout .tf-card__price { color: var(--tf-muted); }

/* ---------- ناوبری ---------- */
.tf-nav {
	position: absolute;
	top: 42%;
	z-index: 10;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	padding: 0;
	color: var(--tf-primary);
	background: #fff;
	border: none;
	border-radius: 50%;
	cursor: pointer;
	box-shadow: 0 8px 22px rgba(0, 0, 0, 0.12);
	transition: all 0.25s ease;
}

.tf-nav:hover {
	color: #fff;
	background: var(--tf-primary);
	transform: scale(1.08);
}

.tf-nav--prev { left: 4px; }
.tf-nav--next { right: 4px; }

/* اطمینان از دیده‌شدن فلش‌ها حتی وقتی پس‌زمینه/افکت فعال است */
.tf-festival__carousel-wrap { position: relative; }
.tf-festive .tf-nav,
.tf-has-bg .tf-nav { z-index: 12; }

.tf-nav.swiper-button-disabled {
	opacity: 0.35;
	cursor: default;
}

/* ---------- نقطه‌ها ---------- */
.tf-swiper .swiper-pagination {
	bottom: 6px;
}

.tf-swiper .swiper-pagination-bullet {
	width: 9px;
	height: 9px;
	background: #d9c2ca;
	opacity: 1;
	transition: all 0.3s ease;
}

.tf-swiper .swiper-pagination-bullet-active {
	width: 26px;
	border-radius: 6px;
	background: var(--tf-primary);
}

/* ---------- خالی ---------- */
.tf-empty {
	text-align: center;
	padding: 40px 20px;
	color: var(--tf-muted);
	font-size: 15px;
}

/* ---------- ریسپانسیو ---------- */
@media (max-width: 1024px) {
	.tf-festival__title span { font-size: 22px; padding: 9px 28px; }
}

@media (max-width: 768px) {
	.tf-festival__title span { font-size: 19px; padding: 8px 22px; }
	.tf-festival__title span::before,
	.tf-festival__title span::after { display: none; }
	.tf-nav { width: 38px; height: 38px; }
	.tf-nav--prev { left: 2px; }
	.tf-nav--next { right: 2px; }
	.tf-countdown { gap: 10px; padding: 12px 16px; }
	.tf-countdown__unit { min-width: 48px; }
	.tf-countdown__val { font-size: 18px; }
	.tf-card__soldout-stamp { font-size: 18px; padding: 8px 22px; }

	/* کادر سرمه‌ای تایمر: عمودی و مرتب در موبایل */
	.tf-countbar {
		flex-direction: column;
		gap: 12px;
		padding: 16px;
		text-align: center;
	}
	.tf-countbar__promo { width: 100%; }
	.tf-countbar__timer { justify-content: center; }
}

@media (max-width: 480px) {
	.tf-countdown__label { width: 100%; text-align: center; }
	.tf-card__title { font-size: 14px; }
	.tf-festival__title span { font-size: 17px; padding: 7px 18px; }
	/* فلش‌ها کمی بزرگ‌تر و واضح‌تر برای لمس راحت */
	.tf-nav { width: 40px; height: 40px; box-shadow: 0 6px 18px rgba(0,0,0,0.18); }
	.tf-cdb__unit { min-width: 44px; }
	.tf-countbar__timer { flex-wrap: wrap; gap: 6px; }
}

/* ==========================================================================
   نسخه 1.2.0 — حالت‌های جشنواره، کادر سرمه‌ای، محصولات منتخب
   ========================================================================== */

/* ---------- حالت قبل از شروع ---------- */
.tf-festival--upcoming { padding: 0; }

.tf-coming {
	position: relative;
	border-radius: 20px;
	overflow: hidden;
	border: 0.5px solid rgba(0,0,0,0.06);
}

.tf-coming__behind {
	display: flex;
	gap: 14px;
	padding: 22px;
	filter: blur(3.5px);
	opacity: 0.5;
	pointer-events: none;
}

.tf-coming__ghost {
	flex: 1;
	min-width: 0;
	border-radius: 14px;
	background: linear-gradient(180deg, #f6eef1, #fff);
	border: 1px solid #f0e3e8;
	overflow: hidden;
	aspect-ratio: 3 / 4;
	display: flex;
	align-items: center;
	justify-content: center;
}

.tf-coming__ghost img { width: 100%; height: 100%; object-fit: contain; }
.tf-coming__ghost--empty { min-height: 150px; }

.tf-coming__overlay {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 16px;
	text-align: center;
	padding: 24px;
	overflow: hidden;
	color: #fff;
	background: radial-gradient(circle at 50% 35%,
		color-mix(in srgb, var(--tf-overlay, #750D24) 85%, transparent),
		color-mix(in srgb, var(--tf-overlay, #750D24) 96%, #000 40%));
}

/* fallback برای مرورگرهای بدون color-mix */
@supports not (background: color-mix(in srgb, red, blue)) {
	.tf-coming__overlay { background: var(--tf-overlay, #750D24); }
}

.tf-coming__overlay::before {
	content: "";
	position: absolute;
	top: -40%;
	left: -30%;
	width: 160%;
	height: 80%;
	background: radial-gradient(ellipse at center, rgba(224,168,60,0.22), transparent 60%);
	animation: tf-glow 4s ease-in-out infinite;
}

@keyframes tf-glow {
	0%, 100% { opacity: 0.5; transform: translateY(0); }
	50% { opacity: 1; transform: translateY(10px); }
}

.tf-spark {
	position: absolute;
	width: 16px;
	height: 16px;
	color: var(--tf-accent, #e0a83c);
	opacity: 0.85;
	animation: tf-twinkle 2.2s ease-in-out infinite;
}

.tf-spark::before {
	content: "";
	position: absolute;
	inset: 0;
	background: currentColor;
	clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%);
}

.tf-spark--1 { top: 18%; left: 14%; animation-delay: 0s; }
.tf-spark--2 { top: 24%; right: 16%; width: 22px; height: 22px; animation-delay: 0.5s; }
.tf-spark--3 { bottom: 22%; left: 22%; width: 18px; height: 18px; animation-delay: 1s; }
.tf-spark--4 { bottom: 28%; right: 24%; width: 12px; height: 12px; animation-delay: 1.5s; }

@keyframes tf-twinkle {
	0%, 100% { opacity: 0.2; transform: scale(0.7); }
	50% { opacity: 1; transform: scale(1.15); }
}

.tf-coming__label {
	position: relative;
	z-index: 2;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.7;
	max-width: 90%;
}

.tf-coming__name {
	color: #f7c9d5;
	padding: 2px 8px;
}

.tf-countdown-big {
	position: relative;
	z-index: 2;
	display: flex;
	gap: 9px;
}

.tf-cdb__unit {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 58px;
	padding: 10px 6px;
	background: rgba(255,255,255,0.1);
	border: 1px solid color-mix(in srgb, var(--tf-accent, #e0a83c) 45%, transparent);
	border-radius: 13px;
	animation: tf-pulse 2s ease-in-out infinite;
}

.tf-cdb__unit:nth-child(2) { animation-delay: 0.2s; }
.tf-cdb__unit:nth-child(3) { animation-delay: 0.4s; }
.tf-cdb__unit:nth-child(4) { animation-delay: 0.6s; }

@keyframes tf-pulse {
	0%, 100% { box-shadow: 0 0 0 0 rgba(224,168,60,0); }
	50% { box-shadow: 0 0 16px 0 color-mix(in srgb, var(--tf-accent, #e0a83c) 40%, transparent); }
}

.tf-cdb__val {
	font-size: 24px;
	font-weight: 800;
	line-height: 1;
	font-variant-numeric: tabular-nums;
}

.tf-cdb__cap {
	margin-top: 5px;
	font-size: 10px;
	color: rgba(255,255,255,0.75);
}

/* ---------- تیتر جشنواره با ستاره ---------- */
.tf-festival--running .tf-festival__title span {
	background: linear-gradient(135deg, var(--tf-primary, #8a1538), var(--tf-primary-dark, #6d0f2b));
}

.tf-festival--running .tf-festival__title span::before,
.tf-festival--running .tf-festival__title span::after {
	content: "★";
	background: none;
	color: var(--tf-accent, #e0a83c);
	font-size: 15px;
	height: auto;
	width: auto;
}

.tf-festival--running .tf-festival__title span::before { right: -30px; }
.tf-festival--running .tf-festival__title span::after { left: -30px; }

/* ---------- کادر سرمه‌ای تایمر پایین ---------- */
.tf-countbar {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	overflow: hidden;
	margin-top: 6px;
	padding: 8px 22px;
	color: #fff;
	background: linear-gradient(90deg, var(--tf-navy, #0B1C2D), var(--tf-navy2, #12324d));
	border-radius: 0 0 15px 15px;
}

.tf-countbar::after {
	content: "";
	position: absolute;
	top: 0;
	left: -120%;
	width: 50%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255,255,255,0.08), transparent);
	animation: tf-sweep 3.5s ease-in-out infinite;
}

@keyframes tf-sweep {
	0% { left: -120%; }
	60%, 100% { left: 130%; }
}

.tf-countbar__promo {
	position: relative;
	z-index: 2;
	font-size: 14px;
	color: #dfe6ee;
	line-height: 1.5;
}

.tf-countbar__promo b { color: var(--tf-accent, #e0a83c); font-weight: 700; }

.tf-countbar__timer {
	position: relative;
	z-index: 2;
	display: flex;
	align-items: center;
	gap: 6px;
	flex-shrink: 0;
}

.tf-countbar__unit {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-width: 40px;
	padding: 5px 4px;
	background: rgba(255,255,255,0.1);
	border: 1px solid color-mix(in srgb, var(--tf-accent, #e0a83c) 25%, transparent);
	border-radius: 9px;
}

.tf-countbar__num { font-size: 16px; font-weight: 800; line-height: 1; font-variant-numeric: tabular-nums; }
.tf-countbar__cap { font-size: 9px; color: rgba(255,255,255,0.65); margin-top: 2px; }
.tf-countbar__sep { opacity: 0.4; font-weight: 700; }

/* ---------- حالت پایان جشنواره ---------- */
.tf-festival--ended { padding: 0; }

.tf-ended {
	position: relative;
	overflow: hidden;
	text-align: center;
	padding: 28px 22px;
	border-radius: 18px;
	color: #fff;
	background: radial-gradient(circle at 50% 30%, #2a3c4f, var(--tf-navy, #0B1C2D));
	border: 1px solid color-mix(in srgb, var(--tf-accent, #e0a83c) 20%, transparent);
}

.tf-ended__badge {
	display: inline-block;
	margin-bottom: 12px;
	padding: 5px 16px;
	border-radius: 30px;
	font-size: 12px;
	font-weight: 600;
	background: color-mix(in srgb, var(--tf-accent, #e0a83c) 18%, transparent);
	color: var(--tf-accent, #e0a83c);
	border: 1px solid color-mix(in srgb, var(--tf-accent, #e0a83c) 40%, transparent);
}

.tf-ended__done { font-size: 20px; font-weight: 700; }
.tf-ended__name { color: var(--tf-accent, #e0a83c); }
.tf-ended__next { margin-top: 8px; font-size: 14px; color: #c3ccd6; }
.tf-ended__next b { color: #fff; font-weight: 700; }

/* ==========================================================================
   ویجت محصولات منتخب
   ========================================================================== */
.tf-custom {
	--tf-accent: #750D24;
	width: 100%;
	padding: 10px 0 30px;
}

.tf-custom__header { text-align: center; margin-bottom: 24px; }

.tf-custom__title span {
	display: inline-block;
	position: relative;
	padding: 10px 34px;
	font-size: 24px;
	font-weight: 800;
	color: #fff;
	background: linear-gradient(135deg, var(--tf-accent), color-mix(in srgb, var(--tf-accent) 75%, #000));
	border-radius: 40px;
	box-shadow: 0 8px 22px color-mix(in srgb, var(--tf-accent) 28%, transparent);
}

.tf-custom__wrap { position: relative; padding: 0 8px; }

.tf-custom__grid {
	display: grid;
	grid-template-columns: repeat(var(--tf-cols, 4), minmax(0, 1fr));
	gap: 20px;
}

.tf-custom__swiper { overflow: hidden; padding: 12px 6px 40px; }
.tf-custom__swiper .swiper-slide { height: auto; display: flex; }

/* کارت محصول منتخب */
.tf-ccard {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	background: #fff;
	border-radius: 18px;
	overflow: hidden;
	box-shadow: 0 10px 30px rgba(0,0,0,0.06);
	transition: transform 0.35s cubic-bezier(0.22,1,0.36,1), box-shadow 0.35s ease;
}

.tf-ccard:hover {
	transform: translateY(-8px);
	box-shadow: 0 20px 46px color-mix(in srgb, var(--tf-accent) 20%, rgba(0,0,0,0.12));
}

.tf-ccard__media {
	position: relative;
	padding: 18px;
	background: linear-gradient(180deg, #fafafa, #fff);
}

.tf-ccard__brand {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 3;
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 52px;
	height: 40px;
	padding: 5px 10px;
	background: rgba(255,255,255,0.95);
	border: 0.5px solid rgba(0,0,0,0.06);
	border-radius: 12px;
	box-shadow: 0 4px 14px rgba(0,0,0,0.10);
	overflow: hidden;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.tf-ccard__brand img {
	max-width: 100%;
	max-height: 28px;
	width: auto;
	height: auto;
	object-fit: contain;
	display: block;
}

.tf-ccard__brand--text {
	font-size: 12px;
	font-weight: 700;
	color: var(--tf-accent, #750D24);
	letter-spacing: 0.3px;
	white-space: nowrap;
}

.tf-ccard:hover .tf-ccard__brand {
	transform: translateY(-2px);
	box-shadow: 0 8px 20px rgba(0,0,0,0.14);
}

.tf-ccard__img { display: block; text-align: center; }
.tf-ccard__img img {
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: contain;
	transition: transform 0.4s ease;
}
.tf-ccard:hover .tf-ccard__img img { transform: scale(1.06); }

.tf-ccard__body { display: flex; flex-direction: column; flex: 1; padding: 16px 18px 18px; }

.tf-ccard__title { margin: 0 0 8px; font-size: 15px; font-weight: 700; line-height: 1.5; }
.tf-ccard__title a {
	color: #2b2b2b;
	text-decoration: none;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	transition: color 0.25s;
}
.tf-ccard__title a:hover { color: var(--tf-accent); }

.tf-ccard__cat {
	margin-bottom: 12px;
	font-size: 12px;
	color: #9a9a9a;
	line-height: 1.6;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.tf-ccard__price { font-size: 16px; font-weight: 800; color: var(--tf-accent); margin-bottom: 14px; margin-top: auto; }
.tf-ccard__price del { display: inline-block; font-size: 12px; font-weight: 500; color: #bbb; margin-right: 6px; }
.tf-ccard__price ins { text-decoration: none; }

/* متن ترغیب (CTA) */
.tf-ccard__cta {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 11px 16px;
	font-size: 14px;
	font-weight: 700;
	color: #fff;
	text-decoration: none;
	background: linear-gradient(135deg, var(--tf-accent), color-mix(in srgb, var(--tf-accent) 72%, #000));
	border-radius: 12px;
	box-shadow: 0 6px 16px color-mix(in srgb, var(--tf-accent) 30%, transparent);
	transition: transform 0.25s, box-shadow 0.25s, filter 0.25s;
	position: relative;
	overflow: hidden;
}

.tf-ccard__cta::before {
	content: "";
	position: absolute;
	top: 0;
	left: -120%;
	width: 60%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255,255,255,0.25), transparent);
	transition: left 0.6s ease;
}

.tf-ccard__cta:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 24px color-mix(in srgb, var(--tf-accent) 42%, transparent);
	color: #fff;
}

.tf-ccard__cta:hover::before { left: 130%; }

/* ریسپانسیو محصولات منتخب */
@media (max-width: 1024px) {
	.tf-custom__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.tf-custom__title span { font-size: 21px; }
}

@media (max-width: 768px) {
	.tf-custom__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
	.tf-coming__label { font-size: 15px; }
	.tf-cdb__unit { min-width: 48px; }
	.tf-cdb__val { font-size: 19px; }
	.tf-countbar { flex-direction: column; gap: 8px; padding: 12px 16px; }
	.tf-countbar__promo { text-align: center; }
}

@media (max-width: 480px) {
	.tf-custom__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tf-ended__done { font-size: 17px; }
	.tf-countbar__unit { min-width: 36px; }
}

/* ==========================================================================
   لایه جشنواره‌ای‌تر (Festive Enhancements) — نسخه ۱.۲
   افکت‌های اضافی برای حس جشن: کانفتی، درخشش تیتر، نوار رنگین
   ========================================================================== */

/* --- کانفتی روی لایه «قبل از شروع» --- */
.tf-coming__overlay .tf-confetti {
	position: absolute;
	top: -10%;
	width: 9px;
	height: 14px;
	border-radius: 2px;
	opacity: 0.9;
	animation: tf-fall linear infinite;
	z-index: 1;
}
.tf-coming__overlay .tf-confetti:nth-child(odd) { border-radius: 50%; }
.tf-confetti--a { left: 12%; background: var(--tf-accent, #e0a83c); animation-duration: 4.2s; animation-delay: 0s; }
.tf-confetti--b { left: 28%; background: #f7c9d5; animation-duration: 5.1s; animation-delay: 0.8s; }
.tf-confetti--c { left: 46%; background: #fff; animation-duration: 3.8s; animation-delay: 0.3s; }
.tf-confetti--d { left: 63%; background: var(--tf-accent, #e0a83c); animation-duration: 4.7s; animation-delay: 1.2s; }
.tf-confetti--e { left: 78%; background: #f7c9d5; animation-duration: 5.4s; animation-delay: 0.5s; }
.tf-confetti--f { left: 90%; background: #fff; animation-duration: 4s; animation-delay: 1.6s; }

@keyframes tf-fall {
	0% { transform: translateY(0) rotate(0deg); opacity: 0; }
	10% { opacity: 0.9; }
	100% { transform: translateY(320px) rotate(360deg); opacity: 0; }
}

/* --- درخشش عبوری روی تیتر جشنواره فعال --- */
.tf-festival--running .tf-festival__title span {
	position: relative;
	overflow: hidden;
}
.tf-festival--running .tf-festival__title span::after {
	/* حفظ ستاره سمت چپ که قبلاً ست شده؛ درخشش را با لایه جدا اضافه می‌کنیم */
}
.tf-festival--running .tf-festival__title span > .tf-shine {
	content: "";
	position: absolute;
	top: 0;
	left: -140%;
	width: 55%;
	height: 100%;
	background: linear-gradient(90deg, transparent, rgba(255,255,255,0.35), transparent);
	transform: skewX(-18deg);
	animation: tf-title-shine 3.4s ease-in-out infinite;
	pointer-events: none;
}
@keyframes tf-title-shine {
	0% { left: -140%; }
	55%, 100% { left: 160%; }
}

/* --- نوار رنگین‌کمان ظریف بالای کادر سرمه‌ای --- */
.tf-countbar {
	border-top: 2px solid transparent;
	border-image: linear-gradient(90deg,
		var(--tf-accent, #e0a83c),
		#f7c9d5,
		var(--tf-accent, #e0a83c)) 1;
}

/* --- تپش ملایم اعداد تایمر کادر سرمه‌ای هر ثانیه --- */
.tf-countbar__num {
	display: inline-block;
	transition: transform 0.25s ease;
}
.tf-countbar__num.tf-tick {
	animation: tf-num-pop 0.4s ease;
}
@keyframes tf-num-pop {
	0% { transform: scale(1); }
	40% { transform: scale(1.25); color: var(--tf-accent, #e0a83c); }
	100% { transform: scale(1); }
}

/* --- آیکن هدیه کنار برچسب «پایان یافت» --- */
.tf-ended__badge::before {
	content: "🎉";
	margin-inline-end: 6px;
	font-size: 13px;
}

/* --- درخشش دور کارت محصول منتخب هنگام هاور --- */
.tf-ccard::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 18px;
	padding: 1.5px;
	background: linear-gradient(135deg, var(--tf-accent, #750D24), transparent 60%);
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask-composite: exclude;
	opacity: 0;
	transition: opacity 0.35s ease;
	pointer-events: none;
	z-index: 3;
}
.tf-ccard:hover::before { opacity: 1; }

/* ==========================================================================
   افکت‌های جشنواره‌ای در حالت فعال (Festive Motion) — نسخه ۱.۴
   ========================================================================== */

.tf-festive { position: relative; overflow: hidden; }

/* نوار رنگین‌کمان متحرک بالای بخش */
.tf-festive::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 4px;
	z-index: 6;
	background: linear-gradient(90deg,
		var(--tf-cf3, #8a1538),
		var(--tf-cf1, #e0a83c),
		var(--tf-cf2, #f7c9d5),
		var(--tf-cf1, #e0a83c),
		var(--tf-cf3, #8a1538));
	background-size: 200% 100%;
	animation: tf-rainbow-slide 3s linear infinite;
}
@keyframes tf-rainbow-slide { to { background-position: 200% 0; } }

/* --- کانفتی سراسری --- */
.tf-festive__confetti {
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 5;
	overflow: hidden;
}

.tf-cf {
	position: absolute;
	top: -16px;
	width: 8px;
	height: 13px;
	border-radius: 2px;
	opacity: 0;
	animation: tf-cf-fall linear infinite;
}
.tf-cf:nth-child(3n) { border-radius: 50%; }
.tf-cf:nth-child(4n) { width: 6px; height: 10px; }

@keyframes tf-cf-fall {
	0%   { transform: translateY(0) rotate(0deg); opacity: 0; }
	8%   { opacity: 0.95; }
	100% { transform: translateY(360px) rotate(420deg); opacity: 0; }
}

.tf-cf--1  { left: 5%;  background: var(--tf-cf1, #e0a83c); animation-duration: 4.6s; animation-delay: 0s; }
.tf-cf--2  { left: 12%; background: var(--tf-cf2, #f7c9d5); animation-duration: 5.4s; animation-delay: 1.1s; }
.tf-cf--3  { left: 20%; background: var(--tf-cf3, #8a1538); animation-duration: 4.2s; animation-delay: 0.5s; }
.tf-cf--4  { left: 28%; background: var(--tf-cf1, #e0a83c); animation-duration: 5.8s; animation-delay: 1.7s; }
.tf-cf--5  { left: 36%; background: var(--tf-cf2, #f7c9d5); animation-duration: 4.9s; animation-delay: 0.3s; }
.tf-cf--6  { left: 44%; background: var(--tf-cf3, #8a1538); animation-duration: 5.2s; animation-delay: 1.4s; }
.tf-cf--7  { left: 52%; background: var(--tf-cf1, #e0a83c); animation-duration: 4.4s; animation-delay: 0.8s; }
.tf-cf--8  { left: 60%; background: var(--tf-cf2, #f7c9d5); animation-duration: 5.6s; animation-delay: 0.1s; }
.tf-cf--9  { left: 68%; background: var(--tf-cf3, #8a1538); animation-duration: 4.7s; animation-delay: 1.9s; }
.tf-cf--10 { left: 75%; background: var(--tf-cf1, #e0a83c); animation-duration: 5.1s; animation-delay: 0.6s; }
.tf-cf--11 { left: 82%; background: var(--tf-cf2, #f7c9d5); animation-duration: 4.3s; animation-delay: 1.2s; }
.tf-cf--12 { left: 88%; background: var(--tf-cf3, #8a1538); animation-duration: 5.5s; animation-delay: 0.4s; }
.tf-cf--13 { left: 94%; background: var(--tf-cf1, #e0a83c); animation-duration: 4.8s; animation-delay: 1.5s; }
.tf-cf--14 { left: 98%; background: var(--tf-cf2, #f7c9d5); animation-duration: 5.3s; animation-delay: 0.9s; }

/* اطمینان از اینکه محتوا روی کانفتی قرار می‌گیرد */
.tf-festive .tf-festival__header,
.tf-festive .tf-festival__carousel-wrap,
.tf-festive .tf-countbar { position: relative; z-index: 7; }

/* --- تیتر: هاله تپنده + ستاره‌های چرخان --- */
.tf-festive .tf-festival__title span {
	animation: tf-title-glow 2.4s ease-in-out infinite;
}
@keyframes tf-title-glow {
	0%, 100% { box-shadow: 0 8px 22px rgba(138,21,56,0.3); }
	50% { box-shadow: 0 8px 34px color-mix(in srgb, var(--tf-accent, #e0a83c) 55%, transparent), 0 0 0 4px color-mix(in srgb, var(--tf-accent, #e0a83c) 14%, transparent); }
}

.tf-festive .tf-festival--running .tf-festival__title span::before,
.tf-festive.tf-festival--running .tf-festival__title span::before,
.tf-festive.tf-festival--running .tf-festival__title span::after {
	animation: tf-star-spin 1.8s ease-in-out infinite;
}
.tf-festive.tf-festival--running .tf-festival__title span::after { animation-delay: 0.3s; }

@keyframes tf-star-spin {
	0%, 100% { transform: translateY(-50%) scale(1) rotate(0deg); }
	50% { transform: translateY(-50%) scale(1.45) rotate(24deg); }
}

/* --- ورود پلکانی کارت‌ها --- */
.tf-festive .tf-swiper .tf-card {
	animation: tf-card-rise 0.6s cubic-bezier(0.22,1,0.36,1) both;
}
.tf-festive .swiper-slide:nth-child(1) .tf-card { animation-delay: 0.05s; }
.tf-festive .swiper-slide:nth-child(2) .tf-card { animation-delay: 0.13s; }
.tf-festive .swiper-slide:nth-child(3) .tf-card { animation-delay: 0.21s; }
.tf-festive .swiper-slide:nth-child(4) .tf-card { animation-delay: 0.29s; }
.tf-festive .swiper-slide:nth-child(5) .tf-card { animation-delay: 0.37s; }

@keyframes tf-card-rise {
	from { opacity: 0; transform: translateY(20px); }
	to { opacity: 1; transform: translateY(0); }
}

/* --- تپش ملایم بج تخفیف در حالت جشنواره --- */
.tf-festive .tf-badge {
	animation: tf-badge-beat 1.9s ease-in-out infinite;
}
@keyframes tf-badge-beat {
	0%, 100% { transform: scale(1); }
	50% { transform: scale(1.07); }
}
.tf-festive .tf-badge--flame { animation: tf-flame-pulse 1.8s ease-in-out infinite, tf-badge-beat 1.9s ease-in-out infinite; }

/* --- احترام به تنظیم کاهش حرکت کاربر --- */
@media (prefers-reduced-motion: reduce) {
	.tf-festive::before,
	.tf-cf,
	.tf-festive .tf-festival__title span,
	.tf-festive.tf-festival--running .tf-festival__title span::before,
	.tf-festive.tf-festival--running .tf-festival__title span::after,
	.tf-festive .tf-swiper .tf-card,
	.tf-festive .tf-badge {
		animation: none !important;
	}
	.tf-festive__confetti { display: none; }
}

/* ==========================================================================
   چیدمان ستون کناری + پس‌زمینه + ریسپانسیو — نسخه ۱.۵
   ========================================================================== */

/* وقتی پس‌زمینه فعال است، فاصله داخلی و گردی گوشه اضافه می‌شود */
.tf-festival.tf-has-bg {
	padding: 26px 22px 30px;
	border-radius: 22px;
}
.tf-festival.tf-has-bg .tf-festival__title span {
	box-shadow: 0 8px 26px rgba(0,0,0,0.25);
}

/* چیدمان اصلی: بخش محصولات + ستون کناری */
.tf-festival__layout {
	display: flex;
	gap: 20px;
	align-items: stretch;
}
.tf-festival__main {
	flex: 1 1 auto;
	min-width: 0; /* جلوگیری از سرریز فلکس */
}

/* ستون کناری */
.tf-festival__side {
	position: relative;
	flex: 0 0 var(--tf-side-w, 300px);
	width: var(--tf-side-w, 300px);
	border-radius: 18px;
	overflow: hidden;
	display: flex;
	align-items: stretch;
	box-shadow: 0 12px 30px rgba(0,0,0,0.18);
}

/* موقعیت ستون: چپ یا راست (در حالت RTL جای پیش‌فرض راست منطقی است) */
.tf-side--left .tf-festival__side { order: 2; }
.tf-side--left .tf-festival__main { order: 1; }
.tf-side--right .tf-festival__side { order: 1; }
.tf-side--right .tf-festival__main { order: 2; }

.tf-side__link {
	position: absolute;
	inset: 0;
	z-index: 4;
}

.tf-side__inner {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 16px;
	width: 100%;
	padding: 24px 20px;
	text-align: center;
}

.tf-side__image { width: 100%; }
.tf-side__image img {
	width: 100%;
	height: auto;
	object-fit: contain;
	display: block;
	filter: drop-shadow(0 10px 22px rgba(0,0,0,0.28));
	animation: tf-side-float 4s ease-in-out infinite;
}
@keyframes tf-side-float {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-10px); }
}

.tf-side__logo img {
	max-width: 150px;
	max-height: 60px;
	width: auto;
	height: auto;
	object-fit: contain;
}

.tf-side__text {
	color: #fff;
	font-size: 14px;
	line-height: 1.9;
}
.tf-side__text p { margin: 0 0 6px; }
.tf-side__text strong { color: var(--tf-accent, #e0a83c); }

/* ---------- ریسپانسیو کامل ---------- */
@media (max-width: 1024px) {
	.tf-festival__side {
		flex-basis: 240px;
		width: 240px;
	}
}

@media (max-width: 900px) {
	/* ستون کناری به زیر بخش محصولات منتقل می‌شود */
	.tf-festival__layout {
		flex-direction: column;
	}
	.tf-side--left .tf-festival__side,
	.tf-side--right .tf-festival__side {
		order: 2;
		flex-basis: auto;
		width: 100%;
	}
	.tf-side--left .tf-festival__main,
	.tf-side--right .tf-festival__main {
		order: 1;
	}
	.tf-festival__side {
		min-height: 200px;
	}
	.tf-side__inner {
		flex-direction: row;
		flex-wrap: wrap;
		justify-content: center;
		gap: 20px;
	}
	.tf-side__image { width: auto; max-width: 45%; }
	.tf-side__image img { max-height: 160px; width: auto; }
}

@media (max-width: 768px) {
	.tf-festival.tf-has-bg { padding: 20px 14px 24px; border-radius: 16px; }
	.tf-festival__layout { gap: 14px; }
	.tf-side__inner { padding: 20px 16px; }
	.tf-side__text { font-size: 13px; }
}

@media (max-width: 480px) {
	.tf-side__inner { flex-direction: column; }
	.tf-side__image { max-width: 70%; }
	.tf-side__image img { max-height: 140px; }
	.tf-side__logo img { max-width: 120px; }
}

/* ==========================================================================
   ارتقای افکت‌های جشنواره — نسخه ۱.۵
   ========================================================================== */

/* هاله نورانی ملایم دور کل بخش وقتی پس‌زمینه فعال است */
.tf-festive.tf-has-bg {
	animation: tf-section-glow 3.5s ease-in-out infinite;
}
@keyframes tf-section-glow {
	0%, 100% { box-shadow: 0 0 0 0 rgba(224,168,60,0); }
	50% { box-shadow: 0 0 40px 2px color-mix(in srgb, var(--tf-accent, #e0a83c) 22%, transparent); }
}

/* کانفتی دوم با شکل نوار پیچ‌خورده برای تنوع بیشتر */
.tf-cf:nth-child(5n) {
	width: 10px;
	height: 4px;
	border-radius: 4px;
	animation-name: tf-cf-fall, tf-cf-wobble;
	animation-duration: inherit, 1.2s;
	animation-timing-function: linear, ease-in-out;
	animation-iteration-count: infinite, infinite;
}
@keyframes tf-cf-wobble {
	0%, 100% { margin-left: 0; }
	50% { margin-left: 14px; }
}

/* ستاره‌های ریز چشمک‌زن پراکنده در پس‌زمینه بخش */
.tf-festive .tf-festival__header { position: relative; }
.tf-festive .tf-festival__header::before,
.tf-festive .tf-festival__header::after {
	content: "✦";
	position: absolute;
	top: 50%;
	color: var(--tf-accent, #e0a83c);
	font-size: 12px;
	opacity: 0.7;
	animation: tf-twinkle 2s ease-in-out infinite;
}
.tf-festive .tf-festival__header::before { left: 20%; animation-delay: 0.2s; }
.tf-festive .tf-festival__header::after { right: 20%; animation-delay: 0.9s; }

/* درخشش متحرک روی خط زیرین کادر سرمه‌ای */
.tf-festive .tf-countbar {
	position: relative;
}
.tf-festive .tf-countbar::before {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	height: 3px;
	width: 100%;
	background: linear-gradient(90deg, transparent, var(--tf-accent, #e0a83c), transparent);
	background-size: 50% 100%;
	background-repeat: no-repeat;
	animation: tf-underline-run 2.5s linear infinite;
}
@keyframes tf-underline-run {
	0% { background-position: -50% 0; }
	100% { background-position: 150% 0; }
}

/* تپش دکمه سبد خرید در حالت جشنواره */
.tf-festive .tf-card__cart {
	animation: tf-cart-bob 2.4s ease-in-out infinite;
}
@keyframes tf-cart-bob {
	0%, 100% { transform: translateY(0); }
	50% { transform: translateY(-3px); }
}

@media (prefers-reduced-motion: reduce) {
	.tf-festive.tf-has-bg,
	.tf-festive .tf-festival__header::before,
	.tf-festive .tf-festival__header::after,
	.tf-festive .tf-countbar::before,
	.tf-festive .tf-card__cart,
	.tf-side__image img {
		animation: none !important;
	}
}

/* ==========================================================================
   تمام‌عرض و کشیدگی — نسخه ۱.۶
   ========================================================================== */

/* تمام عرض: خروج از محدودیت عرض کانتینر و پوشش کل پهنای صفحه */
.tf-festival.tf-fullwidth {
	width: 100vw;
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -50vw;
	margin-right: -50vw;
	max-width: 100vw;
	border-radius: 0;
}

/* در حالت تمام‌عرض، محتوای داخلی به‌طور پیش‌فرض در یک عرض معقول وسط‌چین می‌ماند */
.tf-festival.tf-fullwidth .tf-festival__header,
.tf-festival.tf-fullwidth .tf-festival__layout {
	max-width: 1300px;
	margin-inline: auto;
	padding-inline: 24px;
}

/* کشیدگی: محتوا تا لبه‌های تمام‌عرض کشیده می‌شود */
.tf-festival.tf-fullwidth.tf-stretch .tf-festival__header,
.tf-festival.tf-fullwidth.tf-stretch .tf-festival__layout {
	max-width: 100%;
	padding-inline: 40px;
}

/* کشیدگی بدون تمام‌عرض: کارت‌ها و کادرها فضای بیشتری می‌گیرند */
.tf-festival.tf-stretch .tf-card {
	width: 100%;
}
.tf-festival.tf-stretch .tf-countbar {
	padding-inline: 32px;
}

@media (max-width: 768px) {
	.tf-festival.tf-fullwidth .tf-festival__header,
	.tf-festival.tf-fullwidth .tf-festival__layout,
	.tf-festival.tf-fullwidth.tf-stretch .tf-festival__header,
	.tf-festival.tf-fullwidth.tf-stretch .tf-festival__layout {
		padding-inline: 14px;
	}
}

/* ==========================================================================
   ویجت محصولات تخفیفی — نسخه ۱.۷ (باکس سفید + نوار مشترک پایین)
   ========================================================================== */

.tf-discount {
	--tf-accent: #750D24;
	--tf-cart: #0B1C2D;
	--tf-box: #ffffff;
	width: 100%;
	max-width: 100%;
	padding: 10px 0 20px;
	box-sizing: border-box;
	overflow-x: clip;
}

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

/* باکس سفید که کل بخش (لیست + محتوا + نوار) را در بر می‌گیرد */
.tf-discount__box {
	background: var(--tf-box);
	border-radius: 18px;
	overflow: hidden;
	box-shadow: 0 12px 34px rgba(117, 13, 36, 0.10);
	border: 0.5px solid rgba(0, 0, 0, 0.05);
	max-width: 100%;
}

/* نوار کاروسل موبایل — به‌طور پیش‌فرض در دسکتاپ پنهان */
.tf-discount__mobilenav,
.tf-discount__mdots {
	display: none;
}

.tf-discount__grid {
	display: grid;
	grid-template-columns: var(--tf-list-w, 26%) minmax(0, 1fr);
	gap: 0;
	align-items: stretch;
}

/* لیست عناوین (ستون کناری داخل باکس) */
.tf-discount__list {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 18px;
	border-inline-end: 0.5px solid rgba(0, 0, 0, 0.06);
	background: rgba(0, 0, 0, 0.015);
	min-width: 0;
}

.tf-discount__li {
	text-align: start;
	padding: 13px 15px;
	border: none;
	background: transparent;
	color: color-mix(in srgb, var(--tf-accent) 82%, #000 0%);
	font-size: var(--tf-list-fs, 14px);
	font-weight: 600;
	font-family: inherit;
	line-height: 1.7;
	cursor: pointer;
	border-radius: 12px;
	transition: background 0.22s ease, color 0.22s ease;
	word-break: normal;
	overflow-wrap: anywhere;
}

.tf-discount__li:hover {
	background: color-mix(in srgb, var(--tf-accent) 8%, transparent);
}

.tf-discount__li.is-active {
	background: var(--tf-accent);
	color: #fff;
}

/* بخش اصلی نمایش محصول */
.tf-discount__main {
	position: relative;
	min-height: 320px;
	min-width: 0;
	overflow: hidden;
}

.tf-discount__panel {
	display: none;
	height: 100%;
	animation: tf-fade-in 0.35s ease;
}
.tf-discount__panel.is-active { display: block; }

@keyframes tf-fade-in {
	from { opacity: 0; transform: translateY(8px); }
	to { opacity: 1; transform: translateY(0); }
}

.tf-discount__body {
	display: grid;
	grid-template-columns: minmax(0, 1fr) var(--tf-img-w, 240px);
	grid-template-areas:
		"title img"
		"desc  img";
	grid-template-rows: min-content min-content;
	align-content: center;
	justify-items: center;
	gap: 10px 18px;
	padding: 30px 30px 24px;
	min-height: 300px;
}

.tf-discount__ptitle {
	grid-area: title;
	align-self: end;
	margin: 0;
	font-size: 18px;
	font-weight: 700;
	color: #2b2b2b;
	text-align: center;
	line-height: 1.6;
}

.tf-discount__desc {
	grid-area: desc;
	align-self: start;
	font-size: 14px;
	line-height: 1.9;
	color: #6a6a6a;
	text-align: center;
	word-break: normal;
	overflow-wrap: break-word;
	max-width: 100%;
	padding: 0 6px;
}

.tf-discount__img {
	grid-area: img;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	align-self: center;
}

.tf-discount__img img {
	max-width: 100%;
	max-height: 240px;
	width: auto;
	object-fit: contain;
	filter: drop-shadow(0 12px 26px rgba(0, 0, 0, 0.14));
}

.tf-discount__soldout {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%) rotate(-12deg);
	padding: 8px 24px;
	font-size: 18px;
	font-weight: 900;
	color: #e63950;
	background: rgba(255, 255, 255, 0.9);
	border: 3px solid #e63950;
	border-radius: 10px;
	letter-spacing: 2px;
	white-space: nowrap;
	max-width: 90%;
}

/* نوار مشترک پایینِ کل باکس */
.tf-discount__footer {
	display: flex;
	align-items: stretch;
	justify-content: space-between;
	color: #fff;
	min-height: 60px;
	transition: background 0.35s ease;
}

.tf-discount__cart {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 0 26px;
	background: var(--tf-cart);
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: filter 0.2s ease;
}
.tf-discount__cart:hover { filter: brightness(1.15); color: #fff; }

.tf-discount__price {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: flex-start;
	padding: 10px 26px;
	flex: 1;
	font-size: 15px;
	font-weight: 700;
	color: #fff;
	line-height: 1.5;
}
.tf-discount__price,
.tf-discount__price *,
.tf-discount__price .woocommerce-Price-amount,
.tf-discount__price .amount,
.tf-discount__price bdi,
.tf-discount__price ins,
.tf-discount__price ins .amount {
	color: #fff !important;
}
.tf-discount__price del,
.tf-discount__price del .amount,
.tf-discount__price del bdi {
	font-size: 12px;
	font-weight: 400;
	opacity: 0.7;
	color: #fff !important;
}
.tf-discount__price ins { text-decoration: none; }

/* ---------- ریسپانسیو محصولات تخفیفی ---------- */
@media (max-width: 900px) {
	/* حذف ستون عناوین دسکتاپ؛ محتوا تک‌ستونه */
	.tf-discount__grid {
		grid-template-columns: 1fr;
	}
	.tf-discount__list {
		display: none;
	}

	/* نمایش کاروسل موبایل بالای باکس */
	.tf-discount__mobilenav {
		display: flex;
		align-items: center;
		gap: 10px;
		padding: 14px 12px;
		border-bottom: 0.5px solid rgba(0, 0, 0, 0.06);
		background: color-mix(in srgb, var(--tf-accent) 3%, #fff);
	}

	.tf-discount__mprev,
	.tf-discount__mnext {
		flex: 0 0 auto;
		width: 42px;
		height: 42px;
		min-width: 42px;
		border-radius: 50% !important;
		border: none !important;
		background: var(--tf-accent) !important;
		background-color: var(--tf-accent) !important;
		color: #fff !important;
		display: flex !important;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		box-shadow: 0 4px 12px color-mix(in srgb, var(--tf-accent) 30%, transparent);
		transition: transform 0.2s ease, filter 0.2s ease;
		padding: 0;
		appearance: none;
		-webkit-appearance: none;
	}
	.tf-discount__mprev:hover,
	.tf-discount__mnext:hover { filter: brightness(1.12); }
	.tf-discount__mprev:active,
	.tf-discount__mnext:active { transform: scale(0.92); }
	.tf-discount__mprev svg,
	.tf-discount__mnext svg {
		width: 22px;
		height: 22px;
		color: #fff;
		fill: #fff !important;
		display: block;
	}
	.tf-discount__mprev svg path,
	.tf-discount__mnext svg path { fill: #fff !important; }
	.tf-discount__mprev i,
	.tf-discount__mnext i {
		font-size: 18px;
		line-height: 1;
		color: inherit;
	}

	.tf-discount__mtrack-wrap {
		flex: 1;
		overflow: hidden;
		min-width: 0;
		touch-action: pan-y;
		cursor: pointer;
	}
	.tf-discount__mtrack {
		display: flex;
		width: 100%;
		transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
	}
	.tf-discount__mtitle {
		flex: 0 0 100%;
		min-width: 100%;
		text-align: center;
		font-size: 15px;
		font-weight: 700;
		color: var(--tf-accent);
		padding: 8px 6px;
		line-height: 1.6;
	}

	.tf-discount__mdots {
		display: flex;
		justify-content: center;
		gap: 6px;
		padding: 12px 0;
		background: color-mix(in srgb, var(--tf-accent) 3%, #fff);
		border-bottom: 0.5px solid rgba(0, 0, 0, 0.06);
	}
	.tf-discount__mdot {
		width: 7px;
		height: 7px;
		border-radius: 50%;
		background: color-mix(in srgb, var(--tf-accent) 25%, #ddd);
		cursor: pointer;
		transition: all 0.3s ease;
	}
	.tf-discount__mdot.is-active {
		width: 22px;
		border-radius: 6px;
		background: var(--tf-accent);
	}

	/* همه پنل‌ها روی موبایل هم مثل دسکتاپ فقط فعال نمایش داده می‌شوند */
	.tf-discount__main { min-height: auto; }

	/* موبایل: عنوان (تمام‌عرض) → تصویر → توضیحات به‌صورت ستونی */
	.tf-discount__body {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 12px;
		padding: 20px 18px 16px;
	}
	.tf-discount__ptitle {
		width: 100%;
		margin: 0;
		font-size: 16px;
	}
	.tf-discount__img {
		width: var(--tf-img-mobile, 80%);
		max-width: 80%;
	}
	.tf-discount__img img {
		width: 100%;
		max-height: 220px;
	}
	.tf-discount__desc {
		font-size: 13px;
		width: 100%;
		text-align: center;
		word-break: normal;
		overflow-wrap: break-word;
	}
}

/* موبایل: باکس وسط‌چین با فاصله ۱۰px از چپ و راست */
@media (max-width: 768px) {
	.tf-discount {
		padding-left: 10px;
		padding-right: 10px;
	}
	.tf-discount__box {
		margin-left: auto;
		margin-right: auto;
	}
}

@media (max-width: 600px) {
	/* نوار ثبت سفارش و قیمت کنار هم، دو ستون */
	.tf-discount__footer {
		flex-direction: row;
	}
	.tf-discount__cart {
		flex: 0 0 auto;
		justify-content: center;
		padding: 0 18px;
	}
	.tf-discount__price {
		flex: 1;
		align-items: center;
		text-align: center;
		padding: 12px 14px;
	}
}