/* mah24-perfume 1.12.3 */

/* --- mah24-perfume-minicart --- */
/**
 * مینی‌کارت ووکامرس — پوسته‌ی ماه۲۴.
 *
 * سلکتورها با .mah24-mc شروع می‌شوند و روی خصوصیت‌هایی که پوسته‌ها معمولاً
 * روی مینی‌کارت بازنویسی می‌کنند !important دارند.
 */

.mah24-mc {
	--mah24-mc-accent: #35091c;
	--mah24-mc-ink: #1a1a1e;
	--mah24-mc-muted: #8a8a90;
	--mah24-mc-line: #ececee;
	--mah24-mc-soft: #f6f4f5;

	box-sizing: border-box !important;
	display: flex !important;
	flex-direction: column !important;
	width: 100% !important;
	max-height: 100% !important;
	color: var(--mah24-mc-ink) !important;
	font-size: 13px !important;
	line-height: 1.8 !important;
	text-align: start !important;
}

.mah24-mc *,
.mah24-mc *::before,
.mah24-mc *::after {
	box-sizing: border-box !important;
}

/* ------------------------------------------------------------ فهرست اقلام */

.mah24-mc ul.mah24-mc__list {
	flex: 1 1 auto !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	min-height: 0 !important;
	overflow-x: hidden !important;
	overflow-y: auto !important;
	overscroll-behavior: contain !important;
	margin: 0 !important;
	padding: 0 4px !important;
	border: 0 !important;
	list-style: none !important;
}

.mah24-mc ul.mah24-mc__list > li.mah24-mc__item {
	position: relative !important;
	display: flex !important;
	align-items: flex-start !important;
	gap: 12px !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	overflow: hidden !important;
	margin: 0 !important;
	padding: 14px 8px !important;
	border: 0 !important;
	border-bottom: 1px solid var(--mah24-mc-line) !important;
	background: transparent !important;
	list-style: none !important;
	transition: opacity 0.25s ease !important;
}

.mah24-mc ul.mah24-mc__list > li.mah24-mc__item::before,
.mah24-mc ul.mah24-mc__list > li.mah24-mc__item::after {
	content: none !important;
}

.mah24-mc ul.mah24-mc__list > li.mah24-mc__item:last-child {
	border-bottom: 0 !important;
}

.mah24-mc .mah24-mc__item.is-busy {
	opacity: 0.55 !important;
	pointer-events: none !important;
}

/* تصویر */

.mah24-mc .mah24-mc__thumb {
	flex: 0 0 auto !important;
	display: block !important;
	width: 72px !important;
	height: 72px !important;
	overflow: hidden !important;
	border-radius: 12px !important;
	background: var(--mah24-mc-soft) !important;
	box-shadow: inset 0 0 0 1px var(--mah24-mc-line) !important;
}

.mah24-mc .mah24-mc__thumb img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 12px !important;
	object-fit: cover !important;
	float: none !important;
}

/* بدنه */

.mah24-mc .mah24-mc__body {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
}

.mah24-mc .mah24-mc__head {
	display: flex !important;
	align-items: flex-start !important;
	gap: 8px !important;
	min-width: 0 !important;
	max-width: 100% !important;
}

.mah24-mc .mah24-mc__name,
.mah24-mc .mah24-mc__name:visited {
	flex: 1 1 auto !important;
	min-width: 0 !important;
	display: -webkit-box !important;
	-webkit-line-clamp: 2 !important;
	-webkit-box-orient: vertical !important;
	overflow: hidden !important;
	color: var(--mah24-mc-ink) !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	line-height: 1.7 !important;
	text-decoration: none !important;
	overflow-wrap: anywhere !important;
	word-break: break-word !important;
}

.mah24-mc .mah24-mc__name:hover {
	color: var(--mah24-mc-accent) !important;
}

/* دکمه‌ی حذف (همان لینک ایجکسی ووکامرس) */

.mah24-mc a.mah24-mc__remove,
.mah24-mc a.mah24-mc__remove:visited {
	position: static !important;
	flex: 0 0 auto !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 26px !important;
	height: 26px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 1px solid var(--mah24-mc-line) !important;
	border-radius: 8px !important;
	background: #fafafa !important;
	color: var(--mah24-mc-muted) !important;
	font-size: 0 !important;
	line-height: 1 !important;
	text-decoration: none !important;
	transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease !important;
}

.mah24-mc a.mah24-mc__remove:hover {
	border-color: #ffd0d0 !important;
	background: #ffecec !important;
	color: #ff4d4d !important;
}

.mah24-mc a.mah24-mc__remove svg {
	display: block !important;
	width: 15px !important;
	height: 15px !important;
}

/* تراشه‌های ویژگی */

.mah24-mc .mah24-mc__chips {
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 6px !important;
	min-width: 0 !important;
	max-width: 100% !important;
}

.mah24-mc .mah24-mc__chip {
	display: inline-flex !important;
	align-items: center !important;
	gap: 4px !important;
	max-width: 100% !important;
	overflow-wrap: anywhere !important;
	padding: 4px 9px !important;
	border-radius: 7px !important;
	background: var(--mah24-mc-soft) !important;
	color: #5a5a60 !important;
	font-size: 11px !important;
	line-height: 1.7 !important;
}

.mah24-mc .mah24-mc__chip-key {
	color: var(--mah24-mc-muted) !important;
}

.mah24-mc .mah24-mc__chip-val {
	color: var(--mah24-mc-accent) !important;
	font-weight: 600 !important;
}

/* ردیف تعداد و قیمت */

.mah24-mc .mah24-mc__row {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	flex-wrap: wrap !important;
	gap: 8px 10px !important;
	margin-top: 2px !important;
	min-width: 0 !important;
	max-width: 100% !important;
}

.mah24-mc .mah24-mc__qty {
	display: inline-flex !important;
	align-items: center !important;
	gap: 2px !important;
	padding: 3px !important;
	border-radius: 10px !important;
	background: var(--mah24-mc-soft) !important;
}

.mah24-mc button.mah24-mc__qbtn {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 26px !important;
	height: 26px !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 7px !important;
	background: transparent !important;
	box-shadow: none !important;
	color: #5a5a60 !important;
	font-family: inherit !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	line-height: 1 !important;
	cursor: pointer !important;
	transition: background 0.15s ease, color 0.15s ease !important;
}

.mah24-mc button.mah24-mc__qbtn:hover:not(:disabled) {
	background: #f3eef1 !important;
	color: var(--mah24-mc-accent) !important;
}

.mah24-mc button.mah24-mc__qbtn:active:not(:disabled) {
	transform: translateY(1px) !important;
}

.mah24-mc button.mah24-mc__qbtn:disabled {
	opacity: 0.35 !important;
	cursor: not-allowed !important;
}

.mah24-mc .mah24-mc__qval {
	display: inline-flex !important;
	align-items: baseline !important;
	gap: 3px !important;
	min-width: 34px !important;
	color: var(--mah24-mc-ink) !important;
	font-size: 13px !important;
	font-weight: 700 !important;
	text-align: center !important;
	justify-content: center !important;
}

.mah24-mc .mah24-mc__qval small {
	color: var(--mah24-mc-muted) !important;
	font-size: 10px !important;
	font-weight: 500 !important;
}

.mah24-mc .mah24-mc__price {
	display: flex !important;
	flex-direction: column !important;
	align-items: flex-end !important;
	gap: 1px !important;
	min-width: 0 !important;
	text-align: end !important;
}

.mah24-mc .mah24-mc__price .amount,
.mah24-mc .mah24-mc__price bdi {
	white-space: nowrap !important;
}

.mah24-mc .mah24-mc__line,
.mah24-mc .mah24-mc__line .amount {
	color: var(--mah24-mc-ink) !important;
	font-size: 14px !important;
	font-weight: 700 !important;
}

.mah24-mc .mah24-mc__unit,
.mah24-mc .mah24-mc__unit .amount {
	color: var(--mah24-mc-muted) !important;
	font-size: 11px !important;
	font-weight: 500 !important;
}

.mah24-mc .quantity.mah24-mc__qty-plain {
	color: var(--mah24-mc-muted) !important;
	font-size: 12px !important;
}

/* هشدار حداقل سفارش */

.mah24-mc .mah24-mc__item.is-low {
	background: #fffaf6 !important;
}

.mah24-mc .mah24-mc__warn {
	margin: 0 !important;
	padding: 0 !important;
	color: #c0304d !important;
	font-size: 11.5px !important;
	line-height: 1.8 !important;
}

.mah24-mc .mah24-mc__alert {
	margin: 0 0 12px !important;
	padding: 10px 12px !important;
	border-radius: 10px !important;
	background: #fdf3f5 !important;
	color: #c0304d !important;
	font-size: 12px !important;
	line-height: 1.9 !important;
}

.mah24-mc .mah24-mc__alert ul {
	margin: 4px 0 0 !important;
	padding-inline-start: 16px !important;
	list-style: disc !important;
}

.mah24-mc .mah24-mc__alert li {
	margin: 0 !important;
	color: inherit !important;
	list-style: disc !important;
}

/* -------------------------------------------------------------- فوتر */

/*
 * فوتر از چپ و راست پدینگ ندارد تا دکمه‌ها تمام‌عرض بنشینند؛ فاصله‌ی متن‌ها
 * روی خودشان است.
 */
.mah24-mc .mah24-mc__foot {
	flex: 0 0 auto !important;
	width: 100% !important;
	max-width: 100% !important;
	margin-top: auto !important;
	padding: 14px 0 0 !important;
	border-top: 1px solid var(--mah24-mc-line) !important;
	background: #fff !important;
}

.mah24-mc .mah24-mc__foot > .mah24-mc__alert,
.mah24-mc .mah24-mc__foot > p.mah24-mc__total,
.mah24-mc .mah24-mc__foot > p.mah24-mc__note {
	padding-inline: 4px !important;
}

.mah24-mc p.mah24-mc__total {
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 10px !important;
	margin: 0 0 6px !important;
	padding: 0 !important;
	border: 0 !important;
	font-size: 13px !important;
}

.mah24-mc .mah24-mc__total-label {
	color: var(--mah24-mc-muted) !important;
	font-size: 13px !important;
	font-weight: 500 !important;
}

