/* Property Filter Styles - WordPress Compatible */

/* Form Container */
.property-filter-wrapper {
    position: relative;
    z-index: 1;
}
.cus-filterModal .modal-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
}
.add-selectedFeatures label {
    display: flex;
    gap: 5px;
    align-items: center;
    justify-content: center;
    text-align: center;
}
.fea-selection {
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: flex-start;
	gap: 5px;
}

.add-selectedFeatures {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.add-selectedFeatures p {
    margin: 0;
    font-family: 'Poppins';
    line-height: 15px;
}

.add-selectedFeatures .select2 {
    max-width: 180px;
    font-family: 'Poppins';
}


.add-selectedFeatures .select2 .select2-selection {
    padding: 0 10px;
}

.add-selectedFeatures .select2 .select2-selection__arrow {
    width: 30px;
}

.cus-filterModal .modal-content {
    padding: 15px 0 0;
    border-radius: 15px;
}

.elementor-element-ef5caf5 a {
    color: #fff !important;
}

.elementor-element-2ca9bb5 a {
    color: #fff !important;
}

.loader.filter-loader {
    display: inline-block;
    margin-left: 8px;
    border: 3px solid #dcdcdc;
    border-top: 3px solid #3498db;
    vertical-align: middle;
    width: 15px;
    height: 15px;
}

.modal-backdrop.fade.show {
    display: none;
}

.cus-filterModal {
    top: 6%;
}

.cus-filterModal .modal-dialog {
    max-width: 90%;
	margin: 0 auto;
	align-items: flex-start;	
}

.cus-filterModal .features .accordion-item {
    border: none;
}
.modal-title {
    font-size: 16px;
    text-transform: capitalize;
    font-family: 'Poppins';
}

.modal-header {
    border: none;
}
.accordion-body {
    display: grid;
    grid-template-columns: 1fr;
	gap: 5px;
}

.accordion-body label {
    cursor: pointer;
	display: flex !important;
	gap: 5px;
	font-weight: 500;
	font-family:'Poppins';
	font-size: 12px;
    align-items: center;
	
}

.accordion-body label input[type="checkbox"] {
    cursor: pointer;
}

.cus-filterModal .features .accordion-item button {
    background: #e9e9e9;
    margin-bottom: 7px;
    border-radius: 5px;
    padding: 10px 15px;
    font-size: 13px;
    font-family: 'Poppins';
    font-weight: 500;
	line-height: 25px;
}

div#featuresAccordion {
    max-height: 57vh;
    overflow: auto;
	padding-bottom: 15px;
}

.cus-filterModal .features .accordion-item button:hover {
    color: #000;
}

.cus-filterModal .features .accordion-item:hover {
    box-shadow: none;
    outline: none;
    color: #000;
}

.cus-filterModal .features .accordion-item button:focus {
    outline: none;
    box-shadow: none;
    color: #000;
}


.elementor-element-b008280,.elementor-element-64b69254,.elementor-element-ddcc03b,.elementor-element-59668af2,.elementor-element-59b065b3{
    gap:0 !important;
}

.zjbtn.zjbtn-features {
    margin-bottom: 20px;
}

/* short and long  terms */
.shortTermDate input[type="date"] {
    background: transparent;
    border: none;
    cursor: pointer;
}

.cus-results {
    display: flex;
    gap: 15px;
}
.cus-filters {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 0;
    font-size: 16px;
    color: #000;
    width: 100%;
	max-width: 1120px;
	margin: 0 auto;
}

.cus-results span {
    font-weight: bold;
    color: #000;
}


.sort {
    display: flex;
    gap: 10px;
}


.pricefilter {
    display: flex;
    align-items: center;
    gap: 5px;
    cursor: pointer;
    font-size: 13px;
    background: #fff;
    fill: #314158;
    color: #314158;
    box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.12549019607843137);
    border-radius: 50px 50px 50px 50px;
    padding: 14px 22px 14px 22px;
}

.pricefilter .e-fas-angle-down {
    width: 15px;
    height: 15px;
}

