@charset "UTF-8";
/**
 * MLS Genie™ — Navigation progress.
 *
 * A thin bar across the top of the window while a screen loads, and a pending
 * state on the nav item that was tapped. Both exist to answer one question the
 * agent is asking a second after they click: did that do anything?
 */

.mlsg-navbar {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	height: 3px;
	z-index: 99999;
	pointer-events: none;
	opacity: 0;
	transition: opacity .15s ease;
}

.mlsg-navbar.is-active {
	opacity: 1;
}

.mlsg-navbar__fill {
	width: 0;
	height: 100%;
	/* Front-end installs set --mlsg-navbar-color to the client's brand colour;
	   the CRM and portal shells leave it unset and keep the platform teal. */
	background: var(--mlsg-navbar-color, var(--mlsg-teal));
	/* Matches the pace the script advances at, so the bar glides rather than
	   stepping between positions. */
	transition: width .22s ease-out;
}

/* The tapped nav item, while its screen loads. Deliberately quiet — this is
   reassurance, not an alert. */

.mlsg-shell-nav .is-pending {
	opacity: 0.65;
}

@media ( prefers-reduced-motion: reduce ) {
	.mlsg-navbar,
	.mlsg-navbar__fill {
		transition: none;
	}
}