.mah24-mc .mah24-mc__total-value,
.mah24-mc .mah24-mc__total-value .amount {
	color: var(--mah24-mc-accent) !important;
	font-size: 19px !important;
	font-weight: 800 !important;
}

.mah24-mc .mah24-mc__total-value .woocommerce-Price-currencySymbol {
	color: var(--mah24-mc-muted) !important;
	font-size: 12px !important;
	font-weight: 500 !important;
}

.mah24-mc p.mah24-mc__note {
	margin: 0 0 14px !important;
	padding: 0 !important;
	color: var(--mah24-mc-muted) !important;
	font-size: 11px !important;
	line-height: 1.8 !important;
}

.mah24-mc p.mah24-mc__buttons {
	display: flex !important;
	align-items: stretch !important;
	gap: 8px !important;
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
}

.mah24-mc .mah24-mc__btn,
.mah24-mc .mah24-mc__btn:visited {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 8px !important;
	margin: 0 !important;
	padding: 13px 18px !important;
	border: 0 !important;
	border-radius: 13px !important;
	background: var(--mah24-mc-accent) !important;
	box-shadow: none !important;
	color: #fff !important;
	font-family: inherit !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	line-height: 1.4 !important;
	text-align: center !important;
	text-decoration: none !important;
	text-transform: none !important;
	transition: filter 0.15s ease, transform 0.1s ease !important;
}

.mah24-mc p.mah24-mc__buttons > .mah24-mc__btn {
	flex: 1 1 0 !important;
	min-width: 0 !important;
	padding-inline: 8px !important;
}

.mah24-mc .mah24-mc__btn--main {
	flex: 1 1 auto !important;
}

.mah24-mc .mah24-mc__btn--main:hover {
	color: #fff !important;
	filter: brightness(1.25) !important;
}

.mah24-mc .mah24-mc__btn--main:active {
	transform: translateY(1px) !important;
}

.mah24-mc .mah24-mc__btn--ghost,
.mah24-mc .mah24-mc__btn--ghost:visited {
	background: var(--mah24-mc-soft) !important;
	color: var(--mah24-mc-ink) !important;
	font-weight: 600 !important;
}

.mah24-mc .mah24-mc__btn--ghost:hover {
	background: #eee9ec !important;
	color: var(--mah24-mc-ink) !important;
}

.mah24-mc .mah24-mc__btn.is-disabled {
	opacity: 0.5 !important;
	cursor: not-allowed !important;
	pointer-events: none !important;
}

/* --------------------------------------------------------- سبد خالی */

.mah24-mc .mah24-mc__blank {
	display: flex !important;
	flex-direction: column !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px !important;
	padding: 42px 18px !important;
	text-align: center !important;
}

.mah24-mc .mah24-mc__blank-img {
	display: block !important;
	width: 150px !important;
	max-width: 70% !important;
	height: auto !important;
	margin: 0 auto 6px !important;
	opacity: 0.9 !important;
}

.mah24-mc span.mah24-mc__blank-img svg {
	display: block !important;
	width: 100% !important;
	height: auto !important;
}

.mah24-mc p.mah24-mc__blank-title {
	margin: 0 !important;
	padding: 0 !important;
	color: var(--mah24-mc-ink) !important;
	font-size: 14px !important;
	font-weight: 700 !important;
}

.mah24-mc p.mah24-mc__blank-text {
	margin: 0 !important;
	padding: 0 !important;
	color: var(--mah24-mc-muted) !important;
	font-size: 12.5px !important;
	line-height: 1.9 !important;
}

.mah24-mc .mah24-mc__blank .mah24-mc__btn {
	margin-top: 6px !important;
	padding: 11px 26px !important;
	border-radius: 999px !important;
	font-size: 13px !important;
}

/* ------------------------------------------------------------- ریزنمایش */

@media screen and (max-width: 420px) {
	.mah24-mc .mah24-mc__thumb {
		width: 60px !important;
		height: 60px !important;
	}

	.mah24-mc p.mah24-mc__buttons > .mah24-mc__btn {
		padding-block: 12px !important;
		font-size: 13px !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.mah24-mc ul.mah24-mc__list > li.mah24-mc__item,
	.mah24-mc .mah24-mc__btn,
	.mah24-mc button.mah24-mc__qbtn {
		transition: none !important;
	}
}


/* --- mah24-perfume-mobile-menu --- */
/**
 * منوی موبایل پیشرفته ماه۲۴ (Mah24 Advanced Mobile Menu)
 * شامل منوی اف‌کنواس چندلایه‌ای (Drilldown) با انیمیشن‌های روان و مدرن
 *
 * @package Mah24_Perfume
 */

:root {
	--mah24-mmenu-duration: 350ms;
	--mah24-mmenu-drilldown: 300ms;
	--mah24-mmenu-width: 330px;
	--mah24-mmenu-bg: #ffffff;
	--mah24-mmenu-primary: #4e1229;
	--mah24-mmenu-primary-hover: #681a38;
	--mah24-mmenu-text: #2c272a;
	--mah24-mmenu-text-muted: #7d7277;
	--mah24-mmenu-border: #ede8ea;
	--mah24-mmenu-item-hover: #faf6f8;
	--mah24-mmenu-item-active: #f7eef2;
	--mah24-mmenu-radius: 12px;
}

/* ==========================================================================
   دکمه‌ی باز کردن منو (Trigger)
   ========================================================================== */

.mah24-mmenu-trigger-wrap {
	display: inline-flex;
	align-items: center;
}

.mah24-mmenu-trigger {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 8px 14px;
	background: #ffffff;
	border: 1.5px solid var(--mah24-mmenu-border);
	border-radius: var(--mah24-mmenu-radius);
	color: var(--mah24-mmenu-text);
	cursor: pointer;
	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1);
	outline: none;
	user-select: none;
	-webkit-tap-highlight-color: transparent;
}

.mah24-mmenu-trigger:hover,
.mah24-mmenu-trigger:focus-visible {
	border-color: var(--mah24-mmenu-primary);
	color: var(--mah24-mmenu-primary);
	background: var(--mah24-mmenu-item-hover);
	box-shadow: 0 4px 12px rgba(78, 18, 41, 0.08);
}

/* همبرگر آیکون ۳ خط */
.mah24-mmenu-burger {
	width: 20px;
	height: 14px;
	position: relative;
	display: inline-flex;
	flex-direction: column;
	justify-content: space-between;
}

.mah24-mmenu-burger span {
	display: block;
	width: 100%;
	height: 2px;
	background-color: currentColor;
	border-radius: 2px;
	transition: transform 0.25s ease, opacity 0.25s ease;
}

.mah24-mmenu-burger span:nth-child(2) {
	width: 75%;
	margin-right: 0;
	margin-left: auto;
}

.mah24-mmenu-trigger:hover .mah24-mmenu-burger span:nth-child(2) {
	width: 100%;
}

.mah24-mmenu-trigger__label {
	display: inline-block;
	white-space: nowrap;
}

/* ==========================================================================
   پرتال و لایه‌های اف‌کنواس (Drawer & Backdrop)
   ========================================================================== */

.mah24-mmenu-portal {
	position: fixed;
	inset: 0;
	z-index: 999999;
	visibility: hidden;
	pointer-events: none;
	transition: visibility 0s linear var(--mah24-mmenu-duration);
}

.mah24-mmenu-portal.is-open {
	visibility: visible;
	pointer-events: auto;
	transition: visibility 0s linear 0s;
}

/* پس‌زمینه تیره با بلور گلس‌مورفیسم */
.mah24-mmenu-backdrop {
	position: absolute;
	inset: 0;
	background: rgba(18, 9, 14, 0.48);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	opacity: 0;
	transition: opacity var(--mah24-mmenu-duration) cubic-bezier(0.16, 1, 0.3, 1);
	cursor: pointer;
}

.mah24-mmenu-portal.is-open .mah24-mmenu-backdrop {
	opacity: 1;
}

/* بدنه پنل اف‌کنواس */
.mah24-mmenu-drawer {
	position: absolute;
	top: 0;
	bottom: 0;
	width: var(--mah24-mmenu-width);
	max-width: 88vw;
	background: var(--mah24-mmenu-bg);
	display: flex;
	flex-direction: column;
	overflow: hidden;
	box-shadow: 0 0 35px rgba(0, 0, 0, 0.16);
	z-index: 2;
	direction: rtl;
	text-align: right;
	will-change: transform, opacity;
}

/* جایگاه: راست (پیش‌فرض) */
.mah24-mmenu-portal[data-position="right"] .mah24-mmenu-drawer {
	right: 0;
	left: auto;
}

/* جایگاه: چپ */
.mah24-mmenu-portal[data-position="left"] .mah24-mmenu-drawer {
	left: 0;
	right: auto;
}

/* ==========================================================================
   انیمیشن‌های جذاب ورود و خروج (قابل تنظیم از کنترل‌های ویجت)
   ========================================================================== */

/* ۱. اسلاید روان (Slide) */
.mah24-mmenu-portal[data-anim="slide"][data-position="right"] .mah24-mmenu-drawer {
	transform: translate3d(100%, 0, 0);
	transition: transform var(--mah24-mmenu-duration) cubic-bezier(0.16, 1, 0.3, 1);
}
.mah24-mmenu-portal[data-anim="slide"][data-position="left"] .mah24-mmenu-drawer {
	transform: translate3d(-100%, 0, 0);
	transition: transform var(--mah24-mmenu-duration) cubic-bezier(0.16, 1, 0.3, 1);
}
.mah24-mmenu-portal[data-anim="slide"].is-open .mah24-mmenu-drawer {
	transform: translate3d(0, 0, 0);
}

/* ۲. اسلاید نرم همراه با فید (Fade & Slide) */
.mah24-mmenu-portal[data-anim="fade-slide"][data-position="right"] .mah24-mmenu-drawer {
	transform: translate3d(70px, 0, 0);
	opacity: 0;
	transition: transform var(--mah24-mmenu-duration) cubic-bezier(0.16, 1, 0.3, 1),
	            opacity var(--mah24-mmenu-duration) ease;
}
.mah24-mmenu-portal[data-anim="fade-slide"][data-position="left"] .mah24-mmenu-drawer {
	transform: translate3d(-70px, 0, 0);
	opacity: 0;
	transition: transform var(--mah24-mmenu-duration) cubic-bezier(0.16, 1, 0.3, 1),
	            opacity var(--mah24-mmenu-duration) ease;
}
.mah24-mmenu-portal[data-anim="fade-slide"].is-open .mah24-mmenu-drawer {
	transform: translate3d(0, 0, 0);
	opacity: 1;
}

