@charset "UTF-8";
/**
 * GenieBuilder — Listings Map (GB_Listings_Map). Pins and groups are the
 * Half-Map Search's (mlsg-gb-halfmap.css); this sizes the map and gives the
 * pins their hover and open states here.
 */

.mlsg-gb-listings-map {
	--mlsg-gb-lmap-h: 400px;
	position: relative;
	width: 100%;
}

.mlsg-gb-listings-map__canvas {
	width: 100%;
	height: var(--mlsg-gb-lmap-h);
	background: var(--mlsg-gb-color-placeholder);
}

.mlsg-gb-listings-map.is-loading .mlsg-gb-listings-map__canvas {
	opacity: 0.85;
}

.mlsg-gb-listings-map .mlsg-gb-pricepin:hover,
.mlsg-gb-listings-map .mlsg-gb-pricepin:focus-visible {
	background: var(--mlsg-pin-hover-bg, var(--mlsg-gb-color-primary));
	color: var(--mlsg-pin-hover-text, var(--mlsg-gb-color-on-brand));
	z-index: 2;
}

.mlsg-gb-listings-map .mlsg-gb-pricepin.is-active {
	background: var(--mlsg-pin-active-bg, var(--mlsg-gb-color-text));
	color: var(--mlsg-pin-active-text, var(--mlsg-gb-color-on-brand));
	z-index: 3;
}

.mlsg-gb-listings-map .mlsg-gb-clusterpin:hover {
	z-index: 2;
	scale: 1.08;
}

.mlsg-gb-listings-map .mlsg-gb-clusterpin:focus-visible,
.mlsg-gb-listings-map .mlsg-gb-pricepin:focus-visible {
	outline: 3px solid var(--mlsg-gb-color-primary);
	outline-offset: 2px;
}

.mlsg-gb-listings-map__card {
	width: 18rem;
	max-width: 80vw;
}

.mlsg-gb-listings-map__note {
	margin: 0;
	padding: var(--mlsg-gb-space-md);
	border: 1px dashed var(--mlsg-gb-color-border);
	color: var(--mlsg-gb-color-muted);
}