/**
 * Live Social Proof — blinking indicator.
 *
 * Pure CSS. No SVG, no GIF, no image, no JavaScript animation.
 */

.lsp-dot {
	position: relative;
	display: inline-block;
	flex: 0 0 auto;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background-color: #ff2d2d;
	animation: lsp-pulse 1.2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

.lsp-dot::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 10px;
	height: 10px;
	margin: -5px 0 0 -5px;
	border-radius: 50%;
	background-color: #ff2d2d;
	opacity: 0.65;
	animation: lsp-ring 1.2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
	pointer-events: none;
}

@keyframes lsp-pulse {
	0%,
	100% {
		opacity: 1;
		transform: scale(1);
	}

	50% {
		opacity: 0.55;
		transform: scale(0.86);
	}
}

@keyframes lsp-ring {
	0% {
		opacity: 0.6;
		transform: scale(1);
	}

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

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

/* Respect reduced-motion preferences: keep the dot, drop the movement. */
@media (prefers-reduced-motion: reduce) {

	.lsp-dot,
	.lsp-dot::after {
		animation: none;
	}

	.lsp-dot::after {
		opacity: 0;
	}
}
