/* La busqueda va a sangre: el main pierde el ancho y el padding del
   container para que la lista y el mapa ocupen la ventana entera. */
body:has(.search-shell) main.container {
	max-width: none;
	padding: 0;
}

.search-filters {
	position: relative;
}

.search-bar {
	position: sticky;
	top: 0;
	z-index: var(--z-hud);
	display: flex;
	align-items: center;
	gap: var(--s-2);
	background: var(--surface);
	border-bottom: 1px solid var(--line);
	padding: var(--s-2) var(--s-4);
}

.search-bar-field {
	flex: 0 1 11rem;
	min-width: 0;
}

.search-bar-query {
	flex: 1 1 18rem;
}

.search-bar .search-geo {
	flex: none;
	margin-inline-start: auto;
}

.search-bar .search-more-toggle,
.search-bar .search-bar-submit {
	flex: none;
}

@media (max-width: 60rem) {
	.search-bar {
		flex-wrap: wrap;
	}

	.search-bar-field {
		flex: 1 1 9rem;
	}

	.search-bar .search-geo {
		margin-inline-start: 0;
	}
}

.search-drawer {
	position: absolute;
	inset-inline: 0;
	top: 100%;
	z-index: var(--z-hud);
	display: flex;
	flex-direction: column;
	gap: var(--s-5);
	max-height: 70vh;
	overflow: auto;
	background: var(--surface);
	box-shadow: var(--shadow-3);
	padding: var(--s-5);
}

.search-drawer-row {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
	gap: var(--s-4);
	align-items: end;
}

.search-drawer label {
	display: flex;
	flex-direction: column;
	gap: var(--s-1);
	font-size: var(--fs-sm);
}

.search-drawer fieldset label {
	flex-direction: row;
	align-items: center;
	gap: var(--s-2);
}

.search-checkbox-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr));
	gap: var(--s-2);
	max-height: 16rem;
	overflow-y: auto;
}

.search-price {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: var(--s-1);
	padding-block-start: 2rem;
}

.search-price input[type="range"] {
	position: absolute;
	inset-inline: 0;
	top: 0;
	width: 100%;
	margin: 0;
	pointer-events: none;
	appearance: none;
	background: transparent;
	accent-color: var(--accent);
}

.search-price input[type="range"]::-webkit-slider-runnable-track {
	height: 4px;
	background: var(--line-strong);
	border-radius: var(--r-full);
}

.search-price input[type="range"]::-moz-range-track {
	height: 4px;
	background: var(--line-strong);
	border-radius: var(--r-full);
}

.search-price input[type="range"]::-webkit-slider-thumb {
	pointer-events: auto;
	appearance: none;
	width: 16px;
	height: 16px;
	margin-top: -6px;
	border-radius: var(--r-full);
	background: var(--accent);
	border: 2px solid var(--surface);
	box-shadow: var(--shadow-1);
}

.search-price input[type="range"]::-moz-range-thumb {
	pointer-events: auto;
	width: 16px;
	height: 16px;
	border-radius: var(--r-full);
	background: var(--accent);
	border: 2px solid var(--surface);
	box-shadow: var(--shadow-1);
}

.search-price-output {
	color: var(--ink-soft);
	font-size: var(--fs-sm);
	font-variant-numeric: tabular-nums;
}

.search-geo-status {
	align-self: center;
	color: var(--ink-soft);
	font-size: var(--fs-sm);
}

/* Pantalla partida: la lista scrollea a la izquierda y el mapa queda clavado
   a la derecha, a todo el alto que dejan el header y la barra de busqueda. */
.search-results-layout {
	display: grid;
	grid-template-columns: minmax(0, 56%) minmax(0, 44%);
	gap: 0;
}

.search-results-list {
	padding: var(--s-4) var(--s-5);
	overflow-y: auto;
	height: calc(100vh - var(--nav-h) - 57px);
}

.search-results-map {
	height: calc(100vh - var(--nav-h) - 57px);
	position: sticky;
	top: calc(var(--nav-h) + 57px);
}