/* ۳. بزرگ‌نمایی نرم (Zoom) */
.mah24-mmenu-portal[data-anim="zoom"][data-position="right"] .mah24-mmenu-drawer {
	transform: translate3d(60px, 0, 0) scale(0.92);
	opacity: 0;
	transform-origin: right center;
	transition: transform var(--mah24-mmenu-duration) cubic-bezier(0.16, 1, 0.3, 1),
	            opacity var(--mah24-mmenu-duration) ease;
}
.mah24-mmenu-portal[data-anim="zoom"][data-position="left"] .mah24-mmenu-drawer {
	transform: translate3d(-60px, 0, 0) scale(0.92);
	opacity: 0;
	transform-origin: left center;
	transition: transform var(--mah24-mmenu-duration) cubic-bezier(0.16, 1, 0.3, 1),
	            opacity var(--mah24-mmenu-duration) ease;
}
.mah24-mmenu-portal[data-anim="zoom"].is-open .mah24-mmenu-drawer {
	transform: translate3d(0, 0, 0) scale(1);
	opacity: 1;
}

/* ۴. سه‌بعدی لایه‌ای (3D Push) */
.mah24-mmenu-portal[data-anim="push"][data-position="right"] .mah24-mmenu-drawer {
	transform: perspective(900px) rotateY(-14deg) translate3d(100%, 0, 0);
	transform-origin: right center;
	opacity: 0.3;
	transition: transform var(--mah24-mmenu-duration) cubic-bezier(0.16, 1, 0.3, 1),
	            opacity var(--mah24-mmenu-duration) ease;
}
.mah24-mmenu-portal[data-anim="push"][data-position="left"] .mah24-mmenu-drawer {
	transform: perspective(900px) rotateY(14deg) translate3d(-100%, 0, 0);
	transform-origin: left center;
	opacity: 0.3;
	transition: transform var(--mah24-mmenu-duration) cubic-bezier(0.16, 1, 0.3, 1),
	            opacity var(--mah24-mmenu-duration) ease;
}
.mah24-mmenu-portal[data-anim="push"].is-open .mah24-mmenu-drawer {
	transform: perspective(900px) rotateY(0deg) translate3d(0, 0, 0);
	opacity: 1;
}

/* ۵. اسلاید گلس‌مورفیک بلور (Blur Slide) */
.mah24-mmenu-portal[data-anim="blur-slide"][data-position="right"] .mah24-mmenu-drawer {
	transform: translate3d(100%, 0, 0);
	filter: blur(14px);
	opacity: 0;
	transition: transform var(--mah24-mmenu-duration) cubic-bezier(0.16, 1, 0.3, 1),
	            filter var(--mah24-mmenu-duration) ease,
	            opacity var(--mah24-mmenu-duration) ease;
}
.mah24-mmenu-portal[data-anim="blur-slide"][data-position="left"] .mah24-mmenu-drawer {
	transform: translate3d(-100%, 0, 0);
	filter: blur(14px);
	opacity: 0;
	transition: transform var(--mah24-mmenu-duration) cubic-bezier(0.16, 1, 0.3, 1),
	            filter var(--mah24-mmenu-duration) ease,
	            opacity var(--mah24-mmenu-duration) ease;
}
.mah24-mmenu-portal[data-anim="blur-slide"].is-open .mah24-mmenu-drawer {
	transform: translate3d(0, 0, 0);
	filter: blur(0);
	opacity: 1;
}

/* ==========================================================================
   هدر پنل اف‌کنواس (Header)
   ========================================================================== */

.mah24-mmenu-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 18px 20px;
	border-bottom: 1px solid var(--mah24-mmenu-border);
	background: #ffffff;
	flex-shrink: 0;
	gap: 12px;
}

.mah24-mmenu-header__brand {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.mah24-mmenu-header__logo {
	max-height: 36px;
	width: auto;
	object-fit: contain;
}

.mah24-mmenu-header__title {
	margin: 0;
	font-size: 15px;
	font-weight: 700;
	color: var(--mah24-mmenu-text);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.mah24-mmenu-close {
	width: 34px;
	height: 34px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	border: 1px solid var(--mah24-mmenu-border);
	border-radius: 50%;
	background: #ffffff;
	color: var(--mah24-mmenu-text-muted);
	cursor: pointer;
	transition: all 0.2s ease;
	flex-shrink: 0;
	outline: none;
}

.mah24-mmenu-close:hover {
	border-color: var(--mah24-mmenu-primary);
	color: var(--mah24-mmenu-primary);
	background: var(--mah24-mmenu-item-hover);
	transform: rotate(90deg);
}

.mah24-mmenu-close svg {
	width: 14px;
	height: 14px;
	stroke-width: 2.2;
}

/* ==========================================================================
   نوار جستجو در منو (Search Box)
   ========================================================================== */

.mah24-mmenu-search {
	padding: 12px 18px 6px;
	flex-shrink: 0;
}

.mah24-mmenu-search__form {
	position: relative;
	display: flex;
	align-items: center;
}

.mah24-mmenu-search__input {
	width: 100%;
	height: 42px;
	padding: 0 40px 0 14px;
	background: #fbf9fa;
	border: 1.5px solid var(--mah24-mmenu-border);
	border-radius: var(--mah24-mmenu-radius);
	font-family: inherit;
	font-size: 13px;
	color: var(--mah24-mmenu-text);
	transition: all 0.2s ease;
	outline: none;
}

.mah24-mmenu-search__input:focus {
	background: #ffffff;
	border-color: var(--mah24-mmenu-primary);
	box-shadow: 0 0 0 3px rgba(78, 18, 41, 0.08);
}

.mah24-mmenu-search__icon {
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	color: var(--mah24-mmenu-text-muted);
	pointer-events: none;
	display: flex;
	align-items: center;
	justify-content: center;
}

.mah24-mmenu-search__icon svg {
	width: 16px;
	height: 16px;
}

/* ==========================================================================
   لایه‌های سلسله‌مراتبی و اسلاید از راست (Drilldown Panels)
   ========================================================================== */

.mah24-mmenu-panels {
	position: relative;
	flex: 1 1 auto;
	overflow: hidden;
	width: 100%;
}

.mah24-mmenu-panel {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
	display: flex;
	flex-direction: column;
	background: var(--mah24-mmenu-bg);
	will-change: transform, opacity;

	/* حالت پیش‌فرض: خارج از صفحه در سمت راست (در انتظار نمایش) */
	transform: translate3d(100%, 0, 0);
	visibility: hidden;
	pointer-events: none;
	transition: transform var(--mah24-mmenu-drilldown) cubic-bezier(0.16, 1, 0.3, 1),
	            visibility 0s linear var(--mah24-mmenu-drilldown);
}

/* لایه جاری که نمایش داده می‌شود */
.mah24-mmenu-panel.is-current {
	transform: translate3d(0, 0, 0);
	visibility: visible;
	pointer-events: auto;
	transition: transform var(--mah24-mmenu-drilldown) cubic-bezier(0.16, 1, 0.3, 1);
	z-index: 2;
}

/* لایه والد قبلی در زیر لایه جاری (حرکت مختصر به چپ و مات شدن نرم) */
.mah24-mmenu-panel.is-parent {
	transform: translate3d(-24%, 0, 0);
	opacity: 0.55;
	filter: blur(0.8px);
	pointer-events: none;
	visibility: visible;
	transition: transform var(--mah24-mmenu-drilldown) cubic-bezier(0.16, 1, 0.3, 1),
	            opacity var(--mah24-mmenu-drilldown) ease,
	            filter var(--mah24-mmenu-drilldown) ease;
	z-index: 1;
}

/* اسکرول‌بار ظریف */
.mah24-mmenu-panel::-webkit-scrollbar {
	width: 4px;
}
.mah24-mmenu-panel::-webkit-scrollbar-thumb {
	background: #ded6d9;
	border-radius: 4px;
}

/* ==========================================================================
   دکمه بازگشت در بالای لایه‌های زیرمنو (Back Button)
   ========================================================================== */

.mah24-mmenu-back-bar {
	position: sticky;
	top: 0;
	z-index: 3;
	padding: 12px 16px;
	background: #faf7f8;
	border-bottom: 1px solid var(--mah24-mmenu-border);
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.mah24-mmenu-back-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 6px 12px;
	border: 1px solid var(--mah24-mmenu-border);
	border-radius: 20px;
	background: #ffffff;
	color: var(--mah24-mmenu-primary);
	font-family: inherit;
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
	transition: all 0.18s ease;
	outline: none;
	user-select: none;
}

.mah24-mmenu-back-btn:hover {
	background: var(--mah24-mmenu-primary);
	color: #ffffff;
	border-color: var(--mah24-mmenu-primary);
	transform: translateX(3px);
}

.mah24-mmenu-back-btn svg {
	width: 14px;
	height: 14px;
	stroke-width: 2.4;
	transition: transform 0.18s ease;
}

.mah24-mmenu-back-btn:hover svg {
	transform: translateX(2px);
}

.mah24-mmenu-back-title {
	font-size: 13px;
	font-weight: 600;
	color: var(--mah24-mmenu-text-muted);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 140px;
}

/* لینک مشاهده همه والد */
.mah24-mmenu-parent-link {
	padding: 10px 18px;
	background: #fff6fa;
	border-bottom: 1px solid var(--mah24-mmenu-border);
}

.mah24-mmenu-parent-link a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: var(--mah24-mmenu-primary);
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
}

.mah24-mmenu-parent-link a:hover {
	text-decoration: underline;
}

/* ==========================================================================
   لیست آیتم‌های منو
   ========================================================================== */

.mah24-mmenu-list {
	list-style: none;
	margin: 0;
	padding: 6px 0;
}

.mah24-mmenu-item {
	list-style: none;
	margin: 0;
	padding: 0;
	border-bottom: 1px solid rgba(237, 232, 234, 0.6);
}

.mah24-mmenu-item:last-child {
	border-bottom: none;
}

.mah24-mmenu-link-wrap {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 16px;
	transition: background 0.15s ease;
}

.mah24-mmenu-link-wrap:hover {
	background: var(--mah24-mmenu-item-hover);
}

.mah24-mmenu-link {
	display: flex;
	align-items: center;
	gap: 10px;
	flex: 1 1 auto;
	padding: 14px 0;
	color: var(--mah24-mmenu-text);
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	transition: color 0.15s ease;
}

.mah24-mmenu-link:hover {
	color: var(--mah24-mmenu-primary);
}

/* نشان یا بج (Badge) */
.mah24-mmenu-badge {
	display: inline-block;
	padding: 2px 7px;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.4;
	border-radius: 10px;
	background: var(--mah24-mmenu-primary);
	color: #ffffff;
}

.mah24-mmenu-badge--sale {
	background: #d63384;
}

.mah24-mmenu-badge--new {
	background: #198754;
}

/* دکمه فلش هدایت به زیرمنو */
.mah24-mmenu-toggle-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	margin-left: -6px;
	padding: 0;
	border: none;
	background: transparent;
	color: var(--mah24-mmenu-text-muted);
	cursor: pointer;
	border-radius: 8px;
	transition: all 0.15s ease;
	outline: none;
}