.btn-view {
    background: linear-gradient(180deg, #3582B5 0%, #35A7D6 100%);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0px 3px 5px 0px rgba(68.99999999999997, 85, 107.99999999999996, 0.28);
}

.sort .btn {
    padding: 11px 11px 11px 11px;
    cursor: pointer;
    border-radius: 7px;
}

.btn.btn-list {
    box-shadow: 0px 3px 5px 0px rgba(68.99999999999997, 85, 107.99999999999996, 0.28);
    display: flex;
    align-items: center;
    justify-content: center;
}

.zj-selection {
    padding: 10px;
    border-radius: 6px;
    cursor: pointer;
    background: #fff;
    display: flex;
    align-items: center;
}

.zj-selection .zj-select {
    padding: 0;
}

div#subrefId {
    padding: 2px 0;
}
#locationSelected{
 border:none !important;
}
.zj-location-list {
    scrollbar-color: #8b8b8b transparent !important;
}
.select2-container .select2-selection--single {
    height: 40px;
    display: flex;
    align-items: center;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: 40px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 40px;
}
/*
Source - https://stackoverflow.com/a/14205976
Posted by Fareed Alnamrouti, modified by community. See post 'Timeline' for change history
Retrieved 2026-02-19, License - CC BY-SA 4.0
*/

/* Change the white to any color */
input:-webkit-autofill,
input:-webkit-autofill:hover, 
input:-webkit-autofill:focus, 
input:-webkit-autofill:active{
    -webkit-box-shadow: 0 0 0 30px white inset !important;
}

/* Loader style */
.loader {
  border: 5px solid #f3f3f3;
  border-radius: 50%;
  border-top: 5px solid #3498db;
  width: 20px;
  height: 20px;
  -webkit-animation: spin 1s linear infinite; /* Safari */
  animation: spin 1s linear infinite;
}
.loading-wrapper {
    display: grid;
    grid-template-columns: 1fr 7fr;
    align-items: center;
}
/* Safari */
@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}


.property-pagination {
    margin-top: 50px;
}


select#locationSelect {
    height: 100%;
    appearance: none;
	background: transparent;
    padding-left: 20px;
	cursor:pointer;
	position: relative;
    z-index: 1;
}

.zj-bath-list,.zj-bed-list,.zj-minPrice-list,.zj-shortBed-list{
  position: absolute;
    top: 45px;
	width: 100%;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #d7d9de;
	overflow-y: auto;
    padding: 6px 0 !important;
	z-index: 9999;
    margin: 0;
	max-height: 32.5vh;
	list-style: none;
	scrollbar-color: #8b8b8b transparent !important;
    left: 0;
    right:0;
}

.zj-bath-list li,.zj-shortBed-list li,.zj-bed-list li,zj-minPrice-list li{
    list-style: none;
	font-size: 14px;
	padding: 3px 16px;
    cursor: pointer;
}

.zj-bath-list li:hover,.zj-shortBed-list li:hover,.zj-bed-list li:hover,zj-minPrice-list li:hover{
  background: #eef3ff;
}

.zj-bath-dropdown,.zj-bed-dropdown,.zj-minPrice-dropdown,.zj-shortBed-dropdown{
position: relative;
	width: 100% !important;
    display: flex;
	    max-width: 100%;
	    height: 51px;
}

div#location-selector-container {
    border-radius: 25px;
    overflow: hidden;
	position: relative;
	background: #fff;
}
.zj-location-select:focus{
border:none;
}

#location-selector-container img {
    position: absolute;
    right: 16px;
    top: 22px;
	z-index:0;
}
.zj-location-selected{
 height:100% !important;
	border: none !important;
}

.zj-location-selected,.zj-select {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.immo-price {
    display: flex;
    align-items: center;
}

.immo-price img {
    margin-right: 6px;
}

.field {
    max-width: 100%;
    width: 100%;
	height: 46px;
}

div#priceSelect {
    padding-right: 2px;
}
.zjfilter-group-row{
display:grid;
grid-template-columns: 1fr;
	gap:15px;
}

.immo-group .zjfilter-box img{
margin-right: 6px;
}

