/**
 * Noya Floating Contact — استایل سمت کاربر
 */

@font-face {
	font-family: 'Vazirmatn';
	src: url('../../assets/fonts/Vazirmatn-Regular.woff2') format('woff2');
	font-weight: 400;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Vazirmatn';
	src: url('../../assets/fonts/Vazirmatn-Medium.woff2') format('woff2');
	font-weight: 500;
	font-style: normal;
	font-display: swap;
}
@font-face {
	font-family: 'Vazirmatn';
	src: url('../../assets/fonts/Vazirmatn-Bold.woff2') format('woff2');
	font-weight: 700;
	font-style: normal;
	font-display: swap;
}

/* ---------- کانتینر اصلی ---------- */
#nfc-widget {
	position: fixed;
	bottom: var(--nfc-offset-y, 24px);
	z-index: var(--nfc-z, 99990);
	font-family: 'Vazirmatn', Tahoma, 'Segoe UI', sans-serif;
	line-height: 1.5;
	--nfc-item-size: calc(var(--nfc-size, 60px) * 0.82);
	direction: rtl;
	box-sizing: border-box;
}
#nfc-widget *,
#nfc-widget *::before,
#nfc-widget *::after { box-sizing: border-box; }

#nfc-widget.nfc-nofont { font-family: Tahoma, 'IRANSans', Arial, sans-serif; }
#nfc-widget.nfc-pos-bottom_right { right: var(--nfc-offset-x, 24px); --nfc-dir: -1; }
#nfc-widget.nfc-pos-bottom_left  { left: var(--nfc-offset-x, 24px);  --nfc-dir: 1; }

