/* =============================================================================
   TERRITORIO · búsqueda por mapa
   Mapa teñido con la paleta, pines-pastilla con precio que caen escalonados,
   pin y tarjeta conectados, grupos que laten, ventana de propiedad propia y
   controles de vidrio. Funciona con el mapa de Houzez (Leaflet/OpenStreetMap).
   ========================================================================== */

/* -----------------------------------------------------------------------------
   Lienzo: el mapa flota como una tarjeta sobre Arena
   -------------------------------------------------------------------------- */
.territorio .half-map-wrap { background: var(--t-arena); }
@media (min-width: 769px) {
	.territorio .half-map-left-wrap { padding: 14px 0 14px 14px; background: var(--t-arena); }
	.territorio .half-map-left-wrap .map-wrap {
		height: 100%;
		border-radius: 26px;
		overflow: hidden;
		box-shadow: 0 1px 0 rgba(255, 255, 255, .6) inset, 0 24px 60px -28px rgba(11, 45, 91, .45);
		isolation: isolate;
	}
}
.territorio .map-wrap { position: relative; background: #E9EEF0; }
.territorio .map-wrap::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 450;
	pointer-events: none;
	border-radius: inherit;
	box-shadow: inset 0 0 0 1px rgba(11, 45, 91, .08), inset 0 40px 50px -40px rgba(11, 45, 91, .35);
}

