/**
 * Плавающая колонка: звонок + мессенджеры (левый нижний угол).
 */

.social-fab {
	position: fixed;
	z-index: 9990;
	left: max(1rem, env(safe-area-inset-left));
	bottom: max(1rem, env(safe-area-inset-bottom));
	font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--fab-teal: #007979;
	--fab-teal-dark: #006060;
	--fab-call-green-light: #6be985;
	--fab-call-green: #34d058;
	--fab-call-green-deep: #18a845;
	--fab-red: #ff4b4b;
	--fab-main-size: 56px;
	--fab-sheet-ico: 46px;
}

.social-fab__column {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.65rem;
}

/* Круглые кнопки: только иконки */
.social-fab__btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--fab-main-size);
	height: var(--fab-main-size);
	padding: 0;
	border-radius: 50%;
	text-decoration: none;
	border: none;
	cursor: pointer;
	box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
	transition:
		transform 0.25s cubic-bezier(0.34, 1.56, 0.64, 1),
		box-shadow 0.25s ease;
	flex-shrink: 0;
}

.social-fab__btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 14px 34px rgba(0, 0, 0, 0.22);
}

.social-fab__btn:active {
	transform: translateY(0);
}

.social-fab__btn:focus-visible {
	outline: 2px solid rgba(255, 255, 255, 0.95);
	outline-offset: 3px;
}

.social-fab__btn--call:focus-visible {
	outline-color: rgba(242, 208, 107, 0.95);
}

.social-fab__link:focus-visible {
	outline: 2px solid var(--fab-teal);
	outline-offset: 2px;
}

.social-fab__btn--call {
	background: linear-gradient(
		165deg,
		var(--fab-call-green-light) 0%,
		var(--fab-call-green) 42%,
		var(--fab-call-green-deep) 100%
	);
	color: #fff;
	box-shadow: 0 10px 28px rgba(34, 197, 94, 0.42);
}

.social-fab__btn--call:hover {
	box-shadow: 0 14px 36px rgba(34, 197, 94, 0.52);
}

.social-fab__btn--call i {
	font-size: 1.28rem;
	opacity: 0.98;
}

.social-fab__btn--messengers {
	background: linear-gradient(145deg, #5b7cfa 0%, #7c5cf0 40%, #9d4edd 100%);
	color: #fff;
}

.social-fab__btn--messengers i {
	font-size: 1.35rem;
}

.social-fab__pulse {
	position: absolute;
	inset: -5px;
	border-radius: 50%;
	background: rgba(157, 78, 221, 0.35);
	animation: social-fab-pulse 2.4s ease-out infinite;
	pointer-events: none;
}

@keyframes social-fab-pulse {
	0% {
		transform: scale(1);
		opacity: 0.55;
	}
	70% {
		transform: scale(1.18);
		opacity: 0;
	}
	100% {
		opacity: 0;
	}
}

/* Выпадающий блок мессенджеров */
.social-fab__sheet {
	overflow: visible;
	transition:
		opacity 0.35s cubic-bezier(0.33, 1, 0.68, 1),
		transform 0.4s cubic-bezier(0.33, 1, 0.68, 1),
		visibility 0.4s;
	transform-origin: bottom left;
	transform: translateY(12px) scale(0.92);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.social-fab__sheet:not([hidden]) {
	transform: translateY(0) scale(1);
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.social-fab--open .social-fab__sheet:not([hidden]) .social-fab__item {
	animation: social-fab-item-in 0.45s cubic-bezier(0.34, 1.56, 0.64, 1) backwards;
	animation-delay: var(--social-fab-delay, 0ms);
}

@keyframes social-fab-item-in {
	from {
		opacity: 0;
		transform: translateY(14px) scale(0.85);
	}
	to {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

.social-fab__list {
	list-style: none;
	margin: 0;
	padding: 0.4rem;
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	align-items: center;
	background: rgba(255, 255, 255, 0.96);
	border-radius: 999px;
	box-shadow:
		0 4px 16px rgba(0, 121, 121, 0.12),
		0 18px 44px rgba(0, 0, 0, 0.14),
		0 0 0 1px rgba(0, 121, 121, 0.1);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
}

.social-fab__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: var(--fab-sheet-ico);
	height: var(--fab-sheet-ico);
	padding: 0;
	border-radius: 50%;
	text-decoration: none;
	color: #fff;
	transition:
		transform 0.2s ease,
		box-shadow 0.2s ease;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.12);
}

.social-fab__link:hover {
	transform: scale(1.08);
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.18);
}

.social-fab__link i {
	font-size: 1.35rem;
	line-height: 1;
}

.social-fab__link--telegram {
	background: linear-gradient(145deg, #33bdef 0%, #229ed9 100%);
}

.social-fab__link--telegram i {
	color: #fff;
}

.social-fab__link--viber {
	background: linear-gradient(145deg, #8b7cf8 0%, #7360f2 100%);
}

.social-fab__link--viber i {
	color: #fff;
}

.social-fab__link--whatsapp {
	background: linear-gradient(145deg, #34e090 0%, #25d366 100%);
}

.social-fab__link--whatsapp i {
	color: #fff;
}

.social-fab__link--instagram {
	background: linear-gradient(145deg, #f58529 0%, #dd2a7b 45%, #8134af 100%);
}

.social-fab__link--instagram i {
	color: #fff;
}

.social-fab__link--max {
	background: linear-gradient(145deg, #4d7cff 0%, #5533ff 100%);
}

.social-fab__ico--max {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.35rem;
	height: 1.35rem;
	border-radius: 6px;
	background: rgba(255, 255, 255, 0.25);
	color: #fff;
	font-size: 0.78rem;
	font-weight: 900;
	letter-spacing: -0.05em;
	font-family: system-ui, sans-serif;
}

.social-fab__btn--messengers[aria-expanded="true"] {
	background: linear-gradient(145deg, var(--fab-teal) 0%, var(--fab-teal-dark) 100%);
	box-shadow: 0 12px 32px rgba(0, 121, 121, 0.35);
}

.social-fab__btn--messengers[aria-expanded="true"] .social-fab__pulse {
	display: none;
}

@media (max-width: 480px) {
	.social-fab {
		--fab-main-size: 52px;
		--fab-sheet-ico: 44px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.social-fab__pulse {
		animation: none;
		opacity: 0;
	}

	.social-fab__sheet {
		transition: opacity 0.2s ease;
	}

	.social-fab--open .social-fab__sheet:not([hidden]) .social-fab__item {
		animation: none;
		opacity: 1;
		transform: none;
	}
}