.mah24-mmenu-toggle-btn:hover {
	background: var(--mah24-mmenu-item-active);
	color: var(--mah24-mmenu-primary);
	transform: translateX(-3px);
}

.mah24-mmenu-toggle-btn svg {
	width: 16px;
	height: 16px;
	stroke-width: 2.2;
}

/* کل سطر دارای زیرمنو کلیک‌پذیر باشد */
.mah24-mmenu-item--has-children.mah24-mmenu-item--clickable-row .mah24-mmenu-link-wrap {
	cursor: pointer;
}

/* ==========================================================================
   فوتر پنل اف‌کنواس (Footer)
   ========================================================================== */

.mah24-mmenu-footer {
	padding: 14px 18px;
	background: #fdfbfc;
	border-top: 1px solid var(--mah24-mmenu-border);
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.mah24-mmenu-contact {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 10px 12px;
	background: #ffffff;
	border: 1px solid var(--mah24-mmenu-border);
	border-radius: var(--mah24-mmenu-radius);
	text-decoration: none;
	color: var(--mah24-mmenu-text);
	transition: all 0.2s ease;
}

.mah24-mmenu-contact:hover {
	border-color: var(--mah24-mmenu-primary);
	background: #fffbfd;
}

.mah24-mmenu-contact__icon {
	width: 32px;
	height: 32px;
	border-radius: 8px;
	background: var(--mah24-mmenu-item-active);
	color: var(--mah24-mmenu-primary);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.mah24-mmenu-contact__icon svg {
	width: 16px;
	height: 16px;
}

.mah24-mmenu-contact__info {
	display: flex;
	flex-direction: column;
	text-align: right;
	margin-right: 10px;
	flex: 1 1 auto;
}

.mah24-mmenu-contact__label {
	font-size: 11.5px;
	color: var(--mah24-mmenu-text-muted);
}

.mah24-mmenu-contact__value {
	font-size: 13.5px;
	font-weight: 700;
	color: var(--mah24-mmenu-text);
	direction: ltr;
	text-align: right;
}

.mah24-mmenu-account-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 10px 16px;
	background: var(--mah24-mmenu-primary);
	color: #ffffff !important;
	border-radius: var(--mah24-mmenu-radius);
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
	transition: background 0.2s ease;
}

.mah24-mmenu-account-btn:hover {
	background: var(--mah24-mmenu-primary-hover);
}

.mah24-mmenu-account-btn svg {
	width: 16px;
	height: 16px;
}

/* قفل اسکرول صفحه هنگام باز بودن منو */
body.mah24-mmenu-locked {
	overflow: hidden !important;
	touch-action: none;
}


/* --- mah24-perfume-search --- */
/**
 * جست‌وجوی زنده‌ی محصول — [mah24_search].
 *
 * هر چیزی که ممکن است مدیر بخواهد عوض کند، یک متغیر CSS روی ریشه است، تا
 * کنترل‌های المنتور فقط همان متغیر را بنویسند و این فایل دست‌نخورده بماند.
 */

.mah24-se {
	/* رنگ‌ها */
	--mah24-se-ink: #2c2c2c;
	--mah24-se-muted: #8a8a8a;
	--mah24-se-line: #e9e4e3;
	--mah24-se-accent: #4e1229;
	--mah24-se-field: #fff;
	--mah24-se-panel-bg: #fff;
	/*
	 * نتیجه‌ها یک ته‌رنگ خیلی کم‌رنگ دارند تا از پس‌زمینه‌ی پنل جدا دیده شوند.
	 * رنگ هاور یک پله تیره‌تر است، وگرنه با ته‌رنگ قاطی می‌شد و حس کلیک‌پذیری
	 * کارت از بین می‌رفت. هر دو از تب «ظاهر» قابل تغییرند.
	 */
	--mah24-se-card-bg: #faf8f8;
	--mah24-se-card-hover: #f2ecee;
	--mah24-se-price: #4e1229;
	--mah24-se-off-bg: #b32d2e;
	--mah24-se-off-ink: #fff;

	/* کادر جست‌وجو */
	--mah24-se-h: 48px;
	--mah24-se-radius: 14px;
	--mah24-se-border: 1px;
	--mah24-se-pad: 14px;
	--mah24-se-font: 14px;
	--mah24-se-icon: #8a8a8a;

	/* دکمه */
	--mah24-se-btn-bg: #4e1229;
	--mah24-se-btn-ink: #fff;
	--mah24-se-btn-bg-h: #7a2a45;
	--mah24-se-btn-ink-h: #fff;
	--mah24-se-btn-radius: 14px;
	--mah24-se-btn-pad: 20px;
	--mah24-se-btn-font: 14px;
	--mah24-se-gap: 8px;

	/* پنل */
	--mah24-se-panel-w: 100%;
	--mah24-se-panel-max: 1100px;
	--mah24-se-panel-radius: 16px;
	--mah24-se-panel-pad: 10px;
	--mah24-se-panel-gap: 6px;
	--mah24-se-panel-top: 8px;
	--mah24-se-panel-shadow: 0 18px 44px rgba(24, 8, 14, 0.16);

	/* کارت */
	--mah24-se-card-h: 76px;
	--mah24-se-card-radius: 12px;
	--mah24-se-card-pad: 8px;
	--mah24-se-thumb: 56px;
	--mah24-se-thumb-radius: 10px;
	--mah24-se-title-size: 14px;
	--mah24-se-en-size: 12px;
	--mah24-se-price-size: 13px;

	/* چیدمان (نقطه‌های شکست این‌ها را بازنویسی می‌کنند) */
	--mah24-se-cols: 1;
	--mah24-se-rows: 5;
	--mah24-se-c: var(--mah24-se-cols);
	--mah24-se-r: var(--mah24-se-rows);

	position: relative;
	direction: rtl;
	width: 100%;
	color: var(--mah24-se-ink);
	box-sizing: border-box;
}

.mah24-se *,
.mah24-se *::before,
.mah24-se *::after {
	box-sizing: border-box;
}

/* ----------------------------- کادر و دکمه ---------------------------- */

.mah24-se__form {
	display: flex;
	align-items: stretch;
	gap: var(--mah24-se-gap);
	margin: 0;
	width: 100%;
}

.mah24-se__box {
	position: relative;
	display: flex;
	align-items: center;
	flex: 1 1 auto;
	min-width: 0;
	height: var(--mah24-se-h);
	padding: 0 var(--mah24-se-pad);
	border: var(--mah24-se-border) solid var(--mah24-se-line);
	border-radius: var(--mah24-se-radius);
	background: var(--mah24-se-field);
	transition: border-color 0.18s ease, box-shadow 0.18s ease;
}

.mah24-se.is-open .mah24-se__box,
.mah24-se__box:focus-within {
	border-color: var(--mah24-se-accent);
	box-shadow: 0 0 0 3px rgba(78, 18, 41, 0.08);
}

.mah24-se__icon {
	display: flex;
	flex: 0 0 auto;
	margin-inline-end: 8px;
	color: var(--mah24-se-icon);
}

.mah24-se__input {
	flex: 1 1 auto;
	min-width: 0;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	font-family: inherit;
	font-size: var(--mah24-se-font);
	color: inherit;
	outline: none;
	box-shadow: none;
}

.mah24-se__input::placeholder {
	color: var(--mah24-se-muted);
	opacity: 1;
}

/* دکمه‌ی پاک کردن که ناخواسته از مرورگر نیاید */
.mah24-se__input::-webkit-search-cancel-button {
	-webkit-appearance: none;
	appearance: none;
}

.mah24-se__clear {
	flex: 0 0 auto;
	width: 22px;
	height: 22px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: var(--mah24-se-card-hover);
	color: var(--mah24-se-muted);
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
}

.mah24-se__clear:hover {
	color: var(--mah24-se-ink);
}

.mah24-se__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	flex: 0 0 auto;
	height: var(--mah24-se-h);
	padding: 0 var(--mah24-se-btn-pad);
	border: 0;
	border-radius: var(--mah24-se-btn-radius);
	background: var(--mah24-se-btn-bg);
	color: var(--mah24-se-btn-ink);
	font-family: inherit;
	font-size: var(--mah24-se-btn-font);
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	transition: background 0.18s ease, color 0.18s ease;
}

.mah24-se__btn:hover {
	background: var(--mah24-se-btn-bg-h);
	color: var(--mah24-se-btn-ink-h);
}

/*
 * نوار نازک بارگذاری روی کادر.
 *
 * انیمیشن نوار را از این سر به آن سر می‌برد، پس بدون بریدنِ کادر از دو طرف
 * بیرون می‌زد. overflow روی خود کادر هم نوار را داخل نگه می‌دارد و هم آن را
 * به همان گوشه‌های گرد می‌چسباند. سایه‌ی فوکوس بیرون عنصر است و بریده نمی‌شود.
 */
