/* Cities List View Styles - Match Properties Design */
/* Use the same property-1 styles from theme, no custom overrides needed */
/* The property-listing.property-1 classes will handle all styling */

/* Compact page title banner on mobile */
@media (max-width: 767.98px) {
    .page-title {
        height: auto;
        min-height: 0;
        padding: 1.25rem 0;
    }

    .page-title .ipt-title {
        font-size: 1.5rem;
        line-height: 1.3;
        margin-bottom: 0;
    }
}

/* Ensure city cards use property-1 structure in list view */
.location-property-wrap.list-view,
.property-listing.property-1[data-city-id] {
    /* Inherit all styles from property-1 */
}

/* City filter section - match sorting box font */
.city-filter-section h4 {
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    color: inherit;
}

.city-select-display {
    height: 58px !important;
}

/* Neighborhoods page: city dropdown smaller, neighborhood dropdown wider */
.neighborhood-filter-section .neighborhood-city-filter-wrap {
    flex: 0 1 180px;
    max-width: 200px;
    min-width: 140px;
    width: 180px;
}

.neighborhood-filter-section .neighborhood-name-filter-wrap {
    flex: 1 1 320px;
    min-width: 240px;
}

@media (max-width: 767.98px) {
    .neighborhood-filter-section .neighborhood-city-filter-wrap,
    .neighborhood-filter-section .neighborhood-name-filter-wrap {
        flex: 1 1 100%;
        max-width: none;
        width: 100%;
        min-width: 0;
    }
}

/* Match all filter/sort elements to same height - match Select2 */
.item-sorting-box .select2-container--default .select2-selection--single {
    height: auto !important;
}

.item-sorting-box .select2-container--default .select2-selection {
    min-height: calc(1.5em + .75rem + var(--bb-border-width, 1px) * 2) !important;
}

.item-sorting-box .city-filter-wrapper {
    min-height: calc(1.5em + .75rem + var(--bb-border-width, 1px) * 2) !important;
    height: auto !important;
}

.item-sorting-box .city-filter-wrapper .city-select-display {
    height: 58px !important;
    min-height: 58px !important;
    max-height: 58px !important;
    display: flex !important;
    align-items: center !important;
    box-sizing: border-box !important;
    line-height: 1.5 !important;
}

/* View toggle buttons - square shape with 58px height */
.item-sorting-box .shorting-list {
    position: relative;
    z-index: 5;
}

.item-sorting-box .shorting-list li a,
.item-sorting-box .shorting-list li .view-toggle-btn {
    height: 58px !important;
    width: 58px !important;
    min-height: 58px !important;
    min-width: 58px !important;
    max-height: 58px !important;
    max-width: 58px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    border: 1px solid #e1e9ec;
    border-radius: 4px;
    background: #ffffff;
    cursor: pointer;
    color: inherit;
    text-decoration: none;
    line-height: 1;
    transition: all ease 0.4s;
    pointer-events: auto;
    position: relative;
    z-index: 5;
}

.item-sorting-box .shorting-list li .view-toggle-btn.active,
.item-sorting-box .shorting-list li a.active {
    background: rgba(25, 206, 109, 0.1) !important;
    border-color: #19ce6d !important;
    color: #19ce6d !important;
    opacity: 1;
}

.item-sorting-box .shorting-list li .view-toggle-btn:hover,
.item-sorting-box .shorting-list li a:hover {
    background: rgba(25, 206, 109, 0.1) !important;
    border-color: #19ce6d !important;
    color: #19ce6d !important;
}

.item-sorting-box .sorting-by {
    width: 200px;
    min-width: 200px;
    flex-shrink: 0;
}

.item-sorting-box .sorting-by .select2-container {
    width: 100% !important;
}

/* Keep Select2 clear (×) inside the sort dropdown (esp. RTL) */
.item-sorting-box .sorting-by .select2-selection--single {
    position: relative;
    overflow: hidden;
}

.item-sorting-box .sorting-by .select2-selection--single .select2-selection__clear {
    position: absolute !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
    padding: 0 4px !important;
    line-height: 1 !important;
    z-index: 2;
    right: 28px !important;
    left: auto !important;
}

.item-sorting-box .sorting-by .select2-container[dir="rtl"] .select2-selection__clear,
[dir="rtl"] .item-sorting-box .sorting-by .select2-selection__clear {
    left: 28px !important;
    right: auto !important;
}

.item-sorting-box .sorting-by .select2-container[dir="rtl"] .select2-selection__rendered,
[dir="rtl"] .item-sorting-box .sorting-by .select2-selection__rendered {
    padding-left: 48px !important;
    padding-right: 12px !important;
}

.item-sorting-box .sorting-by .select2-container:not([dir="rtl"]) .select2-selection__rendered {
    padding-right: 48px !important;
}

/* Card uniform sizing */
[data-cities-container] > div,
.cities-container > div,
.row.cities-list > div {
    display: flex !important;
    flex-direction: column !important;
}

.location-property-wrap.grid-view {
    display: flex !important;
    flex-direction: column !important;
    height: calc(100% - 30px) !important;
    margin-bottom: 30px !important;
}

.location-property-wrap.grid-view .location-property-thumb {
    height: 250px !important;
    width: 100% !important;
    position: relative !important;
    overflow: hidden !important;
}

.location-property-wrap.grid-view .location-property-thumb a {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
}

.location-property-wrap.grid-view .location-property-thumb img {
    width: 100% !important;
    height: 100% !important;
    -o-object-fit: cover !important;
       object-fit: cover !important;
    transition: all ease 0.4s !important;
}

.location-property-wrap.grid-view .location-property-content {
    flex-grow: 1 !important;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .property-listing.property-1[data-city-id] {
        margin-bottom: 20px;
    }
}

/* RTL: Position wishlist icon on the left for Arabic localization */
[dir="rtl"] .property-listing .icon-actions-wrapper,
html[dir="rtl"] .property-listing .icon-actions-wrapper,
body[dir="rtl"] .property-listing .icon-actions-wrapper {
    left: 15px !important;
    right: auto !important;
}

[dir="rtl"] .location-property-thumb .icon-actions-wrapper,
html[dir="rtl"] .location-property-thumb .icon-actions-wrapper,
body[dir="rtl"] .location-property-thumb .icon-actions-wrapper {
    left: 15px !important;
    right: auto !important;
}

/* RTL: Position city filter arrow on the left for Arabic */
[dir="rtl"] .city-select-arrow,
html[dir="rtl"] .city-select-arrow,
body[dir="rtl"] .city-select-arrow,
:lang(ar) .city-select-arrow {
    left: 12px !important;
    right: auto !important;
}

/* LTR: Position city filter arrow on the right for English */
[dir="ltr"] .city-select-arrow,
html[dir="ltr"] .city-select-arrow,
body[dir="ltr"] .city-select-arrow,
:lang(en) .city-select-arrow {
    right: 12px !important;
    left: auto !important;
}

/* RTL: Adjust padding for city filter display (arrow on left) */
[dir="rtl"] .city-select-display,
html[dir="rtl"] .city-select-display,
body[dir="rtl"] .city-select-display,
:lang(ar) .city-select-display {
    padding: calc(.5625rem - 1px) 12px calc(.5625rem - 4px) 40px !important;
}

/* LTR: Adjust padding for city filter display (arrow on right) */
[dir="ltr"] .city-select-display,
html[dir="ltr"] .city-select-display,
body[dir="ltr"] .city-select-display,
:lang(en) .city-select-display {
    padding: calc(.5625rem - 1px) 40px calc(.5625rem - 4px) 12px !important;
}