/* ---------- دکمه اصلی (FAB) ---------- */
.nfc-toggle {
	position: relative;
	width: var(--nfc-size, 60px);
	height: var(--nfc-size, 60px);
	padding: 0;
	border: none;
	cursor: pointer;
	color: var(--nfc-icon, #fff);
	background: linear-gradient(135deg, var(--nfc-main-1, #4F46E5), var(--nfc-main-2, #7C3AED));
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 12px 26px -6px rgba(17, 12, 46, 0.45), 0 5px 12px -6px rgba(0, 0, 0, 0.35);
	transition: transform 0.25s ease, box-shadow 0.25s ease;
	z-index: 2;
	overflow: visible;
	-webkit-tap-highlight-color: transparent;
}
.nfc-shape-circle  .nfc-toggle { border-radius: 50%; }
.nfc-shape-rounded .nfc-toggle { border-radius: 20px; }
.nfc-toggle:hover  { transform: scale(1.06); box-shadow: 0 16px 32px -6px rgba(17, 12, 46, 0.55); }
.nfc-toggle:active { transform: scale(0.95); }
.nfc-toggle:focus-visible { outline: 3px solid rgba(255, 255, 255, 0.7); outline-offset: 3px; }

.nfc-toggle-icon {
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform 0.35s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.25s ease;
	z-index: 2;
}
.nfc-icon-close { opacity: 0; transform: rotate(-120deg) scale(0.3); }
#nfc-widget.is-open .nfc-icon-open  { opacity: 0; transform: rotate(120deg) scale(0.3); }
#nfc-widget.is-open .nfc-icon-close { opacity: 1; transform: rotate(0) scale(1); }

/* حلقه ضربان */
.nfc-toggle-ring {
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: var(--nfc-main-1, #4F46E5);
	z-index: -1;
	display: none;
}
.nfc-anim-pulse .nfc-toggle-ring { display: block; }
.nfc-anim-pulse:not(.is-open) .nfc-toggle-ring { animation: nfc-pulse 2.1s ease-out infinite; }
@keyframes nfc-pulse {
	0%   { transform: scale(1);   opacity: 0.55; }
	70%  { transform: scale(1.7); opacity: 0; }
	100% { transform: scale(1.7); opacity: 0; }
}

/* پرش و تادا */
.nfc-anim-bounce:not(.is-open):not(:hover) .nfc-toggle { animation: nfc-bounce 2.6s infinite; }
@keyframes nfc-bounce {
	0%, 20%, 50%, 80%, 100% { transform: translateY(0); }
	40% { transform: translateY(-11px); }
	60% { transform: translateY(-5px); }
}
.nfc-anim-tada:not(.is-open):not(:hover) .nfc-toggle { animation: nfc-tada 2.8s infinite; }
@keyframes nfc-tada {
	0%   { transform: scale(1) rotate(0); }
	10%, 20% { transform: scale(0.9) rotate(-3deg); }
	30%, 50%, 70%, 90% { transform: scale(1.1) rotate(3deg); }
	40%, 60%, 80% { transform: scale(1.1) rotate(-3deg); }
	100% { transform: scale(1) rotate(0); }
}

/* نقطه وضعیت آنلاین */
.nfc-online-dot {
	position: absolute;
	top: 4px;
	inset-inline-end: 4px;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	border: 2px solid #fff;
	z-index: 3;
}
.nfc-online-dot.is-online  { background: #22c55e; }
.nfc-online-dot.is-offline { background: #ef4444; }

/* ---------- کانتینر کانال‌ها (پایه) ---------- */
.nfc-channels {
	position: absolute;
	bottom: calc(var(--nfc-size, 60px) + 16px);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	z-index: 1;
	pointer-events: none;
}
.nfc-pos-bottom_right .nfc-channels { inset-inline-end: calc((var(--nfc-size, 60px) - var(--nfc-item-size)) / 2); }
.nfc-pos-bottom_left  .nfc-channels { inset-inline-start: calc((var(--nfc-size, 60px) - var(--nfc-item-size)) / 2); }
#nfc-widget.is-open .nfc-channels { pointer-events: auto; }

/* ---------- آیتم کانال ---------- */
.nfc-item {
	position: relative;
	width: var(--nfc-item-size);
	height: var(--nfc-item-size);
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--nfc-icon, #fff);
	text-decoration: none;
	box-shadow: 0 7px 18px -5px rgba(0, 0, 0, 0.4);
	opacity: 0;
	transform: scale(0) translateY(12px);
	transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1), opacity 0.2s ease, box-shadow 0.2s ease;
	transition-delay: 0ms;
}
.nfc-shape-circle  .nfc-item { border-radius: 50%; }
.nfc-shape-rounded .nfc-item { border-radius: 16px; }
.nfc-brand-colors   .nfc-item { background: var(--nfc-brand, #4F46E5); }
.nfc-uniform-colors .nfc-item { background: var(--nfc-uniform, #4F46E5); }
.nfc-item:hover { transform: scale(1.12) translateY(0); box-shadow: 0 10px 22px -5px rgba(0, 0, 0, 0.5); }
.nfc-item:focus-visible { outline: 3px solid rgba(0, 0, 0, 0.25); outline-offset: 2px; }
.nfc-item-icon { display: flex; align-items: center; justify-content: center; }
.nfc-item svg { display: block; }
.nfc-item-img {
	display: block;
	width: calc(var(--nfc-item-size) * 0.56);
	height: calc(var(--nfc-item-size) * 0.56);
	object-fit: contain;
	border-radius: 6px;
	pointer-events: none;
}

/* برچسب کنار آیتم */
.nfc-item-label {
	position: absolute;
	inset-inline-end: calc(var(--nfc-item-size) + 12px);
	white-space: nowrap;
	background: rgba(23, 25, 35, 0.92);
	color: #fff;
	font-size: 13px;
	font-weight: 500;
	padding: 6px 12px;
	border-radius: 9px;
	opacity: 0;
	transform: translateX(10px);
	transition: opacity 0.2s ease, transform 0.2s ease;
	pointer-events: none;
	box-shadow: 0 5px 14px -4px rgba(0, 0, 0, 0.4);
}
.nfc-pos-bottom_left .nfc-item-label { inset-inline-end: auto; inset-inline-start: calc(var(--nfc-item-size) + 12px); transform: translateX(-10px); }
.nfc-item:hover .nfc-item-label { opacity: 1; transform: translateX(0); }

/* ---------- باز شدن: استایل ستونی و اسپید ---------- */
#nfc-widget.is-open .nfc-item {
	opacity: 1;
	transform: scale(1) translateY(0);
	transition-delay: calc((var(--nfc-i, 1) - 1) * 45ms);
}
#nfc-widget.nfc-has-labels.nfc-style-vertical.is-open .nfc-item-label,
#nfc-widget.nfc-style-speed.is-open .nfc-item-label {
	opacity: 1;
	transform: translateX(0);
	transition-delay: calc((var(--nfc-i, 1) - 1) * 45ms + 60ms);
}
.nfc-style-speed .nfc-item-label {
	background: #fff;
	color: #2b2f3a;
	box-shadow: 0 4px 12px -2px rgba(0, 0, 0, 0.22);
}

/* ---------- استایل بادبزنی (Radial) ---------- */
/* پیش‌فرض مانند ستونی است؛ در مرورگرهای مدرن به کمان تبدیل می‌شود. */
@supports (transform: translate(calc(sin(1deg) * 1px), 0)) {
	.nfc-style-radial .nfc-channels {
		flex-direction: row;
		gap: 0;
		bottom: calc(var(--nfc-size, 60px) + 8px);
	}
	.nfc-style-radial .nfc-item {
		position: absolute;
		bottom: 0;
		--nfc-angle: calc((var(--nfc-i, 1) - 1) * 36deg + 6deg);
		--nfc-radius: calc(var(--nfc-size, 60px) + 46px);
	}
	.nfc-pos-bottom_right.nfc-style-radial .nfc-item { inset-inline-end: 0; }
	.nfc-pos-bottom_left.nfc-style-radial  .nfc-item { inset-inline-start: 0; }
	#nfc-widget.nfc-style-radial.is-open .nfc-item {
		transform: translate(
			calc(var(--nfc-dir, -1) * sin(var(--nfc-angle)) * var(--nfc-radius)),
			calc(-1 * cos(var(--nfc-angle)) * var(--nfc-radius))
		) scale(1);
	}
}

/* ---------- استایل کارتی (Card) ---------- */
.nfc-style-card .nfc-channels {
	flex-direction: column;
	align-items: stretch;
	gap: 2px;
	width: 258px;
	max-width: calc(100vw - 40px);
	padding: 10px;
	background: #ffffff;
	border-radius: 20px;
	box-shadow: 0 22px 55px -14px rgba(17, 12, 46, 0.4), 0 8px 20px -10px rgba(0, 0, 0, 0.25);
	opacity: 0;
	transform: scale(0.5);
	transition: opacity 0.25s ease, transform 0.28s cubic-bezier(0.34, 1.56, 0.64, 1);
}
.nfc-pos-bottom_right.nfc-style-card .nfc-channels { transform-origin: bottom right; }
.nfc-pos-bottom_left.nfc-style-card  .nfc-channels { transform-origin: bottom left; }
#nfc-widget.nfc-style-card.is-open .nfc-channels { opacity: 1; transform: scale(1); }

.nfc-card-head {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	padding: 6px 8px 12px;
	border-bottom: 1px solid #eef0f5;
	margin-bottom: 6px;
}
.nfc-card-texts { flex: 1; }
.nfc-card-title { font-size: 15px; font-weight: 700; color: #1f2430; }
.nfc-card-sub { font-size: 12px; color: #6b7280; margin-top: 3px; display: flex; align-items: center; }
.nfc-status-dot { width: 8px; height: 8px; border-radius: 50%; background: #22c55e; display: inline-block; margin-inline-start: 6px; }
#nfc-widget.nfc-offline .nfc-status-dot { background: #ef4444; }
.nfc-card-close {
	background: none; border: none; cursor: pointer; font-size: 22px; line-height: 1;
	color: #9aa1ad; padding: 0 4px;
}
.nfc-card-close:hover { color: #4b5563; }

.nfc-style-card .nfc-item {
	width: 100%;
	height: auto;
	flex-direction: row;
	justify-content: flex-start;
	gap: 12px;
	padding: 9px 10px;
	border-radius: 12px !important;
	background: transparent !important;
	color: #2b2f3a;
	box-shadow: none;
	opacity: 1;
	transform: none;
	transition: background 0.15s ease;
}
#nfc-widget.nfc-style-card.is-open .nfc-item { transform: none; }
.nfc-style-card .nfc-item:hover { background: #f4f5fa !important; transform: none; box-shadow: none; }
.nfc-style-card .nfc-item-icon {
	width: 42px; height: 42px; border-radius: 50%;
	background: var(--nfc-brand, #4F46E5);
	color: #fff;
	flex: 0 0 auto;
}
.nfc-style-card .nfc-item-img { width: 24px; height: 24px; }
.nfc-style-card .nfc-item-label {
	position: static;
	opacity: 1;
	transform: none;
	background: transparent;
	color: inherit;
	padding: 0;
	font-size: 14px;
	font-weight: 600;
	box-shadow: none;
}

/* ---------- تولتیپ خوش‌آمد ---------- */
.nfc-welcome {
	position: absolute;
	bottom: calc(var(--nfc-size, 60px) + 16px);
	background: #fff;
	color: #232732;
	padding: 11px 14px;
	border-radius: 14px;
	box-shadow: 0 14px 34px -10px rgba(17, 12, 46, 0.35);
	font-size: 13px;
	max-width: 230px;
	line-height: 1.8;
	display: flex;
	align-items: flex-start;
	gap: 8px;
	opacity: 0;
	transform: translateY(12px) scale(0.9);
	transform-origin: bottom center;
	transition: opacity 0.3s ease, transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
	pointer-events: none;
	z-index: 4;
}
.nfc-pos-bottom_right .nfc-welcome { inset-inline-end: 0; transform-origin: bottom right; }
.nfc-pos-bottom_left  .nfc-welcome { inset-inline-start: 0; transform-origin: bottom left; }
.nfc-welcome::after {
	content: '';
	position: absolute;
	bottom: -7px;
	width: 14px; height: 14px;
	background: #fff;
	transform: rotate(45deg);
	box-shadow: 3px 3px 6px -3px rgba(0, 0, 0, 0.2);
}
.nfc-pos-bottom_right .nfc-welcome::after { inset-inline-end: calc(var(--nfc-size, 60px) / 2 - 7px); }
.nfc-pos-bottom_left  .nfc-welcome::after { inset-inline-start: calc(var(--nfc-size, 60px) / 2 - 7px); }
.nfc-welcome.nfc-show { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
#nfc-widget.is-open .nfc-welcome { opacity: 0 !important; pointer-events: none; transform: translateY(12px) scale(0.9) !important; }
.nfc-welcome-text { flex: 1; }
.nfc-welcome-close {
	background: none; border: none; cursor: pointer;
	font-size: 18px; line-height: 1; color: #b3b9c4; padding: 0;
	margin-top: -2px;
}
.nfc-welcome-close:hover { color: #6b7280; }

/* ---------- واکنش‌گرا ---------- */
@media (max-width: 480px) {
	.nfc-style-card .nfc-channels { width: min(258px, calc(100vw - 32px)); }
	.nfc-welcome { max-width: min(230px, calc(100vw - 90px)); }
}

/* ---------- کاهش حرکت ---------- */
@media (prefers-reduced-motion: reduce) {
	#nfc-widget .nfc-toggle,
	#nfc-widget .nfc-item,
	#nfc-widget .nfc-channels,
	#nfc-widget .nfc-welcome,
	#nfc-widget .nfc-toggle-icon,
	#nfc-widget .nfc-toggle-ring {
		transition-duration: 0.001ms !important;
		animation: none !important;
	}
}

/* ---------- مقاوم‌سازی در برابر تداخل قالب‌ها ---------- */
/* تضمین موقعیت ثابت و کلیک‌پذیری دکمه، مستقل از استایل‌های قالب. */
#nfc-widget {
	position: fixed !important;
	box-sizing: border-box;
	max-width: none !important;
	visibility: visible !important;
}
#nfc-widget * { box-sizing: border-box; }
#nfc-widget .nfc-toggle {
	cursor: pointer !important;
	pointer-events: auto !important;
	opacity: 1 !important;
	visibility: visible !important;
	margin: 0 !important;
	float: none !important;
}
/* عناصر داخل دکمه نباید هدف کلیک شوند تا خودِ دکمه کلیک را بگیرد. */
#nfc-widget .nfc-toggle > *,
#nfc-widget .nfc-toggle-icon,
#nfc-widget .nfc-toggle-icon svg,
#nfc-widget .nfc-toggle-ring,
#nfc-widget .nfc-online-dot { pointer-events: none !important; }
#nfc-widget .nfc-item-icon svg,
#nfc-widget .nfc-item-img,
#nfc-widget .nfc-item-label { pointer-events: none !important; }
/* قالب‌ها گاهی به همه‌ی a ها زیرخط/پس‌زمینه می‌دهند؛ خنثی می‌کنیم. */
#nfc-widget a.nfc-item { text-decoration: none !important; box-shadow: 0 7px 18px -5px rgba(0, 0, 0, 0.4); }
#nfc-widget.nfc-style-card a.nfc-item { box-shadow: none; }

/* مهم: جلوگیری از ناپدید یا بدشکل‌شدن آیکون‌ها؛ بسیاری از قالب‌ها
   svg{height:auto;max-width:100%} دارند که باعث جمع‌شدن آیکون به اندازه صفر می‌شود. */
#nfc-widget svg { max-width: none !important; }
#nfc-widget .nfc-toggle-icon svg,
#nfc-widget .nfc-toggle-icon svg path { fill: currentColor !important; }
#nfc-widget .nfc-toggle-icon svg {
	width: 28px !important;
	height: 28px !important;
	min-width: 28px !important;
	min-height: 28px !important;
	display: block !important;
	vertical-align: middle;
}
#nfc-widget .nfc-item-icon svg {
	width: 26px !important;
	height: 26px !important;
	min-width: 26px !important;
	min-height: 26px !important;
	display: block !important;
}
#nfc-widget .nfc-item-img {
	max-width: none !important;
	width: calc(var(--nfc-item-size) * 0.56) !important;
	height: calc(var(--nfc-item-size) * 0.56) !important;
}
#nfc-widget.nfc-style-card .nfc-item-img { width: 24px !important; height: 24px !important; }