.zjfilter-container {
    position: relative;
    z-index: 1;
    max-width: 800px;
    margin: 50px auto;
    padding: 40px;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: 24px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
     display: flex;
    gap: 30px;
    align-items: flex-start;
}
.zjfilter-container{
	display: grid !important;
	grid-template-columns:1fr;
}

input#refId {
    border: none;
    box-shadow: none;
}
.zjfilter-group-row div {
    flex: 1;
}

.zj-location-dropdown {
    position: relative;
    width: 100% !important;
	display:flex;
}

.zj-location-selected {
    background: #fff;
    padding: 12px 16px;
    border-radius: 40px;
    border: 1px solid #cfd2d8;
    cursor: pointer;
    transition: all 0.2s ease;
    font-size: 14px;
    color: #333;
	width:100%;
}
.zjbtn-group .zjbtn{
padding:17px 28px !important;
	height: 46px;
}

.zjbtn-features {
    height: 46px;
}


.zj-location-selected:hover {
    border: none !important;
    box-shadow: none !important;
}

.zjbtn-group .zjfilter-box{
height:46px;
}

.zjfilter-box{
width:100% !important;
}

/* Scroll Area */
.zj-location-list {
    position: absolute;
    top: 45px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100%;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #d7d9de;
    max-height: 57vh !important;
    overflow-y: auto;
    padding: 6px 0 !important;
    display: none;
    z-index: 9999;
    margin: 0;
    list-style: none;
}

/* Scrollbar */
.zj-location-list::-webkit-scrollbar {
    width: 8px;
}

.zj-location-list::-webkit-scrollbar-thumb {
    background: #d0d4da;
    border-radius: 20px;
}

.zj-location-list li {
    list-style: none;
    padding: 3px 16px !important;
    cursor: pointer;	
    font-size: 14px;
	color: #333;
}

.zj-location-list li:hover {
    background: #eef3ff;
}
.zj-location-list li{
padding: 4px 16px;
}
.zj-menu .zj-list label{
  font-size: 12px !important;
	display: flex;
}


/* Category Headers - Non-clickable, styled differently */
.zj-location-list li.location-category-header {
    font-weight: bold;
    background-color: #f5f7fa;
    color: #2c3e50;
    cursor: default;
    padding: 8px 16px;
    margin-top: 4px;
    border-top: 1px solid #e1e8ed;
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.zj-location-list li.location-category-header:hover {
    background-color: #f5f7fa;
}

.zj-location-list li.location-category-header:first-child {
    margin-top: 0;
    border-top: none;
}



/* Property Type Category Styles */
.property-type-category {
    margin-bottom: 8px;
}

.zjfilter-box{
	padding:2.5px 10px !important;
}

.property-type-category-header {
    display: flex;
    align-items: center;
    padding: 3px 5px;
    cursor: pointer;
    background-color: #f5f7fa;
    border-radius: 4px;
    transition: background-color 0.2s ease;
    user-select: none;
    -webkit-user-select: none;
	text-transform: uppercase;
	font-size: 13px;
	font-weight: bold;
}

.property-type-category-header:hover {
    background-color: #e9ecef;
}

.property-type-category-header .category-toggle {
    display: inline-block;
    width: 20px;
    font-weight: bold;
    font-size: 16px;
    color: #1447E6;
    margin-right: 8px;
    text-align: center;
}

.property-type-category-header .category-name {
    flex: 1;
	color: #2c3e50;
}

.property-type-category-items {
    padding: 0px;
    background-color: #fff;
        display: none; /* Initially hidden, will be shown via JavaScript */
}

.property-type-category-items label {
    display: block;
    padding: 6px 12px;
    margin: 2px 0;
    cursor: pointer;
    transition: background-color 0.2s ease;
    border-radius: 3px;
}

.property-type-category-items label:hover {
    background-color: #f8f9fa;
}

.property-type-category-items input[type="checkbox"] {
    margin-right: 8px;
    cursor: pointer;
}

.property-type-category-items label:has(input:checked) {
    background-color: #e7f0ff;
    color: #1447E6;
    font-weight: 500;
}


.zjfilter-group {
    display: flex;
    gap: 15px;
    flex: 1;
}

.zjfilter-box {
    position: relative;
    /* z-index: 1000; */
}

.zj-dropdown {
    z-index: revert-layer !important;
    position: relative;
    width: 100%;
}

.zj-dropdown .zj-select {
    pointer-events: auto !important;
    cursor: pointer !important;
}

.zj-select {
    background: #fff;
    padding: 12px 16px;
    border: none !important;
    border-radius: 40px;
    border: 1px solid #cfd2d8;
    cursor: pointer;
    min-width: 150px;
    transition: all 0.2s ease;
    font-size: 14px;
    color: #333;
    position: relative;
    z-index: 1001;
    user-select: none;
    -webkit-user-select: none;
    pointer-events: auto !important;
    -webkit-tap-highlight-color: transparent;
}

/* ── Dropdown "jump" fix (Region / Property Type toggles) ──────────
   The open panel (.zj-menu) sits at top:101% of its wrapper .zj-dropdown,
   whose height equals the toggle (.zj-select) height. The toggle had NO fixed
   height, so its height was driven by its contents. In non-English languages
   TranslatePress reprocesses the DOM on check / Select-All / Clear, which
   nudged the toggle's height by a sub-pixel — moving the toggle (and the panel
   anchored to it) up/down. DevTools "Layout shift regions" highlights the
   toggle itself, confirming it's what moves. Locking the toggle to the same
   46px as every other filter field (.field { height:46px }) keeps its height
   constant, so nothing can move — in any language. It also lines these two
   toggles up with the Location/Beds/Baths fields, which are already 46px.
   Vertical centring is already handled by the flex rule on
   .zj-location-selected,.zj-select above. */
#subAreaDrop .zj-select,
#propertyTypeDrop .zj-select {
    height: 44px;
    box-sizing: border-box;
    padding-top: 0;
    padding-bottom: 0;
}

