/*
 * Homepage discovery polish
 *
 * A narrow, child-theme-only layer for the home discovery journey. Keep the
 * profile-card radius hierarchy out of this file: it is intentionally deferred
 * to the second design pass.
 */

.home,
.front-page {
	--home-ui-radius: 10px;
}

/* Search and city selection are one compact discovery surface on mobile. */
@media screen and (max-width: 960px) {
	.modern-mobile-discovery-strip {
		padding: 12px var(--spacing-4);
	}

	.modern-mobile-search-band__row {
		gap: 8px;
	}

	.modern-mobile-search-field .mobile-drawer-search-field__input,
	.modern-mobile-location-filter,
	.modern-mobile-search-band__results,
	.modern-mobile-signin,
	.modern-mobile-controls .mobile-menu-icon {
		border-radius: var(--home-ui-radius) !important;
	}

	.modern-mobile-search-field .mobile-drawer-search-field__input,
	.modern-mobile-location-filter {
		border-color: rgba(255, 255, 255, 0.14);
	}

	.modern-mobile-search-field .mobile-drawer-search-field__input:focus,
	.modern-mobile-location-filter:focus-visible {
		border-color: rgba(255, 255, 255, 0.3);
	}

	.modern-mobile-location-filter {
		min-width: 118px;
		padding-inline: 11px 12px;
	}

	.modern-mobile-location-filter__label {
		max-width: 92px;
		font-weight: 700;
	}

	.modern-mobile-location-filter__icon {
		background: rgba(255, 255, 255, 0.045);
	}
}

/* The header keeps the same compact 10px shape at larger breakpoints too. */
.modern-header-actions .modern-post-ad-cta {
	border-radius: var(--home-ui-radius) !important;
}

/* The campaign itself is the visual boundary; it does not need a faint rule. */
.home .homepage-ad-carousel,
.front-page .homepage-ad-carousel {
	border-bottom: 0 !important;
	border-radius: var(--home-ui-radius);
}

.home .homepage-ad-carousel .static-ad-carousel,
.front-page .homepage-ad-carousel .static-ad-carousel {
	padding-bottom: 8px;
}

.home .homepage-ad-carousel .ad-card,
.front-page .homepage-ad-carousel .ad-card,
.home .homepage-ad-carousel .ad-card__image-link,
.front-page .homepage-ad-carousel .ad-card__image-link {
	border-radius: var(--home-ui-radius);
}

.homepage-campaign-pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	min-height: 20px;
	margin: 2px 0 0;
}

.homepage-campaign-pagination__dot {
	width: 6px;
	height: 6px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 999px;
	background: rgba(255, 255, 255, 0.27);
	cursor: pointer;
	transition: width 160ms ease, background-color 160ms ease, transform 160ms ease;
}

.homepage-campaign-pagination__dot:hover {
	background: rgba(255, 255, 255, 0.58);
	transform: scale(1.1);
}

.homepage-campaign-pagination__dot.is-active {
	width: 18px;
	background: rgba(236, 236, 236, 0.9);
}

.homepage-campaign-pagination__dot:focus-visible {
	outline: 2px solid var(--focus-ring-color, #fff);
	outline-offset: 3px;
}

/* An empty live rail should hand visitors to a useful next discovery path. */
.home .online-empty-state,
.front-page .online-empty-state {
	padding: var(--spacing-2) 0 var(--spacing-3);
}

.home .online-empty-state__panel,
.front-page .online-empty-state__panel {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 14px;
	padding: 13px;
	border: 1px solid rgba(255, 255, 255, 0.09);
	border-radius: var(--home-ui-radius);
	background: linear-gradient(135deg, rgba(22, 28, 27, 0.96), rgba(15, 16, 18, 0.98));
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.035), 0 12px 26px -24px rgba(0, 0, 0, 0.95);
}

.online-empty-state__content {
	display: grid;
	grid-template-columns: 30px minmax(0, 1fr);
	align-items: start;
	gap: 10px;
	min-width: 0;
}

.online-empty-state__signal {
	position: relative;
	display: block;
	width: 30px;
	height: 30px;
	border: 1px solid rgba(16, 185, 129, 0.18);
	border-radius: var(--home-ui-radius);
	background: rgba(16, 185, 129, 0.07);
}

.online-empty-state__signal::before,
.online-empty-state__signal::after {
	position: absolute;
	content: '';
	border-radius: 50%;
}

.online-empty-state__signal::before {
	inset: 8px;
	background: #18b783;
	box-shadow: 0 0 0 4px rgba(24, 183, 131, 0.09);
}

.online-empty-state__signal::after {
	inset: 5px;
	border: 1px solid rgba(24, 183, 131, 0.22);
}

.online-empty-state__copy p {
	margin: 0;
}

.online-empty-state__eyebrow {
	margin-bottom: 2px !important;
	color: rgba(103, 221, 180, 0.78);
	font-size: 9px;
	font-weight: 750;
	letter-spacing: 0.08em;
	line-height: 1.2;
	text-transform: uppercase;
}

.online-empty-state__message {
	font-size: 14px;
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: 1.3;
}

.online-empty-state__hint {
	margin-top: 2px !important;
	color: var(--text-secondary);
	font-size: 11px;
	line-height: 1.35;
}

.online-empty-state__action {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 38px;
	padding: 0 11px 0 12px;
	border: 1px solid rgba(16, 185, 129, 0.24);
	border-radius: var(--home-ui-radius);
	background: rgba(16, 185, 129, 0.1);
	color: rgba(232, 255, 246, 0.94);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.01em;
	line-height: 1;
	text-transform: none;
	transition: transform 160ms ease, border-color 160ms ease, background-color 160ms ease;
}

