:root {
	--bnre-wa-green: #22c55e;
	--bnre-wa-green-deep: #149647;
	--bnre-wa-green-hover: #34d56d;
	--bnre-wa-ring: rgba(34, 197, 94, 0.34);
	--bnre-wa-ring-soft: rgba(34, 197, 94, 0.18);
	--bnre-wa-focus: rgba(34, 197, 94, 0.28);
	--bnre-wa-shadow: 0 18px 42px rgba(8, 15, 26, 0.28);
	--bnre-wa-shadow-hover: 0 26px 56px rgba(8, 15, 26, 0.36);
	--bnre-wa-z: 99990;
}

.bnre-wa-wrap {
	position: fixed;
	right: max(24px, env(safe-area-inset-right));
	bottom: calc(24px + env(safe-area-inset-bottom));
	z-index: var(--bnre-wa-z);
	opacity: 0;
	transform: translate3d(0, 24px, 0) scale(0.92);
}

.bnre-wa-wrap.is-ready {
	opacity: 1;
	transform: translate3d(0, 0, 0) scale(1);
	animation: bnreWaEntrance 0.8s cubic-bezier(0.22, 1, 0.36, 1) both;
}

body.admin-bar .bnre-wa-wrap {
	bottom: calc(24px + env(safe-area-inset-bottom));
}

.bnre-wa-button {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	border-radius: 50%;
	text-decoration: none;
	-webkit-tap-highlight-color: transparent;
	transform-origin: center;
	transition:
		transform 0.24s ease,
		filter 0.24s ease;
}

.bnre-wa-button::before,
.bnre-wa-button::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	pointer-events: none;
}

.bnre-wa-button::before {
	background:
		linear-gradient(145deg, rgba(255, 255, 255, 0.28) 0%, rgba(255, 255, 255, 0) 34%),
		radial-gradient(circle at 30% 30%, rgba(255, 255, 255, 0.18), transparent 48%);
	mix-blend-mode: screen;
	opacity: 0.95;
	animation: bnreWaSheen 2.8s linear infinite;
}

.bnre-wa-button::after {
	border: 2px solid var(--bnre-wa-ring);
	opacity: 0;
	transform: scale(1);
}

.bnre-wa-wrap.is-ready .bnre-wa-button {
	animation: bnreWaFloat 2.5s ease-in-out infinite;
}

.bnre-wa-wrap.is-ready .bnre-wa-button::after {
	animation: bnreWaRipple 2.2s ease-out infinite;
}

.bnre-wa-button:hover {
	transform: translateY(-5px) scale(1.08);
	filter: drop-shadow(var(--bnre-wa-shadow-hover));
}

.bnre-wa-button:focus-visible {
	outline: 0;
	box-shadow: 0 0 0 6px var(--bnre-wa-focus);
}

.bnre-wa-icon {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 60px;
	height: 60px;
	flex: 0 0 60px;
	border-radius: 50%;
	background:
		radial-gradient(circle at 28% 28%, #4cef84 0%, rgba(76, 239, 132, 0.88) 14%, transparent 42%),
		linear-gradient(180deg, var(--bnre-wa-green-hover) 0%, var(--bnre-wa-green) 56%, var(--bnre-wa-green-deep) 100%);
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.28),
		0 18px 42px rgba(8, 15, 26, 0.3),
		0 0 0 10px var(--bnre-wa-ring-soft);
	color: #ffffff;
	transition:
		transform 0.24s ease,
		box-shadow 0.24s ease,
		background 0.24s ease;
}

.bnre-wa-icon::before,
.bnre-wa-icon::after {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	pointer-events: none;
}

.bnre-wa-icon::before {
	inset: 6px;
	border: 1px solid rgba(255, 255, 255, 0.2);
	opacity: 0.8;
}

.bnre-wa-icon::after {
	background: radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.1), transparent 62%);
	opacity: 0.95;
}

.bnre-wa-wrap.is-ready .bnre-wa-icon {
	animation: bnreWaPulse 1.7s ease-in-out infinite;
}

.bnre-wa-button:hover .bnre-wa-icon,
.bnre-wa-button:focus-visible .bnre-wa-icon {
	transform: scale(1.06) rotate(-6deg);
	box-shadow:
		inset 0 1px 0 rgba(255, 255, 255, 0.3),
		0 26px 56px rgba(8, 15, 26, 0.38),
		0 0 0 14px rgba(34, 197, 94, 0.2);
	background:
		radial-gradient(circle at 28% 28%, #68f69a 0%, rgba(104, 246, 154, 0.92) 16%, transparent 42%),
		linear-gradient(180deg, #4ae77f 0%, var(--bnre-wa-green-hover) 55%, var(--bnre-wa-green-deep) 100%);
}

.bnre-wa-icon svg {
	position: relative;
	z-index: 2;
	display: block;
	width: 32px;
	height: 32px;
	filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.12));
}

@keyframes bnreWaEntrance {
	0% {
		opacity: 0;
		transform: translate3d(0, 28px, 0) scale(0.82);
	}

	65% {
		opacity: 1;
		transform: translate3d(0, -4px, 0) scale(1.04);
	}

	100% {
		opacity: 1;
		transform: translate3d(0, 0, 0) scale(1);
	}
}

@keyframes bnreWaFloat {
	0%,
	100% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(-8px);
	}
}

@keyframes bnreWaPulse {
	0%,
	100% {
		transform: scale(1);
	}

	35% {
		transform: scale(1.05);
	}

	70% {
		transform: scale(0.97);
	}
}

@keyframes bnreWaRipple {
	0% {
		opacity: 0.75;
		transform: scale(1);
	}

	70% {
		opacity: 0.12;
	}

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

@keyframes bnreWaSheen {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

@media (max-width: 782px) {
	.bnre-wa-wrap {
		right: max(16px, env(safe-area-inset-right));
		bottom: calc(16px + env(safe-area-inset-bottom));
	}

	.bnre-wa-button,
	.bnre-wa-icon {
		width: 64px;
		height: 64px;
		flex-basis: 64px;
	}

	.bnre-wa-icon {
		box-shadow:
			inset 0 1px 0 rgba(255, 255, 255, 0.28),
			0 14px 32px rgba(8, 15, 26, 0.26),
			0 0 0 8px var(--bnre-wa-ring-soft);
	}

	.bnre-wa-icon svg {
		width: 34px;
		height: 34px;
	}

	.bnre-wa-wrap.is-ready .bnre-wa-button {
		animation-duration: 2.9s;
	}

	.bnre-wa-wrap.is-ready .bnre-wa-icon {
		animation-duration: 2s;
	}
}

@media (prefers-reduced-motion: reduce) {
	.bnre-wa-wrap,
	.bnre-wa-wrap.is-ready,
	.bnre-wa-button,
	.bnre-wa-button::before,
	.bnre-wa-button::after,
	.bnre-wa-icon {
		animation: none !important;
		transition-duration: 0.01ms !important;
		transition-delay: 0ms !important;
	}

	.bnre-wa-button:hover,
	.bnre-wa-button:hover .bnre-wa-icon {
		transform: none;
	}
}