.mah24-se__box {
	overflow: hidden;
}

.mah24-se.is-loading .mah24-se__box::after {
	content: "";
	position: absolute;
	inset-inline: 0;
	bottom: 0;
	height: 2px;
	background: linear-gradient(90deg, transparent, var(--mah24-se-accent), transparent);
	animation: mah24-se-scan 0.9s linear infinite;
}

@keyframes mah24-se-scan {
	0% { transform: translateX(100%); }
	100% { transform: translateX(-100%); }
}

/* -------------------------------- پنل -------------------------------- */

.mah24-se__panel {
	position: absolute;
	inset-inline-start: 0;
	top: calc(100% + var(--mah24-se-panel-top));
	z-index: 60;
	width: var(--mah24-se-panel-w);
	padding: var(--mah24-se-panel-pad);
	border: 1px solid var(--mah24-se-line);
	border-radius: var(--mah24-se-panel-radius);
	background: var(--mah24-se-panel-bg);
	box-shadow: var(--mah24-se-panel-shadow);
}

.mah24-se__panel[hidden] {
	display: none;
}

/*
 * «هم‌عرض هدر»: پنل از کادر بیرون می‌زند و وسطِ صفحه می‌نشیند، تا در هدرهای
 * تمام‌عرض همان عرض هدر دیده شود. سقف عرض هم قابل تنظیم است.
 */
.mah24-se--w-wide .mah24-se__panel {
	inset-inline-start: 50%;
	width: min(var(--mah24-se-panel-max), calc(100vw - 32px));
	transform: translateX(50%);
}

.mah24-se--w-custom .mah24-se__panel {
	width: min(var(--mah24-se-panel-w), calc(100vw - 32px));
}

.mah24-se__hint,
.mah24-se__empty {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 22px 12px;
	color: var(--mah24-se-muted);
	font-size: 13px;
	text-align: center;
}

.mah24-se__empty-icon {
	display: flex;
	opacity: 0.7;
}

/* ------------------------------ نتیجه‌ها ------------------------------ */

.mah24-se__list {
	display: grid;
	grid-template-columns: repeat(var(--mah24-se-c), minmax(0, 1fr));
	gap: var(--mah24-se-panel-gap);

	/*
	 * ارتفاع = تعداد ردیف × ارتفاع کارت + فاصله‌ها. بقیه اسکرول می‌خورد، پس
	 * «تعداد ردیف» واقعاً یعنی چند ردیف دیده می‌شود، نه چندتا نتیجه بیاید.
	 */
	max-height: calc(
		(var(--mah24-se-card-h) * var(--mah24-se-r))
		+ (var(--mah24-se-panel-gap) * (var(--mah24-se-r) - 1))
	);
	overflow-y: auto;
	overscroll-behavior: contain;
}

.mah24-se__list::-webkit-scrollbar {
	width: 6px;
}

.mah24-se__list::-webkit-scrollbar-thumb {
	border-radius: 6px;
	background: var(--mah24-se-line);
}

.mah24-se__card {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: var(--mah24-se-card-h);
	padding: var(--mah24-se-card-pad);
	border-radius: var(--mah24-se-card-radius);
	background: var(--mah24-se-card-bg);
	color: inherit;
	text-decoration: none;
	transition: background 0.15s ease;
}

/*
 * خط جداکننده بین نتیجه‌ها، تا دو کارت پشت‌سرهم در هم نروند. آخرین کارتِ هر
 * ستون خط نمی‌گیرد؛ در چیدمان تک‌ستونی یعنی فقط آخری، و در چند ستونی یعنی
 * ردیف آخر — که با nth-last-child ساده نمی‌شد و :not(:last-child) کافی است
 * چون فاصله‌ی شبکه خودش ستون‌ها را جدا نگه می‌دارد.
 */
.mah24-se__list > .mah24-se__card:not(:last-child) {
	border-bottom: 1px solid var(--mah24-se-line);
}

.mah24-se__card:hover,
.mah24-se__card.is-active {
	background: var(--mah24-se-card-hover);
	color: inherit;
}

.mah24-se__card.is-out,
.mah24-se__card.mah24-out {
	opacity: 0.6;
}

.mah24-se__thumb {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 var(--mah24-se-thumb);
	width: var(--mah24-se-thumb);
	height: var(--mah24-se-thumb);
	border-radius: var(--mah24-se-thumb-radius);
	overflow: hidden;
	background: var(--mah24-se-card-hover);
}

.mah24-se__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	margin: 0;
	border-radius: 0;
}

.mah24-se__off {
	position: absolute;
	inset-block-start: 3px;
	inset-inline-start: 3px;
	padding: 1px 5px;
	border-radius: 6px;
	background: var(--mah24-se-off-bg);
	color: var(--mah24-se-off-ink);
	font-size: 10px;
	font-weight: 700;
	line-height: 1.6;
}

.mah24-se__body {
	display: flex;
	flex-direction: column;
	gap: 2px;
	flex: 1 1 auto;
	min-width: 0;
}

.mah24-se__brand {
	font-size: 11px;
	color: var(--mah24-se-muted);
	letter-spacing: 0.02em;
}

.mah24-se__title {
	font-size: var(--mah24-se-title-size);
	font-weight: 600;
	line-height: 1.7;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.mah24-se__en {
	font-size: var(--mah24-se-en-size);
	color: var(--mah24-se-muted);
	line-height: 1.6;
	direction: ltr;
	text-align: right;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.mah24-se__rating,
.mah24-se__stock {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	font-size: 11px;
	color: var(--mah24-se-muted);
}

.mah24-se__star {
	color: #e8a33d;
}

.mah24-se__stock.is-out {
	color: var(--mah24-se-off-bg);
}

.mah24-se__price {
	flex: 0 0 auto;
	font-size: var(--mah24-se-price-size);
	font-weight: 700;
	color: var(--mah24-se-price);
	text-align: end;
	white-space: nowrap;
}

.mah24-se__price del {
	display: block;
	font-size: 0.85em;
	font-weight: 400;
	color: var(--mah24-se-muted);
	text-decoration: line-through;
}

.mah24-se__price ins {
	text-decoration: none;
}

/* ------------------------------ پاورقی ------------------------------- */

.mah24-se__more {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	margin-top: var(--mah24-se-panel-gap);
	padding: 10px;
	border-top: 1px solid var(--mah24-se-line);
	color: var(--mah24-se-accent);
	font-size: 13px;
	font-weight: 700;
	text-decoration: none;
}

.mah24-se__more:hover {
	color: var(--mah24-se-accent);
	text-decoration: underline;
}

.mah24-se__more-arrow {
	font-size: 16px;
	line-height: 1;
}


/* ------------------------------ ریسپانسیو ---------------------------- */

/*
 * تبلت و موبایل: عنوان بالا، قیمت زیرش.
 *
 * در چیدمان تک‌ردیفی، قیمت کنار عنوان می‌نشیند و چون با nowrap عرضش را
 * نگه می‌دارد، هرچه عرض کم می‌شود از سهم عنوان کم می‌کند تا جایی که عنوان
 * به چند حرف می‌رسد. اینجا کارت دو ردیفی می‌شود: تصویر در ستون کنار و
 * هر دو ردیف را می‌گیرد، عنوان تمام عرض باقی‌مانده را دارد و قیمت زیر آن.
 */
@media (max-width: 1024px) {
	.mah24-se {
		/* دو ردیفی بلندتر است؛ وگرنه «تعداد ردیف» دیگر با واقعیت نمی‌خواند. */
		--mah24-se-card-h: 84px;
	}

	.mah24-se__card {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr);
		align-items: center;
		column-gap: 10px;
		row-gap: 2px;
	}

	.mah24-se__thumb {
		grid-column: 1;
		grid-row: 1 / -1;
	}

	.mah24-se__body {
		grid-column: 2;
	}

	.mah24-se__price {
		grid-column: 2;
		text-align: start;
	}

	/* خط‌خورده کنار قیمت بنشیند، نه زیرش؛ ردیف دوم بلند نشود. */
	.mah24-se__price del {
		display: inline;
		margin-inline-start: 6px;
	}
}

@media (max-width: 767px) {
	.mah24-se {
		--mah24-se-h: 44px;
		--mah24-se-thumb: 48px;
		--mah24-se-card-h: 78px;
		--mah24-se-btn-pad: 14px;
	}

	.mah24-se__list {
		/*
		 * سقف ارتفاع در موبایل.
		 *
		 * ارتفاع پایه از «تعداد ردیف» می‌آید، ولی صفحه‌ی موبایل کوتاه است و با
		 * ردیف زیاد، پنل از پایین صفحه بیرون می‌زد. min() هرکدام را که کوچک‌تر
		 * باشد برمی‌دارد، پس تنظیمِ مدیر محترم است مگر جایی که جا نشود.
		 */
		max-height: min(
			calc(
				(var(--mah24-se-card-h) * var(--mah24-se-r))
				+ (var(--mah24-se-panel-gap) * (var(--mah24-se-r) - 1))
			),
			58vh
		);

		/*
		 * زنجیره‌ی اسکرول باز است: وقتی فهرست به ته رسید، ادامه‌ی حرکتِ انگشت
		 * خودِ صفحه را می‌برد. روی دسکتاپ همان contain می‌ماند تا چرخ ماوس روی
		 * پنل، صفحه‌ی پشتش را تکان ندهد.
		 */
		overscroll-behavior: auto;
	}

	/* در موبایل، عرض دلخواه و «هم‌عرض هدر» هر دو به عرض صفحه می‌رسند. */
	.mah24-se--w-wide .mah24-se__panel,
	.mah24-se--w-custom .mah24-se__panel {
		inset-inline-start: 0;
		width: 100%;
		transform: none;
	}

	.mah24-se__btn-text {
		display: none;
	}
}


/* --- mah24-perfume-support --- */
/**
 * استایل دکمه‌ی شناور پشتیبانی ماه۲۴ (Mah24 Floating Support)
 *
 * ساختار: یک ریشه‌ی fixed در گوشه‌ی صفحه که هم دکمه‌ی شناور را نگه می‌دارد و
 * هم پنل را. باز و بسته شدن پنل با transform سه‌بعدی روی همان گوشه انجام
 * می‌شود (transform-origin روی گوشه‌ی نزدیک به دکمه) تا حسِ «از دل دکمه باز
 * شدن» بدهد.
 *
 * @package Mah24_Perfume
 */

.mah24-sp {
	--mah24-sp-primary: #4e1229;
	--mah24-sp-primary-2: #7a1f42;
	--mah24-sp-accent: #d4af37;
	--mah24-sp-bg: #ffffff;
	--mah24-sp-soft: #faf6f8;
	--mah24-sp-border: #ede4e8;
	--mah24-sp-text: #2c272a;
	--mah24-sp-muted: #7d7277;
	--mah24-sp-online: #20bf6b;
	--mah24-sp-radius: 22px;
	--mah24-sp-size: 60px;
	--mah24-sp-width: 340px;
	--mah24-sp-shadow: 0 24px 60px -18px rgba(78, 18, 41, 0.35);
	--mah24-sp-offset-side: 24px;
	--mah24-sp-offset-bottom: 24px;
	--mah24-sp-z: 9998;
	--mah24-sp-gap: 16px;

	position: fixed;
	z-index: var(--mah24-sp-z);
	direction: rtl;
	text-align: right;
	font-family: inherit;
	line-height: 1.7;
	-webkit-tap-highlight-color: transparent;
	/*
	 * عمقِ سه‌بعدی عمداً روی این عنصر تعریف نشده: perspective برای فرزندانِ
	 * position:fixed «بلوکِ دربرگیرنده» می‌سازد و آن‌وقت پرده و پنلِ موبایل
	 * به‌جای پنجره، نسبت به همین دکمه‌ی کوچک چیده می‌شدند. عمق داخل خودِ
	 * transform پنل با تابع perspective() می‌آید.
	 *
	 * از ویژگی‌های منطقی (inset-inline-*) هم استفاده نشده، چون direction اینجا
	 * rtl است و «انتهای درون‌خطی» می‌شود سمت چپ؛ گوشه‌ها باید فیزیکی بمانند.
	 */
}

/* گوشه‌ها */
.mah24-sp--bottom-right {
	right: var(--mah24-sp-offset-side);
	bottom: var(--mah24-sp-offset-bottom);
}

.mah24-sp--bottom-left {
	left: var(--mah24-sp-offset-side);
	bottom: var(--mah24-sp-offset-bottom);
}

.mah24-sp--top-right {
	right: var(--mah24-sp-offset-side);
	top: var(--mah24-sp-offset-bottom);
}

.mah24-sp--top-left {
	left: var(--mah24-sp-offset-side);
	top: var(--mah24-sp-offset-bottom);
}

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

.mah24-sp .mah24-sp-svg {
	width: 100%;
	height: 100%;
	display: block;
}

/* --------------------------------------------------------------------- */
/* دکمه‌ی شناور                                                            */
/* --------------------------------------------------------------------- */

.mah24-sp__launcher {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--mah24-sp-size);
	height: var(--mah24-sp-size);
	padding: 0;
	margin: 0;
	border: 0;
	border-radius: 50%;
	cursor: pointer;
	color: #fff;
	background: linear-gradient(145deg, var(--mah24-sp-primary-2), var(--mah24-sp-primary));
	box-shadow: 0 14px 30px -10px rgba(78, 18, 41, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.18);
	transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), box-shadow 0.3s ease;
	-webkit-appearance: none;
	appearance: none;
}

