/**
 * Clustered search-results map styling. Uses the plugin's palette
 * custom properties (with sensible fallbacks) so it inherits the same
 * colours and dark-mode overrides as the rest of the front end.
 */

.ucl-search-map-wrap {
	margin: 0 0 24px;
}

.ucl-map-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 14px;
	margin: 0 0 12px;
}

.ucl-map-nearme {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 14px;
	border: 1px solid var(--ucl-card-border, #e2e6ea);
	border-radius: 999px;
	background: var(--ucl-button-bg, var(--ucl-primary, #f85c70));
	color: var(--ucl-button-text, #fff);
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
	line-height: 1;
	transition: background .15s ease;
}

.ucl-map-nearme:hover {
	background: var(--ucl-button-hover-bg, var(--ucl-primary-hover, #e0384f));
	color: var(--ucl-button-hover-text, #fff);
}

.ucl-map-nearme i {
	font-size: 15px;
}

.ucl-map-radius-label {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 14px;
	color: var(--ucl-text-muted, #6b6f77);
}

.ucl-map-radius {
	padding: 7px 10px;
	border: 1px solid var(--ucl-card-border, #e2e6ea);
	border-radius: 8px;
	background: var(--ucl-card-bg, #fff);
	color: var(--ucl-text, #2c333a);
	font-size: 14px;
}

.ucl-map-status {
	font-size: 13px;
	color: var(--ucl-text-muted, #6b6f77);
}

.ucl-search-map {
	width: 100%;
	min-height: 240px;
	border-radius: var(--ucl-card-radius, 10px);
	border: 1px solid var(--ucl-card-border, #e2e6ea);
	overflow: hidden;
	z-index: 0;
}

.ucl-map-empty {
	margin-top: 10px;
	padding: 10px 14px;
	font-size: 14px;
	color: var(--ucl-text-muted, #6b6f77);
	background: var(--ucl-page-bg, #f6f7f9);
	border-radius: 8px;
}

/* ---- Popup ---- */
.ucl-map-popup {
	display: block;
	min-width: 180px;
}

.ucl-map-popup-img {
	display: block;
	width: 100%;
	height: 110px;
	object-fit: cover;
	border-radius: 6px;
	margin: 0 0 8px;
}

.ucl-map-popup-title {
	display: block;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.3;
	color: var(--ucl-heading, #1d2530);
	text-decoration: none;
	margin: 0 0 2px;
}

.ucl-map-popup-title:hover {
	color: var(--ucl-primary, #f85c70);
}

.ucl-map-popup-city {
	font-size: 12.5px;
	color: var(--ucl-text-muted, #6b6f77);
	margin: 0 0 4px;
}

.ucl-map-popup-price {
	font-size: 15px;
	font-weight: 700;
	color: var(--ucl-price, var(--ucl-primary, #f85c70));
	margin: 0 0 8px;
}

.ucl-map-popup-link {
	display: inline-block;
	font-size: 13px;
	font-weight: 600;
	color: var(--ucl-button-text, #fff);
	background: var(--ucl-button-bg, var(--ucl-primary, #f85c70));
	padding: 6px 12px;
	border-radius: 6px;
	text-decoration: none;
}

.ucl-map-popup-link:hover {
	background: var(--ucl-button-hover-bg, var(--ucl-primary-hover, #e0384f));
	color: var(--ucl-button-hover-text, #fff);
}

/* The Leaflet popup close button can clash with dark card backgrounds. */
.ucl-search-map .leaflet-popup-content-wrapper {
	background: var(--ucl-card-bg, #fff);
	color: var(--ucl-text, #2c333a);
}

.ucl-search-map .leaflet-popup-tip {
	background: var(--ucl-card-bg, #fff);
}