.search-area-btn {
	position: absolute;
	top: var(--s-3);
	left: 50%;
	transform: translateX(-50%);
	z-index: 1000;
}

#search-map {
	height: 100%;
}

/* Cards mas densas que en la home: la lista compite con el mapa por el ancho
   y caben tres por fila en un desktop normal. */
.search-results-list .ad-results-list {
	grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
	gap: var(--s-3);
}

.search-results-list .ad-card-price {
	font-size: var(--fs-lg);
}

.search-results-list .ad-card-overlay {
	padding: var(--s-3);
}

.search-results-list .ad-card-strip {
	padding: var(--s-2) var(--s-3);
}

.ad-results-header {
	margin-block-end: var(--s-4);
}

.ad-result-card {
	position: relative;
}

.ad-result-card-badges {
	position: absolute;
	z-index: 1;
	top: var(--s-2);
	left: var(--s-2);
	display: flex;
	align-items: center;
	gap: var(--s-1);
}

.ad-result-badge-kind {
	padding: var(--s-1) var(--s-2);
	border-radius: var(--r-full);
	background: color-mix(in srgb, var(--navy-deep) 80%, transparent);
	color: #ffffff;
	font-size: var(--fs-xs);
	font-weight: var(--fw-medium);
	line-height: 1;
}

.ad-result-card-favourite {
	position: absolute;
	z-index: 1;
	top: var(--s-2);
	right: var(--s-2);
}

.ad-result-card-hover {
	outline: 2px solid var(--accent);
	border-radius: var(--r-lg);
}

.search-view-switch {
	display: none;
}

@media (max-width: 60rem) {
	.search-results-layout {
		grid-template-columns: 1fr;
	}

	.search-results-list,
	.search-results-map {
		height: auto;
		position: static;
	}

	.search-results-map {
		height: calc(100vh - var(--nav-h) - 57px);
	}

	#resultados.search-view-map .search-results-list {
		display: none;
	}

	#resultados:not(.search-view-map) .search-results-map {
		display: none;
	}

	.search-view-switch {
		position: fixed;
		bottom: var(--s-5);
		left: 50%;
		transform: translateX(-50%);
		z-index: var(--z-hud);
		display: flex;
		gap: var(--s-1);
		padding: var(--s-1);
		border-radius: var(--r-full);
		background: var(--navy);
		box-shadow: var(--shadow-3);
	}

	.search-view-toggle {
		border: 0;
		border-radius: var(--r-full);
		background: transparent;
		padding: var(--s-2) var(--s-4);
		color: #ffffff;
		font-size: var(--fs-sm);
		font-weight: var(--fw-medium);
		cursor: pointer;
	}

	.search-view-toggle[aria-pressed="true"] {
		background: var(--navy-deep);
	}
}

.ad-map-pin {
	display: inline-block;
	background: var(--accent);
	color: var(--accent-ink);
	font-weight: 600;
	font-size: var(--fs-sm);
	padding: 2px var(--s-2);
	border-radius: var(--r-full);
	border: 1px solid rgba(0, 0, 0, .15);
	box-shadow: var(--shadow-1);
	white-space: nowrap;
}

.ad-map-pin-wrap {
	background: none;
	border: none;
}

.ad-map-pin-active .ad-map-pin {
	background: var(--navy, #0E2E50);
	color: #fff;
}

.search-results-map .leaflet-popup-content a {
	display: grid;
	gap: var(--s-1);
	text-decoration: none;
}

.search-results-map .leaflet-popup-content img {
	width: 200px;
	border-radius: var(--r-sm);
}

.marker-cluster-small,
.marker-cluster-small div,
.marker-cluster-medium,
.marker-cluster-medium div,
.marker-cluster-large,
.marker-cluster-large div {
	background-color: rgba(149, 211, 15, .5);
	color: var(--navy-deep, #081d36);
	font-weight: 600;
}

.search-draw-btn {
	position: absolute;
	top: var(--s-3);
	right: var(--s-3);
	z-index: 1000;
}
