/* مهرسام | دکمه تماس شناور — استایل سمت سایت */

.mhrs-widget {
	--mhrs-size: 60px;
	--mhrs-side: 24px;
	--mhrs-bottom: 24px;
	--mhrs-main: #4a6cf7;
	--mhrs-gap: 14px;

	position: fixed;
	bottom: var(--mhrs-bottom);
	z-index: 99990;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--mhrs-gap);
	font-family: inherit;
	line-height: 1;
	direction: ltr; /* چیدمان ستونی؛ جهت متن داخل حباب جداگانه تعیین می‌شود */
}

.mhrs-widget.mhrs-pos-left  { left: var(--mhrs-side); align-items: flex-start; }
.mhrs-widget.mhrs-pos-right { right: var(--mhrs-side); align-items: flex-end; }

/* لیست دکمه‌ها
   از جریان صفحه خارج است و بالای دکمه‌ی اصلی لنگر می‌اندازد؛
   بنابراین در حالت بسته، جعبه‌ی ویجت فقط اندازه‌ی خودِ دکمه است و
   هیچ فضای خالی‌ای پشتِ صفحه را نمی‌گیرد. */
.mhrs-list {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
	display: flex;
	flex-direction: column;
	gap: var(--mhrs-gap);
	position: absolute;
	bottom: calc(100% + var(--mhrs-gap)); /* درست بالای دکمه‌ی اصلی */
	pointer-events: none; /* در حالت بسته، ناحیه‌ی لیست کلیک را عبور می‌دهد */
}
.mhrs-pos-left  .mhrs-list { left: 0;  align-items: flex-start; }
.mhrs-pos-right .mhrs-list { right: 0; align-items: flex-end; }

/* در حالت باز، لیست و آیتم‌ها کلیک‌پذیر می‌شوند (هیچ والدِ pointer-events:none نداریم) */
.mhrs-widget.is-open .mhrs-list { pointer-events: auto; }

.mhrs-list::before,
.mhrs-list::after { content: none !important; }

.mhrs-item {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	opacity: 0;
	transform: translateY(14px) scale(.7);
	pointer-events: none;
	transition: opacity .22s ease, transform .28s cubic-bezier(.2, .9, .3, 1.3);
	transition-delay: 0s;
}

.mhrs-widget.is-open .mhrs-item {
	opacity: 1;
	transform: none;
	pointer-events: auto;
}

/* باز شدن پلکانی از پایین به بالا */
.mhrs-widget.is-open .mhrs-item:nth-last-child(1) { transition-delay: .02s; }
.mhrs-widget.is-open .mhrs-item:nth-last-child(2) { transition-delay: .06s; }
.mhrs-widget.is-open .mhrs-item:nth-last-child(3) { transition-delay: .10s; }
.mhrs-widget.is-open .mhrs-item:nth-last-child(4) { transition-delay: .14s; }
.mhrs-widget.is-open .mhrs-item:nth-last-child(5) { transition-delay: .18s; }
.mhrs-widget.is-open .mhrs-item:nth-last-child(6) { transition-delay: .22s; }
.mhrs-widget.is-open .mhrs-item:nth-last-child(n + 7) { transition-delay: .26s; }

/* دکمه‌ها */
.mhrs-btn,
.mhrs-toggle {
	width: var(--mhrs-size);
	height: var(--mhrs-size);
	min-width: var(--mhrs-size);
	min-height: var(--mhrs-size);
	border-radius: 50%;
	border: 0;
	padding: 0 !important;
	margin: 0 !important;
	display: flex !important;
	align-items: center;
	justify-content: center;
	position: relative;
	overflow: visible;
	flex: 0 0 auto;
	cursor: pointer;
	box-shadow: 0 8px 22px rgba(20, 30, 70, .18);
	transition: transform .18s ease, box-shadow .18s ease, filter .18s ease;
	text-decoration: none !important;
	box-sizing: border-box;
	-webkit-tap-highlight-color: transparent;
	-webkit-appearance: none;
	appearance: none;
	line-height: 0;
	text-align: center;
	vertical-align: middle;
}

