/**
 * Cross-site transition — Quitox #preloader visual (namespaced).
 *
 * Source: quitox/assets/scss/components/_preloader.scss
 * Markup mirrors quitox/header.php (#preloader > .preloader > span×2).
 */

.paramour-cross-site-transition {
	position: fixed;
	inset: 0;
	background-color: #f7f7f7;
	z-index: 999999;
	opacity: 1;
	pointer-events: auto;
	transition: opacity 0.6s ease;
}

.paramour-cross-site-transition.is-leaving {
	opacity: 0;
	pointer-events: none;
}

.paramour-cross-site-transition.is-leaving .paramour-cross-site-transition__spinner,
.paramour-cross-site-transition.is-leaving .paramour-cross-site-transition__spinner span {
	animation: none;
}

.paramour-cross-site-transition__spinner {
	width: 50px;
	height: 50px;
	display: inline-block;
	padding: 0;
	text-align: left;
	box-sizing: border-box;
	position: absolute;
	top: 50%;
	left: 50%;
	margin-left: -25px;
	margin-top: -25px;
}

.paramour-cross-site-transition__spinner span {
	position: absolute;
	display: inline-block;
	width: 50px;
	height: 50px;
	border-radius: 100%;
	background: var(--paramour-cross-site-transition-accent, #141774);
	-webkit-animation: paramour-cross-site-transition-spin 1.3s linear infinite;
	animation: paramour-cross-site-transition-spin 1.3s linear infinite;
}

.paramour-cross-site-transition__spinner span:last-child {
	animation-delay: -0.9s;
	-webkit-animation-delay: -0.9s;
}

@keyframes paramour-cross-site-transition-spin {
	0% {
		transform: scale(0, 0);
		opacity: 0.5;
	}

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

@-webkit-keyframes paramour-cross-site-transition-spin {
	0% {
		-webkit-transform: scale(0, 0);
		opacity: 0.5;
	}

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

html.paramour-cross-site-transition-lock body {
	overflow: hidden;
}

/* JS owns enter fade on gateway (script always enqueued). No CSS auto-fade here —
   it raced JS handoff and caused a second spinner when opacity snapped back to 1. */

@media (prefers-reduced-motion: reduce) {
	.paramour-cross-site-transition {
		display: none !important;
		transition: none !important;
		animation: none !important;
	}

	.paramour-cross-site-transition__spinner span {
		animation: none !important;
	}

	html.paramour-cross-site-transition-lock body {
		overflow: visible;
	}
}