/* WordPress Turbo Runtime - front-end runtime styles. */

/* Top loading bar shown during instant navigation. */
.wptr-progress {
	position: fixed;
	top: 0;
	left: 0;
	width: 0;
	height: 3px;
	z-index: 2147483647;
	background: linear-gradient( 90deg, #2271b1, #72aee6 );
	opacity: 0;
	pointer-events: none;
	transition: width 0.2s ease, opacity 0.3s ease;
}

.wptr-progress.is-active {
	opacity: 1;
	width: 80%;
	transition: width 8s cubic-bezier( 0.1, 0.7, 0.1, 1 ), opacity 0.2s ease;
}

.wptr-progress.is-done {
	width: 100%;
	opacity: 0;
	transition: width 0.2s ease, opacity 0.4s ease 0.1s;
}

@media ( prefers-reduced-motion: reduce ) {
	.wptr-progress {
		transition: opacity 0.2s ease;
	}
}

/* While the runtime swaps content, suppress CSS transitions so changing
   classes/attributes on reused elements does not flicker. Keyframe animations
   are restarted by the transitions module once the swap completes. */
html.wptr-swapping *,
html.wptr-swapping *::before,
html.wptr-swapping *::after {
	transition: none !important;
}

/* Offline banner shown by the runtime offline module. */
.wptr-offline {
	position: fixed;
	left: 50%;
	bottom: 20px;
	transform: translateX( -50% ) translateY( 20px );
	max-width: 90%;
	padding: 10px 18px;
	background: #1d2327;
	color: #fff;
	font-size: 14px;
	line-height: 1.4;
	border-radius: 6px;
	box-shadow: 0 4px 16px rgba( 0, 0, 0, 0.25 );
	z-index: 2147483646;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.25s ease, transform 0.25s ease;
}

.wptr-offline.is-visible {
	opacity: 1;
	transform: translateX( -50% ) translateY( 0 );
}