/* Search results page — unique styles */
.search-results-page .container { max-width: 1600px; }
.results-layout { display: flex; gap: 16px; align-items: flex-start; }
.results-map-column { width: 50%; flex-shrink: 0; position: sticky; top: 20px; height: calc(100vh - 40px); border-radius: 8px; box-shadow: 0 2px 4px var(--shadow); overflow: hidden; border: 1px solid var(--color-outline-variant); }
.results-list { flex: 1; min-width: 0; padding-bottom: 20px; }
.cards-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.results-meta { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; font-size: 14px; color: var(--color-on-surface-variant); }
.results-meta-actions { display: flex; gap: 12px; align-items: center; }
.results-meta-actions a, .results-meta-actions span { cursor: pointer; font-size: 13px; }
.listing-card { background: var(--color-surface); padding: 14px; border-radius: 8px; box-shadow: 0 2px 4px var(--shadow); display: flex; flex-direction: column; gap: 8px; cursor: pointer; transition: box-shadow 0.15s, transform 0.1s; }
.listing-card:hover { box-shadow: 0 4px 12px var(--shadow); transform: translateY(-1px); }
.listing-card-highlight { outline: 2px solid var(--color-primary); outline-offset: -2px; }
.listing-card h3 { margin: 0; font-size: 14px; line-height: 1.35; }
.listing-card h3 a:hover { color: var(--color-primary); }
.listing-card.teaser { border-left: 3px solid var(--color-primary); }
.listing-header { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.listing-price { font-size: 18px; font-weight: 700; color: var(--color-tertiary); white-space: nowrap; }
.listing-details { display: flex; flex-wrap: wrap; gap: 5px; }
.detail-item { padding: 3px 8px; background: var(--color-surface-variant); border-radius: 20px; font-size: 12px; white-space: nowrap; }
.listing-desc { font-size: 13px; color: var(--color-on-surface-variant); margin: 0; line-height: 1.45; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.listing-card .teaser-badge { margin-left: 6px; vertical-align: middle; }
.listing-card .teaser-notice { font-size: 12px; padding: 6px 10px; margin: 0; }
.no-results { text-align: center; padding: 40px; background: var(--color-surface); border-radius: 8px; }
.map-pin-icon { background: none; border: none; transition: transform 0.15s; }
.map-pin-highlight { transform: scale(1.25); filter: drop-shadow(0 2px 4px rgba(0,0,0,0.4)); }

/* Map count overlay */
.map-count-overlay { background: var(--color-surface); padding: 4px 10px; border-radius: 4px; font-size: 12px; color: var(--color-on-surface-variant); box-shadow: 0 1px 4px rgba(0,0,0,0.2); margin-top: 8px !important; margin-left: 8px !important; }

/* Map legend */
.map-legend { background: var(--color-surface); border-radius: 6px; box-shadow: 0 1px 4px rgba(0,0,0,0.2); font-size: 12px; max-width: 180px; margin-bottom: 8px !important; margin-left: 8px !important; }
.map-legend-toggle { padding: 5px 10px; cursor: pointer; font-weight: 600; color: var(--color-on-surface-variant); user-select: none; }
.map-legend-toggle:hover { color: var(--color-on-surface); }
.map-legend-body { padding: 0 10px 8px; }
.map-legend-row { display: flex; align-items: center; gap: 6px; padding: 2px 0; }
.map-legend-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.map-legend-label { color: var(--color-on-surface); white-space: nowrap; }

/* Listing type badges — color-coded to match map pins */
.listing-type-badge { font-weight: 600; text-transform: capitalize; }
.listing-type-foreclosure { background: color-mix(in srgb, var(--listing-color-foreclosure) 15%, transparent); color: var(--listing-color-foreclosure); border: 1px solid color-mix(in srgb, var(--listing-color-foreclosure) 30%, transparent); }
.listing-type-preforeclosure { background: color-mix(in srgb, var(--listing-color-preforeclosure) 15%, transparent); color: var(--listing-color-preforeclosure); border: 1px solid color-mix(in srgb, var(--listing-color-preforeclosure) 30%, transparent); }
.listing-type-tax-lien { background: color-mix(in srgb, var(--listing-color-tax-lien) 15%, transparent); color: var(--listing-color-tax-lien); border: 1px solid color-mix(in srgb, var(--listing-color-tax-lien) 30%, transparent); }
.listing-type-bankruptcy { background: color-mix(in srgb, var(--listing-color-bankruptcy) 15%, transparent); color: var(--listing-color-bankruptcy); border: 1px solid color-mix(in srgb, var(--listing-color-bankruptcy) 30%, transparent); }
.listing-type-short-sale { background: color-mix(in srgb, var(--listing-color-short-sale) 15%, transparent); color: var(--listing-color-short-sale); border: 1px solid color-mix(in srgb, var(--listing-color-short-sale) 30%, transparent); }
.listing-type-reo { background: color-mix(in srgb, var(--listing-color-reo) 15%, transparent); color: var(--listing-color-reo); border: 1px solid color-mix(in srgb, var(--listing-color-reo) 30%, transparent); }
.listing-type-mls { background: color-mix(in srgb, var(--listing-color-mls) 15%, transparent); color: var(--listing-color-mls); border: 1px solid color-mix(in srgb, var(--listing-color-mls) 30%, transparent); }
.listing-type-auction { background: color-mix(in srgb, var(--listing-color-auction) 15%, transparent); color: var(--listing-color-auction); border: 1px solid color-mix(in srgb, var(--listing-color-auction) 30%, transparent); }
.listing-type-rental { background: color-mix(in srgb, var(--listing-color-rental) 15%, transparent); color: var(--listing-color-rental); border: 1px solid color-mix(in srgb, var(--listing-color-rental) 30%, transparent); }
.listing-type-for-sale-by-owner { background: color-mix(in srgb, var(--listing-color-fsbo) 15%, transparent); color: var(--listing-color-fsbo); border: 1px solid color-mix(in srgb, var(--listing-color-fsbo) 30%, transparent); }
.listing-type-other, .listing-type-unknown { background: color-mix(in srgb, var(--listing-color-other) 15%, transparent); color: var(--listing-color-other); border: 1px solid color-mix(in srgb, var(--listing-color-other) 30%, transparent); }

/* Save search form */
.save-search-form { display: none; background: var(--color-surface-variant); padding: 16px 20px; border-radius: 8px; margin-bottom: 16px; border: 1px solid var(--color-outline-variant); }
.save-search-form-inner { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; }
.save-search-form label { font-weight: 500; font-size: 14px; white-space: nowrap; }
.save-search-form input[type="text"] { flex: 1; min-width: 200px; padding: 7px 10px; border: 1px solid var(--color-outline-variant); border-radius: 4px; font-size: 14px; background: var(--color-surface-variant); color: var(--color-on-surface); }
.save-search-form .btn-save { background: var(--color-tertiary); padding: 7px 16px; font-size: 13px; color: white; border: none; border-radius: 4px; cursor: pointer; }
.save-search-form .btn-cancel { background: var(--text-faint); padding: 7px 16px; font-size: 13px; color: white; border: none; border-radius: 4px; cursor: pointer; }

/* Pagination */
.pagination { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 16px 0 8px; }
.pagination-info { font-size: 13px; color: var(--color-on-surface-variant); }
.pagination-controls { display: flex; align-items: center; gap: 4px; }
.pagination-btn { display: inline-flex; align-items: center; justify-content: center; min-width: 32px; height: 32px; padding: 0 8px; border-radius: 6px; font-size: 13px; font-weight: 500; color: var(--color-on-surface); background: var(--color-surface); border: 1px solid var(--color-outline-variant); text-decoration: none; cursor: pointer; transition: background 0.15s, border-color 0.15s; }
.pagination-btn:hover { background: var(--color-surface-variant); border-color: var(--color-primary); color: var(--color-primary); }
.pagination-current { background: var(--color-primary); color: #fff; border-color: var(--color-primary); cursor: default; }
.pagination-current:hover { background: var(--color-primary); color: #fff; }
.pagination-ellipsis { padding: 0 4px; color: var(--color-on-surface-variant); font-size: 13px; }

/* Neighborhood shape tooltips */
.neighborhood-tooltip { background: var(--color-surface, #fff); color: var(--color-on-surface, #1a1a1a); border: 1px solid var(--color-outline-variant, #ccc); border-radius: 4px; padding: 4px 8px; font-size: 12px; font-weight: 500; box-shadow: 0 1px 4px rgba(0,0,0,0.15); }
.neighborhood-tooltip::before { border-top-color: var(--color-outline-variant, #ccc) !important; }

@media (max-width: 1100px) {
    .cards-grid { grid-template-columns: 1fr; }
    .results-map-column { width: 40%; }
}
@media (max-width: 768px) {
    .results-layout { flex-direction: column; }
    .results-map-column { width: 100%; position: relative; z-index: 1; height: 260px; }
    .results-list { padding-bottom: 0; }
    .cards-grid { grid-template-columns: 1fr; }
    .results-meta { flex-direction: column; align-items: flex-start; gap: 8px; }
    .save-search-form-inner { flex-direction: column; }
    .save-search-form input[type="text"] { min-width: 0; width: 100%; }
}