/**
 * Relationship & Discovery Engine (Phase 2.9, docs/DECISIONS.md ADR-027).
 * Styles for the Recommendation, Related Content, Popular Search,
 * Trending, Search Empty State, and Recently Viewed components. Loaded
 * on every request (not conditionally) — unlike service.css/city.css,
 * these components now appear across service, city, search, and blog
 * post pages, so the conditional-enqueue matrix would cover nearly every
 * request anyway; see inc/class-assets.php for the full reasoning.
 */

/* ---------- Recommendation / Related Content ---------- */

.recommendation {
	margin-block-start: var(--space-10);
}

.related-content {
	margin-block-start: var(--space-10);
	display: flex;
	flex-direction: column;
	gap: var(--space-10);
}

.related-content__posts {
	margin-block-start: var(--space-2);
}

/* ---------- Popular Search / Trending ---------- */

.popular-searches,
.trending-searches {
	margin-block-start: var(--space-8);
}

.popular-searches__title,
.trending-searches__title {
	display: flex;
	align-items: center;
	gap: var(--space-2);
	margin: 0 0 var(--space-4);
	font-size: var(--font-size-lg);
}

.trending-searches__title svg {
	width: 1.1rem;
	height: 1.1rem;
	color: var(--color-accent-400);
}

.popular-searches__list,
.trending-searches__list {
	display: flex;
	flex-wrap: wrap;
	gap: var(--space-3);
	margin: 0;
	padding: 0;
	list-style: none;
}

/* ---------- Search Empty State ---------- */

.search-empty-state {
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
	margin-block-start: var(--space-8);
}

/* ---------- Recently Viewed ---------- */

.recently-viewed {
	margin-block-start: var(--space-8);
	padding-block-start: var(--space-6);
	border-block-start: 1px solid var(--color-border);
}

.recently-viewed[hidden] {
	display: none;
}

.recently-viewed__title {
	margin: 0 0 var(--space-3);
	font-size: var(--font-size-base);
	color: var(--color-text-muted);
}

.recently-viewed__list {
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.recently-viewed__list a {
	color: var(--color-brand-primary);
	text-decoration: none;
	font-weight: var(--font-weight-medium);
}

.recently-viewed__list a:hover {
	text-decoration: underline;
}

/* ---------- Service Sidebar cities list (Phase 2.9 — was plain text) ---------- */

.service-sidebar__cities {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-direction: column;
	gap: var(--space-2);
}

.service-sidebar__cities a {
	color: var(--color-text);
	text-decoration: none;
}

.service-sidebar__cities a:hover {
	color: var(--color-brand-primary);
}