/* Keep the label on one line so a long translated label can't wrap; the
   chevron never shrinks. */
#subAreaDrop .zj-selectText,
#propertyTypeDrop .zj-selectText {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
#subAreaDrop .zj-select img,
#propertyTypeDrop .zj-select img {
    flex-shrink: 0;
}

#subAreaDrop .zj-select {
    pointer-events: auto !important;
    cursor: pointer !important;
}

.zjselect {
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}

#propertySearchForm .zj-select:hover {
    border-color: #007bff;
    box-shadow: none !important;
}

.zj-menu {
    position: absolute;
    top: 52px;
    left: 0;
    width: 100%;
    background: #fff;
    border-radius: 12px;
    border: 1px solid #d7d9de;
    max-height: 57vh;
    overflow-y: auto;
    padding: 6px 0;
    display: none;
    /* z-index: 9999; */
}

.zj-dropdown.open .zj-menu {
    z-index: 9999999 !important;
	top: 101% !important;
    display: block;
	scrollbar-color: #8b8b8b transparent;
}

.zj-actions {
    display: flex;
    gap: 10px;
    padding: 10px 6px;
	border-bottom:none;
}

.zj-actions button {
    padding: 6px 12px;
    border: 1px solid #cfd2d8;
    background: #fff;
    border-radius: 6px;
    cursor: pointer;
    font-size: 12px !important;
    transition: all 0.2s ease;
}

.zj-actions button:hover {
    background: #f5f5f5;
}

.zj-search {
    width: 100%;
    padding: 10px 16px;
    border: none;
    border-bottom: 1px solid #e0e0e0;
    outline: none;
    box-sizing: border-box;
}

.zj-list {
    padding: 6px 0;
}

.zj-list label {
    display: block;
    padding: 3px 5px;
    cursor: pointer;
}

.zj-list label:hover {
    background: #eef3ff;
}

.zj-list input[type="checkbox"] {
    margin-right: 5px;
}

.zj-list .sa-count {
    color: #7f8c8d;
    font-size: 0.92em;
}

.zj-list .sub-area-placeholder {
    padding: 8px 5px;
    text-align: center;
    color: #7f8c8d;
    font-style: italic;
    font-size: 14px;
	margin: 0;
	font-size:12px;
}

.list-search {
    position: relative;
}

