@charset "UTF-8";
/**
 * GenieBuilder — listing page pieces: Area List (GB_Term_Links), and a
 * page's questions, market snapshot and longer copy (GB_Listing_Page).
 */

.mlsg-gb-termlinks {
	display: flex;
	flex-direction: column;
	gap: var(--mlsg-gb-space-sm);
}

.mlsg-gb-termlinks__title {
	margin: 0;
}

.mlsg-gb-termlinks__list {
	display: flex;
	flex-direction: column;
	gap: var(--mlsg-gb-space-xs);
	margin: 0;
	padding: 0;
	list-style: none;
}

.mlsg-gb-termlinks .mlsg-gb-termlinks__link {
	display: flex;
	align-items: center;
	gap: var(--mlsg-gb-space-xs);
	color: var(--mlsg-gb-color-primary);
	text-decoration: none;
}

.mlsg-gb-termlinks .mlsg-gb-termlinks__link:hover,
.mlsg-gb-termlinks .mlsg-gb-termlinks__link:focus-visible {
	text-decoration: underline;
}

.mlsg-gb-termlinks__link i {
	font-size: 0.75em;
}

.mlsg-gb-termlinks__count {
	margin-inline-start: auto;
	color: var(--mlsg-gb-color-muted);
}

/* ── A listing page's questions (GB_Listing_Page::faq_html()) ─────────── */

.mlsg-gb-faq {
	display: flex;
	flex-direction: column;
	gap: var(--mlsg-gb-space-sm);
}

.mlsg-gb-faq .mlsg-gb-faq__title {
	margin: 0;
	/* Its own, so a site's fixed body line height cannot stack the lines. */
	line-height: 1.2;
}

.mlsg-gb-faq__list {
	display: flex;
	flex-direction: column;
	border-top: 1px solid var(--mlsg-gb-color-border);
}

.mlsg-gb-faq__item {
	border-bottom: 1px solid var(--mlsg-gb-color-border);
}

.mlsg-gb-faq .mlsg-gb-faq__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--mlsg-gb-space-md);
	margin: 0;
	padding: var(--mlsg-gb-space-md) 0;
	color: var(--mlsg-gb-color-text);
	font-size: 1.0625rem;
	font-weight: 600;
	line-height: 1.4;
}

summary.mlsg-gb-faq__q {
	list-style: none;
	cursor: pointer;
}

summary.mlsg-gb-faq__q::-webkit-details-marker {
	display: none;
}

summary.mlsg-gb-faq__q:focus-visible {
	outline: 2px solid var(--mlsg-gb-color-primary);
	outline-offset: 2px;
}

.mlsg-gb-faq__q i {
	flex: none;
	color: var(--mlsg-gb-color-muted);
	font-size: 0.875rem;
	transition: transform 0.2s ease;
}

.mlsg-gb-faq__item[open] > .mlsg-gb-faq__q i {
	transform: rotate(180deg);
}

.mlsg-gb-faq__a {
	padding: 0 0 var(--mlsg-gb-space-md);
	color: var(--mlsg-gb-color-text);
	font-size: 1rem;
	line-height: 1.6;
}

.mlsg-gb-faq__a > :first-child {
	margin-top: 0;
}

.mlsg-gb-faq__a > :last-child {
	margin-bottom: 0;
}

@media (prefers-reduced-motion: reduce) {
	.mlsg-gb-faq__q i {
		transition: none;
	}
}

/* ── A city or area page's market at a glance ─────────────────────────── */

.mlsg-gb-snapshot {
	display: flex;
	flex-direction: column;
	gap: var(--mlsg-gb-space-xs);
}

.mlsg-gb-snapshot__tiles {
	display: flex;
	flex-wrap: wrap;
	gap: var(--mlsg-gb-space-sm);
	margin: 0;
}

.mlsg-gb-snapshot__tile {
	display: flex;
	flex: 1 1 9rem;
	flex-direction: column;
	gap: 0.125rem;
	padding: var(--mlsg-gb-space-sm) var(--mlsg-gb-space-md);
	border: 1px solid var(--mlsg-gb-color-border);
	border-radius: var(--mlsg-gb-radius-card);
	background: var(--mlsg-gb-color-surface);
}

.mlsg-gb-snapshot__label {
	color: var(--mlsg-gb-color-muted);
	font-size: 0.875rem;
}

.mlsg-gb-snapshot__value {
	margin: 0;
	color: var(--mlsg-gb-color-text);
	font-size: 1.375rem;
	font-weight: 700;
}

.mlsg-gb-snapshot__note {
	margin: 0;
	color: var(--mlsg-gb-color-muted);
	font-size: 0.875rem;
}

/* ── A listing page's longer copy ─────────────────────────────────────── */

.mlsg-gb-page-more > :first-child {
	margin-top: 0;
}

.mlsg-gb-page-more > :last-child {
	margin-bottom: 0;
}