.mah24-sp__launcher:hover {
	transform: translateY(-3px) scale(1.05);
	box-shadow: 0 20px 38px -10px rgba(78, 18, 41, 0.6);
}

.mah24-sp__launcher:active {
	transform: scale(0.96);
}

.mah24-sp__launcher:focus-visible {
	outline: 3px solid var(--mah24-sp-accent);
	outline-offset: 3px;
}

.mah24-sp__icon {
	position: absolute;
	inset: 0;
	margin: auto;
	width: 26px;
	height: 26px;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.4s cubic-bezier(0.34, 1.4, 0.64, 1), opacity 0.25s ease;
}

.mah24-sp__icon svg {
	width: 26px;
	height: 26px;
}

.mah24-sp__icon--close {
	opacity: 0;
	transform: rotate(-120deg) scale(0.4);
}

.mah24-sp.is-open .mah24-sp__icon--open {
	opacity: 0;
	transform: rotate(120deg) scale(0.4);
}

.mah24-sp.is-open .mah24-sp__icon--close {
	opacity: 1;
	transform: rotate(0) scale(1);
}

/* حلقه‌ی تپنده */
.mah24-sp__ring {
	position: absolute;
	inset: 0;
	border-radius: 50%;
	pointer-events: none;
}

.mah24-sp--pulse .mah24-sp__ring::before,
.mah24-sp--pulse .mah24-sp__ring::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: 50%;
	border: 2px solid var(--mah24-sp-primary);
	opacity: 0;
	animation: mah24-sp-pulse 2.6s cubic-bezier(0.24, 0.6, 0.4, 1) infinite;
}

.mah24-sp--pulse .mah24-sp__ring::after {
	animation-delay: 1.3s;
}

.mah24-sp.is-open .mah24-sp__ring::before,
.mah24-sp.is-open .mah24-sp__ring::after {
	animation-play-state: paused;
	opacity: 0;
}

@keyframes mah24-sp-pulse {
	0% {
		opacity: 0.55;
		transform: scale(1);
	}

	70% {
		opacity: 0;
		transform: scale(1.75);
	}

	100% {
		opacity: 0;
		transform: scale(1.75);
	}
}

/* نشان عددی روی دکمه */
.mah24-sp__badge {
	position: absolute;
	top: -2px;
	left: -2px;
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	border-radius: 10px;
	background: #e53935;
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	line-height: 20px;
	text-align: center;
	box-shadow: 0 2px 8px rgba(229, 57, 53, 0.5);
}

/* برچسب کنار دکمه */
.mah24-sp__tip {
	position: absolute;
	top: 50%;
	right: calc(var(--mah24-sp-size) + 12px);
	transform: translateY(-50%) translateX(8px);
	padding: 7px 14px;
	border-radius: 999px;
	background: var(--mah24-sp-text);
	color: #fff;
	font-size: 12.5px;
	font-weight: 600;
	white-space: nowrap;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s;
	box-shadow: 0 8px 20px -8px rgba(0, 0, 0, 0.5);
}

.mah24-sp--bottom-left .mah24-sp__tip,
.mah24-sp--top-left .mah24-sp__tip {
	right: auto;
	left: calc(var(--mah24-sp-size) + 12px);
	transform: translateY(-50%) translateX(-8px);
}

.mah24-sp--label-always .mah24-sp__tip,
.mah24-sp__launcher:hover ~ .mah24-sp__tip,
.mah24-sp__launcher:focus-visible ~ .mah24-sp__tip {
	opacity: 1;
	visibility: visible;
	transform: translateY(-50%) translateX(0);
}

.mah24-sp.is-open .mah24-sp__tip {
	opacity: 0;
	visibility: hidden;
}

/* --------------------------------------------------------------------- */
/* پنل                                                                     */
/* --------------------------------------------------------------------- */

.mah24-sp__panel {
	position: absolute;
	bottom: calc(var(--mah24-sp-size) + var(--mah24-sp-gap));
	right: 0;
	width: var(--mah24-sp-width);
	max-width: calc(100vw - 2 * var(--mah24-sp-offset-side));
	max-height: min(72vh, 560px);
	overflow: hidden auto;
	background: var(--mah24-sp-bg);
	border: 1px solid var(--mah24-sp-border);
	border-radius: var(--mah24-sp-radius);
	box-shadow: var(--mah24-sp-shadow);
	color: var(--mah24-sp-text);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	/* گوشه‌ی نزدیک به دکمه، هم محور چرخش است و هم نقطه‌ی گریز پرسپکتیو. */
	transform-origin: 100% 100%;
	transition:
		transform 0.52s cubic-bezier(0.22, 1.12, 0.36, 1),
		opacity 0.3s ease,
		visibility 0.52s;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: thin;
}

.mah24-sp--bottom-left .mah24-sp__panel,
.mah24-sp--top-left .mah24-sp__panel {
	right: auto;
	left: 0;
	transform-origin: 0 100%;
}

.mah24-sp--top-right .mah24-sp__panel,
.mah24-sp--top-left .mah24-sp__panel {
	bottom: auto;
	top: calc(var(--mah24-sp-size) + var(--mah24-sp-gap));
}

.mah24-sp--top-right .mah24-sp__panel {
	transform-origin: 100% 0;
}

.mah24-sp--top-left .mah24-sp__panel {
	transform-origin: 0 0;
}

/*
 * حالت بسته، به تفکیک نوع انیمیشن.
 *
 * ترتیب توابع در همه‌ی حالت‌ها (و در حالت باز) یکی است تا مرورگر بتواند
 * تک‌تکِ توابع را درون‌یابی کند و حرکت نرم بماند.
 */

.mah24-sp--anim-flip .mah24-sp__panel {
	transform: perspective(1400px) translate3d(0, 26px, -120px) rotateX(-72deg) rotateY(0deg) rotateZ(0deg) scale(0.88);
}

.mah24-sp--anim-cube .mah24-sp__panel {
	transform: perspective(1400px) translate3d(28px, 10px, -140px) rotateX(0deg) rotateY(-78deg) rotateZ(0deg) scale(0.92);
}

.mah24-sp--bottom-left.mah24-sp--anim-cube .mah24-sp__panel,
.mah24-sp--top-left.mah24-sp--anim-cube .mah24-sp__panel {
	transform: perspective(1400px) translate3d(-28px, 10px, -140px) rotateX(0deg) rotateY(78deg) rotateZ(0deg) scale(0.92);
}

.mah24-sp--anim-tilt .mah24-sp__panel {
	transform: perspective(1400px) translate3d(14px, 34px, -180px) rotateX(-38deg) rotateY(-24deg) rotateZ(3deg) scale(0.82);
}