.list-search img {
    position: absolute;
    right: 7px;
    width: 15px;
    height: 15px;
    cursor: pointer;
    top: 13px;
}

.zjselect {
    width: 100%;
    padding: 12px 16px;
    border-radius: 40px;
    border: 1px solid #cfd2d8;
    background: #fff;
    cursor: pointer;
    min-width: 150px;
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23333' d='M6 9L1 4h10z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 16px center;
    padding-right: 40px;
    font-size: 14px;
    color: #333;
    transition: all 0.2s ease;
    box-sizing: border-box;
}

.zjselect:hover {
    border-color: #007bff;
    box-shadow: 0 2px 8px rgba(0, 123, 255, 0.1);
}

.zjselect:focus {
    outline: none;
    border-color: #007bff;
    box-shadow: 0 2px 8px rgba(0, 123, 255, 0.2);
}

.zjbtn-group {
    display: grid !important;
	gap: 15px !important;
    grid-template-columns: 1fr  !important;
    min-width: 200px;
}

.zjbtn {
    padding: 12px 24px;
    border-radius: 40px;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 500;
    transition: all 0.3s ease;
}

.zjbtn-features {
    background: #1a1a2e;
    border: none;
    color: #fff;
}

.zjbtn-features:hover {
    background: #16213e;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

.zjbtn-search {
    background:linear-gradient( to right,#3580B3, #35A9D7) !important;
    color: #fff;
}

.zjbtn-search:hover {
    background: #3580B3 !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(0, 123, 255, 0.4);
}

/* Hidden input for location */
.zj-location-input {
    display: none;
}

/* Hidden input for sub-area checkboxes */
.zj-subarea-input {
    display: none;
}

/* Properties Results Container */
.properties-results-container {
    position: relative;
    z-index: 1;
    max-width: 1400px;
    margin: 30px auto;
    padding: 30px;
    background: rgba(255, 255, 255, 0.95);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-radius: 24px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

.results-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 2px solid #e0e0e0;
}

.results-header h2 {
    margin: 0;
    color: #333;
    font-size: 28px;
}

.close-results-btn {
    background: #ff4444;
    color: white;
    border: none;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    font-size: 24px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;
    line-height: 1;
}

.close-results-btn:hover {
    background: #cc0000;
    transform: rotate(90deg);
}

.properties-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
    gap: 30px;
    margin-top: 20px;
}

.property-card {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease;
    cursor: pointer;
}

.property-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.15);
}

.property-image {
    position: relative;
    width: 100%;
    height: 250px;
    overflow: hidden;
}

.property-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.property-card:hover .property-image img {
    transform: scale(1.05);
}

.property-status {
    position: absolute;
    top: 15px;
    right: 15px;
    background: rgba(0, 123, 255, 0.9);
    color: white;
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
}

.property-content {
    padding: 20px;
}

.property-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 15px;
}

.property-title {
    margin: 0;
    font-size: 18px;
    color: #333;
    font-weight: 600;
}

.property-price {
    font-size: 20px;
    font-weight: 700;
    color: #007bff;
}

.property-location {
    display: flex;
    align-items: center;
    gap: 8px;
    color: #666;
    font-size: 14px;
    margin-bottom: 15px;
}

.property-details {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 15px;
    padding-bottom: 15px;
    border-bottom: 1px solid #e0e0e0;
}

.detail-item {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    color: #555;
}

.detail-icon {
    font-size: 16px;
}

.property-features-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 15px;
}

.feature-badge {
    background: #eef3ff;
    color: #007bff;
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 500;
}

.property-description {
    color: #666;
    font-size: 14px;
    line-height: 1.6;
}

.loading-indicator {
    text-align: center;
    padding: 60px 20px;
}

.spinner {
    border: 4px solid #f3f3f3;
    border-top: 4px solid #007bff;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    animation: spin 1s linear infinite;
    margin: 0 auto 20px;
}

keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.loading-indicator p {
    color: #666;
    font-size: 16px;
}

.error-message {
    background: #ffebee;
    color: #c62828;
    padding: 20px;
    border-radius: 12px;
    text-align: center;
    font-size: 16px;
    margin: 20px 0;
}

