/*
 * دکمهٔ شناورِ تماس — شیوه‌نامه
 *
 * پیش‌تر این قواعد درون <style> در wp_head هر صفحه چاپ می‌شد:
 * ۲٫۵ کیلوبایت که مرورگر نمی‌توانست کش کند و لایت‌اسپید هم
 * نمی‌توانست با بقیهٔ CSS ترکیب و فشرده کند. حالا فایلِ واقعی
 * است، پس یک‌بار دانلود و برای همیشه کش می‌شود.
 *
 * قواعدِ «پیامِ خوش‌آمد» (۷۰۰ بایت) حذف شد: مارک‌آپش هرگز چاپ
 * نمی‌شد و فقط وزن اضافه می‌کرد.
 */

.fcc-wrap {
	position: fixed;
	inset-block-end: 1rem;
	inset-inline-end: 1rem;
	z-index: 99999;
	font-family: inherit;
}

@media (min-width: 640px) { .fcc-wrap { inset-block-end: 1.5rem; inset-inline-end: 1.5rem; } }
@media (min-width: 1024px) { .fcc-wrap { inset-block-end: 2rem; inset-inline-end: 2rem; } }

.fcc-buttons {
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
	gap: .5rem;
}

@media (min-width: 640px) { .fcc-buttons { gap: .75rem; } }

.fcc-main {
	position: relative;
	width: 3rem;
	height: 3rem;
	border: 0;
	border-radius: 50%;
	background: linear-gradient(135deg, #d4af37, #b8962e);
	box-shadow: 0 4px 20px rgba(212, 175, 55, .4);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: transform .3s ease;
}

@media (min-width: 640px) { .fcc-main { width: 3.5rem; height: 3.5rem; } }
@media (min-width: 1024px) { .fcc-main { width: 4rem; height: 4rem; } }

.fcc-main:hover { transform: scale(1.1); }
.fcc-main:focus-visible { outline: 3px solid #0a0830; outline-offset: 3px; }

.fcc-main::before {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: rgba(212, 175, 55, .3);
	animation: fcc-ping 2s infinite;
}

.fcc-main svg {
	width: 1.25rem;
	height: 1.25rem;
	fill: #fff;
	transition: opacity .3s ease, transform .3s ease;
}

@media (min-width: 640px) { .fcc-main svg { width: 1.5rem; height: 1.5rem; } }
@media (min-width: 1024px) { .fcc-main svg { width: 1.75rem; height: 1.75rem; } }

.fcc-main svg.fcc-close { position: absolute; opacity: 0; transform: scale(0); }
.fcc-main.is-open svg.fcc-chat { opacity: 0; transform: scale(0); }
.fcc-main.is-open svg.fcc-close { opacity: 1; transform: scale(1); }

.fcc-btn {
	width: 2.5rem;
	height: 2.5rem;
	border: 0;
	border-radius: 50%;
	box-shadow: 0 4px 15px rgba(0, 0, 0, .2);
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	transform: translateY(1rem);
	pointer-events: none;
	transition: opacity .3s ease, transform .3s ease;
}

@media (min-width: 640px) { .fcc-btn { width: 2.75rem; height: 2.75rem; } }
@media (min-width: 1024px) { .fcc-btn { width: 3rem; height: 3rem; } }

.fcc-btn.is-shown { opacity: 1; transform: translateY(0); pointer-events: auto; }
.fcc-btn:hover { transform: scale(1.1); }
.fcc-btn:focus-visible { outline: 3px solid #0a0830; outline-offset: 3px; }
.fcc-btn svg { width: 1rem; height: 1rem; fill: #fff; }

@media (min-width: 640px) { .fcc-btn svg { width: 1.25rem; height: 1.25rem; } }

.fcc-phone { background: #4caf50; transition-delay: .1s; }
.fcc-whatsapp { background: #25d366; transition-delay: .15s; }
.fcc-telegram { background: #0088cc; transition-delay: .2s; }

@keyframes fcc-ping {
	0%   { transform: scale(1);   opacity: .7; }
	100% { transform: scale(1.5); opacity: 0; }
}

/* کاربری که جنبش را کم کرده، نبضِ دائمی نبیند */
@media (prefers-reduced-motion: reduce) {
	.fcc-main::before { animation: none; }
	.fcc-main, .fcc-btn, .fcc-main svg { transition: none; }
	.fcc-main:hover, .fcc-btn:hover { transform: none; }
}