{"id":34934,"date":"2026-05-14T17:36:37","date_gmt":"2026-05-14T16:36:37","guid":{"rendered":"https:\/\/plexoproperties.com\/busqueda-en-el-mapa-de-propiedades-de-segunda-mano\/"},"modified":"2026-05-15T16:44:21","modified_gmt":"2026-05-15T15:44:21","slug":"busqueda-en-el-mapa-de-propiedades-de-segunda-mano","status":"publish","type":"page","link":"https:\/\/plexoproperties.com\/es\/busqueda-en-el-mapa-de-propiedades-de-segunda-mano\/","title":{"rendered":"B\u00fasqueda en el mapa de propiedades de segunda mano"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"34934\" class=\"elementor elementor-34934 elementor-34916\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-79b442f e-con-full e-flex e-con e-parent\" data-id=\"79b442f\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b605366 elementor-widget elementor-widget-shortcode\" data-id=\"b605366\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"shortcode.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-shortcode\">\n<style>\n\/* =============================================================================\n * RESALES MAP SEARCH BETA v1.0.0\n * Location-based clustered map with Houzez styling\n * ============================================================================= *\/\n\n:root {\n    --prm-primary: #1a3c5e;\n    --prm-primary-hover: #254d75;\n    --prm-accent: #c9a961;\n    --prm-accent-hover: #d4b977;\n    --prm-text: #2e3e49;\n    --prm-text-muted: #6b7b8a;\n    --prm-border: #e0e4e8;\n    --prm-bg: #f5f7f9;\n    --prm-white: #ffffff;\n    --prm-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);\n    --prm-shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.12);\n    --prm-green: #28a745;\n    --prm-radius: 8px;\n}\n\n\/* Reset & Base *\/\n.prm-map-search * { box-sizing: border-box; }\n.prm-map-search {\n    font-family: \"Inter\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif;\n    display: flex;\n    flex-direction: column;\n    height: calc(100vh - 80px);\n    min-height: 600px;\n    background: var(--prm-bg);\n}\n\n\/* =============================================================================\n * LAYOUT - MAP & SIDEBAR\n * ============================================================================= *\/\n.prm-map-container {\n    display: flex;\n    flex: 1;\n    min-height: 450px;\n    position: relative;\n}\n\n\/* Map Area - 60% *\/\n.prm-map-area {\n    flex: 0 0 60%;\n    position: relative;\n    background: #e8e8e8;\n}\n\n#prm-property-map {\n    width: 100%;\n    height: 100%;\n    z-index: 1;\n}\n\n\/* Sidebar - 40% *\/\n.prm-sidebar {\n    flex: 0 0 40%;\n    display: flex;\n    flex-direction: column;\n    background: var(--prm-white);\n    border-left: 1px solid var(--prm-border);\n    overflow: hidden;\n}\n\n\/* =============================================================================\n * FILTERS PANEL\n * ============================================================================= *\/\n.prm-filters-panel {\n    padding: 20px;\n    border-bottom: 1px solid var(--prm-border);\n    background: var(--prm-white);\n}\n\n.prm-search-box {\n    position: relative;\n    margin-bottom: 15px;\n}\n\n.prm-search-box input {\n    width: 100%;\n    padding: 12px 15px 12px 42px;\n    border: 1px solid var(--prm-border);\n    border-radius: var(--prm-radius);\n    font-size: 14px;\n    transition: border-color 0.2s, box-shadow 0.2s;\n}\n\n.prm-search-box input:focus {\n    outline: none;\n    border-color: var(--prm-primary);\n    box-shadow: 0 0 0 3px rgba(26, 60, 94, 0.1);\n}\n\n.prm-search-box svg {\n    position: absolute;\n    left: 14px;\n    top: 50%;\n    transform: translateY(-50%);\n    width: 18px;\n    height: 18px;\n    fill: var(--prm-text-muted);\n}\n\n.prm-filters-grid {\n    display: grid;\n    grid-template-columns: repeat(4, 1fr);\n    gap: 10px;\n    margin-bottom: 15px;\n}\n\n.prm-filter-select {\n    padding: 10px 12px;\n    border: 1px solid var(--prm-border);\n    border-radius: var(--prm-radius);\n    font-size: 13px;\n    color: var(--prm-text);\n    background: var(--prm-white);\n    cursor: pointer;\n    transition: border-color 0.2s;\n}\n\n.prm-filter-select:focus {\n    outline: none;\n    border-color: var(--prm-primary);\n}\n\n.prm-filters-row {\n    display: grid;\n    grid-template-columns: repeat(4, 1fr);\n    gap: 10px;\n    margin-bottom: 15px;\n}\n\n.prm-filters-actions {\n    display: flex;\n    gap: 10px;\n}\n\n.prm-btn {\n    padding: 12px 24px;\n    border: none;\n    border-radius: var(--prm-radius);\n    font-size: 14px;\n    font-weight: 600;\n    cursor: pointer;\n    transition: all 0.2s;\n}\n\n.prm-btn-primary {\n    flex: 1;\n    background: var(--prm-primary);\n    color: var(--prm-white);\n}\n\n.prm-btn-primary:hover {\n    background: var(--prm-primary-hover);\n}\n\n.prm-btn-outline {\n    background: transparent;\n    border: 1px solid var(--prm-border);\n    color: var(--prm-text);\n}\n\n.prm-btn-outline:hover {\n    background: var(--prm-bg);\n}\n\n\/* =============================================================================\n * RESULTS SECTION\n * ============================================================================= *\/\n.prm-results-header {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 15px 20px;\n    border-bottom: 1px solid var(--prm-border);\n    background: var(--prm-bg);\n}\n\n.prm-results-count {\n    font-size: 15px;\n    font-weight: 600;\n    color: var(--prm-text);\n}\n\n.prm-sort-select {\n    padding: 8px 12px;\n    border: 1px solid var(--prm-border);\n    border-radius: var(--prm-radius);\n    font-size: 13px;\n    background: var(--prm-white);\n}\n\n.prm-listings {\n    flex: 1;\n    overflow-y: auto;\n    padding: 15px;\n}\n\n\/* =============================================================================\n * PROPERTY CARDS\n * ============================================================================= *\/\n.prm-property-card {\n    display: flex;\n    background: var(--prm-white);\n    border: 1px solid var(--prm-border);\n    border-radius: var(--prm-radius);\n    margin-bottom: 15px;\n    overflow: hidden;\n    cursor: pointer;\n    transition: all 0.2s;\n}\n\n.prm-property-card:hover {\n    box-shadow: var(--prm-shadow);\n    border-color: var(--prm-primary);\n}\n\n.prm-property-card.highlighted {\n    border-color: var(--prm-accent);\n    box-shadow: 0 0 0 2px var(--prm-accent);\n}\n\n.prm-card-image {\n    flex: 0 0 140px;\n    min-width: 140px;\n    height: 140px;\n    position: relative;\n    overflow: hidden;\n    background-color: #f0f0f0; \/* Shows a light gray box while loading *\/\n}\n\n.prm-card-image img {\n    width: 100%;\n    height: 100%;\n    object-fit: cover;\n    display: block;\n    opacity: 1 !important; \/* Forces visibility if a plugin is hiding them *\/\n    visibility: visible !important;\n}\n\n.prm-card-badge {\n    position: absolute;\n    top: 8px;\n    left: 8px;\n    padding: 4px 8px;\n    border-radius: 4px;\n    font-size: 10px;\n    font-weight: 700;\n    text-transform: uppercase;\n    background: var(--prm-green);\n    color: var(--prm-white);\n}\n\n.prm-card-content {\n    flex: 1;\n    padding: 12px 15px;\n    display: flex;\n    flex-direction: column;\n}\n\n.prm-card-price {\n    font-size: 18px;\n    font-weight: 700;\n    color: var(--prm-primary);\n    margin-bottom: 4px;\n}\n\n.prm-card-title {\n    font-size: 14px;\n    font-weight: 600;\n    color: var(--prm-text);\n    margin-bottom: 6px;\n    line-height: 1.3;\n}\n\n.prm-card-title a {\n    color: inherit;\n    text-decoration: none;\n}\n\n.prm-card-title a:hover {\n    color: var(--prm-accent);\n}\n\n.prm-card-location {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n    font-size: 12px;\n    color: var(--prm-text-muted);\n    margin-bottom: 8px;\n}\n\n.prm-card-location svg {\n    width: 12px;\n    height: 12px;\n    fill: var(--prm-text-muted);\n}\n\n.prm-card-meta {\n    display: flex;\n    gap: 12px;\n    margin-top: auto;\n}\n\n.prm-card-meta-item {\n    display: flex;\n    align-items: center;\n    gap: 4px;\n    font-size: 12px;\n    color: var(--prm-text-muted);\n}\n\n.prm-card-meta-item svg {\n    width: 14px;\n    height: 14px;\n    fill: var(--prm-text-muted);\n}\n\n\/* =============================================================================\n * CLUSTER MARKERS\n * ============================================================================= *\/\n.prm-cluster-marker {\n    background: transparent !important;\n    border: none !important;\n}\n\n.prm-cluster-icon {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    border-radius: 50%;\n    font-weight: 700;\n    color: var(--prm-white);\n    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.3);\n    transition: transform 0.2s;\n    cursor: pointer;\n}\n\n.prm-cluster-icon:hover {\n    transform: scale(1.1);\n}\n\n.prm-cluster-small {\n    width: 40px;\n    height: 40px;\n    font-size: 14px;\n    background: var(--prm-primary);\n}\n\n.prm-cluster-medium {\n    width: 50px;\n    height: 50px;\n    font-size: 15px;\n    background: #1565c0;\n}\n\n.prm-cluster-large {\n    width: 60px;\n    height: 60px;\n    font-size: 16px;\n    background: #0d47a1;\n}\n\n\/* City-level clusters (zoomed out) - distinctive gold\/accent color *\/\n.prm-cluster-city {\n    background: var(--prm-accent) !important;\n    border: 3px solid rgba(255,255,255,0.5);\n}\n\n.prm-cluster-city.prm-cluster-small {\n    width: 50px;\n    height: 50px;\n}\n\n.prm-cluster-city.prm-cluster-medium {\n    width: 60px;\n    height: 60px;\n}\n\n.prm-cluster-city.prm-cluster-large {\n    width: 70px;\n    height: 70px;\n    font-size: 18px;\n}\n\n\/* Area Popup *\/\n.prm-area-popup {\n    text-align: center;\n    min-width: 180px;\n}\n\n.prm-area-popup h4 {\n    margin: 0 0 10px 0;\n    font-size: 16px;\n    font-weight: 700;\n    color: var(--prm-primary);\n}\n\n.prm-area-popup .prm-area-count {\n    font-size: 24px;\n    font-weight: 700;\n    color: var(--prm-accent);\n    margin-bottom: 5px;\n}\n\n.prm-area-popup .prm-area-label {\n    font-size: 12px;\n    color: var(--prm-text-muted);\n    margin-bottom: 10px;\n}\n\n.prm-area-popup .prm-area-price {\n    font-size: 13px;\n    color: var(--prm-text);\n    margin-bottom: 12px;\n}\n\n.prm-area-popup .prm-area-btn {\n    display: inline-block;\n    padding: 8px 16px;\n    background: var(--prm-primary);\n    color: var(--prm-white);\n    border-radius: var(--prm-radius);\n    font-size: 13px;\n    font-weight: 600;\n    text-decoration: none;\n    cursor: pointer;\n    border: none;\n}\n\n.prm-area-popup .prm-area-btn:hover {\n    background: var(--prm-primary-hover);\n}\n\n\/* =============================================================================\n * MAP CONTROLS\n * ============================================================================= *\/\n.prm-map-controls {\n    position: absolute;\n    top: 15px;\n    left: 15px;\n    z-index: 1000;\n    display: flex;\n    gap: 8px;\n}\n\n.prm-map-btn {\n    background: var(--prm-white);\n    border: none;\n    padding: 10px 15px;\n    border-radius: var(--prm-radius);\n    font-size: 13px;\n    font-weight: 600;\n    color: var(--prm-text);\n    cursor: pointer;\n    box-shadow: var(--prm-shadow);\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    transition: all 0.2s;\n}\n\n.prm-map-btn:hover {\n    background: var(--prm-primary);\n    color: var(--prm-white);\n}\n\n.prm-map-btn svg {\n    width: 16px;\n    height: 16px;\n}\n\n\/* Legend *\/\n.prm-map-legend {\n    position: absolute;\n    bottom: 15px;\n    left: 15px;\n    z-index: 1000;\n    background: var(--prm-white);\n    padding: 12px 15px;\n    border-radius: var(--prm-radius);\n    box-shadow: var(--prm-shadow);\n}\n\n.prm-legend-title {\n    font-size: 11px;\n    font-weight: 600;\n    color: var(--prm-text-muted);\n    text-transform: uppercase;\n    margin-bottom: 8px;\n}\n\n.prm-legend-items {\n    display: flex;\n    gap: 15px;\n}\n\n.prm-legend-item {\n    display: flex;\n    align-items: center;\n    gap: 6px;\n    font-size: 12px;\n    color: var(--prm-text);\n}\n\n.prm-legend-dot {\n    width: 12px;\n    height: 12px;\n    border-radius: 50%;\n}\n\n.prm-legend-dot.small { background: var(--prm-primary); }\n.prm-legend-dot.medium { background: #1565c0; }\n.prm-legend-dot.large { background: #0d47a1; }\n\n\/* Selected Area Badge *\/\n.prm-selected-area {\n    position: absolute;\n    top: 15px;\n    left: 50%;\n    transform: translateX(-50%);\n    z-index: 1000;\n    background: var(--prm-accent);\n    color: var(--prm-white);\n    padding: 10px 20px;\n    border-radius: var(--prm-radius);\n    font-size: 14px;\n    font-weight: 600;\n    box-shadow: var(--prm-shadow-lg);\n    display: none;\n}\n\n.prm-selected-area.visible {\n    display: flex;\n    align-items: center;\n    gap: 10px;\n}\n\n.prm-selected-area button {\n    background: rgba(255,255,255,0.2);\n    border: none;\n    color: var(--prm-white);\n    width: 20px;\n    height: 20px;\n    border-radius: 50%;\n    cursor: pointer;\n    display: flex;\n    align-items: center;\n    justify-content: center;\n}\n\n.prm-selected-area button:hover {\n    background: rgba(255,255,255,0.3);\n}\n\n\/* =============================================================================\n * LOADING & NO RESULTS\n * ============================================================================= *\/\n.prm-loading {\n    position: absolute;\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    background: rgba(255, 255, 255, 0.9);\n    display: flex;\n    flex-direction: column;\n    align-items: center;\n    justify-content: center;\n    z-index: 2000;\n}\n\n.prm-loading.hidden {\n    display: none;\n}\n\n.prm-spinner {\n    width: 40px;\n    height: 40px;\n    border: 3px solid var(--prm-border);\n    border-top-color: var(--prm-primary);\n    border-radius: 50%;\n    animation: prm-spin 0.8s linear infinite;\n}\n\n@keyframes prm-spin {\n    to { transform: rotate(360deg); }\n}\n\n.prm-loading-text {\n    margin-top: 15px;\n    font-size: 14px;\n    color: var(--prm-text-muted);\n}\n\n.prm-no-results {\n    text-align: center;\n    padding: 60px 20px;\n}\n\n.prm-no-results svg {\n    width: 60px;\n    height: 60px;\n    fill: var(--prm-border);\n    margin-bottom: 15px;\n}\n\n.prm-no-results h3 {\n    font-size: 18px;\n    color: var(--prm-text);\n    margin: 0 0 8px 0;\n}\n\n.prm-no-results p {\n    font-size: 14px;\n    color: var(--prm-text-muted);\n    margin: 0;\n}\n\n\/* =============================================================================\n * BETA BADGE\n * ============================================================================= *\/\n.prm-beta-badge {\n    position: absolute;\n    top: 15px;\n    right: 15px;\n    z-index: 1000;\n    background: #ff6b35;\n    color: white;\n    padding: 6px 12px;\n    border-radius: var(--prm-radius);\n    font-size: 11px;\n    font-weight: 700;\n    text-transform: uppercase;\n    letter-spacing: 0.5px;\n}\n\n\/* =============================================================================\n * RESPONSIVE\n * ============================================================================= *\/\n@media (max-width: 1024px) {\n    .prm-map-container {\n        flex-direction: column;\n    }\n    \n    .prm-map-area {\n        flex: 0 0 400px;\n    }\n    \n    .prm-sidebar {\n        flex: 1;\n        border-left: none;\n        border-top: 1px solid var(--prm-border);\n    }\n    \n    .prm-filters-grid,\n    .prm-filters-row {\n        grid-template-columns: repeat(2, 1fr);\n    }\n}\n\n@media (max-width: 600px) {\n    .prm-filters-grid,\n    .prm-filters-row {\n        grid-template-columns: 1fr;\n    }\n    \n    .prm-property-card {\n        flex-direction: column;\n    }\n    \n    .prm-card-image {\n        flex: none;\n        height: 180px;\n    }\n}\n<\/style>\n\n<!-- Main Container -->\n<div class=\"prm-map-search\">\n    <div class=\"prm-map-container\">\n        <!-- Map Area -->\n        <div class=\"prm-map-area\">\n            <div id=\"prm-property-map\"><\/div>\n            \n            <!-- Beta Badge -->\n            <div class=\"prm-beta-badge\">BETA<\/div>\n            \n            <!-- Map Controls -->\n            <div class=\"prm-map-controls\">\n                <button type=\"button\" class=\"prm-map-btn\" onclick=\"prmMapSearch.zoomIn()\">\n                    <svg viewBox=\"0 0 24 24\"><path d=\"M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z\"\/><\/svg>\n                <\/button>\n                <button type=\"button\" class=\"prm-map-btn\" onclick=\"prmMapSearch.zoomOut()\">\n                    <svg viewBox=\"0 0 24 24\"><path d=\"M19 13H5v-2h14v2z\"\/><\/svg>\n                <\/button>\n            <\/div>\n            \n            <!-- Selected Area Badge -->\n            <div id=\"prm-selected-area\" class=\"prm-selected-area\">\n                <span id=\"prm-selected-area-text\"><\/span>\n                <button onclick=\"prmMapSearch.clearAreaFilter()\">&times;<\/button>\n            <\/div>\n            \n            <!-- Legend -->\n            <div class=\"prm-map-legend\">\n                <div class=\"prm-legend-title\">Properties by Area<\/div>\n                <div class=\"prm-legend-items\">\n                    <div class=\"prm-legend-item\">\n                        <span class=\"prm-legend-dot small\"><\/span>\n                        <span>1-10<\/span>\n                    <\/div>\n                    <div class=\"prm-legend-item\">\n                        <span class=\"prm-legend-dot medium\"><\/span>\n                        <span>11-50<\/span>\n                    <\/div>\n                    <div class=\"prm-legend-item\">\n                        <span class=\"prm-legend-dot large\"><\/span>\n                        <span>50+<\/span>\n                    <\/div>\n                <\/div>\n            <\/div>\n            \n            <!-- Loading Overlay -->\n            <div id=\"prm-loading\" class=\"prm-loading hidden\">\n                <div class=\"prm-spinner\"><\/div>\n                <div class=\"prm-loading-text\">Loading properties...<\/div>\n            <\/div>\n            \n            <!-- Sync Needed Message -->\n            <div id=\"prm-sync-needed\" class=\"prm-loading hidden\">\n                <div style=\"text-align:center;padding:40px;\">\n                    <svg width=\"60\" height=\"60\" viewBox=\"0 0 24 24\" fill=\"#dc3545\"><path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-2h2v2zm0-4h-2V7h2v6z\"\/><\/svg>\n                    <h3 style=\"margin:15px 0 10px;color:#333;\">Cache Empty<\/h3>\n                    <p style=\"color:#666;margin-bottom:20px;\">Please sync properties first from:<br><strong>Tools \u2192 Resales Map Cache<\/strong><\/p>\n                                    <\/div>\n            <\/div>\n        <\/div>\n        \n        <!-- Sidebar -->\n        <div class=\"prm-sidebar\">\n            <!-- Filters -->\n            <div class=\"prm-filters-panel\">\n                <div class=\"prm-search-box\">\n                    <svg viewBox=\"0 0 24 24\"><path d=\"M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z\"\/><\/svg>\n                    <input type=\"text\" id=\"prm-search-ref\" placeholder=\"Search by reference, location or keyword...\">\n                <\/div>\n                \n                <div class=\"prm-filters-grid\">\n                    <select id=\"prm-filter-location\" class=\"prm-filter-select\">\n                        <option value=\"\">All Areas<\/option>\n                                                    <option value=\"Algeciras\">Algeciras<\/option>\n                                                    <option value=\"Alhaurin Golf\">Alhaurin Golf<\/option>\n                                                    <option value=\"Alhaurin de la Torre\">Alhaurin de la Torre<\/option>\n                                                    <option value=\"Alhaurin el Grande\">Alhaurin el Grande<\/option>\n                                                    <option value=\"Alhaur\u00edn de la Torre\">Alhaur\u00edn de la Torre<\/option>\n                                                    <option value=\"Alhaur\u00edn el Grande\">Alhaur\u00edn el Grande<\/option>\n                                                    <option value=\"Aloha\">Aloha<\/option>\n                                                    <option value=\"Alora\">Alora<\/option>\n                                                    <option value=\"Altos de los Monteros\">Altos de los Monteros<\/option>\n                                                    <option value=\"Antequera\">Antequera<\/option>\n                                                    <option value=\"Arroyo de la Miel\">Arroyo de la Miel<\/option>\n                                                    <option value=\"Artola\">Artola<\/option>\n                                                    <option value=\"Atalaya\">Atalaya<\/option>\n                                                    <option value=\"Bah\u00eda de Marbella\">Bah\u00eda de Marbella<\/option>\n                                                    <option value=\"Bajondillo\">Bajondillo<\/option>\n                                                    <option value=\"Benahavis\">Benahavis<\/option>\n                                                    <option value=\"Benahav\u00eds\">Benahav\u00eds<\/option>\n                                                    <option value=\"Benalmadena\">Benalmadena<\/option>\n                                                    <option value=\"Benalmadena Costa\">Benalmadena Costa<\/option>\n                                                    <option value=\"Benalmadena Pueblo\">Benalmadena Pueblo<\/option>\n                                                    <option value=\"Benalm\u00e1dena\">Benalm\u00e1dena<\/option>\n                                                    <option value=\"Benamara\">Benamara<\/option>\n                                                    <option value=\"Benavista\">Benavista<\/option>\n                                                    <option value=\"Cabopino\">Cabopino<\/option>\n                                                    <option value=\"Calahonda\">Calahonda<\/option>\n                                                    <option value=\"Calanova Golf\">Calanova Golf<\/option>\n                                                    <option value=\"Cancelada\">Cancelada<\/option>\n                                                    <option value=\"Carib Playa\">Carib Playa<\/option>\n                                                    <option value=\"Cartama\">Cartama<\/option>\n                                                    <option value=\"Carvajal\">Carvajal<\/option>\n                                                    <option value=\"Casares\">Casares<\/option>\n                                                    <option value=\"Casares Playa\">Casares Playa<\/option>\n                                                    <option value=\"Casares Pueblo\">Casares Pueblo<\/option>\n                                                    <option value=\"Cerros del Aguila\">Cerros del Aguila<\/option>\n                                                    <option value=\"Coin\">Coin<\/option>\n                                                    <option value=\"Cortijo Blanco\">Cortijo Blanco<\/option>\n                                                    <option value=\"Costabella\">Costabella<\/option>\n                                                    <option value=\"Costalita\">Costalita<\/option>\n                                                    <option value=\"Co\u00edn\">Co\u00edn<\/option>\n                                                    <option value=\"C\u00e1rtama\">C\u00e1rtama<\/option>\n                                                    <option value=\"Diana Park\">Diana Park<\/option>\n                                                    <option value=\"Do\u00f1a Julia\">Do\u00f1a Julia<\/option>\n                                                    <option value=\"El Campanario\">El Campanario<\/option>\n                                                    <option value=\"El Faro\">El Faro<\/option>\n                                                    <option value=\"El Madro\u00f1al\">El Madro\u00f1al<\/option>\n                                                    <option value=\"El Padron\">El Padron<\/option>\n                                                    <option value=\"El Paraiso\">El Paraiso<\/option>\n                                                    <option value=\"El Rosario\">El Rosario<\/option>\n                                                    <option value=\"Elviria\">Elviria<\/option>\n                                                    <option value=\"Estacion de Cartama\">Estacion de Cartama<\/option>\n                                                    <option value=\"Estepona\">Estepona<\/option>\n                                                    <option value=\"Fuengirola\">Fuengirola<\/option>\n                                                    <option value=\"Guadalmina Alta\">Guadalmina Alta<\/option>\n                                                    <option value=\"Guadalmina Baja\">Guadalmina Baja<\/option>\n                                                    <option value=\"Guadiaro\">Guadiaro<\/option>\n                                                    <option value=\"Guaro\">Guaro<\/option>\n                                                    <option value=\"Hacienda Las Chapas\">Hacienda Las Chapas<\/option>\n                                                    <option value=\"Hacienda del Sol\">Hacienda del Sol<\/option>\n                                                    <option value=\"Higueron\">Higueron<\/option>\n                                                    <option value=\"Higuer\u00f3n\">Higuer\u00f3n<\/option>\n                                                    <option value=\"Istan\">Istan<\/option>\n                                                    <option value=\"Ist\u00e1n\">Ist\u00e1n<\/option>\n                                                    <option value=\"La Alcaidesa\">La Alcaidesa<\/option>\n                                                    <option value=\"La Cala\">La Cala<\/option>\n                                                    <option value=\"La Cala Golf\">La Cala Golf<\/option>\n                                                    <option value=\"La Cala Hills\">La Cala Hills<\/option>\n                                                    <option value=\"La Cala de Mijas\">La Cala de Mijas<\/option>\n                                                    <option value=\"La Carihuela\">La Carihuela<\/option>\n                                                    <option value=\"La Duquesa\">La Duquesa<\/option>\n                                                    <option value=\"La L\u00ednea\">La L\u00ednea<\/option>\n                                                    <option value=\"La Quinta\">La Quinta<\/option>\n                                                    <option value=\"La Zagaleta\">La Zagaleta<\/option>\n                                                    <option value=\"Las Brisas\">Las Brisas<\/option>\n                                                    <option value=\"Las Chapas\">Las Chapas<\/option>\n                                                    <option value=\"Las Lagunas\">Las Lagunas<\/option>\n                                                    <option value=\"Lauro Golf\">Lauro Golf<\/option>\n                                                    <option value=\"Los Arqueros\">Los Arqueros<\/option>\n                                                    <option value=\"Los Barrios\">Los Barrios<\/option>\n                                                    <option value=\"Los Boliches\">Los Boliches<\/option>\n                                                    <option value=\"Los Flamingos\">Los Flamingos<\/option>\n                                                    <option value=\"Los Monteros\">Los Monteros<\/option>\n                                                    <option value=\"Los Naranjos\">Los Naranjos<\/option>\n                                                    <option value=\"Los Pacos\">Los Pacos<\/option>\n                                                    <option value=\"Manilva\">Manilva<\/option>\n                                                    <option value=\"Marbella\">Marbella<\/option>\n                                                    <option value=\"Marbesa\">Marbesa<\/option>\n                                                    <option value=\"Mijas\">Mijas<\/option>\n                                                    <option value=\"Mijas Costa\">Mijas Costa<\/option>\n                                                    <option value=\"Mijas Golf\">Mijas Golf<\/option>\n                                                    <option value=\"Monda\">Monda<\/option>\n                                                    <option value=\"Monte Halcones\">Monte Halcones<\/option>\n                                                    <option value=\"Montemar\">Montemar<\/option>\n                                                    <option value=\"M\u00e1laga\">M\u00e1laga<\/option>\n                                                    <option value=\"M\u00e1laga Centro\">M\u00e1laga Centro<\/option>\n                                                    <option value=\"M\u00e1laga Este\">M\u00e1laga Este<\/option>\n                                                    <option value=\"Nag\u00fceles\">Nag\u00fceles<\/option>\n                                                    <option value=\"New Golden Mile\">New Golden Mile<\/option>\n                                                    <option value=\"Nueva Andalucia\">Nueva Andalucia<\/option>\n                                                    <option value=\"Nueva Andaluc\u00eda\">Nueva Andaluc\u00eda<\/option>\n                                                    <option value=\"Ojen\">Ojen<\/option>\n                                                    <option value=\"Oj\u00e9n\">Oj\u00e9n<\/option>\n                                                    <option value=\"Pizarra\">Pizarra<\/option>\n                                                    <option value=\"Playamar\">Playamar<\/option>\n                                                    <option value=\"Pueblo Nuevo de Guadiaro\">Pueblo Nuevo de Guadiaro<\/option>\n                                                    <option value=\"Puerto Banus\">Puerto Banus<\/option>\n                                                    <option value=\"Puerto Ban\u00fas\">Puerto Ban\u00fas<\/option>\n                                                    <option value=\"Punta Chullera\">Punta Chullera<\/option>\n                                                    <option value=\"Reserva de Marbella\">Reserva de Marbella<\/option>\n                                                    <option value=\"Reserva del Higueron\">Reserva del Higueron<\/option>\n                                                    <option value=\"Riviera del Sol\">Riviera del Sol<\/option>\n                                                    <option value=\"Ronda\">Ronda<\/option>\n                                                    <option value=\"R\u00edo Real\">R\u00edo Real<\/option>\n                                                    <option value=\"San Enrique\">San Enrique<\/option>\n                                                    <option value=\"San Luis de Sabinillas\">San Luis de Sabinillas<\/option>\n                                                    <option value=\"San Mart\u00edn de Tesorillo\">San Mart\u00edn de Tesorillo<\/option>\n                                                    <option value=\"San Pedro de Alcantara\">San Pedro de Alcantara<\/option>\n                                                    <option value=\"San Pedro de Alc\u00e1ntara\">San Pedro de Alc\u00e1ntara<\/option>\n                                                    <option value=\"San Roque\">San Roque<\/option>\n                                                    <option value=\"San Roque Club\">San Roque Club<\/option>\n                                                    <option value=\"Santa Clara\">Santa Clara<\/option>\n                                                    <option value=\"Seghers\">Seghers<\/option>\n                                                    <option value=\"Selwo\">Selwo<\/option>\n                                                    <option value=\"Sierra Blanca\">Sierra Blanca<\/option>\n                                                    <option value=\"Sierrezuela\">Sierrezuela<\/option>\n                                                    <option value=\"Sotogrande\">Sotogrande<\/option>\n                                                    <option value=\"Sotogrande Alto\">Sotogrande Alto<\/option>\n                                                    <option value=\"Sotogrande Costa\">Sotogrande Costa<\/option>\n                                                    <option value=\"Sotogrande Marina\">Sotogrande Marina<\/option>\n                                                    <option value=\"Sotogrande Playa\">Sotogrande Playa<\/option>\n                                                    <option value=\"Sotogrande Puerto\">Sotogrande Puerto<\/option>\n                                                    <option value=\"The Golden Mile\">The Golden Mile<\/option>\n                                                    <option value=\"Tolox\">Tolox<\/option>\n                                                    <option value=\"Torre Real\">Torre Real<\/option>\n                                                    <option value=\"Torreblanca\">Torreblanca<\/option>\n                                                    <option value=\"Torreguadiaro\">Torreguadiaro<\/option>\n                                                    <option value=\"Torremolinos\">Torremolinos<\/option>\n                                                    <option value=\"Torremolinos Centro\">Torremolinos Centro<\/option>\n                                                    <option value=\"Torremuelle\">Torremuelle<\/option>\n                                                    <option value=\"Torrequebrada\">Torrequebrada<\/option>\n                                                    <option value=\"Valle Romano\">Valle Romano<\/option>\n                                                    <option value=\"default\">default<\/option>\n                                                    <option value=\"\u00c1lora\">\u00c1lora<\/option>\n                                            <\/select>\n                    \n                    <select id=\"prm-filter-type\" class=\"prm-filter-select\">\n                        <option value=\"\">All Types<\/option>\n                        <option value=\"Apartment\">Apartment<\/option>\n                        <option value=\"Penthouse\">Penthouse<\/option>\n                        <option value=\"Villa\">Villa<\/option>\n                        <option value=\"Townhouse\">Townhouse<\/option>\n                        <option value=\"Land\">Land<\/option>\n                    <\/select>\n                    \n                    <select id=\"prm-filter-beds\" class=\"prm-filter-select\">\n                        <option value=\"\">Bedrooms<\/option>\n                        <option value=\"1\">1+<\/option>\n                        <option value=\"2\">2+<\/option>\n                        <option value=\"3\">3+<\/option>\n                        <option value=\"4\">4+<\/option>\n                        <option value=\"5\">5+<\/option>\n                    <\/select>\n                    \n                    <select id=\"prm-filter-baths\" class=\"prm-filter-select\">\n                        <option value=\"\">Bathrooms<\/option>\n                        <option value=\"1\">1+<\/option>\n                        <option value=\"2\">2+<\/option>\n                        <option value=\"3\">3+<\/option>\n                        <option value=\"4\">4+<\/option>\n                    <\/select>\n                <\/div>\n                \n                <div class=\"prm-filters-row\">\n                    <select id=\"prm-filter-min-price\" class=\"prm-filter-select\">\n                        <option value=\"\">Min Price<\/option>\n                        <option value=\"100000\">\u20ac100,000<\/option>\n                        <option value=\"200000\">\u20ac200,000<\/option>\n                        <option value=\"300000\">\u20ac300,000<\/option>\n                        <option value=\"500000\">\u20ac500,000<\/option>\n                        <option value=\"750000\">\u20ac750,000<\/option>\n                        <option value=\"1000000\">\u20ac1,000,000<\/option>\n                        <option value=\"2000000\">\u20ac2,000,000<\/option>\n                        <option value=\"5000000\">\u20ac5,000,000<\/option>\n                    <\/select>\n                    \n                    <select id=\"prm-filter-max-price\" class=\"prm-filter-select\">\n                        <option value=\"\">Max Price<\/option>\n                        <option value=\"200000\">\u20ac200,000<\/option>\n                        <option value=\"300000\">\u20ac300,000<\/option>\n                        <option value=\"500000\">\u20ac500,000<\/option>\n                        <option value=\"750000\">\u20ac750,000<\/option>\n                        <option value=\"1000000\">\u20ac1,000,000<\/option>\n                        <option value=\"2000000\">\u20ac2,000,000<\/option>\n                        <option value=\"5000000\">\u20ac5,000,000<\/option>\n                        <option value=\"10000000\">\u20ac10,000,000<\/option>\n                    <\/select>\n                    \n                    <select id=\"prm-filter-status\" class=\"prm-filter-select\">\n                        <option value=\"\">All Status<\/option>\n                        <option value=\"Available\">Available<\/option>\n                        <option value=\"Under Offer\">Under Offer<\/option>\n                        <option value=\"Sold\">Sold<\/option>\n                    <\/select>\n                    \n                    <div><\/div>\n                <\/div>\n                \n                <div class=\"prm-filters-actions\">\n                    <button type=\"button\" class=\"prm-btn prm-btn-primary\" onclick=\"prmMapSearch.search()\">\n                        Search\n                    <\/button>\n                    <button type=\"button\" class=\"prm-btn prm-btn-outline\" onclick=\"prmMapSearch.clearFilters()\">\n                        Clear\n                    <\/button>\n                <\/div>\n            <\/div>\n            \n            <!-- Results Header -->\n            <div class=\"prm-results-header\">\n                <span id=\"prm-results-count\" class=\"prm-results-count\">0 Results Found<\/span>\n                <select id=\"prm-sort\" class=\"prm-sort-select\" onchange=\"prmMapSearch.search()\">\n                    <option value=\"date_desc\">Date - New to Old<\/option>\n                    <option value=\"date_asc\">Date - Old to New<\/option>\n                    <option value=\"price_asc\">Price - Low to High<\/option>\n                    <option value=\"price_desc\">Price - High to Low<\/option>\n                <\/select>\n            <\/div>\n            \n            <!-- Listings -->\n            <div id=\"prm-listings\" class=\"prm-listings\">\n                <!-- Property cards will be inserted here -->\n            <\/div>\n        <\/div>\n    <\/div>\n<\/div>\n\n<!-- Leaflet CSS & JS -->\n<link rel=\"stylesheet\" href=\"https:\/\/unpkg.com\/leaflet@1.9.4\/dist\/leaflet.css\" \/>\n<script src=\"https:\/\/unpkg.com\/leaflet@1.9.4\/dist\/leaflet.js\"><\/script>\n\n<script>\n\/**\n * Resales Map Search Beta - Location Clusters\n *\/\nconst prmMapSearch = {\n    map: null,\n    markers: null,\n    clusters: [],\n    properties: [],\n    selectedArea: null,\n    initialBoundsFit: false,\n    ajaxUrl: 'https:\/\/plexoproperties.com\/wp-admin\/admin-ajax.php',\n    nonce: '',\n    nonceReady: false,\n    propertyBase: 'resales-property',\n    filterId: '0',\n    \n    \/**\n     * Initialize the map search\n     *\/\n    init: function() {\n        \/\/ Initialize map\n        this.map = L.map('prm-property-map', {\n            center: [36.5, -4.9],\n            zoom: 10,\n            zoomControl: false\n        });\n        \n        \/\/ Add tile layer\n        L.tileLayer('https:\/\/{s}.tile.openstreetmap.org\/{z}\/{x}\/{y}.png', {\n            attribution: '\u00a9 OpenStreetMap contributors',\n            maxZoom: 18\n        }).addTo(this.map);\n        \n        \/\/ Create marker layer group\n        this.markers = L.layerGroup().addTo(this.map);\n        \n        \/\/ Get nonce and load initial data\n        this.fetchNonce()\n            .then(() => this.search())\n            .catch(error => {\n                console.error('Init failed:', error);\n                this.showLoading(false);\n            });\n        \n        \/\/ Bind events\n        this.bindEvents();\n    },\n    \n    \/**\n     * Fetch fresh nonce\n     *\/\n    fetchNonce: function() {\n        return fetch(this.ajaxUrl, {\n            method: 'POST',\n            headers: { 'Content-Type': 'application\/x-www-form-urlencoded' },\n            body: 'action=plexo_resales_map_beta_get_nonce'\n        })\n        .then(response => response.json())\n        .then(data => {\n            if (data.success) {\n                this.nonce = data.data.nonce;\n                this.nonceReady = true;\n            } else {\n                throw new Error('Failed to get nonce');\n            }\n        });\n    },\n    \n    \/**\n     * Bind events\n     *\/\n    bindEvents: function() {\n        document.getElementById('prm-search-ref').addEventListener('keypress', (e) => {\n            if (e.key === 'Enter') {\n                e.preventDefault();\n                this.search();\n            }\n        });\n        \n        \/\/ Re-render clusters when zoom changes (for two-tier clustering)\n        this.map.on('zoomend', () => {\n            if (this.clusters && this.clusters.length > 0) {\n                this.updateMap();\n            }\n        });\n    },\n    \n    \/**\n     * Get current filters\n     *\/\n    getFilters: function() {\n        return {\n            search: document.getElementById('prm-search-ref').value,\n            location: this.selectedArea || document.getElementById('prm-filter-location').value,\n            type: document.getElementById('prm-filter-type').value,\n            beds: document.getElementById('prm-filter-beds').value,\n            baths: document.getElementById('prm-filter-baths').value,\n            min_price: document.getElementById('prm-filter-min-price').value,\n            max_price: document.getElementById('prm-filter-max-price').value,\n            status: document.getElementById('prm-filter-status').value,\n            sort: document.getElementById('prm-sort').value,\n            features: {\n                pool: false,\n                garden: false,\n                garage: false\n            }\n        };\n    },\n    \n    \/**\n     * Search properties\n     *\/\n    search: function() {\n        if (!this.nonceReady) {\n            this.showLoading(true);\n            this.fetchNonce().then(() => this.doSearch());\n            return;\n        }\n        this.doSearch();\n    },\n    \n    \/**\n     * Execute search\n     *\/\n    doSearch: function() {\n        this.showLoading(true);\n        \n        const filters = this.getFilters();\n        \n        fetch(this.ajaxUrl, {\n            method: 'POST',\n            headers: { 'Content-Type': 'application\/x-www-form-urlencoded' },\n            body: new URLSearchParams({\n                action: 'plexo_resales_map_beta_search',\n                nonce: this.nonce,\n                filters: JSON.stringify(filters),\n                property_base: this.propertyBase,\n                filter_id: this.filterId\n            })\n        })\n        .then(response => response.json())\n        .then(data => {\n            if (data.success) {\n                this.clusters = data.data.clusters;\n                this.properties = data.data.properties;\n                this.updateMap();\n                this.updateListings();\n                this.updateResultsCount(data.data.total);\n            } else {\n                console.error('Search failed:', data.data?.message);\n                if (data.data?.need_sync) {\n                    document.getElementById('prm-sync-needed').classList.remove('hidden');\n                } else {\n                    this.showNoResults();\n                }\n            }\n            this.showLoading(false);\n        })\n        .catch(error => {\n            console.error('Search error:', error);\n            this.showLoading(false);\n            this.showNoResults();\n        });\n    },\n    \n    \/**\n     * Update map with zoom-sensitive two-tier clustering\n     * - Zoomed out (< 12): Shows only city-level clusters with aggregated counts\n     * - Zoomed in (>= 12): Shows individual area clusters\n     *\/\n    updateMap: function() {\n        this.markers.clearLayers();\n        \n        const currentZoom = this.map.getZoom();\n        const bounds = [];\n        \n        \/\/ Filter out clusters with zero count (important when filtering)\n        const activeClusters = this.clusters.filter(c => c.count > 0);\n        \n        \/\/ Determine which clusters to display based on zoom level\n        let displayClusters = [];\n        \n        if (currentZoom < 12) {\n            \/\/ GOLD MODE: Aggregate into city-level clusters\n            const cityTotals = {};\n            \n            activeClusters.forEach(cluster => {\n                \/\/ Determine the key: if it's a city, use its name; if it's an area, use parent_city\n                let cityKey = '';\n                \n                if (cluster.is_city === 1) {\n                    cityKey = cluster.name;\n                } else if (cluster.parent_city && cluster.parent_city !== '') {\n                    cityKey = cluster.parent_city;\n                } else {\n                    \/\/ No parent city - show as standalone\n                    cityKey = cluster.name;\n                }\n                \n                if (!cityKey) return;\n                \n                if (!cityTotals[cityKey]) {\n                    \/\/ Find the city's coordinates from clusters (if it exists as a city)\n                    const cityCluster = this.clusters.find(c => c.name === cityKey && c.is_city === 1);\n                    \n                    cityTotals[cityKey] = {\n                        name: cityKey,\n                        count: 0,\n                        lat: cityCluster ? cityCluster.lat : cluster.lat,\n                        lng: cityCluster ? cityCluster.lng : cluster.lng,\n                        min_price: Infinity,\n                        max_price: 0,\n                        avg_price: 0,\n                        total_price: 0,\n                        is_city: 1,\n                        parent_city: '',\n                        forceCityStyle: true \/\/ Flag for Gold color\n                    };\n                }\n                \n                cityTotals[cityKey].count += cluster.count;\n                cityTotals[cityKey].min_price = Math.min(cityTotals[cityKey].min_price, cluster.min_price || Infinity);\n                cityTotals[cityKey].max_price = Math.max(cityTotals[cityKey].max_price, cluster.max_price || 0);\n                cityTotals[cityKey].total_price += (cluster.avg_price || 0) * cluster.count;\n            });\n            \n            \/\/ Calculate average prices and convert to array (only non-zero counts)\n            displayClusters = Object.values(cityTotals)\n                .filter(city => city.count > 0)\n                .map(city => {\n                    city.avg_price = city.count > 0 ? city.total_price \/ city.count : 0;\n                    if (city.min_price === Infinity) city.min_price = 0;\n                    return city;\n                });\n            \n        } else {\n            \/\/ BLUE MODE: Show all individual area clusters (but not cities that have children)\n            const citiesWithChildren = new Set();\n            activeClusters.forEach(c => {\n                if (c.parent_city && c.parent_city !== '') {\n                    citiesWithChildren.add(c.parent_city);\n                }\n            });\n            \n            displayClusters = activeClusters.filter(cluster => {\n                \/\/ Hide city markers if they have child areas visible\n                if (cluster.is_city === 1 && citiesWithChildren.has(cluster.name)) {\n                    return false;\n                }\n                return true;\n            });\n        }\n        \n        \/\/ Create markers for display clusters\n        displayClusters.forEach(cluster => {\n            if (cluster.lat && cluster.lng && cluster.count > 0) {\n                \/\/ Decide if it should be gold (city aggregate) or blue (specific area)\n                const isGold = (currentZoom < 12) || cluster.forceCityStyle;\n                const marker = this.createClusterMarker(cluster, isGold);\n                this.markers.addLayer(marker);\n                bounds.push([cluster.lat, cluster.lng]);\n            }\n        });\n        \n        \/\/ Fit map to markers on initial load only\n        if (bounds.length > 0 && !this.initialBoundsFit) {\n            this.map.fitBounds(bounds, { padding: [50, 50], maxZoom: 11 });\n            this.initialBoundsFit = true;\n        }\n    },\n    \n    \/**\n     * Create cluster marker\n     *\/\n    createClusterMarker: function(cluster, isCityLevel) {\n        \/\/ Determine size based on count - larger for city-level\n        let size = 'small';\n        let iconSize = 40;\n        \n        if (isCityLevel) {\n            \/\/ City-level markers are bigger\n            if (cluster.count > 500) {\n                size = 'large';\n                iconSize = 70;\n            } else if (cluster.count > 100) {\n                size = 'medium';\n                iconSize = 60;\n            } else {\n                size = 'small';\n                iconSize = 50;\n            }\n        } else {\n            \/\/ Area-level markers\n            if (cluster.count > 50) {\n                size = 'large';\n                iconSize = 60;\n            } else if (cluster.count > 10) {\n                size = 'medium';\n                iconSize = 50;\n            }\n        }\n        \n        const icon = L.divIcon({\n            html: `<div class=\"prm-cluster-icon prm-cluster-${size}${isCityLevel ? ' prm-cluster-city' : ''}\">${cluster.count}<\/div>`,\n            className: 'prm-cluster-marker',\n            iconSize: [iconSize, iconSize],\n            iconAnchor: [iconSize\/2, iconSize\/2]\n        });\n        \n        const marker = L.marker([cluster.lat, cluster.lng], { icon: icon });\n        \n        \/\/ Format price range\n        const minPrice = this.formatPrice(cluster.min_price);\n        const maxPrice = this.formatPrice(cluster.max_price);\n        const priceRange = minPrice === maxPrice ? minPrice : `${minPrice} - ${maxPrice}`;\n        \n        \/\/ Popup content - different text for city vs area\n        const levelLabel = isCityLevel ? 'properties in this city' : 'properties available';\n        const buttonText = isCityLevel ? 'Zoom In' : 'View Properties';\n        const buttonAction = isCityLevel \n            ? `prmMapSearch.zoomToCity('${cluster.name.replace(\/'\/g, \"\\\\'\")}', ${cluster.lat}, ${cluster.lng})`\n            : `prmMapSearch.filterByArea('${cluster.name.replace(\/'\/g, \"\\\\'\")}')`;\n        \n        const popupContent = `\n            <div class=\"prm-area-popup\">\n                <h4>${cluster.name}<\/h4>\n                <div class=\"prm-area-count\">${cluster.count}<\/div>\n                <div class=\"prm-area-label\">${levelLabel}<\/div>\n                <div class=\"prm-area-price\">${priceRange}<\/div>\n                <button class=\"prm-area-btn\" onclick=\"${buttonAction}\">\n                    ${buttonText}\n                <\/button>\n            <\/div>\n        `;\n        \n        marker.bindPopup(popupContent, {\n            maxWidth: 250,\n            className: 'prm-popup-container'\n        });\n        \n        return marker;\n    },\n    \n    \/**\n     * Zoom to city (for city-level clusters)\n     *\/\n    zoomToCity: function(cityName, lat, lng) {\n        this.map.closePopup();\n        this.map.setView([lat, lng], 13);\n    },\n    \n    \/**\n     * Filter by area\n     *\/\n    filterByArea: function(areaName) {\n        this.selectedArea = areaName;\n        document.getElementById('prm-filter-location').value = '';\n        \n        \/\/ Show selected area badge\n        const badge = document.getElementById('prm-selected-area');\n        const text = document.getElementById('prm-selected-area-text');\n        text.textContent = `Showing: ${areaName}`;\n        badge.classList.add('visible');\n        \n        \/\/ Close popup\n        this.map.closePopup();\n        \n        \/\/ Search with area filter\n        this.search();\n    },\n    \n    \/**\n     * Clear area filter\n     *\/\n    clearAreaFilter: function() {\n        this.selectedArea = null;\n        document.getElementById('prm-selected-area').classList.remove('visible');\n        this.search();\n    },\n    \n    \/**\n     * Format price\n     *\/\n    formatPrice: function(price) {\n        if (!price || price <= 0) return 'POA';\n        return '\u20ac' + price.toLocaleString('es-ES');\n    },\n    \n    \/**\n     * Update listings sidebar\n     *\/\n    updateListings: function() {\n        const container = document.getElementById('prm-listings');\n        container.innerHTML = '';\n        \n        if (this.properties.length === 0) {\n            this.showNoResults();\n            return;\n        }\n        \n        this.properties.forEach((property, index) => {\n            const card = this.createPropertyCard(property, index);\n            container.appendChild(card);\n        });\n        \n        \/\/ Trigger resize\/scroll to force lazy-loaded images to appear\n        \/\/ (fixes conflict with WP Rocket, Autoptimize, etc.)\n        setTimeout(() => {\n            window.dispatchEvent(new Event('resize'));\n            window.dispatchEvent(new Event('scroll'));\n            \/\/ Also scroll the sidebar container slightly to trigger intersection observer\n            container.scrollTop = 1;\n            container.scrollTop = 0;\n        }, 100);\n    },\n    \n    \/**\n     * Create property card\n     *\/\n    createPropertyCard: function(property, index) {\n        const card = document.createElement('div');\n        card.className = 'prm-property-card';\n        card.dataset.ref = property.ref;\n        \n        const bedsIcon = '<svg viewBox=\"0 0 24 24\"><path d=\"M7 13c1.66 0 3-1.34 3-3S8.66 7 7 7s-3 1.34-3 3 1.34 3 3 3zm12-6h-8v7H3V5H1v15h2v-3h18v3h2v-9c0-2.21-1.79-4-4-4z\"\/><\/svg>';\n        const bathsIcon = '<svg viewBox=\"0 0 24 24\"><path d=\"M7 7c0-1.1.9-2 2-2s2 .9 2 2-.9 2-2 2-2-.9-2-2zm13 13H4c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2zM20 6c0-.55-.45-1-1-1h-2v2h1v7H6V7h1V5H5c-.55 0-1 .45-1 1v10c0 .55.45 1 1 1h14c.55 0 1-.45 1-1V6z\"\/><\/svg>';\n        const areaIcon = '<svg viewBox=\"0 0 24 24\"><path d=\"M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zM9 17H7v-7h2v7zm4 0h-2V7h2v10zm4 0h-2v-4h2v4z\"\/><\/svg>';\n        const locationIcon = '<svg viewBox=\"0 0 24 24\"><path d=\"M12 2C8.13 2 5 5.13 5 9c0 5.25 7 13 7 13s7-7.75 7-13c0-3.87-3.13-7-7-7zm0 9.5c-1.38 0-2.5-1.12-2.5-2.5s1.12-2.5 2.5-2.5 2.5 1.12 2.5 2.5-1.12 2.5-2.5 2.5z\"\/><\/svg>';\n        \n        const imageUrl = property.image || 'data:image\/svg+xml,%3Csvg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 24 24\"%3E%3Cpath fill=\"%23ddd\" d=\"M21 19V5c0-1.1-.9-2-2-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2zM8.5 13.5l2.5 3.01L14.5 12l4.5 6H5l3.5-4.5z\"\/%3E%3C\/svg%3E';\n        \n        card.innerHTML = `\n            <div class=\"prm-card-image\">\n                <img loading=\"eager\" decoding=\"async\" src=\"${imageUrl}\" alt=\"${property.title}\">\n                ${property.status ? `<span class=\"prm-card-badge\">${property.status}<\/span>` : ''}\n            <\/div>\n            <div class=\"prm-card-content\">\n                <div class=\"prm-card-price\">${property.price}<\/div>\n                <h3 class=\"prm-card-title\">\n                    <a href=\"${property.url}\" target=\"_blank\">${property.title || 'Property'}<\/a>\n                <\/h3>\n                ${property.location ? `<div class=\"prm-card-location\">${locationIcon} ${property.location}<\/div>` : ''}\n                <div class=\"prm-card-meta\">\n                    ${property.beds ? `<span class=\"prm-card-meta-item\">${bedsIcon} ${property.beds}<\/span>` : ''}\n                    ${property.baths ? `<span class=\"prm-card-meta-item\">${bathsIcon} ${property.baths}<\/span>` : ''}\n                    ${property.area ? `<span class=\"prm-card-meta-item\">${areaIcon} ${property.area} m\u00b2<\/span>` : ''}\n                <\/div>\n            <\/div>\n        `;\n        \n        return card;\n    },\n    \n    \/**\n     * Show no results\n     *\/\n    showNoResults: function() {\n        const container = document.getElementById('prm-listings');\n        container.innerHTML = `\n            <div class=\"prm-no-results\">\n                <svg viewBox=\"0 0 24 24\"><path d=\"M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-2 15l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z\"\/><\/svg>\n                <h3>No properties found<\/h3>\n                <p>Try adjusting your search filters<\/p>\n            <\/div>\n        `;\n    },\n    \n    \/**\n     * Update results count\n     *\/\n    updateResultsCount: function(total) {\n        document.getElementById('prm-results-count').textContent = total + ' Results Found';\n    },\n    \n    \/**\n     * Clear all filters\n     *\/\n    clearFilters: function() {\n        document.getElementById('prm-search-ref').value = '';\n        document.getElementById('prm-filter-location').value = '';\n        document.getElementById('prm-filter-type').value = '';\n        document.getElementById('prm-filter-beds').value = '';\n        document.getElementById('prm-filter-baths').value = '';\n        document.getElementById('prm-filter-min-price').value = '';\n        document.getElementById('prm-filter-max-price').value = '';\n        document.getElementById('prm-filter-status').value = '';\n        document.getElementById('prm-sort').value = 'date_desc';\n        \n        this.selectedArea = null;\n        document.getElementById('prm-selected-area').classList.remove('visible');\n        \n        this.search();\n    },\n    \n    \/**\n     * Show\/hide loading\n     *\/\n    showLoading: function(show) {\n        const loading = document.getElementById('prm-loading');\n        if (show) {\n            loading.classList.remove('hidden');\n        } else {\n            loading.classList.add('hidden');\n        }\n    },\n    \n    \/**\n     * Zoom controls\n     *\/\n    zoomIn: function() {\n        this.map.zoomIn();\n    },\n    \n    zoomOut: function() {\n        this.map.zoomOut();\n    }\n};\n\n\/\/ Initialize on DOM ready\ndocument.addEventListener('DOMContentLoaded', function() {\n    prmMapSearch.init();\n});\n<\/script>\n<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-34934","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/plexoproperties.com\/es\/wp-json\/wp\/v2\/pages\/34934","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/plexoproperties.com\/es\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/plexoproperties.com\/es\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/plexoproperties.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/plexoproperties.com\/es\/wp-json\/wp\/v2\/comments?post=34934"}],"version-history":[{"count":1,"href":"https:\/\/plexoproperties.com\/es\/wp-json\/wp\/v2\/pages\/34934\/revisions"}],"predecessor-version":[{"id":34935,"href":"https:\/\/plexoproperties.com\/es\/wp-json\/wp\/v2\/pages\/34934\/revisions\/34935"}],"wp:attachment":[{"href":"https:\/\/plexoproperties.com\/es\/wp-json\/wp\/v2\/media?parent=34934"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}