.no-results {
    text-align: center;
    padding: 60px 20px;
    color: #666;
}

.no-results p {
    font-size: 18px;
    margin: 0;
}

@media (max-width: 500px) {
	
	.property-filter-wrapper  .zjfilter-container{
         width: 96% !important;
      max-width: 350px !important;
    }
    .field .zj-bath-list, .field .zj-bed-list,.field .zj-shortBed-list,.field .zj-minPrice-list, .zj-location-dropdown .zj-location-list {
        margin: 0 auto !important;
        max-width: 268px !important;
    }
}

@media (max-width: 575px) {
	.zj-bath-list,.zj-bed-list,.zj-shortBed-list,.zj-location-list,.zj-minPrice-list{
	    margin : 0 auto !important;
		max-width: 386px;
	}
	.cus-filterModal{
	  /* top: 15%; */
	}
	.add-selectedFeatures label {
    flex-direction: column;
		align-items:start;
}
    .zjfilter-container .zjfilter-group div {
        flex-wrap: nowrap !important;
		justify-content: space-between !important;
    }
 .zjfilter-container .zjfilter-group div .zj-actions,.zjfilter-container .zjfilter-group div .price-actions {
    justify-content: flex-start !important;
}
}

.property-filter-wrapper .zjfilter-container{
 	    min-width: 298px;
	}

/* Responsive Design */
@media (max-width: 768px) {
	.search-header .short-term-rentals{
	 bottom: 0px !important;
	}
	
	.cus-filters{
	 flex-direction: column;
		gap: 20px;
	}
	.pricefilter{
		padding: 5px 22px 5px 22px;
	}
	.sort .btn{
	    padding: 7px;
	}
	
	.cus-results{
	  gap: 5px;
		font-size:  12px;
	}

.zj-bath-list,.zj-bed-list,.zj-shortBed-list,.zj-location-list,.zj-minPrice-list{
	    max-width: 338px !important;
		margin:0 auto !important;
	}
	
	.zjbtn.zjbtn-features{
	  max-width: 76%;
	}
	
	.zjfilter-container{
		max-width: 400px !important;
		margin: 0 auto 20px !important;
	}

	
	.zjbtn-group .zjfilter-box{
	width: 100% !important;
	}
	.zjbtn{
		width: 100% !important;
	}
	
	.zjfilter-group div{
	width: 100% !important;
	}
    .zjfilter-container {
        flex-direction: column;
        padding: 30px 20px;
        margin: 20px;
    }

    .zjbtn-group {
        width: 100%;
    }

    .zjbtn {
        width: 100%;
        justify-content: center;
    }

    .properties-grid {
        grid-template-columns: 1fr;
        gap: 20px;
    }

    .properties-results-container {
        padding: 20px;
        margin: 20px;
    }

    .zj-location-dropdown {
        width: 100%;
    }

    .zjfilter-group-row {
        flex-direction: column;
    }

    .zjfilter-group-row div {
        width: 100%;
    }
}




/* Price Selector Styles */
.price-selector-menu {
    padding: 20px;
}

.price-selector-header {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin-bottom: 15px;
    padding-bottom: 10px;
}

.price-inputs {
    display: flex;
    margin-bottom: 8px;
	flex-direction:column;
}

.price-input {
    flex: 1;
    padding: 10px 12px;
    border: 1px solid #cfd2d8;
    border-radius: 8px;
    font-size: 14px;
    color: #333;
    outline: none;
    transition: border-color 0.2s ease;
}

.price-input:focus {
    border-color: #1da9e9;
}

.price-separator {
    font-size: 16px;
    color: #666;
    font-weight: 500;
}

.price-range-label {
    font-size: 12px;
    color: #666;
    margin-bottom: 15px;
}


.price-slider {
    position: relative;
    height: 6px;
    width: 100%;
}

.price-slider-track {
    position: absolute;
    width: 100%;
    height: 6px;
    background-color: #e0e0e0;
    border-radius: 3px;
    top: 0;
}

.price-slider-range {
    position: absolute;
    height: 6px;
    background-color: #1da9e9;
    border-radius: 3px;
    top: 0;
    left: 0;
    width: 60%;
}

