.danini-floating-messengers {
	position: fixed;
	left: clamp(18px, 2vw, 28px);
	bottom: clamp(18px, 2.2vw, 30px);
	z-index: 99990;
	display: grid;
	gap: 10px;
	justify-items: start;
	pointer-events: none;
}

.danini-floating-messengers,
.danini-floating-messengers * {
	box-sizing: border-box;
}

.danini-floating-messengers__panel {
	display: grid;
	gap: 8px;
	transform: translateY(10px) scale(0.96);
	transform-origin: left bottom;
	opacity: 0;
	visibility: hidden;
	transition:
		opacity 180ms ease,
		visibility 180ms ease,
		transform 180ms ease;
	pointer-events: none;
}

.danini-floating-messengers.is-open .danini-floating-messengers__panel,
.danini-floating-messengers:hover .danini-floating-messengers__panel,
.danini-floating-messengers:focus-within .danini-floating-messengers__panel {
	transform: translateY(0) scale(1);
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.danini-floating-messengers .danini-floating-messengers__link,
.danini-floating-messengers .danini-floating-messengers__trigger {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 54px;
	border: 1px solid rgba(255, 255, 255, 0.62);
	border-radius: 999px;
	text-decoration: none;
	backdrop-filter: blur(18px) saturate(1.25);
	-webkit-backdrop-filter: blur(18px) saturate(1.25);
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.72),
		0 18px 44px rgba(23, 18, 11, 0.18);
}

.danini-floating-messengers .danini-floating-messengers__link {
	width: max-content;
	padding: 8px 18px 8px 8px;
	background:
		linear-gradient(135deg, rgba(255, 255, 255, 0.82), rgba(247, 240, 229, 0.74));
	color: #2b241b;
	font-size: 0.92rem;
	font-weight: 800;
	letter-spacing: 0.01em;
	transition:
		color 180ms ease,
		background 180ms ease,
		box-shadow 180ms ease,
		transform 180ms ease;
}

.danini-floating-messengers__link:hover,
.danini-floating-messengers__link:focus-visible {
	color: #17120c;
	background:
		linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(238, 225, 203, 0.86));
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.8),
		0 22px 54px rgba(23, 18, 11, 0.22);
	transform: translateX(4px);
}

.danini-floating-messengers__icon {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	color: #fff;
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.35),
		0 12px 22px rgba(23, 18, 11, 0.2);
}

.danini-floating-messengers__icon svg {
	display: block;
	width: 22px;
	height: 22px;
	fill: currentColor;
}

.danini-floating-messengers__link--whatsapp .danini-floating-messengers__icon {
	background:
		radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.35), transparent 34%),
		linear-gradient(135deg, #2bdc75, #159653);
}

.danini-floating-messengers__link--viber .danini-floating-messengers__icon {
	background:
		radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.32), transparent 34%),
		linear-gradient(135deg, #8c71d6, #55469a);
}

.danini-floating-messengers .danini-floating-messengers__trigger {
	position: relative;
	min-width: 176px;
	padding: 9px 20px 9px 10px;
	background:
		radial-gradient(circle at 22% 12%, rgba(255, 255, 255, 0.42), transparent 32%),
		linear-gradient(135deg, rgba(64, 56, 46, 0.94), rgba(36, 31, 25, 0.92));
	color: #fff;
	font-family: inherit;
	font-size: 0.93rem;
	font-weight: 850;
	letter-spacing: 0.02em;
	cursor: pointer;
	pointer-events: auto;
	transition:
		background 180ms ease,
		box-shadow 180ms ease,
		transform 180ms ease;
}

.danini-floating-messengers__trigger:hover,
.danini-floating-messengers__trigger:focus-visible,
.danini-floating-messengers.is-open .danini-floating-messengers__trigger {
	background:
		radial-gradient(circle at 22% 12%, rgba(255, 255, 255, 0.48), transparent 32%),
		linear-gradient(135deg, rgba(91, 76, 52, 0.98), rgba(40, 34, 26, 0.96));
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.7),
		0 24px 58px rgba(23, 18, 11, 0.26);
	transform: translateY(-2px);
}

.danini-floating-messengers__trigger-icon {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background:
		linear-gradient(180deg, rgba(255, 255, 255, 0.94), rgba(231, 220, 202, 0.9));
	color: #3f3427;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9);
}

.danini-floating-messengers__trigger-icon svg {
	width: 22px;
	height: 22px;
}

.danini-floating-messengers__pulse {
	position: absolute;
	inset: 0;
	z-index: -1;
	border-radius: 999px;
	border: 2px solid rgba(218, 174, 101, 0.52);
	background: transparent;
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.16);
	animation: danini-floating-messengers-pulse 2.45s ease-out infinite;
}

.danini-floating-messengers__pulse::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: inherit;
	border: 2px solid rgba(255, 255, 255, 0.38);
	animation: danini-floating-messengers-pulse 2.45s ease-out 0.9s infinite;
}

@keyframes danini-floating-messengers-pulse {
	0% {
		transform: scale(1);
		opacity: 0.88;
	}

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

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

@media (prefers-reduced-motion: reduce) {
	.danini-floating-messengers__pulse {
		animation: none;
	}

	.danini-floating-messengers__panel,
	.danini-floating-messengers__link,
	.danini-floating-messengers__trigger {
		transition: none;
	}
}

@media (max-width: 767px) {
	.danini-floating-messengers {
		left: 14px;
		bottom: 14px;
		gap: 8px;
	}

	.danini-floating-messengers .danini-floating-messengers__trigger {
		min-width: 58px;
		width: 58px;
		height: 58px;
		padding: 9px;
	}

	.danini-floating-messengers__trigger-text {
		position: absolute;
		width: 1px;
		height: 1px;
		overflow: hidden;
		clip: rect(0, 0, 0, 0);
		white-space: nowrap;
	}

	.danini-floating-messengers__trigger-icon {
		width: 40px;
		height: 40px;
	}

	.danini-floating-messengers .danini-floating-messengers__link {
		min-height: 52px;
		padding: 7px 15px 7px 7px;
		font-size: 0.88rem;
	}

	.danini-floating-messengers__icon {
		width: 38px;
		height: 38px;
	}
}