.mhrs-btn { background: var(--mhrs-bg, #4a6cf7); color: #fff; }
.mhrs-toggle { background: var(--mhrs-main); color: #fff; }

/* افکت هاور فقط روی دستگاه‌هایی که واقعاً ماوس دارند
   (در موبایل، hover بعد از لمس می‌چسبد و آیکون از جای خود بیرون می‌زد) */
@media (hover: hover) and (pointer: fine) {
	.mhrs-btn:hover,
	.mhrs-toggle:hover { transform: translateY(-2px) scale(1.05); box-shadow: 0 12px 26px rgba(20, 30, 70, .26); }
}

/* روی لمس، فقط بازخورد کوتاه فشردن */
.mhrs-btn:active { transform: scale(.94); }

/* هنگام بازگشت به سایت، هرگونه حالت گیرکرده پاک می‌شود */
.mhrs-widget.mhrs-reset .mhrs-btn,
.mhrs-widget.mhrs-reset .mhrs-toggle {
	transform: none !important;
	transition: none !important;
}
.mhrs-widget.mhrs-reset.is-open .mhrs-toggle { transform: rotate(90deg) !important; }

.mhrs-btn:focus-visible,
.mhrs-toggle:focus-visible { outline: 3px solid #111; outline-offset: 3px; }

/* آیکون */
.mhrs-icon,
.mhrs-toggle-open,
.mhrs-toggle-close {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48%;
	height: 48%;
	position: static;
	margin: 0 !important;
	padding: 0 !important;
	flex: 0 0 auto;
	line-height: 0;
	transform: none;
	pointer-events: none; /* لمس همیشه روی خودِ دکمه ثبت شود */
}
.mhrs-icon svg,
.mhrs-toggle svg {
	width: 100%;
	height: 100%;
	display: block;
	max-width: 100%;
	max-height: 100%;
	vertical-align: middle;
}
.mhrs-icon img,
.mhrs-toggle img {
	width: 100% !important;
	height: 100% !important;
	max-width: 100% !important;
	object-fit: contain;
	display: block;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0;
	box-shadow: none !important;
	vertical-align: middle;
}

/* آیکون بستن */
.mhrs-toggle-close { display: none; }
.mhrs-widget.is-open .mhrs-toggle { background: #fff; color: #16244d; }
.mhrs-widget.is-open .mhrs-toggle-open { display: none; }
.mhrs-widget.is-open .mhrs-toggle-close { display: flex; }
.mhrs-widget.is-open .mhrs-toggle { transform: rotate(90deg); }
.mhrs-widget.is-open .mhrs-toggle:hover { transform: rotate(90deg) scale(1.05); }

/* حباب عنوان */
.mhrs-tip {
	position: absolute;
	top: 50%;
	background: #fff;
	color: #16244d;
	font-size: 15px;
	font-weight: 700;
	white-space: nowrap;
	padding: 10px 16px;
	border-radius: 10px;
	box-shadow: 0 6px 18px rgba(20, 30, 70, .16);
	opacity: 0;
	pointer-events: none;
	transition: opacity .18s ease, transform .18s ease;
	direction: rtl;      /* عنوان فارسی درست نمایش داده شود */
	text-align: right;
	unicode-bidi: plaintext; /* اگر عنوان انگلیسی بود، خودش چپ‌چین می‌شود */
	line-height: 1.4;
}
.mhrs-tip::after {
	content: "";
	position: absolute;
	top: 50%;
	width: 0;
	height: 0;
	border: 7px solid transparent;
}

/* دکمه سمت چپ صفحه → حباب سمت راستِ دکمه */
.mhrs-pos-left .mhrs-tip {
	left: calc(100% + 14px);
	transform: translateY(-50%) translateX(-8px);
}
.mhrs-pos-left .mhrs-btn:hover .mhrs-tip,
.mhrs-pos-left .mhrs-btn:focus-visible .mhrs-tip {
	opacity: 1;
	transform: translateY(-50%) translateX(0);
}
.mhrs-pos-left .mhrs-tip::after {
	right: 100%;
	transform: translateY(-50%);
	border-right-color: #fff;
}

/* دکمه سمت راست صفحه → حباب سمت چپِ دکمه */
.mhrs-pos-right .mhrs-tip {
	right: calc(100% + 14px);
	transform: translateY(-50%) translateX(8px);
}
.mhrs-pos-right .mhrs-btn:hover .mhrs-tip,
.mhrs-pos-right .mhrs-btn:focus-visible .mhrs-tip {
	opacity: 1;
	transform: translateY(-50%) translateX(0);
}
.mhrs-pos-right .mhrs-tip::after {
	left: 100%;
	transform: translateY(-50%);
	border-left-color: #fff;
}

/* در حالت باز، روی دسکتاپ عنوان‌ها همیشه دیده شوند */
@media (hover: hover) and (min-width: 782px) {
	.mhrs-widget.is-open .mhrs-tip { opacity: 1; }
	.mhrs-pos-left.is-open .mhrs-tip  { transform: translateY(-50%) translateX(0); }
	.mhrs-pos-right.is-open .mhrs-tip { transform: translateY(-50%) translateX(0); }
}

.mhrs-no-labels .mhrs-tip { display: none !important; }

/* موبایل */
@media (max-width: 782px) {
	.mhrs-widget {
		--mhrs-gap: 12px;
		bottom: var(--mhrs-bottom-m, 16px);
	}
	.mhrs-widget.mhrs-pos-left  { left: var(--mhrs-side-m, 16px); }
	.mhrs-widget.mhrs-pos-right { right: var(--mhrs-side-m, 16px); }

	/* اندازه مخصوص موبایل */
	.mhrs-widget .mhrs-btn,
	.mhrs-widget .mhrs-toggle {
		width: var(--mhrs-size-m, 52px);
		height: var(--mhrs-size-m, 52px);
	}

	/* روی موبایل عنوان‌ها فقط وقتی باز است نمایش داده می‌شوند */
	.mhrs-widget.is-open .mhrs-tip { opacity: 1; font-size: 14px; padding: 8px 13px; }
	.mhrs-pos-left.is-open .mhrs-tip  { transform: translateY(-50%) translateX(0); }
	.mhrs-pos-right.is-open .mhrs-tip { transform: translateY(-50%) translateX(0); }
}

.mhrs-hide-mobile { display: none; }
@media (min-width: 783px) {
	.mhrs-hide-mobile { display: flex; }
}

/* احترام به تنظیم کاهش انیمیشن */
@media (prefers-reduced-motion: reduce) {
	.mhrs-item,
	.mhrs-btn,
	.mhrs-toggle,
	.mhrs-tip { transition: none !important; }
	.mhrs-widget.is-open .mhrs-item { transition-delay: 0s !important; }
}