.price-slider-handle {
    position: absolute;
    width: 100%;
    height: 6px;
    background: transparent;
    -webkit-appearance: none;
    appearance: none;
    margin: 0;
    z-index: 3;
    pointer-events: none;
}


.zj-select:hover {box-shadow: none;}

.price-slider-handle::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 18px;
    height: 18px;
    background-color: #1da9e9;
    border: 2px solid #fff;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    pointer-events: all;
    position: relative;
    top: -6px;
}

.price-slider-handle::-moz-range-thumb {
    width: 18px;
    height: 18px;
    background-color: #1da9e9;
    border: 2px solid #fff;
    border-radius: 50%;
    cursor: pointer;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
    pointer-events: all;
}

.price-slider-handle::-moz-range-track {
    background: transparent;
}

.price-slider-handle:focus {
    outline: none;
}

.price-slider-handle:focus::-webkit-slider-thumb {
    box-shadow: 0 2px 6px  #1da9e9;
}

.price-slider-handle:hover::-webkit-slider-thumb {
    box-shadow: 0 2px 6px  #1da9e9;
}

.price-slider-handle:hover::-moz-range-thumb {
    box-shadow: 0 2px 6px  #1da9e9;
}

#priceSliderMin {
    left: 0;
    z-index: 3;
}

#priceSliderMax {
    left: 0;
    z-index: 4;
}

.price-actions {
    display: flex;
    gap: 10px;
    justify-content: flex-start;
    margin-top: 7px;
    padding-top: 15px;
}

.price-inputs label {
	font-size: 12px;
	font-weight: bold;
}

.price-reset-btn,
.price-done-btn {
    padding: 6px 10px;
    border-radius: 8px;
    border: none;
    cursor: pointer;
    font-size: 12px;
    font-weight: 500;
    transition: all 0.2s ease;
}

.price-reset-btn {
    background-color: #1da9e9;
    color: white;
}

.price-reset-btn:hover {
    background-color: #d0e0ff;
}

.price-done-btn {
    background-color: #666;
    color: #fff;
}
.price-inputs input{
  font-size: 14px;
}
.price-done-btn:hover {
    background-color: #555;
}

@media (min-width: 576px) {
	.cus-filterModal{
	  top: 10%;
	}
	.add-selectedFeatures .select2{
	   max-width: 616px !important;
	}
	.add-selectedFeatures{
	 max-width: 100% !important;
		width: 100%;
	}
      .modal-header {
        align-items: center !important;
    }
    .fea-selection {
        display: flex  !important;
        justify-content: center  !important;
        align-items: center  !important;
        flex-direction: column  !important;
    }
}
@media (max-width: 768px) {
	.cus-filterModal{
		
	  top: 10%;
	}
	.add-selectedFeatures .select2{
	   max-width: 500px;
	}
	.add-selectedFeatures{
	 max-width: 500px;
		width: 100%;
	}
      .modal-header {
        align-items: center !important;
    }
    .fea-selection {
        display: flex  !important;
        justify-content: center  !important;
        align-items: center  !important;
        flex-direction: column  !important;
    }
     .cus-filterModal.modal {
       margin-top: 10% !important;
    }
    .cus-filterModal .modal-content {
    max-height: 89vh !important;
    }
}

@media (min-width: 768px) {	
   
    .modal-header {
        align-items: center !important;
    }
    .fea-selection {
        display: flex  !important;
        justify-content: center  !important;
        align-items: center  !important;
        flex-direction: column  !important;
    }
	.cus-filterModal{
		top: 14%;
	}
	
	.accordion-body {
    grid-template-columns: 1fr 1fr;
}
	.zj-bath-list,.zj-bed-list,.zj-shortBed-list,.zj-location-list,.zj-minPrice-list{
	    max-width: 184px !important;
		margin: 0 auto !important;
	}
	.property-filter-wrapper .zjfilter-container{
	 max-width: 690px !important;
	}
	.zjbtn.zjbtn-features {
    margin-bottom: 0px;
}
	.zjfilter-group-row{
	grid-template-columns:1fr 1fr 1fr;
	}
	.zjbtn-group{
	grid-template-columns: 1fr 1fr !important;
	}
	.elementor-element-db5326f.elementor-widget p {
    margin-bottom: 26.5px;
}
}

