/*
 * Unified property-filter finish.
 *
 * One UI is mounted on the homepage, the full catalogue and Half Map. This
 * final layer deliberately owns the shared grid, range choices and clear-link
 * treatment so those surfaces cannot drift apart as individual theme rules
 * load around them.
 */

:root {
    --artbin-filter-navy: #10233a;
    --artbin-filter-gold: #f4b51b;
    --artbin-filter-line: #dbe3eb;
    --artbin-filter-muted: #66788e;
}

/* Homepage keyword field: the browser placeholder is the single source of
   truth.  The older decorative pseudo-label could be rendered at the same
   time on small screens, producing a duplicated Address / Property ID label. */
@media (max-width: 767.98px) {
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-keyword-group:has(input[name="keyword"]:placeholder-shown)::after {
        content: none !important;
        display: none !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-keyword-group input[name="keyword"]::placeholder {
        color: rgba(255, 255, 255, .78) !important;
        opacity: 1 !important;
    }
}

/* The reset control should only occupy space once there is something to reset. */
html body [data-artbin-service-filter] [data-artbin-clear-slot][hidden] {
    display: none !important;
}

/* Older result sheets target the action rail with a more specific selector,
   so repeat the hidden state at that specificity as well. */
html body form.artbin-results-filter-form .artbin-service-filter--results [data-artbin-clear-slot][hidden],
html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search [data-artbin-clear-slot][hidden],
html body.artbin-home-gold-search-active .artbin-service-filter--home > [data-artbin-clear-slot][hidden] {
    display: none !important;
}

/* Shared range treatment: preset intervals only.  Exact From/To inputs are
 * deliberately absent from the shared template on home, catalogue and map. */
html body [data-artbin-service-filter] .artbin-service-range-presets {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    margin: 0 !important;
}

html body [data-artbin-service-filter] .artbin-service-range-presets .artbin-service-quick,
html body [data-artbin-service-filter] .artbin-service-range-presets [data-artbin-range-preset] {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 36px !important;
    margin: 0 !important;
    padding: 6px 8px !important;
    border: 1px solid var(--artbin-filter-line) !important;
    border-radius: 8px !important;
    background: #ffffff !important;
    color: var(--artbin-filter-navy) !important;
    font-size: 12px !important;
    font-weight: 750 !important;
    line-height: 1.15 !important;
    text-align: center !important;
    white-space: nowrap !important;
}

html body [data-artbin-service-filter] .artbin-service-range-presets .artbin-service-quick:hover,
html body [data-artbin-service-filter] .artbin-service-range-presets .artbin-service-quick:focus-visible,
html body [data-artbin-service-filter] .artbin-service-range-presets .artbin-service-quick.is-active {
    border-color: var(--artbin-filter-gold) !important;
    background: #fff6dc !important;
    color: var(--artbin-filter-navy) !important;
    box-shadow: 0 3px 10px rgba(244, 181, 27, .16) !important;
}

/* Result pages ------------------------------------------------------------ */
@media (min-width: 768px) {
    html body form.artbin-results-filter-form .artbin-service-filter--results {
        gap: 12px !important;
        padding: 18px !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-filter-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        grid-auto-rows: 50px !important;
        align-items: stretch !important;
        gap: 12px !important;
        width: 100% !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-filter-grid > .artbin-service-market,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-filter-grid > .artbin-service-control,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-filter-grid > .artbin-service-filter-group {
        grid-column: auto !important;
        grid-row: auto !important;
        min-width: 0 !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-search-slot {
        grid-column: 1 / -1 !important;
        grid-row: auto !important;
        min-width: 0 !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-filter-group > .artbin-service-filter-label {
        display: none !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control > summary,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-market > .artbin-service-home-market-selector > summary,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-filter-group > .artbin-service-control > summary {
        min-height: 50px !important;
        height: 50px !important;
        padding: 10px 14px !important;
        border: 1px solid var(--artbin-filter-line) !important;
        border-radius: 10px !important;
        background: #ffffff !important;
        color: var(--artbin-filter-navy) !important;
        font-size: 14px !important;
        font-weight: 750 !important;
        line-height: 1.2 !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control[open] > summary,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control.is-active > summary,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control > summary:hover {
        border-color: var(--artbin-filter-gold) !important;
        box-shadow: 0 4px 14px rgba(16, 35, 58, .07) !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover {
        z-index: 70 !important;
        min-width: 260px !important;
        padding: 12px !important;
        border: 1px solid rgba(16, 35, 58, .12) !important;
        border-radius: 12px !important;
        background: #ffffff !important;
        box-shadow: 0 16px 34px rgba(16, 35, 58, .16) !important;
    }

    /* Every categorical choice uses the same illustrated Types treatment.
       Previously Category/Condition/City were styled as tiles while Types
       and Features inherited a different theme rule, so opening adjacent
       controls produced visibly mismatched dropdowns. */
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-category,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-condition,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-city,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-market-options .artbin-service-market-option,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-type,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-feature,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-quick {
        display: flex !important;
        align-items: center !important;
        width: 100% !important;
        min-height: 40px !important;
        margin: 0 0 6px !important;
        padding: 8px 11px !important;
        border: 1px solid var(--artbin-filter-line) !important;
        border-radius: 8px !important;
        background: #ffffff !important;
        color: var(--artbin-filter-navy) !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        text-align: left !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-category:last-child,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-condition:last-child,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-city:last-child,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-market-options .artbin-service-market-option:last-child,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-type:last-child,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-feature:last-child,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-quick:last-child {
        margin-bottom: 0 !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-category:hover,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-category.is-active,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-condition:hover,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-condition.is-active,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-city:hover,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-city.is-active,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-market-options .artbin-service-market-option:hover,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-market-options .artbin-service-market-option.is-active,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-type:hover,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-type.is-active,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-feature:hover,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-feature.is-active,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-feature[aria-pressed="true"],
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-quick:hover,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control-popover .artbin-service-quick.is-active {
        border-color: var(--artbin-filter-gold) !important;
        background: #fff6dc !important;
        color: var(--artbin-filter-navy) !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) auto auto !important;
        grid-template-rows: 50px !important;
        gap: 10px !important;
        height: 50px !important;
        min-height: 50px !important;
        align-items: center !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search input[name="keyword"],
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search > .elementor-field-group {
        grid-area: 1 / 1 !important;
        width: 100% !important;
        min-width: 0 !important;
        height: 50px !important;
        min-height: 50px !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search button.half-map-search-js-btn,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search button[type="submit"],
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search > .elementor-field-type-submit {
        grid-area: 1 / 2 !important;
        width: auto !important;
        min-width: 110px !important;
        height: 50px !important;
        min-height: 50px !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search .artbin-service-clear-slot,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search .artbin-service-reset-wrap {
        grid-area: 1 / 3 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
        width: auto !important;
        min-width: 0 !important;
        height: 50px !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-clear-action,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-reset-wrap .reset-search-btn {
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: auto !important;
        min-height: 0 !important;
        height: auto !important;
        margin: 0 !important;
        padding: 7px 2px !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: var(--artbin-filter-muted) !important;
        box-shadow: none !important;
        font-size: 12px !important;
        font-weight: 750 !important;
        line-height: 1.2 !important;
        text-decoration: underline !important;
        text-decoration-color: rgba(102, 120, 142, .45) !important;
        text-underline-offset: 3px !important;
        white-space: nowrap !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-clear-action:hover,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-reset-wrap .reset-search-btn:hover {
        color: var(--artbin-filter-navy) !important;
        text-decoration-color: var(--artbin-filter-gold) !important;
    }
}

/* Shared selector icon language ----------------------------------------- */
/* The result/map filter is rendered from the same template as the home
 * filter, but the older archive rules only supplied a Types pictogram.  Keep
 * every summary and categorical option on one predictable icon system. */
html body [data-artbin-service-filter] .artbin-service-control-icon,
html body [data-artbin-service-filter] .artbin-service-market-icon,
html body [data-artbin-service-filter] .artbin-service-option-icon {
    display: inline-block !important;
    flex: 0 0 16px !important;
    width: 16px !important;
    height: 16px !important;
    margin: 0 7px 0 0 !important;
    background-color: currentColor !important;
    background-image: none !important;
    -webkit-mask: var(--artbin-service-filter-icon) center / contain no-repeat !important;
    mask: var(--artbin-service-filter-icon) center / contain no-repeat !important;
}

html body [data-artbin-service-filter] .artbin-service-control-icon--operation,
html body [data-artbin-service-filter] .artbin-service-market-icon--all,
html body [data-artbin-service-filter] .artbin-service-market-icon--sale,
html body [data-artbin-service-filter] .artbin-service-market-icon--rent {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M3 21h18M5 21V10l7-6 7 6v11M8 21v-6h8v6M8 11h8'/%3E%3C/svg%3E");
}

html body [data-artbin-service-filter] .artbin-service-control-icon--features {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='m12 3 2.8 5.8 6.2.9-4.5 4.4 1.1 6.2-5.6-3-5.6 3 1.1-6.2L3 9.7l6.2-.9L12 3Z'/%3E%3C/svg%3E");
}

html body [data-artbin-service-filter] .artbin-service-control-icon--category,
html body [data-artbin-service-filter] .artbin-service-option-icon--category {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M3 21h18M5 21V9l7-5 7 5v12M8 21v-7h8v7M8 11h8M10 7h4'/%3E%3C/svg%3E");
}

html body [data-artbin-service-filter] .artbin-service-control-icon--condition,
html body [data-artbin-service-filter] .artbin-service-option-icon--condition {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M4 12.5 12.5 4H20v7.5L11.5 20 4 12.5ZM15.5 8.5h.01'/%3E%3C/svg%3E");
}

html body [data-artbin-service-filter] .artbin-service-control-icon--city,
html body [data-artbin-service-filter] .artbin-service-city-pin {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round' d='M12 21s7-5.2 7-11A7 7 0 1 0 5 10c0 5.8 7 11 7 11Zm0-8.2a2.5 2.5 0 1 1 0-5 2.5 2.5 0 0 1 0 5Z'/%3E%3C/svg%3E");
}

html body [data-artbin-service-filter] .artbin-service-control-icon--bedrooms {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round' d='M3 18v-6h18v6M5 12V8h5v4m0 0V9h4a3 3 0 0 1 3 3m-14 6v2m16-2v2'/%3E%3C/svg%3E");
}

html body [data-artbin-service-filter] .artbin-service-control-icon--bathrooms {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round' d='M4 12h16M6 12V8a6 6 0 0 1 12 0v4M5 12v4a3 3 0 0 0 3 3h8a3 3 0 0 0 3-3v-4M8 7V5m8 2V5'/%3E%3C/svg%3E");
}

html body [data-artbin-service-filter] .artbin-service-control-icon--price {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round' d='M20 12V5H6L3 8l9 9 3-3m-4-7h.01M16 4v12a4 4 0 0 0 4 4h1'/%3E%3C/svg%3E");
}

html body [data-artbin-service-filter] .artbin-service-control-icon--area {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round' d='M4 9V5h4m8 0h4v4M4 15v4h4m12-4v4h-4M8 12h8M12 8v8'/%3E%3C/svg%3E");
}

html body [data-artbin-service-filter] .artbin-service-control-icon--types {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M3 21h18M5 21V9l7-5 7 5v12M8 21v-7h8v7M8 11h8M10 7h4'/%3E%3C/svg%3E");
}

/* Type choices carry the same compact pictogram treatment as the other
 * categorical choices.  The legacy span existed in the markup but had no
 * dimensions on result sheets, so its icon collapsed to zero width. */
html body [data-artbin-service-filter] .artbin-service-type-icon {
    display: inline-block !important;
    flex: 0 0 16px !important;
    width: 16px !important;
    height: 16px !important;
    margin: 0 7px 0 0 !important;
    background-color: currentColor !important;
    background-image: none !important;
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M3 21h18M5 21V9l7-5 7 5v12M8 21v-7h8v7M8 11h8M10 7h4'/%3E%3C/svg%3E");
    -webkit-mask: var(--artbin-service-filter-icon) center / contain no-repeat !important;
    mask: var(--artbin-service-filter-icon) center / contain no-repeat !important;
}

/* The city pin is an option icon on result/archive sheets as well.  Using a
 * mask here removes the old border/pseudo-element treatment from those
 * sheets while preserving the compact homepage pin styling in its own layer. */
html body .artbin-service-filter--results .artbin-service-city-pin,
html body .artbin-service-filter--archive .artbin-service-city-pin {
    display: inline-block !important;
    position: static !important;
    flex: 0 0 16px !important;
    width: 16px !important;
    height: 16px !important;
    margin: 0 7px 0 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    transform: none !important;
    background-color: currentColor !important;
    -webkit-mask: var(--artbin-service-filter-icon) center / contain no-repeat !important;
    mask: var(--artbin-service-filter-icon) center / contain no-repeat !important;
}

html body .artbin-service-filter--results .artbin-service-city-pin::after,
html body .artbin-service-filter--archive .artbin-service-city-pin::after {
    display: none !important;
}

/* Parking is the one feature that previously inherited a missing font glyph.
 * Give it a dedicated car/garage mask everywhere the shared filter appears. */
html body [data-artbin-service-filter] .artbin-service-feature--parking .artbin-service-feature-icon {
    display: inline-block !important;
    flex: 0 0 16px !important;
    width: 16px !important;
    height: 16px !important;
    margin: 0 7px 0 0 !important;
    font-size: 0 !important;
    line-height: 1 !important;
    background-color: currentColor !important;
    background-image: none !important;
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M4 17v-5l2-5h12l2 5v5M4 17h16M7 17v2m10-2v2M7 12h10M7 9h10M6 12h.01M18 12h.01'/%3E%3C/svg%3E") !important;
    -webkit-mask: var(--artbin-service-filter-icon) center / contain no-repeat !important;
    mask: var(--artbin-service-filter-icon) center / contain no-repeat !important;
}

/* Map/list sheets: make Type, Feature, City, Market and range choices use
 * the same white tile, gold-active interaction as the Types selector. */
@media (max-width: 767.98px) {
    html body .artbin-service-filter--results .artbin-service-control-popover :is(.artbin-service-market-option, .artbin-service-category, .artbin-service-condition, .artbin-service-city, .artbin-service-type, .artbin-service-feature, .artbin-service-quick),
    html body .artbin-service-filter--archive .artbin-service-control-popover :is(.artbin-service-market-option, .artbin-service-category, .artbin-service-condition, .artbin-service-city, .artbin-service-type, .artbin-service-feature, .artbin-service-quick) {
        display: flex !important;
        align-items: center !important;
        justify-content: flex-start !important;
        box-sizing: border-box !important;
        width: 100% !important;
        min-width: 0 !important;
        min-height: 40px !important;
        margin: 0 !important;
        padding: 8px 10px !important;
        border: 1px solid var(--artbin-filter-line) !important;
        border-radius: 8px !important;
        background: #ffffff !important;
        color: var(--artbin-filter-navy) !important;
        font-size: 13px !important;
        font-weight: 700 !important;
        line-height: 1.2 !important;
        text-align: left !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        box-shadow: none !important;
        transition: border-color .16s ease, background-color .16s ease, color .16s ease, box-shadow .16s ease !important;
    }

    html body .artbin-service-filter--results .artbin-service-control-popover :is(.artbin-service-market-option, .artbin-service-category, .artbin-service-condition, .artbin-service-city, .artbin-service-type, .artbin-service-feature, .artbin-service-quick).is-active,
    html body .artbin-service-filter--results .artbin-service-control-popover .artbin-service-feature[aria-pressed="true"],
    html body .artbin-service-filter--archive .artbin-service-control-popover :is(.artbin-service-market-option, .artbin-service-category, .artbin-service-condition, .artbin-service-city, .artbin-service-type, .artbin-service-feature, .artbin-service-quick).is-active,
    html body .artbin-service-filter--archive .artbin-service-control-popover .artbin-service-feature[aria-pressed="true"] {
        border-color: var(--artbin-filter-gold) !important;
        background: var(--artbin-filter-gold) !important;
        color: var(--artbin-filter-navy) !important;
    }

    html body .artbin-service-filter--results .artbin-service-control-popover :is(.artbin-service-market-option, .artbin-service-category, .artbin-service-condition, .artbin-service-city, .artbin-service-type, .artbin-service-feature, .artbin-service-quick):hover,
    html body .artbin-service-filter--results .artbin-service-control-popover :is(.artbin-service-market-option, .artbin-service-category, .artbin-service-condition, .artbin-service-city, .artbin-service-type, .artbin-service-feature, .artbin-service-quick):focus-visible,
    html body .artbin-service-filter--archive .artbin-service-control-popover :is(.artbin-service-market-option, .artbin-service-category, .artbin-service-condition, .artbin-service-city, .artbin-service-type, .artbin-service-feature, .artbin-service-quick):hover,
    html body .artbin-service-filter--archive .artbin-service-control-popover :is(.artbin-service-market-option, .artbin-service-category, .artbin-service-condition, .artbin-service-city, .artbin-service-type, .artbin-service-feature, .artbin-service-quick):focus-visible {
        border-color: var(--artbin-filter-gold) !important;
        background: #fff8e5 !important;
        color: var(--artbin-filter-navy) !important;
        outline: none !important;
        box-shadow: 0 0 0 2px rgba(244, 181, 27, .16) !important;
    }
}

/* Large map panel: nine filter controls fill three even rows; Bathrooms and
   the action rail then share the final row without a dead cell. */
@media (min-width: 1200px) {
    html body form.houzez-search-filters-js.artbin-results-filter-form .artbin-service-filter--results .artbin-service-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    html body form.houzez-search-filters-js.artbin-results-filter-form .artbin-service-filter--results .artbin-service-search-slot {
        grid-column: 2 / -1 !important;
    }

    /* Full-width catalogue: four clean columns and an exact final action row. */
    html body form.houzez-search-builder-form-js.artbin-results-filter-form .artbin-service-filter--results .artbin-service-filter-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    }

    html body form.houzez-search-builder-form-js.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control[data-artbin-control="bedrooms"],
    html body form.houzez-search-builder-form-js.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control[data-artbin-control="bathrooms"] {
        grid-column: auto !important;
        grid-row: auto !important;
    }

    html body form.houzez-search-builder-form-js.artbin-results-filter-form .artbin-service-filter--results .artbin-service-search-slot {
        grid-column: 3 / -1 !important;
        grid-row: auto !important;
    }
}

/* Homepage --------------------------------------------------------------- */
@media (min-width: 768px) {
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid {
        display: grid !important;
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        gap: 12px !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-clear-slot {
        display: none !important;
        justify-content: flex-end !important;
        width: 100% !important;
        margin: 4px 0 0 !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-clear-slot.is-visible:not([hidden]) {
        display: flex !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-clear-slot .artbin-service-clear-action {
        min-height: 0 !important;
        margin: 0 !important;
        padding: 4px 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: rgba(255, 255, 255, .76) !important;
        font-size: 12px !important;
        font-weight: 750 !important;
        text-decoration: underline !important;
        text-underline-offset: 3px !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover {
        z-index: 70 !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-range-presets .artbin-service-quick,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-range-presets [data-artbin-range-preset] {
        border-color: rgba(185, 205, 223, .34) !important;
        background: rgba(17, 52, 85, .96) !important;
        color: #ffffff !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-range-presets .artbin-service-quick:hover,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-range-presets .artbin-service-quick.is-active {
        border-color: var(--artbin-filter-gold) !important;
        background: rgba(244, 181, 27, .16) !important;
        color: var(--artbin-filter-gold) !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-range-field {
        color: rgba(255, 255, 255, .65) !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-range-field input {
        border-color: rgba(185, 205, 223, .34) !important;
        background: rgba(8, 31, 54, .96) !important;
        color: #ffffff !important;
    }
}

/* Phone layouts retain two equal columns, including the new range cards. */
@media (max-width: 767.98px) {
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-filter-grid,
    html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-filter-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 8px !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-filter-grid > .artbin-service-market,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-filter-grid > .artbin-service-filter-group--features,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-search-slot {
        grid-column: 1 / -1 !important;
        grid-row: auto !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control[data-artbin-control="bathrooms"] {
        grid-column: auto !important;
        grid-row: auto !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control > summary,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-market > .artbin-service-home-market-selector > summary,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-filter-group > .artbin-service-control > summary {
        min-height: 48px !important;
        height: 48px !important;
        padding: 8px 9px !important;
        font-size: 12px !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search {
        grid-template-columns: minmax(0, 1fr) 108px !important;
        grid-template-rows: 44px !important;
        gap: 8px !important;
        height: 44px !important;
        min-height: 44px !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search input[name="keyword"],
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search > .elementor-field-group {
        grid-area: 1 / 1 !important;
        height: 44px !important;
        min-height: 44px !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search button.half-map-search-js-btn,
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search button[type="submit"],
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search > .elementor-field-type-submit {
        grid-area: 1 / 2 !important;
        min-width: 0 !important;
        height: 44px !important;
        min-height: 44px !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results > .artbin-service-clear-slot {
        display: none !important;
        justify-content: flex-end !important;
        margin: 4px 0 0 !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results > .artbin-service-clear-slot.is-visible:not([hidden]) {
        display: flex !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results > .artbin-service-clear-slot .artbin-service-clear-action,
    html body form.artbin-results-filter-form .artbin-service-filter--results > .artbin-service-clear-slot .reset-search-btn {
        min-height: 0 !important;
        height: auto !important;
        margin: 0 !important;
        padding: 4px 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: var(--artbin-filter-muted) !important;
        font-size: 12px !important;
        font-weight: 750 !important;
        text-decoration: underline !important;
        text-underline-offset: 3px !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-filter-grid > .artbin-service-filter-group--features {
        grid-column: 1 / -1 !important;
    }

    /* The full-width deal switch occupies child one, so generic even/odd
       positioning puts Price's popover off the left edge. Pin each right
       column explicitly and keep all remaining popovers inside the sheet. */
    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-filter-grid > [data-artbin-control] > .artbin-service-control-popover,
    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-filter-grid > .artbin-service-filter-group > .artbin-service-catalog-selector > .artbin-service-control-popover {
        left: 0 !important;
        right: auto !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-filter-grid > :nth-child(3) > .artbin-service-control-popover,
    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-filter-grid > :nth-child(5) > .artbin-service-control-popover,
    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-filter-grid > :nth-child(7) > .artbin-service-control-popover,
    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-filter-grid > :nth-child(9) > .artbin-service-control-popover,
    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-filter-grid > :nth-child(3) > .artbin-service-catalog-selector > .artbin-service-control-popover,
    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-filter-grid > :nth-child(5) > .artbin-service-catalog-selector > .artbin-service-control-popover,
    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-filter-grid > :nth-child(7) > .artbin-service-catalog-selector > .artbin-service-control-popover,
    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-filter-grid > :nth-child(9) > .artbin-service-catalog-selector > .artbin-service-control-popover {
        right: 0 !important;
        left: auto !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-filter-grid > [data-artbin-keyword-cell],
    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-filter-grid > [data-artbin-search-submit-cell] {
        grid-column: auto !important;
        min-height: 52px !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-filter-grid > [data-artbin-keyword-cell] input[name="keyword"],
    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-filter-grid > [data-artbin-search-submit-cell] .houzez-search-button {
        min-height: 52px !important;
        height: 52px !important;
        padding: 0 10px !important;
        font-size: 12px !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-clear-slot {
        display: none !important;
        justify-content: flex-end !important;
        width: 100% !important;
        margin: 4px 0 0 !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-clear-slot.is-visible:not([hidden]) {
        display: flex !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-clear-slot .artbin-service-clear-action {
        min-height: 0 !important;
        margin: 0 !important;
        padding: 4px 0 !important;
        border: 0 !important;
        border-radius: 0 !important;
        background: transparent !important;
        color: rgba(255, 255, 255, .78) !important;
        font-size: 12px !important;
        font-weight: 750 !important;
        text-decoration: underline !important;
        text-underline-offset: 3px !important;
    }

    html body [data-artbin-service-filter] .artbin-service-range-presets {
        gap: 6px !important;
        margin-bottom: 8px !important;
    }

    html body [data-artbin-service-filter] .artbin-service-range-presets .artbin-service-quick,
    html body [data-artbin-service-filter] .artbin-service-range-presets [data-artbin-range-preset] {
        min-height: 34px !important;
        padding: 5px 6px !important;
        font-size: 11px !important;
    }
}

/* Homepage selector interaction ------------------------------------------------
 * The City control is the reference treatment: every choice opens in the same
 * compact, tactile tile language, while the selector's own content layout
 * (two-column types, features and range presets) remains intact.  The shared
 * template has interval presets only on every surface.
 */

html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-range-presets {
    margin-bottom: 0 !important;
}

/* These short, mutually exclusive lists scan better as a City-style vertical
 * menu instead of leaving an orphan option in a second grid column. */
html body.artbin-home-gold-search-active .artbin-service-filter--home [data-artbin-control="condition"] > .artbin-service-control-popover,
html body.artbin-home-gold-search-active .artbin-service-filter--home [data-artbin-control="category"] > .artbin-service-control-popover {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 7px !important;
}

html body.artbin-home-gold-search-active .artbin-service-filter--home [data-artbin-control="condition"] > .artbin-service-control-popover > .artbin-service-condition,
html body.artbin-home-gold-search-active .artbin-service-filter--home [data-artbin-control="category"] > .artbin-service-control-popover > .artbin-service-category {
    width: 100% !important;
}

html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-market-option,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-condition,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-category,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-city,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-type,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-feature,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-quick {
    display: flex !important;
    align-items: center !important;
    min-height: 34px !important;
    margin: 0 !important;
    padding: 7px 9px !important;
    border: 1px solid rgba(16, 35, 58, .14) !important;
    border-radius: 7px !important;
    background: #ffffff !important;
    color: var(--artbin-filter-navy) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    box-shadow: none !important;
    transition: border-color .16s ease, background-color .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease !important;
}

html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-market-option,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-condition,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-category,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-city {
    justify-content: flex-start !important;
    text-align: left !important;
}

html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-type,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-feature,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-quick {
    justify-content: center !important;
    text-align: center !important;
}

html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-market-option:hover,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-market-option:focus-visible,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-condition:hover,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-condition:focus-visible,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-category:hover,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-category:focus-visible,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-city:hover,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-city:focus-visible,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-type:hover,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-type:focus-visible,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-feature:hover,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-feature:focus-visible,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-quick:hover,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-quick:focus-visible {
    border-color: var(--artbin-filter-gold) !important;
    background: #fff8e5 !important;
    color: var(--artbin-filter-navy) !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(244, 181, 27, .18) !important;
    transform: translateY(-1px) !important;
}

html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-market-option.is-active,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-condition.is-active,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-category.is-active,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-city.is-active,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-type.is-active,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-feature.is-active,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-feature[aria-pressed="true"],
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-quick.is-active {
    border-color: var(--artbin-filter-gold) !important;
    background: var(--artbin-filter-gold) !important;
    color: var(--artbin-filter-navy) !important;
    box-shadow: none !important;
    transform: none !important;
}

html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-market-option.is-active:hover,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-condition.is-active:hover,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-category.is-active:hover,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-city.is-active:hover,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-type.is-active:hover,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-feature.is-active:hover,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover .artbin-service-quick.is-active:hover {
    background: var(--artbin-filter-gold) !important;
    box-shadow: none !important;
    transform: none !important;
}

/* The eighth feature must not inherit the generic pool pictogram. */
html body .artbin-service-feature--elevator .artbin-service-feature-icon {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M5 21V4h14v17M8 21v-7h8v7M8 8h.01M16 8h.01'/%3E%3C/svg%3E");
}

/* Catalogue, category archive and Half Map must never let a selector escape
 * its own rail.  The map rail becomes much narrower than the catalogue at
 * intermediate widths, so its inherited 260px minimum used to spill outside
 * the visible panel — most noticeably in Features. */
@media (min-width: 768px) {
    html body .artbin-service-filter--results [data-artbin-control],
    html body .artbin-service-filter--archive [data-artbin-control],
    html body .artbin-service-filter--results .artbin-service-home-market-selector,
    html body .artbin-service-filter--archive .artbin-service-home-market-selector {
        position: relative !important;
        min-width: 0 !important;
    }

    html body .artbin-service-filter--results .artbin-service-control-popover,
    html body .artbin-service-filter--archive .artbin-service-control-popover {
        box-sizing: border-box !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: min(100%, calc(100vw - 32px)) !important;
        max-height: min(420px, calc(100dvh - 144px)) !important;
        overflow-x: hidden !important;
        overflow-y: auto !important;
        overscroll-behavior: contain;
        z-index: 150 !important;
    }

    html body .artbin-service-filter--results .artbin-service-features,
    html body .artbin-service-filter--results .artbin-service-types,
    html body .artbin-service-filter--archive .artbin-service-features,
    html body .artbin-service-filter--archive .artbin-service-types {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 7px !important;
        align-items: start !important;
        min-width: 0 !important;
    }

    html body .artbin-service-filter--results .artbin-service-control-popover :is(.artbin-service-city, .artbin-service-type, .artbin-service-feature, .artbin-service-quick),
    html body .artbin-service-filter--archive .artbin-service-control-popover :is(.artbin-service-city, .artbin-service-type, .artbin-service-feature, .artbin-service-quick) {
        min-width: 0 !important;
        max-width: 100% !important;
        overflow-wrap: anywhere !important;
    }
}

/* Final override: the elevator icon must not fall back to the pool glyph. */
html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-features,
html body form.artbin-service-archive-form .artbin-service-filter--archive .artbin-service-features {
    align-items: start !important;
}

html body [data-artbin-service-filter] .artbin-service-feature--elevator .artbin-service-feature-icon {
    display: inline-block !important;
    flex: 0 0 16px !important;
    width: 16px !important;
    height: 16px !important;
    margin: 0 7px 0 0 !important;
    font-size: 0 !important;
    line-height: 1 !important;
    background-color: currentColor !important;
    background-image: none !important;
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M5 21V4h14v17M8 21v-7h8v7M8 8h.01M16 8h.01'/%3E%3C/svg%3E") !important;
    -webkit-mask: var(--artbin-service-filter-icon) center / contain no-repeat !important;
    mask: var(--artbin-service-filter-icon) center / contain no-repeat !important;
}

/* Homepage desktop/tablet: Selected filters and Clear share one compact
 * footer row.  Keeping the action at the far right removes the former empty
 * clear row without taking space away from the 4 x 3 control grid. */
@media (min-width: 768px) {
    html body.artbin-home-gold-search-active .artbin-service-filter--home {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) max-content !important;
        column-gap: 18px !important;
        row-gap: 0 !important;
        align-items: start !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-filter-grid {
        grid-column: 1 / -1 !important;
        grid-row: 1 !important;
        min-width: 0 !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-selection-summary {
        grid-column: 1 !important;
        grid-row: 2 !important;
        min-width: 0 !important;
        width: auto !important;
        margin: 14px 0 0 !important;
        padding: 11px 0 0 !important;
        border-top: 1px solid rgba(192, 210, 225, .24) !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-selection-summary.is-visible {
        display: flex !important;
        flex-wrap: wrap !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-selection-summary .artbin-service-selection-chips {
        min-width: 0 !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-clear-slot {
        grid-column: 2 !important;
        grid-row: 2 !important;
        display: none !important;
        align-self: start !important;
        justify-self: end !important;
        justify-content: flex-end !important;
        width: auto !important;
        margin: 14px 0 0 !important;
        padding: 11px 0 0 !important;
        border-top: 1px solid rgba(192, 210, 225, .24) !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-clear-slot.is-visible:not([hidden]) {
        display: flex !important;
    }

    html body.artbin-home-gold-search-active .artbin-service-filter--home > .artbin-service-clear-slot .artbin-service-clear-action {
        white-space: nowrap !important;
    }
}

/* Results and map filters: every desktop/tablet popover stays attached to the
 * control that opened it.  Several inherited Houzez rules still centre a
 * popover with a translate transform, which can push Area/Price choices past
 * the left edge of the filter sheet on a three-column rail. */
@media (min-width: 768px) {
    html body form.artbin-results-filter-form .artbin-service-filter--results [data-artbin-control] > .artbin-service-control-popover,
    html body form.artbin-service-archive-form .artbin-service-filter--archive [data-artbin-control] > .artbin-service-control-popover {
        left: 0 !important;
        right: auto !important;
        transform: none !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results [data-artbin-control][open],
    html body form.artbin-service-archive-form .artbin-service-filter--archive [data-artbin-control][open] {
        z-index: 200 !important;
    }
}

/* Use the same gold visual cue for every filter icon, both in the closed
 * selector and in its choices.  Text remains navy for contrast. */
html body form.artbin-results-filter-form .artbin-service-filter--results :is(.artbin-service-market-icon, .artbin-service-control-icon, .artbin-service-option-icon, .artbin-service-city-pin, .artbin-service-feature-icon),
html body form.artbin-service-archive-form .artbin-service-filter--archive :is(.artbin-service-market-icon, .artbin-service-control-icon, .artbin-service-option-icon, .artbin-service-city-pin, .artbin-service-feature-icon) {
    color: var(--artbin-filter-gold) !important;
}

/* City names stay in the existing two-column catalogue, but compact padding,
 * a smaller type scale and a non-wrapping line keep long names such as
 * “Tavernes de la Valldigna” readable instead of breaking inside a tile. */
@media (min-width: 768px) {
    html body [data-artbin-service-filter] [data-artbin-control="city"] .artbin-service-city {
        min-height: 34px !important;
        padding: 6px 7px !important;
        font-size: clamp(9px, .72vw, 11px) !important;
        line-height: 1.15 !important;
        white-space: nowrap !important;
        overflow: hidden !important;
        text-overflow: ellipsis !important;
    }

    html body [data-artbin-service-filter] [data-artbin-control="city"] .artbin-service-city-pin {
        flex: 0 0 14px !important;
        width: 14px !important;
        height: 14px !important;
        margin-right: 5px !important;
    }
}

/* Homepage filter: Deal type now uses the same single-selector language as
 * Market segment.  The original three buttons remain the source of truth for
 * the search state; the desktop selector mirrors them with stable icons. */
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-home-market-selector > .artbin-service-market-popover,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-home-market-selector > .artbin-service-control-popover {
    display: block !important;
    width: max(100%, 310px) !important;
    min-width: 0 !important;
    max-width: min(420px, calc(100vw - 48px)) !important;
    padding: 8px !important;
}

html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-home-market-selector .artbin-service-market-options {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 7px !important;
    width: 100% !important;
}

html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-home-market-selector .artbin-service-market-option {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 8px 10px !important;
    border: 1px solid rgba(16, 35, 58, .14) !important;
    border-radius: 7px !important;
    background: #ffffff !important;
    color: var(--artbin-filter-navy) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    letter-spacing: normal !important;
    text-align: left !important;
    text-transform: none !important;
    box-shadow: none !important;
}

html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-home-market-selector .artbin-service-market-option:hover,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-home-market-selector .artbin-service-market-option:focus-visible {
    border-color: var(--artbin-filter-gold) !important;
    background: #fff8e5 !important;
    color: var(--artbin-filter-navy) !important;
    outline: none !important;
    box-shadow: 0 0 0 2px rgba(244, 181, 27, .18) !important;
}

html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-home-market-selector .artbin-service-market-option.is-active,
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-home-market-selector .artbin-service-market-option.is-active:hover {
    border-color: var(--artbin-filter-gold) !important;
    background: var(--artbin-filter-gold) !important;
    color: var(--artbin-filter-navy) !important;
    box-shadow: none !important;
}

/* Choices retain sentence case in every language.  This also overrides older
 * Houzez button rules that made labels unreadable on hover. */
html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover :is(.artbin-service-market-option, .artbin-service-condition, .artbin-service-category, .artbin-service-type) {
    text-transform: none !important;
    letter-spacing: normal !important;
}

html body.artbin-home-gold-search-active .artbin-service-filter--home .artbin-service-control-popover :is(.artbin-service-market-option, .artbin-service-condition, .artbin-service-category, .artbin-service-type):is(:hover, :focus-visible) > * {
    color: inherit !important;
}

/* Type tiles use the same two-column, icon-first City grid instead of the
 * old centred tags.  Long labels remain aligned on the left edge. */
html body.artbin-home-gold-search-active .artbin-service-filter--home [data-artbin-control="types"] > .artbin-service-control-popover > .artbin-service-types {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 7px !important;
    width: 100% !important;
}

html body.artbin-home-gold-search-active .artbin-service-filter--home [data-artbin-control="types"] .artbin-service-type {
    justify-content: flex-start !important;
    min-width: 0 !important;
    text-align: left !important;
    text-transform: none !important;
}

html body.artbin-home-gold-search-active .artbin-service-filter--home [data-artbin-control="types"] .artbin-service-type > span:last-child {
    min-width: 0 !important;
    overflow: hidden !important;
    text-align: left !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

/* Deal, segment and category choices receive their own pictogram.  They use
 * currentColor so inactive, hovered and selected states always stay legible. */
html body [data-artbin-service-filter] .artbin-service-market-icon--all,
html body [data-artbin-service-filter] .artbin-service-option-icon--category-all,
html body [data-artbin-service-filter] .artbin-service-option-icon--condition-all,
html body [data-artbin-service-filter] .artbin-service-type--all .artbin-service-type-icon {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='4' width='6' height='6' fill='none' stroke='black' stroke-width='1.8'/%3E%3Crect x='14' y='4' width='6' height='6' fill='none' stroke='black' stroke-width='1.8'/%3E%3Crect x='4' y='14' width='6' height='6' fill='none' stroke='black' stroke-width='1.8'/%3E%3Crect x='14' y='14' width='6' height='6' fill='none' stroke='black' stroke-width='1.8'/%3E%3C/svg%3E") !important;
}

html body [data-artbin-service-filter] .artbin-service-market-icon--sale,
html body [data-artbin-service-filter] .artbin-service-option-icon--category-residential {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='m3 11 9-7 9 7v9H3v-9Zm6 9v-6h6v6'/%3E%3C/svg%3E") !important;
}

html body [data-artbin-service-filter] .artbin-service-market-icon--rent {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='m3 11 9-7 5 4m-8 12v-6h6v6m4-8 2-2 2 2-2 2m-2-2h-5m5 2h-5'/%3E%3C/svg%3E") !important;
}

/* Results/list/map: selected criteria need a clear visual break from the
 * final control row.  Keep deal-type pictograms intact in every state: the
 * former active-chip cascade could hide the leading span on narrow screens. */
html body [data-artbin-service-filter] > [data-artbin-selection-summary] {
    margin-top: 14px !important;
}

html body [data-artbin-service-filter] :is(.artbin-service-chip, .artbin-service-market-option) > .artbin-service-market-icon {
    display: inline-block !important;
    visibility: visible !important;
    flex: 0 0 16px !important;
    width: 16px !important;
    height: 16px !important;
    margin: 0 8px 0 0 !important;
    opacity: 1 !important;
    color: currentColor !important;
    background-color: currentColor !important;
}

@media (max-width: 767.98px) {
    html body [data-artbin-service-filter] > [data-artbin-selection-summary] {
        margin-top: 12px !important;
    }

    html body [data-artbin-service-filter] .artbin-service-market > .artbin-service-chip {
        align-items: center !important;
        justify-content: center !important;
    }
}

html body [data-artbin-service-filter] .artbin-service-option-icon--category-commercial,
html body [data-artbin-service-filter] .artbin-service-type--business-premise .artbin-service-type-icon,
html body [data-artbin-service-filter] .artbin-service-type--office .artbin-service-type-icon,
html body [data-artbin-service-filter] .artbin-service-type--hotel .artbin-service-type-icon {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M4 21V4h10v17M14 9h6v12M7 8h.01M11 8h.01M7 12h.01M11 12h.01M7 16h.01M11 16h.01M17 13h.01M17 17h.01'/%3E%3C/svg%3E") !important;
}

html body [data-artbin-service-filter] .artbin-service-option-icon--condition-new-build {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M3 21h18M7 21V11h7v10M2 8h13m-7 0V4h9l3 4m-7 0v5m0-5 4 3'/%3E%3C/svg%3E") !important;
}

html body [data-artbin-service-filter] .artbin-service-option-icon--condition-resale {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M20 9a8 8 0 0 0-14-2L4 9m0 0h5m-5 0V4m0 11a8 8 0 0 0 14 2l2-2m0 0h-5m5 0v5'/%3E%3C/svg%3E") !important;
}

html body [data-artbin-service-filter] :is(.artbin-service-type--apartament, .artbin-service-type--apartment, .artbin-service-type--flat, .artbin-service-type--ground-floors) .artbin-service-type-icon {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M5 21V4h14v17M8 8h.01M12 8h.01M16 8h.01M8 12h.01M12 12h.01M16 12h.01M9 21v-5h6v5'/%3E%3C/svg%3E") !important;
}

html body [data-artbin-service-filter] :is(.artbin-service-type--villa, .artbin-service-type--villas, .artbin-service-type--house, .artbin-service-type--detached-chalet, .artbin-service-type--bungalows) .artbin-service-type-icon {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='m3 11 9-7 9 7v9H3v-9Zm6 9v-6h6v6M7 10h.01M17 10h.01'/%3E%3C/svg%3E") !important;
}

html body [data-artbin-service-filter] :is(.artbin-service-type--penthouses, .artbin-service-type--penthouse, .artbin-service-type--duplexes, .artbin-service-type--terraced-houses) .artbin-service-type-icon {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M4 21V8l8-5 8 5v13M8 21v-7h8v7M3 8h18M12 3V1'/%3E%3C/svg%3E") !important;
}

html body [data-artbin-service-filter] .artbin-service-type--parking .artbin-service-type-icon {
    --artbin-service-filter-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' d='M4 20V5h11a5 5 0 0 1 0 10H9m0-6h6a2 2 0 0 1 0 4H9v7'/%3E%3C/svg%3E") !important;
}

/* Results and Map View --------------------------------------------------
 * Keep the final desktop row in the same grid rhythm as the filter controls:
 * Features | Address / Property ID | Search.  The Search slot spans two
 * parent cells and splits into two equal children, so every visible block in
 * that row is exactly one grid cell wide. */
@media (min-width: 768px) {
    html body form.houzez-search-builder-form-js.artbin-results-filter-form .artbin-service-filter--results .artbin-service-filter-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    html body form.houzez-search-builder-form-js.artbin-results-filter-form .artbin-service-filter--results .artbin-service-control[data-artbin-control="bathrooms"] {
        grid-column: auto !important;
        grid-row: auto !important;
    }

    html body form.houzez-search-builder-form-js.artbin-results-filter-form .artbin-service-filter--results .artbin-service-search-slot {
        grid-column: 2 / -1 !important;
        grid-row: 4 !important;
        order: 11 !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        grid-template-rows: 50px !important;
        gap: 12px !important;
        height: 50px !important;
        min-height: 50px !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search input[name="keyword"],
    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search > .elementor-field-group {
        grid-area: 1 / 1 !important;
        width: 100% !important;
        min-width: 0 !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search :is(button.half-map-search-js-btn, button[type="submit"], .elementor-field-type-submit) {
        grid-area: 1 / 2 !important;
        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 100% !important;
        min-width: 0 !important;
        padding: 0 14px !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-native-search :is(button.half-map-search-js-btn, button[type="submit"])::after {
        content: none !important;
        display: none !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-submit-icon {
        position: relative !important;
        display: inline-block !important;
        flex: 0 0 18px !important;
        width: 18px !important;
        height: 18px !important;
        border: 2px solid currentColor !important;
        border-radius: 50% !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results .artbin-service-submit-icon::after {
        content: "" !important;
        position: absolute !important;
        right: -5px !important;
        bottom: -3px !important;
        width: 7px !important;
        height: 2px !important;
        border-radius: 2px !important;
        background: currentColor !important;
        transform: rotate(45deg) !important;
        transform-origin: left center !important;
    }

    /* Clear is intentionally outside the search rail, after selected values. */
    html body form.artbin-results-filter-form .artbin-service-filter--results > .artbin-service-clear-slot {
        display: none !important;
        justify-content: flex-end !important;
        width: 100% !important;
        margin: 8px 0 0 !important;
        padding: 0 !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results > .artbin-service-clear-slot.is-visible:not([hidden]) {
        display: flex !important;
    }

    html body form.artbin-results-filter-form .artbin-service-filter--results > .artbin-service-clear-slot :is(.artbin-service-clear-action, .artbin-service-reset-wrap, .reset-search-btn) {
        width: auto !important;
        min-height: 0 !important;
        height: auto !important;
        margin: 0 !important;
    }
}