/* Star Fitness Preloader
 * Dynamic values (--sfp-bg, --sfp-ring, --sfp-size, --sfp-fade) are injected
 * inline by PHP. Fallbacks below keep it working if that ever fails.
 */

.sfp-preloader {
	position: fixed;
	inset: 0;
	z-index: 999999;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--sfp-bg, #0f0f10);
	opacity: 1;
	transition: opacity var(--sfp-fade, 500ms) ease;
	will-change: opacity;
}

/* Fade-out state toggled by JS. */
.sfp-preloader.sfp-hide {
	opacity: 0;
}

/* Fully removed from interaction after the fade. */
.sfp-preloader.sfp-done {
	visibility: hidden;
	pointer-events: none;
}

.sfp-preloader__stage {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
}

.sfp-preloader__logo {
	width: var(--sfp-size, 140px);
	height: auto;
	max-width: 70vw;
	display: block;
	position: relative;
	z-index: 2;
	filter: drop-shadow(0 6px 18px rgba(0, 0, 0, 0.45));
}

/* Ring sits behind the logo, sized a bit larger. */
.sfp-preloader__ring {
	position: absolute;
	top: 50%;
	left: 50%;
	width: calc(var(--sfp-size, 140px) + 40px);
	height: calc(var(--sfp-size, 140px) + 40px);
	margin-top: calc((var(--sfp-size, 140px) + 40px) / -2);
	margin-left: calc((var(--sfp-size, 140px) + 40px) / -2);
	border: 4px solid rgba(255, 255, 255, 0.12);
	border-top-color: var(--sfp-ring, #c0c0c0);
	border-radius: 50%;
	z-index: 1;
	opacity: 0;
}

/* ---------- Animation variants ---------- */

/* Spinning ring around a steady logo (default). */
.sfp-anim-spin-ring .sfp-preloader__ring {
	opacity: 1;
	animation: sfp-spin 1s linear infinite;
}

/* Pulse: logo scales in and out. */
.sfp-anim-pulse .sfp-preloader__logo {
	animation: sfp-pulse 1.2s ease-in-out infinite;
}

/* Spin: rotate the logo itself. */
.sfp-anim-spin .sfp-preloader__logo {
	animation: sfp-spin 1.4s linear infinite;
}

/* Bounce. */
.sfp-anim-bounce .sfp-preloader__logo {
	animation: sfp-bounce 1s ease-in-out infinite;
}

/* Fade: opacity pulse. */
.sfp-anim-fade .sfp-preloader__logo {
	animation: sfp-fade 1.2s ease-in-out infinite;
}

/* Zoom breathe. */
.sfp-anim-zoom .sfp-preloader__logo {
	animation: sfp-zoom 2s ease-in-out infinite;
}

@keyframes sfp-spin {
	to { transform: rotate(360deg); }
}

@keyframes sfp-pulse {
	0%, 100% { transform: scale(1); }
	50%      { transform: scale(1.12); }
}

@keyframes sfp-bounce {
	0%, 100% { transform: translateY(0); }
	50%      { transform: translateY(-18px); }
}

@keyframes sfp-fade {
	0%, 100% { opacity: 1; }
	50%      { opacity: 0.35; }
}

@keyframes sfp-zoom {
	0%, 100% { transform: scale(0.92); }
	50%      { transform: scale(1.08); }
}

/* Respect reduced-motion: hold still, no looping animation. */
@media (prefers-reduced-motion: reduce) {
	.sfp-preloader__ring,
	.sfp-preloader__logo {
		animation: none !important;
	}
}