@media (min-width: 992px) {
	.cus-filterModal .features .accordion-item button {
		font-size: 15px;
	}
	.cus-filterModal{
	top: 3;
	}
	.accordion-body {
    grid-template-columns: 1fr 1fr 1fr;
}
	.zj-bath-list,.zj-bed-list,.zj-shortBed-list,.zj-location-list,.zj-minPrice-list{
	    max-width: 232px !important;
		margin: 0 auto !important;
	}
	.zjfilter-container{
	 max-width: 832px !important;
	}
}


@media (min-width: 1200px) {
	.elementor-element-db5326f.elementor-widget p {
    margin-bottom: 32px;
}
	.property-filter-wrapper .zjfilter-container{
	 max-width: 1000px !important;
	}
	
	.zj-bath-list,.zj-bed-list,.zj-location-list,.zj-shortBed-list,.zj-minPrice-list{
	    max-width: 214px !important;
	}
	.zjfilter-container{
	 max-width: 1000px !important;
	}
	.zjfilter-container{
	grid-template-columns: 4fr 1fr;
	}
	.zjbtn-group{
	grid-template-columns:1fr !important;
	}
	.cus-filterModal .modal-dialog{
	  max-width: 1120px;
	}
	.cus-filterModal{
	top: 15%;
	}
}



@media (min-width: 1367px) {
	.cus-filters{
	 max-width: 1300px;
	}
	.cus-filterModal .modal-dialog{
	  max-width: 1300px;
	}
    #home-p-text{
            margin-bottom: 15px !important;
    }
}


/* =========================================================
   Additional Filters modal — viewport fit + close (×) button
   Masla: chhoti / kam-height screens pe modal bottom se chipak raha
   tha. Hal: modal-content ko viewport ke andar cap (94vh) kar ke khud
   scroll diya, header sticky rakha (Must/Nice + Save/Close + close
   button hamesha nazar mein), aur upar-neeche space diya.
   NOTE: modal-content ko flex NAHI banaya — warna andar ki list ki
   height 0 ho jati hai (body khali dikhti hai). Normal block + scroll
   sabse mehfooz hai.
   ========================================================= */
.cus-filterModal.modal {
    top: 0 !important;
    padding: 3vh 0 !important;  
    margin-top: 5% !important;        /* upar-neeche breathing space */
}
.cus-filterModal .modal-dialog-centered {
    min-height: auto;                   /* BS ki min-height max-height se na takraye */
}
.cus-filterModal .modal-dialog {
    max-height: 94vh;
    margin: 0 auto;
}
.cus-filterModal .modal-content {
    max-height: 79vh;
    overflow-y: auto;                   /* poora modal scroll — content kabhi chhupta nahi */
    position: relative;                 /* close button ke liye */
}
/* Header upar chipka rahe taake list scroll karte waqt bhi controls
   aur close button nazar mein rahein. */
.cus-filterModal .modal-header {
    top: 0;
    z-index: 4;
    background: #fff;
    padding-right: 44px;                /* close button ke liye jagah */
    border-radius: 15px 15px 0 0;
}
/* Inner 57vh scroll hata diya — ab modal-content khud scroll karega,
   list poori flow kar ke dikhegi (height 0 wala masla khatam). */
.cus-filterModal #featuresAccordion {
    max-height: none;
    overflow: visible;
}

/* Top-right close (×) button — high specificity + !important taake
   theme ke generic button styles (blue) isay override na karein. */
.cus-filterModal .modal-header .cus-modal-close {
    position: absolute !important;
    top: 12px;
    right: 12px;
    width: 32px !important;
    height: 32px !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    border-radius: 50% !important;
    background: #f0f0f0 !important;
    color: #333 !important;
    font-size: 22px !important;
    line-height: 30px !important;
    text-align: center;
    cursor: pointer;
    z-index: 6;
}
.cus-filterModal .modal-header .cus-modal-close:hover {
    background: #e0e0e0 !important;
    color: #000 !important;
}