.mah24-sp--bottom-left.mah24-sp--anim-tilt .mah24-sp__panel,
.mah24-sp--top-left.mah24-sp--anim-tilt .mah24-sp__panel {
	transform: perspective(1400px) translate3d(-14px, 34px, -180px) rotateX(-38deg) rotateY(24deg) rotateZ(-3deg) scale(0.82);
}

.mah24-sp--anim-pop .mah24-sp__panel {
	transform: perspective(1400px) translate3d(0, 14px, -60px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(0.72);
}

/* --- حالت باز --- */

.mah24-sp.is-open .mah24-sp__panel {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: perspective(1400px) translate3d(0, 0, 0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
}

/* درخشش لبه‌ی بالای پنل */
.mah24-sp__panel::before {
	content: '';
	position: sticky;
	top: 0;
	display: block;
	height: 3px;
	background: linear-gradient(90deg, var(--mah24-sp-primary), var(--mah24-sp-accent), var(--mah24-sp-primary-2));
	z-index: 3;
}

/* سربرگ پنل */
.mah24-sp__head {
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 18px 18px 16px;
	background: linear-gradient(150deg, var(--mah24-sp-primary), var(--mah24-sp-primary-2));
	color: #fff;
}

.mah24-sp__head-icon {
	flex: 0 0 auto;
	width: 42px;
	height: 42px;
	padding: 9px;
	border-radius: 14px;
	background: rgba(255, 255, 255, 0.16);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
}

.mah24-sp__head-icon svg {
	width: 100%;
	height: 100%;
}

.mah24-sp__head-icon i,
.mah24-sp__head-icon .e-font-icon-svg {
	font-size: 22px;
	width: 22px;
	height: 22px;
}

.mah24-sp__head-text {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.mah24-sp__title {
	font-size: 15px;
	font-weight: 700;
	line-height: 1.6;
	color: #fff;
}

.mah24-sp__subtitle {
	font-size: 12px;
	line-height: 1.7;
	color: rgba(255, 255, 255, 0.78);
}

.mah24-sp__status {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 4px;
	font-size: 11.5px;
	color: rgba(255, 255, 255, 0.9);
}

.mah24-sp__status i {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--mah24-sp-online);
	box-shadow: 0 0 0 0 rgba(32, 191, 107, 0.7);
	animation: mah24-sp-dot 2s ease-out infinite;
}

@keyframes mah24-sp-dot {
	0% {
		box-shadow: 0 0 0 0 rgba(32, 191, 107, 0.7);
	}

	70% {
		box-shadow: 0 0 0 7px rgba(32, 191, 107, 0);
	}

	100% {
		box-shadow: 0 0 0 0 rgba(32, 191, 107, 0);
	}
}

.mah24-sp__close {
	flex: 0 0 auto;
	width: 30px;
	height: 30px;
	padding: 6px;
	border: 0;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.14);
	color: #fff;
	cursor: pointer;
	transition: background 0.2s ease, transform 0.2s ease;
}

.mah24-sp__close:hover {
	background: rgba(255, 255, 255, 0.28);
	transform: rotate(90deg);
}

.mah24-sp__close:focus-visible {
	outline: 2px solid #fff;
	outline-offset: 2px;
}

/* فهرست راه‌های ارتباطی */
.mah24-sp__items {
	list-style: none;
	margin: 0;
	padding: 12px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	/*
	 * پنل به‌خاطر overflow نمی‌تواند preserve-3d داشته باشد، پس عمقِ ورودِ
	 * پلکانی آیتم‌ها از همین‌جا تأمین می‌شود.
	 */
	perspective: 900px;
	perspective-origin: 50% 0;
}

.mah24-sp__item-wrap {
	margin: 0;
	padding: 0;
	list-style: none;
	opacity: 0;
	transform: translateY(14px) translateZ(-40px) rotateX(-22deg);
	transition:
		opacity 0.4s ease,
		transform 0.5s cubic-bezier(0.22, 1.12, 0.36, 1);
	transition-delay: 0s;
}

.mah24-sp.is-open .mah24-sp__item-wrap {
	opacity: 1;
	transform: translateY(0) translateZ(0) rotateX(0);
	/* پلکانی: هر آیتم کمی دیرتر از قبلی. */
	transition-delay: calc(0.16s + var(--mah24-sp-i, 0) * 0.07s);
}

.mah24-sp__item {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 11px 12px;
	border: 1px solid var(--mah24-sp-border);
	border-radius: 16px;
	background: var(--mah24-sp-bg);
	color: var(--mah24-sp-text);
	text-decoration: none;
	position: relative;
	overflow: hidden;
	transition: border-color 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease, background-color 0.25s ease;
}

.mah24-sp__item::after {
	content: '';
	position: absolute;
	inset: 0;
	background: var(--mah24-sp-item, var(--mah24-sp-primary));
	opacity: 0;
	transition: opacity 0.25s ease;
	pointer-events: none;
}

.mah24-sp__item:hover,
.mah24-sp__item:focus-visible {
	border-color: var(--mah24-sp-item, var(--mah24-sp-primary));
	transform: translateX(-4px);
	box-shadow: 0 10px 24px -14px var(--mah24-sp-item, var(--mah24-sp-primary));
	text-decoration: none;
	color: var(--mah24-sp-text);
}

.mah24-sp--bottom-left .mah24-sp__item:hover,
.mah24-sp--top-left .mah24-sp__item:hover {
	transform: translateX(4px);
}

.mah24-sp__item:hover::after,
.mah24-sp__item:focus-visible::after {
	opacity: 0.05;
}

.mah24-sp__item:focus-visible {
	outline: 2px solid var(--mah24-sp-item, var(--mah24-sp-primary));
	outline-offset: 2px;
}

/* ردیفی که مقصد ندارد: فقط نمایش، بدون رفتار کلیک‌پذیر. */
.mah24-sp__item--static {
	cursor: default;
	background: var(--mah24-sp-soft);
}

.mah24-sp__item--static:hover {
	transform: none;
	border-color: var(--mah24-sp-border);
	box-shadow: none;
}

.mah24-sp__item--static:hover::after {
	opacity: 0;
}

.mah24-sp__item--static:hover .mah24-sp__item-icon {
	transform: none;
}

.mah24-sp__item-icon {
	position: relative;
	z-index: 1;
	flex: 0 0 auto;
	width: 42px;
	height: 42px;
	padding: 10px;
	border-radius: 14px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--mah24-sp-item, var(--mah24-sp-primary));
	background: color-mix(in srgb, var(--mah24-sp-item, #4e1229) 12%, transparent);
	transition: transform 0.3s cubic-bezier(0.34, 1.5, 0.64, 1);
}

/* پشتیبان برای مرورگرهایی که color-mix ندارند. */
@supports not (background: color-mix(in srgb, red 10%, transparent)) {
	.mah24-sp__item-icon {
		background: var(--mah24-sp-soft);
	}
}

.mah24-sp__item-icon svg {
	width: 100%;
	height: 100%;
}

.mah24-sp__item-icon i,
.mah24-sp__item-icon .e-font-icon-svg {
	font-size: 21px;
	width: 21px;
	height: 21px;
}

.mah24-sp__item:hover .mah24-sp__item-icon {
	transform: scale(1.08) rotate(-6deg);
}

.mah24-sp__item-text {
	position: relative;
	z-index: 1;
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 1px;
}

.mah24-sp__item-title {
	font-size: 13.5px;
	font-weight: 700;
	line-height: 1.7;
	color: var(--mah24-sp-text);
}

.mah24-sp__item-sub {
	font-size: 11.5px;
	line-height: 1.7;
	color: var(--mah24-sp-muted);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.mah24-sp__item-badge {
	position: relative;
	z-index: 1;
	flex: 0 0 auto;
	padding: 2px 8px;
	border-radius: 999px;
	font-size: 10.5px;
	font-weight: 700;
	color: #fff;
	background: var(--mah24-sp-item, var(--mah24-sp-primary));
}

.mah24-sp__item-arrow {
	position: relative;
	z-index: 1;
	flex: 0 0 auto;
	width: 18px;
	height: 18px;
	color: var(--mah24-sp-muted);
	opacity: 0.55;
	transition: transform 0.25s ease, opacity 0.25s ease, color 0.25s ease;
}

.mah24-sp--bottom-left .mah24-sp__item-arrow,
.mah24-sp--top-left .mah24-sp__item-arrow {
	transform: scaleX(-1);
}

.mah24-sp__item:hover .mah24-sp__item-arrow {
	opacity: 1;
	color: var(--mah24-sp-item, var(--mah24-sp-primary));
	transform: translateX(-3px);
}

.mah24-sp--bottom-left .mah24-sp__item:hover .mah24-sp__item-arrow,
.mah24-sp--top-left .mah24-sp__item:hover .mah24-sp__item-arrow {
	transform: scaleX(-1) translateX(-3px);
}

/* پاورقی */
.mah24-sp__foot {
	padding: 12px 18px 16px;
	border-top: 1px solid var(--mah24-sp-border);
	background: var(--mah24-sp-soft);
	font-size: 11.5px;
	line-height: 1.9;
	color: var(--mah24-sp-muted);
	text-align: center;
}

.mah24-sp__foot a {
	color: var(--mah24-sp-primary);
	text-decoration: none;
}

/* پرده‌ی پشت پنل */
.mah24-sp__backdrop {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(26, 12, 18, 0.42);
	backdrop-filter: blur(2px);
	opacity: 0;
	transition: opacity 0.35s ease;
	z-index: -1;
}

.mah24-sp--backdrop.is-open .mah24-sp__backdrop {
	display: block;
	opacity: 1;
}

/* --------------------------------------------------------------------- */
/* موبایل: پنل به شکل شیت پایین صفحه                                       */
/* --------------------------------------------------------------------- */

@media (max-width: 600px) {
	.mah24-sp {
		--mah24-sp-size: 54px;
		--mah24-sp-offset-side: 16px;
		--mah24-sp-offset-bottom: 16px;
	}

	.mah24-sp__icon svg {
		width: 23px;
		height: 23px;
	}

	/* روی موبایل همیشه پرده هست تا تمرکز روی پنل بماند. */
	.mah24-sp.is-open .mah24-sp__backdrop {
		display: block;
		opacity: 1;
	}

	/*
	 * روی موبایل پنل از قابِ کوچکِ گوشه بیرون می‌آید و تمام عرض را می‌گیرد؛
	 * fixed هم اینجا واقعاً نسبت به پنجره است، چون هیچ جدّی perspective ندارد.
	 */
	.mah24-sp__panel {
		position: fixed;
		left: 12px;
		right: 12px;
		bottom: calc(var(--mah24-sp-offset-bottom) + var(--mah24-sp-size) + 12px);
		top: auto;
		width: auto;
		max-width: none;
		max-height: 70vh;
		max-height: 70dvh;
		border-radius: 20px;
		transform-origin: 50% 100%;
	}

	.mah24-sp--top-right .mah24-sp__panel,
	.mah24-sp--top-left .mah24-sp__panel {
		top: calc(var(--mah24-sp-offset-bottom) + var(--mah24-sp-size) + 12px);
		bottom: auto;
		transform-origin: 50% 0;
	}

	/* روی صفحه‌ی کوچک، چرخش ملایم‌تر تا متن‌ها خوانا بمانند. */
	.mah24-sp--anim-flip .mah24-sp__panel,
	.mah24-sp--anim-tilt .mah24-sp__panel,
	.mah24-sp--bottom-left.mah24-sp--anim-tilt .mah24-sp__panel,
	.mah24-sp--top-left.mah24-sp--anim-tilt .mah24-sp__panel {
		transform: perspective(1100px) translate3d(0, 22px, -90px) rotateX(-42deg) rotateY(0deg) rotateZ(0deg) scale(0.92);
	}

	.mah24-sp--anim-cube .mah24-sp__panel,
	.mah24-sp--bottom-left.mah24-sp--anim-cube .mah24-sp__panel,
	.mah24-sp--top-left.mah24-sp--anim-cube .mah24-sp__panel {
		transform: perspective(1100px) translate3d(0, 18px, -110px) rotateX(0deg) rotateY(-52deg) rotateZ(0deg) scale(0.94);
	}

	.mah24-sp--anim-pop .mah24-sp__panel {
		transform: perspective(1100px) translate3d(0, 16px, -40px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(0.8);
	}

	.mah24-sp.is-open .mah24-sp__panel {
		transform: perspective(1100px) translate3d(0, 0, 0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
	}

	.mah24-sp__head {
		padding: 15px 15px 13px;
	}

	.mah24-sp__items {
		padding: 10px;
		gap: 7px;
	}

	.mah24-sp__item {
		padding: 10px;
		gap: 10px;
	}

	.mah24-sp__item-icon {
		width: 40px;
		height: 40px;
		padding: 9px;
	}

	.mah24-sp__item-title {
		font-size: 13px;
	}

	.mah24-sp__item-sub {
		font-size: 11px;
		white-space: normal;
	}

	/* برچسب کنار دکمه روی موبایل جا نمی‌گیرد. */
	.mah24-sp__tip {
		display: none;
	}
}

@media (max-width: 360px) {
	.mah24-sp {
		--mah24-sp-size: 50px;
	}

	.mah24-sp__head-icon {
		display: none;
	}
}

/* صفحه‌های کوتاه (موبایل افقی) */
@media (max-height: 480px) {
	.mah24-sp__panel {
		max-height: 78vh;
	}

	.mah24-sp__head {
		padding: 12px 14px;
	}

	.mah24-sp__subtitle,
	.mah24-sp__status {
		display: none;
	}
}

/* احترام به تنظیم «کاهش حرکت» سیستم کاربر */
@media (prefers-reduced-motion: reduce) {
	.mah24-sp__panel,
	.mah24-sp__item-wrap,
	.mah24-sp__launcher,
	.mah24-sp__icon,
	.mah24-sp__item,
	.mah24-sp__item-icon,
	.mah24-sp__tip {
		transition-duration: 0.001s !important;
		transition-delay: 0s !important;
	}

	.mah24-sp--anim-flip .mah24-sp__panel,
	.mah24-sp--anim-cube .mah24-sp__panel,
	.mah24-sp--anim-tilt .mah24-sp__panel,
	.mah24-sp--anim-pop .mah24-sp__panel {
		transform: none;
	}

	.mah24-sp__item-wrap {
		transform: none;
	}

	.mah24-sp--pulse .mah24-sp__ring::before,
	.mah24-sp--pulse .mah24-sp__ring::after,
	.mah24-sp__status i {
		animation: none;
	}
}

/* --------------------------------------------------------------------- */
/* سازگاری با المنتور                                                      */
/* --------------------------------------------------------------------- */

/*
 * خنثی‌کردن «افکت ورودی» (Entrance Animation) روی این ویجت.
 *
 * المنتور برای افکت ورودی، کلاس elementor-invisible را با visibility:hidden
 * روی عنصر ویجت می‌گذارد و فقط وقتی عنصر وارد دید شود برش می‌دارد. بدنه‌ی این
 * ویجت اما position:fixed است و جعبه‌اش در جریان صفحه ارتفاع صفر دارد؛ آن
 * لحظه ممکن است هرگز نرسد و دکمه تا ابد نامرئی بماند — در ویرایشگر دیده شود و
 * در سایت نه.
 *
 * دردسر دوم: خودِ انیمیشن روی همین عنصر transform می‌گذارد و transform برای
 * فرزندِ position:fixed «بلوک دربرگیرنده» می‌سازد؛ یعنی دکمه به‌جای گوشه‌ی
 * پنجره، در گوشه‌ی همان ستون قفل می‌شد.
 *
 * افکت ورودی روی یک دکمه‌ی همیشه‌شناور هم معنای چندانی ندارد (خودش انیمیشن
 * ورود و حلقه‌ی تپنده دارد)، پس اینجا کلاً از کار انداخته می‌شود.
 */
.elementor-widget-mah24-support.elementor-invisible {
	visibility: visible !important;
}

/*
 * عمداً به کلاس «animated» بند نشده: المنتور نام انیمیشن را با کلاس جدا
 * (مثل fadeInUp) می‌گذارد و اگر روزی «animated» را نگذارد، این بند از کار
 * می‌افتاد. خودِ ویجت هیچ انیمیشنی روی جعبه‌ی بیرونی ندارد؛ تپش و چراغ
 * وضعیت روی عنصرهای درونی‌اند و animation ارث نمی‌رسد، پس چیزی از دست نمی‌رود.
 */
.elementor-widget-mah24-support {
	animation: none !important;
}

/* --------------------------------------------------------------------- */
/* راهنمای ویرایشگر المنتور                                                */
/* --------------------------------------------------------------------- */

.mah24-sp-notice {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 16px 18px;
	border: 1px dashed #d9cfd3;
	border-radius: 16px;
	background: #fdfaf9;
	color: #8b8085;
	font-size: 13px;
	line-height: 1.9;
	direction: rtl;
	text-align: right;
}

/* حالت هشدار: چیزی هست که در سایت آن‌طور که انتظار می‌رود کار نمی‌کند. */
.mah24-sp-notice--warn {
	border-color: #e0b44a;
	border-style: solid;
	background: #fffaf0;
	color: #8a6520;
}

.mah24-sp-notice--warn .mah24-sp-notice__icon {
	background: #fdf0d5;
	color: #a9761d;
}

.mah24-sp-notice--warn strong {
	color: #8a6520;
}

.mah24-sp-notice__icon {
	flex: 0 0 auto;
	width: 40px;
	height: 40px;
	padding: 9px;
	border-radius: 12px;
	background: #f4ecef;
	color: #4e1229;
}

.mah24-sp-notice__icon svg {
	width: 100%;
	height: 100%;
}

.mah24-sp-notice strong {
	display: block;
	color: #4e1229;
	font-size: 13.5px;
}

.mah24-sp-notice p {
	margin: 2px 0 0;
	font-size: 12px;
	line-height: 1.9;
}


/* --- mah24-perfume-toast --- */
/**
 * پیام شناور مشترک (toast) — علاقه‌مندی، کیف پول و هر بخش دیگری.
 *
 * جهت‌ها منطقی (logical) هستند تا در RTL و LTR یکسان کار کنند.
 */

.mah24-toasts {
	position: fixed;
	z-index: 999999;
	inset-block-end: 24px;
	inset-inline-start: 24px;
	display: flex;
	flex-direction: column;
	gap: 10px;
	max-width: min(360px, calc(100vw - 32px));
	pointer-events: none;
}

.mah24-toast {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 13px 16px;
	border-radius: 14px;
	border-inline-start: 4px solid #8a8a8a;
	background: #fff;
	box-shadow: 0 16px 40px -18px rgba(20, 5, 12, 0.55);
	color: #2b2330;
	font-size: 13.5px;
	font-weight: 600;
	line-height: 1.8;
	pointer-events: auto;
	opacity: 0;
	transform: translateY(12px);
	transition: opacity 0.25s ease, transform 0.25s ease;
}

.mah24-toast.is-in {
	opacity: 1;
	transform: translateY(0);
}

.mah24-toast--success {
	border-inline-start-color: #1d9a68;
}

.mah24-toast--error {
	border-inline-start-color: #c1123f;
}

.mah24-toast__icon {
	flex: 0 0 auto;
	width: 20px;
	height: 20px;
	margin-top: 2px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
}

.mah24-toast--success .mah24-toast__icon {
	background: #1d9a68;
}

.mah24-toast--error .mah24-toast__icon {
	background: #c1123f;
}

.mah24-toast__body {
	flex: 1;
	min-width: 0;
}

.mah24-toast__link {
	display: inline-block;
	margin-top: 4px;
	color: #4e1229;
	font-weight: 800;
	text-decoration: underline;
}

.mah24-toast__close {
	flex: 0 0 auto;
	margin: -4px -6px 0 -6px;
	padding: 4px 6px;
	border: 0;
	background: none;
	color: #a1959b;
	font-size: 16px;
	line-height: 1;
	cursor: pointer;
}

.mah24-toast__close:hover {
	color: #2b2330;
}

@media (prefers-reduced-motion: reduce) {
	.mah24-toast {
		transition: none;
	}
}

@media (max-width: 480px) {
	.mah24-toasts {
		inset-inline: 16px;
		inset-block-end: 16px;
		max-width: none;
	}
}