/* Mapa con la paleta de la marca (filtro SVG de inc/mapa.php). */
.territorio .t-mapa-tenido .leaflet-tile-pane { filter: url(#t-mapa-marca); }
.territorio .leaflet-container { font-family: var(--t-fuente); background: #E9EEF0; }
.territorio .leaflet-control-attribution {
	background: rgba(255, 255, 255, .7) !important;
	border-radius: 10px 0 0 0;
	font-size: 10px;
	color: var(--t-gris);
}
.territorio .leaflet-control-attribution a { color: var(--t-azul-2); }

/* -----------------------------------------------------------------------------
   Pines con precio
   -------------------------------------------------------------------------- */
.territorio .leaflet-marker-icon.someclass { overflow: visible; }
.territorio .map-marker-label,
.territorio .osm-marker.map-marker-label {
	position: absolute;
	left: 0;
	top: 0;
	translate: -50% calc(-100% - 9px);
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 7px 12px 7px 9px !important;
	border: 2px solid #fff !important;
	border-radius: 999px !important;
	background: var(--t-azul) !important;
	color: #fff !important;
	font: 800 13px/1 var(--t-fuente-titulo) !important;
	letter-spacing: -.01em;
	white-space: nowrap;
	cursor: pointer;
	box-shadow: 0 6px 16px -6px rgba(11, 45, 91, .6), 0 1px 2px rgba(11, 45, 91, .3) !important;
	transition: scale var(--t-base) var(--t-rebote), background-color var(--t-rapido) ease, color var(--t-rapido) ease, box-shadow var(--t-base) ease;
	will-change: scale;
}
/* Punto de color por tipo de operación (renta = coral, venta = aqua). */
.territorio .map-marker-label::before {
	content: "";
	flex: none;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--t-menta);
	box-shadow: 0 0 0 3px rgba(126, 226, 209, .25);
}
.territorio .map-marker-label.t-renta::before { background: var(--t-coral); box-shadow: 0 0 0 3px rgba(255, 123, 123, .25); }
/* Colita del pin */
.territorio .map-marker-label::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: -7px;
	width: 10px;
	height: 10px;
	margin-left: -5px;
	background: inherit;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
	border-radius: 0 0 3px 0;
	transform: rotate(45deg);
}
.territorio .map-marker-label .t-pin-360 {
	font: 800 9px/1 var(--t-fuente);
	padding: 3px 5px;
	border-radius: 999px;
	background: var(--t-aqua);
	color: #fff;
	letter-spacing: .02em;
}
.territorio .map-marker-label:hover,
.territorio .map-marker-label.t-activo {
	background: var(--t-aqua) !important;
	scale: 1.16;
	box-shadow: 0 12px 26px -8px rgba(20, 184, 166, .8), 0 0 0 6px rgba(20, 184, 166, .18) !important;
}
.territorio .map-marker-label.t-activo { animation: t-pin-pulso 1.6s ease-out infinite; }
.territorio .map-marker-label.t-activo::before,
.territorio .map-marker-label:hover::before { background: #fff; }
.territorio .map-marker-label.t-visitado:not(.t-activo):not(:hover) {
	background: #fff !important;
	color: var(--t-azul) !important;
	border-color: rgba(11, 45, 91, .18) !important;
}
.territorio .map-marker-label.t-visitado:not(.t-activo):not(:hover)::after { border-color: rgba(11, 45, 91, .18); }
.territorio .leaflet-marker-icon.t-encima { z-index: 9999 !important; }

/* Entrada: los pines caen en cascada. */
.territorio .map-marker-label.t-pin-entra { animation: t-pin-caer .7s var(--t-rebote) both; animation-delay: calc(var(--t-i, 0) * 55ms); }
@keyframes t-pin-caer {
	0% { opacity: 0; top: -26px; scale: .4; }
	60% { opacity: 1; }
	100% { opacity: 1; top: 0; scale: 1; }
}
@keyframes t-pin-pulso {
	0% { box-shadow: 0 12px 26px -8px rgba(20, 184, 166, .8), 0 0 0 0 rgba(20, 184, 166, .45); }
	100% { box-shadow: 0 12px 26px -8px rgba(20, 184, 166, .8), 0 0 0 18px rgba(20, 184, 166, 0); }
}

/* Pines de imagen (si alguien apaga los pines con precio): misma caída. */
.territorio .leaflet-marker-icon:not(.someclass):not(.mycluster) { transition: filter var(--t-rapido) ease; }
.territorio .leaflet-marker-icon:not(.someclass):not(.mycluster):hover { filter: drop-shadow(0 6px 8px rgba(11, 45, 91, .45)); }

/* -----------------------------------------------------------------------------
   Grupos de pines
   -------------------------------------------------------------------------- */
.territorio .marker-cluster,
.territorio .mycluster { background: transparent !important; }
.territorio .marker-cluster div,
.territorio .houzez-osm-cluster {
	position: relative;
	width: 47px !important;
	height: 47px !important;
	margin: 0 !important;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50% !important;
	background: radial-gradient(circle at 30% 25%, var(--t-azul-2), var(--t-azul)) !important;
	border: 3px solid #fff;
	color: #fff !important;
	font: 800 15px/1 var(--t-fuente-titulo) !important;
	box-shadow: 0 10px 22px -8px rgba(11, 45, 91, .7);
	transition: scale var(--t-base) var(--t-rebote);
}
.territorio .houzez-osm-cluster::before,
.territorio .houzez-osm-cluster::after {
	content: "";
	position: absolute;
	inset: -3px;
	border-radius: 50%;
	border: 2px solid var(--t-aqua);
	animation: t-grupo-onda 2.4s cubic-bezier(.2, .6, .3, 1) infinite;
	pointer-events: none;
}
.territorio .houzez-osm-cluster::after { animation-delay: 1.2s; }
.territorio .mycluster:hover .houzez-osm-cluster { scale: 1.1; }
@keyframes t-grupo-onda { 0% { transform: scale(1); opacity: .9; } 100% { transform: scale(1.9); opacity: 0; } }
.territorio .leaflet-cluster-anim .leaflet-marker-icon,
.territorio .leaflet-cluster-anim .leaflet-marker-shadow { transition: transform .45s var(--t-curva), opacity .3s ease-in; }

/* -----------------------------------------------------------------------------
   Ventana de la propiedad (popup)
   -------------------------------------------------------------------------- */
.territorio .leaflet-popup-content-wrapper {
	border-radius: 22px !important;
	padding: 0 !important;
	overflow: hidden;
	box-shadow: 0 30px 60px -20px rgba(11, 45, 91, .55), 0 0 0 1px rgba(11, 45, 91, .06) !important;
	transform-origin: 50% 100%;
	animation: t-ventana .42s var(--t-rebote);
}
.territorio .leaflet-popup-content { margin: 0 !important; width: 280px !important; }
.territorio .leaflet-popup-tip { box-shadow: none; }
.territorio .leaflet-popup-close-button {
	z-index: 3;
	top: 10px !important;
	right: 10px !important;
	width: 30px !important;
	height: 30px !important;
	border-radius: 50%;
	background: rgba(255, 255, 255, .9) !important;
	color: var(--t-azul) !important;
	font: 600 20px/28px var(--t-fuente) !important;
	text-align: center;
	box-shadow: 0 4px 10px -4px rgba(11, 45, 91, .4);
}
@keyframes t-ventana { from { opacity: 0; transform: translateY(10px) scale(.92); } }
.territorio .property-info-window {
	width: 280px;
	padding: 0;
	border-radius: 0;
	box-shadow: none;
	font-family: var(--t-fuente);
}
.territorio .property-info-window .info-window-image { overflow: hidden; }
.territorio .property-info-window .info-window-image img {
	width: 100%;
	max-width: none;
	height: 170px;
	border-radius: 0;
	transition: transform 1.2s var(--t-curva);
}
.territorio .property-info-window:hover .info-window-image img { transform: scale(1.05); }
.territorio .property-info-window .info-window-image::after {
	content: "";
	position: absolute;
	inset: 50% 0 0 0;
	background: linear-gradient(transparent, rgba(11, 45, 91, .35));
	pointer-events: none;
}
.territorio .property-info-window .info-window-label { border-radius: 999px; background: var(--t-coral) !important; padding: 5px 9px 4px; font-weight: 700; z-index: 2; }
.territorio .info-window-price { font: 800 20px/1.2 var(--t-fuente-titulo); color: var(--t-azul); padding: 14px 16px 0; margin-bottom: 4px; }
.territorio .info-window-title,
.territorio .property-info-window h4,
.territorio .property-info-window .info-title { font: 700 14px/1.35 var(--t-fuente); color: var(--t-tinta); padding: 0 16px; margin: 0 0 6px; }
.territorio .info-window-property-type { color: var(--t-aqua-2); font-weight: 700; letter-spacing: .08em; padding: 0 16px; margin-bottom: 6px; }
.territorio .info-window-info-details { color: var(--t-gris); padding: 0 16px; }
.territorio .info-window-address-info { color: var(--t-gris); padding: 0 16px 16px; }
.territorio .property-info-window a { color: inherit; }
.territorio .t-ventana-titulo { display: block; padding: 0 16px; margin: 0 0 6px; font: 700 14px/1.35 var(--t-fuente); color: var(--t-tinta) !important; }
.territorio .t-ventana-ir {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 6px 12px 12px;
	padding: 11px 14px;
	border-radius: 14px;
	background: var(--t-azul);
	color: #fff !important;
	font: 700 13px/1 var(--t-fuente);
	transition: background-color var(--t-rapido) ease;
}
.territorio .t-ventana-ir svg { width: 18px; height: 18px; transition: transform var(--t-base) var(--t-rebote); }
.territorio .t-ventana-ir:hover { background: var(--t-aqua-2); }
.territorio .t-ventana-ir:hover svg { transform: translateX(4px); }

/* -----------------------------------------------------------------------------
   Controles de vidrio
   -------------------------------------------------------------------------- */
.territorio .map-btn {
	height: 40px !important;
	line-height: 40px !important;
	padding: 0 14px !important;
	border-radius: 14px !important;
	background: rgba(255, 255, 255, .86) !important;
	-webkit-backdrop-filter: saturate(1.6) blur(10px);
	backdrop-filter: saturate(1.6) blur(10px);
	color: var(--t-azul) !important;
	font: 700 12px/40px var(--t-fuente) !important;
	text-transform: none !important;
	letter-spacing: 0;
	box-shadow: 0 8px 22px -10px rgba(11, 45, 91, .55), 0 0 0 1px rgba(11, 45, 91, .06);
	transition: transform var(--t-base) var(--t-rebote), background-color var(--t-rapido) ease, color var(--t-rapido) ease;
}
.territorio .map-btn:hover { transform: translateY(-2px); background: #fff !important; color: var(--t-aqua-2) !important; }
.territorio .map-btn:active { transform: scale(.95); }
.territorio .map-btn i { color: var(--t-aqua-2); }
.territorio .map-arrows-actions,
.territorio .map-next-prev-actions,
.territorio .map-zoom-actions { z-index: 500; }
.territorio .map-arrows-actions { top: 18px !important; left: 18px !important; display: flex; flex-direction: column; gap: 0; border-radius: 14px; overflow: hidden; box-shadow: 0 8px 22px -10px rgba(11, 45, 91, .55); }
.territorio .map-arrows-actions .map-btn { width: 42px; padding: 0 !important; border-radius: 0 !important; box-shadow: none; font-size: 16px !important; }
.territorio .map-arrows-actions .map-btn + .map-btn { border-top: 1px solid var(--t-linea); }
.territorio .map-next-prev-actions { top: 18px !important; right: 18px !important; display: flex; gap: 8px; }
.territorio .map-zoom-actions { right: 18px !important; bottom: 26px !important; }

/* Cargando: órbita en lugar de las bolitas de Houzez. */
.territorio .houzez-map-loading { z-index: 600; }
.territorio .houzez-map-loading .mapPlaceholder {
	width: 74px;
	height: 74px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .92);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	box-shadow: 0 18px 40px -16px rgba(11, 45, 91, .55);
	position: relative;
}
.territorio .houzez-map-loading .loader-ripple { display: none; }
.territorio .houzez-map-loading .mapPlaceholder::before {
	content: "";
	position: absolute;
	inset: 12px;
	border-radius: 50%;
	border: 2px dashed rgba(11, 45, 91, .25);
	animation: t-girar 4s linear infinite;
}
.territorio .houzez-map-loading .mapPlaceholder::after {
	content: "";
	position: absolute;
	left: 50%;
	top: 50%;
	width: 12px;
	height: 12px;
	margin: -6px;
	border-radius: 50%;
	background: var(--t-aqua);
	box-shadow: 0 0 10px var(--t-aqua);
	animation: t-orbitar 1.2s linear infinite;
}
@keyframes t-girar { to { transform: rotate(360deg); } }
@keyframes t-orbitar { from { transform: rotate(0) translateX(25px); } to { transform: rotate(360deg) translateX(25px); } }

/* Chip con el número de propiedades en la zona (lo pone territorio-mapa.js). */
.t-mapa-chip {
	position: absolute;
	z-index: 500;
	left: 76px;
	top: 18px;
	display: inline-flex;
	align-items: center;
	gap: 9px;
	height: 40px;
	padding: 0 16px 0 14px;
	border-radius: 999px;
	background: var(--t-azul);
	color: #fff;
	font: 600 13px/1 var(--t-fuente);
	box-shadow: 0 12px 30px -12px rgba(11, 45, 91, .8);
	white-space: nowrap;
	pointer-events: none;
	animation: t-chip-entra .6s var(--t-rebote) .3s both;
}
.t-mapa-chip b { font: 800 15px/1 var(--t-fuente-titulo); color: var(--t-menta); font-variant-numeric: tabular-nums; }
.t-mapa-chip i {
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: var(--t-aqua);
	box-shadow: 0 0 0 0 rgba(20, 184, 166, .7);
	animation: t-latir-punto 1.8s ease-out infinite;
}
.t-mapa-chip.t-cargando b { opacity: .5; }
.t-mapa-chip.t-cambio { animation: t-chip-cambio .5s var(--t-rebote); }
@keyframes t-chip-entra { from { opacity: 0; transform: translateY(-16px) scale(.9); } }
@keyframes t-chip-cambio { 40% { scale: 1.08; } }
@keyframes t-latir-punto { 0% { box-shadow: 0 0 0 0 rgba(20, 184, 166, .7); } 100% { box-shadow: 0 0 0 10px rgba(20, 184, 166, 0); } }
@media (max-width: 575.98px) {
	.t-mapa-chip { top: 70px; height: 34px; font-size: 12px; }
}
/* El aviso «Showing…» de Houzez se vuelve una pastilla discreta; en el celular lo dice el chip. */
.territorio .houzez-map-message {
	left: 18px;
	bottom: 26px;
	border-radius: 999px;
	padding: 8px 14px;
	background: rgba(11, 45, 91, .86);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	font: 600 12px/18px var(--t-fuente);
}
@media (max-width: 768px) { .territorio .houzez-map-message { display: none; } }

/* -----------------------------------------------------------------------------
   Panel de resultados
   -------------------------------------------------------------------------- */
.territorio .half-map-right-wrap { background: #FBFAF6; scroll-behavior: smooth; }
.territorio .half-map-right-wrap .page-title-wrap { padding: 22px 24px 8px !important; }
.territorio .half-map-right-wrap .page-title { font: 800 20px/1.2 var(--t-fuente-titulo); color: var(--t-azul); }
.territorio .half-map-right-wrap #total-results { color: var(--t-aqua-2); }
.territorio .half-map-right-wrap .item-listing-wrap { padding-left: 16px; padding-right: 16px; }
.territorio .half-map-right-wrap .item-listing-wrap .item-wrap { cursor: pointer; }
/* Al pasar por el pin, la tarjeta se ilumina con una franja Aqua. */
.territorio .half-map-right-wrap .item-listing-wrap .item-wrap { position: relative; }
.territorio .half-map-right-wrap .item-listing-wrap .item-wrap::before {
	content: "";
	position: absolute;
	left: 0;
	top: 18px;
	bottom: 18px;
	width: 4px;
	border-radius: 0 4px 4px 0;
	background: var(--t-aqua);
	transform: scaleY(0);
	transition: transform var(--t-base) var(--t-rebote);
	z-index: 2;
}
.territorio .half-map-right-wrap .item-listing-wrap.t-activa .item-wrap::before,
.territorio .half-map-right-wrap .item-listing-wrap:hover .item-wrap::before { transform: scaleY(1); }
/* Resultados nuevos (AJAX): entran desde la derecha, hacia el mapa. */
.territorio .half-map-right-wrap .item-listing-wrap.t-revelar { transform: translateX(26px); }
.territorio .half-map-right-wrap .item-listing-wrap.t-revelar.t-visto { transform: none; }

/* Buscador sobre el panel */
.territorio .half-map-right-wrap .advanced-search-half-map,
.territorio .half-map-right-wrap .advanced-search { background: #fff; border-bottom: 1px solid var(--t-linea); }

/* Celular: interruptor Lista / Mapa (template-parts/listing/partials/mobile-map-switch.php). */
@media (min-width: 768px) { .territorio .mobile-map-switch.t-interruptor { display: none !important; } }
.territorio .mobile-map-switch.t-interruptor {
	z-index: 1001;
	left: 50%;
	width: auto;
	margin: 0;
	bottom: calc(18px + env(safe-area-inset-bottom));
	translate: -50% 0;
	display: flex;
	padding: 5px;
	border: 0;
	border-radius: 999px;
	background: var(--t-azul);
	box-shadow: 0 16px 36px -12px rgba(11, 45, 91, .85);
	animation: t-chip-entra .6s var(--t-rebote) .4s both;
}
.territorio .t-interruptor .btn {
	position: relative;
	z-index: 1;
	width: auto !important;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	height: 42px;
	padding: 0 20px;
	border: 0 !important;
	border-radius: 999px;
	background: transparent !important;
	color: rgba(255, 255, 255, .8) !important;
	font: 700 15px/1 var(--t-fuente);
	box-shadow: none !important;
	transition: color var(--t-base) ease;
}
.territorio .t-interruptor .btn svg { width: 18px; height: 18px; }
.territorio .t-interruptor .btn[aria-pressed="true"] { color: var(--t-azul) !important; }
.territorio .t-interruptor__luz {
	position: absolute;
	z-index: 0;
	top: 5px;
	bottom: 5px;
	left: 5px;
	width: calc(50% - 5px);
	border-radius: 999px;
	background: linear-gradient(135deg, #fff, var(--t-menta-2));
	transition: translate .45s var(--t-rebote);
}
.territorio .t-interruptor[data-vista="mapa"] .t-interruptor__luz { translate: 100% 0; }

@media (prefers-reduced-motion: reduce) {
	.territorio .map-marker-label.t-pin-entra,
	.territorio .map-marker-label.t-activo,
	.territorio .houzez-osm-cluster::before,
	.territorio .houzez-osm-cluster::after,
	.t-mapa-chip, .t-mapa-chip i, @media (min-width: 768px) { .territorio .mobile-map-switch.t-interruptor { display: none !important; } }
.territorio .mobile-map-switch.t-interruptor { animation: none !important; }
}
