@charset "UTF-8";
/* mlsg-frontend: assets/css/mlsg-frontend.css */
/**
 * MLS Genie™ — Front-end chrome.
 *
 * Small pieces the plugin adds to a client's public site that are not part of
 * any one feature's stylesheet: menu integrations, shortcode wrappers, and
 * similar. Loaded site-wide alongside the navigation progress bar.
 *
 * Feature stylesheets stay with their feature. This is only for the bits that
 * would otherwise have nowhere to live and end up inline.
 */

/* Voice search button when added to a theme's main menu. The theme owns the
   button's appearance; this only settles it into the menu row. */
.mlsg-menu-item {
	display: flex;
	align-items: center;
	margin-left: 10px;
}
/* mlsg-nav-progress: includes/genie-crm/assets/css/genie-nav-progress.css */
/**
 * 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;
}

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