.online-empty-state__action-arrow {
	font-size: 15px;
	line-height: 1;
}

.online-empty-state__action:hover,
.online-empty-state__action:focus-visible {
	border-color: rgba(76, 219, 170, 0.5);
	background: rgba(16, 185, 129, 0.17);
	transform: translateY(-1px);
}

.online-empty-state__action:focus-visible {
	outline: 2px solid var(--focus-ring-color, #fff);
	outline-offset: 3px;
}

/* Two rows, two jobs: explore first, then refine. */
.home .filter-chips-section,
.front-page .filter-chips-section,
.home .online-stories-section,
.front-page .online-stories-section {
	border-radius: var(--home-ui-radius);
}

.home .filter-chips-section,
.front-page .filter-chips-section {
	border-bottom: 0 !important;
	padding: var(--spacing-3) !important;
	margin-bottom: var(--spacing-2) !important;
}

/* The next listing starts from the filter outcome, not a new isolated card. */
.home .filter-chips-section + .featured-section,
.front-page .filter-chips-section + .featured-section {
	padding-top: 0 !important;
}

/* Unlockable results live in the New section; empty VIP/Premium sections add no value. */
@supports selector(body:has(*)) {
	body.home:has(.filter-chip[data-filter-type="private"].is-active) #vip-escorts-section,
	body.home:has(.filter-chip[data-filter-type="private"].is-active) .premium-section,
	body.front-page:has(.filter-chip[data-filter-type="private"].is-active) #vip-escorts-section,
	body.front-page:has(.filter-chip[data-filter-type="private"].is-active) .premium-section {
		display: none !important;
	}
}

.filter-chip-row {
	gap: 8px;
	padding-bottom: 4px;
	scroll-padding-inline: 1px;
}

.filter-chip-row--refine {
	margin-top: 2px;
}

.filter-chip {
	min-height: 44px;
	border-radius: var(--home-ui-radius);
	padding-inline: 13px;
	letter-spacing: 0;
}

.filter-chip--private {
	border-color: rgba(190, 75, 91, 0.42);
	background: linear-gradient(180deg, rgba(103, 18, 31, 0.23), rgba(30, 22, 24, 0.58));
	color: rgba(255, 239, 235, 0.96);
}

.filter-chip--private:hover {
	border-color: rgba(190, 75, 91, 0.64);
	background: linear-gradient(180deg, rgba(113, 22, 36, 0.36), rgba(33, 23, 26, 0.7));
}

.filter-chip--private .filter-chip__lock {
	color: #f0c4b9;
}

.filter-chip--private.is-active {
	border-color: rgba(220, 111, 126, 0.76);
	background: linear-gradient(180deg, rgba(114, 22, 37, 0.74), rgba(66, 17, 28, 0.9));
}

.filter-chip--drawer-toggle {
	min-width: 140px;
	border-color: rgba(255, 255, 255, 0.2);
	background: rgba(255, 255, 255, 0.055);
}

.filter-chip--drawer-toggle.is-active {
	border-color: rgba(255, 255, 255, 0.42);
	background: rgba(255, 255, 255, 0.11);
}

.filter-chip--drawer-toggle__icon {
	width: 17px;
	height: 17px;
	flex: 0 0 17px;
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-width: 1.8;
}

/* Replace the former CSS-drawn generic bars with the intentional SVG above. */
.filter-chip--drawer-toggle__icon::before,
.filter-chip--drawer-toggle__icon::after {
	display: none;
}

.filter-results-summary {
	min-height: 44px;
	margin-top: 10px;
	padding: 8px 10px;
	border-radius: var(--home-ui-radius);
	border-color: rgba(255, 255, 255, 0.08);
	background: rgba(255, 255, 255, 0.025);
	box-shadow: none;
}

.filter-results-summary__separator {
	color: var(--text-tertiary);
}

.filter-results-summary__clear {
	min-height: 32px;
	border-radius: var(--home-ui-radius);
}

@media screen and (max-width: 640px) {
	.home .online-empty-state__panel,
	.front-page .online-empty-state__panel {
		gap: 10px;
		padding: 12px;
	}

	.online-empty-state__action {
		min-width: 120px;
	}

	.home .homepage-ad-carousel,
	.front-page .homepage-ad-carousel {
		margin-bottom: var(--spacing-4);
	}

	.home .homepage-ad-carousel .static-ad-carousel,
	.front-page .homepage-ad-carousel .static-ad-carousel {
		gap: 12px;
		padding-right: 12px;
	}

	.home .homepage-ad-carousel .static-ad-carousel .ad-card,
	.front-page .homepage-ad-carousel .static-ad-carousel .ad-card {
		flex-basis: 82%;
		min-width: 82%;
	}

	.filter-chip {
		font-size: 12px;
		padding-inline: 12px;
	}

	.filter-chip--drawer-toggle {
		min-width: 136px;
	}

	.filter-results-summary {
		display: flex;
		justify-content: flex-start;
		gap: 7px;
	}

	.filter-results-summary__count,
	.filter-results-summary__label {
		font-size: 11px;
	}

	.filter-results-summary__clear {
		margin-left: auto;
	}
}

@media screen and (max-width: 390px) {
	.home .online-empty-state__panel,
	.front-page .online-empty-state__panel {
		grid-template-columns: 1fr;
	}

	.online-empty-state__action {
		width: 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.homepage-campaign-pagination__dot {
		transition: none;
	}

	.homepage-campaign-pagination__dot:hover {
		transform: none;
	}
}