.available-homes-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
}
.home-card {
    border: 1px solid #d3d3d3;
    border-radius: 8px 8px 0px 0px;
    overflow: hidden;
    background: #fff url('../images/Curve.png');
    padding:10px 10px;
    background-position: center bottom;
    background-size: 100%;
    background-repeat: no-repeat;
}
.home-meta {
    list-style: none;
    padding: 0;
    margin: 10px 0 14px;
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.home-image {
    width: 100%;
    height: 240px;
}
.home-image img {
    width: 100%;
    height: 100%;
    display: block;
/*     object-fit: cover; */
}
.home-card p {
    margin-bottom: 0;
}
.home-status {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0;
}
.home-status p {
    width: 50%;
    text-align: center;
    background-color: var(--e-global-color-secondary);
    margin: 0px 0px 0px 0px;
    padding: 10px 4px 10px 4px;
    font-family: "Raleway", Sans-serif;
    font-size: 14px;
    font-weight: 600;
    text-transform: capitalize;
    line-height: 16px;
    color: var(--e-global-color-100d932f);
}
.home-status p.home-under-cunstruction{
	background-color: #b91c3a;
}
.home-status p.home-move-in-ready{
	width: 100%;
}
.view-home{
    display:inline-block;
    margin-top:10px;
    background:#b71c36;
    color:#fff;
    padding:10px 15px;
    text-decoration:none;
    font-weight:600;
    margin-right:10px;
}
.home-card-inner .home-title,.login-popup h3 {
    font-family: "Raleway", Sans-serif;
    font-size: 30px;
    font-weight: 300;
    text-transform: capitalize;
    line-height: 46px;
    color: var(--e-global-color-secondary);
    text-align:center;
    margin: 0px;
}
.home-price {
    font-family: "Raleway", Sans-serif;
    font-size: 24px;
    font-weight: 600;
    line-height: 34px;
    color: var(--e-global-color-secondary);
    text-align: center;
    margin-bottom: 12px;
}
.home-city,.login-popup input,.login-popup .login-btn {
    font-family: var(--e-global-typography-text-font-family), Sans-serif;
    font-size: var(--e-global-typography-text-font-size);
    font-weight: var(--e-global-typography-text-font-weight);
    text-transform: var(--e-global-typography-text-text-transform);
    font-style: var(--e-global-typography-text-font-style);
    line-height: var(--e-global-typography-text-line-height);
    color: var(--e-global-color-text);
    text-align: center;
    margin: 8px 0px;
}
ul.home-meta li{
	text-align: center;
}
ul.home-meta li {
    font-family: var(--e-global-typography-secondary-font-family), Sans-serif;
    font-size: var(--e-global-typography-secondary-font-size);
    font-weight: var(--e-global-typography-secondary-font-weight);
    line-height: var(--e-global-typography-secondary-line-height);
}
ul.home-meta li span {
    font-family: var(--e-global-typography-text-font-family), Sans-serif;
    font-size: var(--e-global-typography-text-font-size);
    font-weight: var(--e-global-typography-text-font-weight);
    text-transform: var(--e-global-typography-text-text-transform);
    font-style: var(--e-global-typography-text-font-style);
    line-height: var(--e-global-typography-text-line-height);
    color: var(--e-global-color-accent);
    display: block;
}
a.view-home:hover {
    transform: scale(1.1);
    transition: .3s;
}
a.view-home {
    background-color: var(--e-global-color-af486e0);
    font-family: var(--e-global-typography-secondary-font-family), Sans-serif;
    font-size: var(--e-global-typography-secondary-font-size);
    font-weight: var(--e-global-typography-secondary-font-weight);
    line-height: var(--e-global-typography-secondary-line-height);
    fill: var(--e-global-color-4d695be3);
    transition: .3s;
    color: #fff;
    margin: 0px;
}
a.view-home.open-tour{
    color: var(--e-global-color-4d695be3);
    margin: 15px 0px 20px;
    display: block;
}
.home-card-top-container{
	border-bottom: 2px solid #b91c3a;
}
.available-homes-filter{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-bottom:20px;
    position:relative;
    justify-content: space-between;
}
.beds-baths-dropdown #toggle-beds-baths {
    width: 360px;
}
.save-filter-data{
    margin-right: 10px;
}
select#filter-community {
    width: 330px;
}
.open-login-popup:focus-visible,.save-filter-data:focus-visible,.logout-btn:focus-visible{
    outline: none;
}
.save-filter-data:focus,.logout-btn:focus{
    background-color: transparent;
    color: var(--e-global-color-secondary);
}
.available-homes-filter input, .available-homes-filter select {
    padding: 10px 12px;
    border: unset;
    font-size: 15px;
    width: 280px;
    background-color: #F0F0F0;
    color: #00000080;
    position: relative;
}
.available-homes-filter input::placeholder{
    color: #00000080;
    opacity: 1;
}
.available-homes-filter select{
    appearance: none;
}
.available-homes-filter input[type=text],.available-homes-filter select{
    padding: 10px 16px;
    border: unset;
    color: #00000080;
    cursor: pointer;
    transition: 0.3s;
    width: 290px;
    text-align: left;
    background: #F0F0F0 url("../images/Arrow_Grey.svg")no-repeat;
    background-position: 100% 50%;
    background-size: 45px;
    border-radius: 0;
}
.available-homes-filter input[type=text]:hover,
.available-homes-filter select:hover{
    background: #F0F0F0 url("../images/Arrow_Red.svg")no-repeat;
    background-size: 45px;
    background-position: 100% 50%;
}
.available-homes-filter input[type=text]#filter-city{
    background: #F0F0F0 url("../images/Search_Grey.svg")no-repeat;
    background-position: 100% 50%;
    background-size: 45px;
}
.available-homes-filter input[type=text]#filter-city:hover{
    background: #F0F0F0 url("../images/Serach_Red.svg")no-repeat;
    background-position: 100% 50%;
    background-size: 45px;
}
.filter-sort,.available-homes-filter input[type=text]{
    position: relative;
}
/*.available-homes-filter input[type=text]::before,.available-homes-filter input[type=text]::after,
.available-homes-filter input::before,.available-homes-filter input::after,
.filter-sort::before,.filter-sort::after{
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    height: 44px;
    width: 44px;
    transition: .3s;
}
.available-homes-filter input[type=text]::before,
.available-homes-filter input::before,
.filter-sort::before {
    background:url('../images/Dropdown.svg')no-repeat;
    background-position: 50% 50%;
    z-index: 2;
}*/
select#filter-sort {
    width: 220px;
    border: unset;
    border-radius: 0;
    color: #00000080;
}
.available-homes-filter input[type=text]:focus-visible,
.available-homes-filter input:focus-visible,
.filter-sort:focus-visible,select#filter-sort:focus-visible{
    outline: none;
}
.available-homes-filter input[type=text]::after{
    background-color: #979797;
    transition: .3s;
}
.available-homes-filter input[type=text]:hover{
    background-color: #F0F0F0;
}
.available-homes-filter input[type=text]:focus{
	background-color: #F0F0F0;
}
.available-homes-filter input[type=text]:hover::after,
.available-homes-filter input:hover::after,
.filter-sort:hover::after{
    background-color: #B91C3A;
    transition: .3s;
}
.available-homes-grid.loading{
    opacity:.5;
    pointer-events:none;
}
.available-homes-count{
    font-weight:600;
}
.avialable-home-count-login-logout-button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 15px;
}
.beds-baths-dropdown{
    position:relative;
}
.beds-baths-content {
    display: none;
    position: absolute;
    top: 46px;
    left: 0;
    background: #fff;
    border: 1px solid #ccc;
    padding: 30px 20px;
    z-index: 99;
    width: 100%;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    border-radius: 6px;
}
.beds-baths-content label {
    display: block;
    margin-bottom: 5px;
    font-weight: 600;
}
.available-homes-filter .beds-baths-content input {
    width: 100%;
    margin-bottom: 8px;
    padding: 6px 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background-image: unset;
}
.available-homes-filter .beds-baths-content input:hover {
    background-image: unset;
}
.beds-baths-content .filter-buttons{
    display:flex;
    gap:20px;
    margin-top:40px;
}
.beds-baths-filter-content {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}
.beds-baths-filter-content div {
    width: 29%;
}
.beds-baths-filter-content div:last-child, .beds-baths-filter-content div:nth-last-child(2) {
    width: 45%;
}
.available-homes-filter .filter-buttons input {
    font-weight: 600;
    margin-bottom: 0px;
}
.home-status-container {
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.beds-baths-content.price-content {
    width: 290px;
}

.home-status-container div {
    background-color: var(--e-global-color-secondary);
    margin: 0px 0px 0px 0px;
    padding: 10px 4px 10px 4px;
    width: 50%;
    font-family: "Raleway", Sans-serif;
    font-size: 14px;
    font-weight: 600;
    text-transform: capitalize;
    line-height: 16px;
    color: var(--e-global-color-100d932f);
    text-align: center;
}
.home-status-container .under-cunsturction {
    background-color: #b91c3a;
}
.home-status-container .move-in-ready {
    width: 100%;
}
.open-login-popup,.save-filter-data,.logout-btn,.available-homes-filter .filter-buttons input {
  padding: 10px 20px;
  text-align: center;
  border: 1px solid var(--e-global-color-secondary);
  color: var(--e-global-color-secondary);
  display: inline-block;
  border-radius: 5px;
  background-color: transparent;
}
.open-login-popup:hover,.save-filter-data:hover,.logout-btn:hover,.available-homes-filter .filter-buttons input:hover {
  background-color: var(--e-global-color-secondary);
  color: #fff;
}

/*login popup css*/

.login-popup-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.6);
    display: none;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}
.login-popup {
    background: #fff;
    width: 380px;
    padding: 30px;
    border-radius: 10px;
    position: absolute;
    text-align: center;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.close-login-popup {
    position: absolute;
    top: 12px;
    right: 15px;
    font-size: 22px;
    cursor: pointer;
}
.login-popup h3 {
    margin-bottom: 20px;
}
.login-popup input {
    width: 100%;
    padding: 12px;
    margin-bottom: 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    text-align: left;
}
.login-btn {
    width: 100%;
    padding: 12px;
    background: #000;
    color: #fff;
    border: none;
    border-radius: 6px;
    cursor: pointer;
}
.forgot-password,.sign-up {
    display: inline-block;
    margin: 12px 0;
    font-size: 14px;
    color: #555;
}
.or-divider {
    margin: 15px 0;
    position: relative;
}
.or-divider span {
    background: #fff;
    padding: 0 10px;
    font-size: 12px;
    color: #777;
}
.or-divider:before {
    content: "";
    height: 1px;
    background: #ddd;
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    z-index: -1;
}
/*.google-login-btn {
    width: 100%;
    padding: 10px;
    color: #142247;
    border: 1px solid #ddd;
    background: url("../images/Google_Icon.svg")no-repeat;
    background-position: 55px 13px;
    border-radius: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    cursor: pointer;
}
.google-login-btn:hover{
    background-color: #b91c3a;
    color: #fff;
}*/
button.login-btn:hover {
    background-color: #b91c3a;
}
.login-popup .login-btn {
    text-align: center;
    font-weight: 600;
    color: #fff;
}

/* ===================== TOAST NOTIFICATION ===================== */
.custom-toast {
    position: fixed;
    bottom: 20px;
    right: 20px;
    min-width: 200px;
    max-width: 300px;
    padding: 12px 20px;
    border-radius: 8px;
    color: #fff;
    font-size: 14px;
    z-index: 99999;
    display: none;
    box-shadow: 0 4px 12px rgba(0,0,0,0.2);
    opacity: 0.95;
    pointer-events: none;
    transition: all 0.3s ease-in-out;
}

/* Success type */
.custom-toast.success {
    background-color: #28a745; /* green */
}

/* Error type */
.custom-toast.error {
    background-color: #dc3545; /* red */
}

/*27/02/2026*/

select#filter-city {
    width: 150px;
}
input#toggle-price {
    width: 230px;
}

select#filter-floor-plan {
    width: 200px;
}





@media(max-width:1024px){
    .available-homes-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:640px){
    .available-homes-grid{grid-template-columns:1fr;}
}
@media(max-width:1439px){
    select#filter-community {
        width: 305px;
    }
}
/*1366*/
@media(max-width:1365px){
    select#filter-sort {
        width: 205px;
    }
    .available-homes-filter input[type=text], .available-homes-filter select {
        padding: 7px 10px;
    }
    .available-homes-filter input, .available-homes-filter select{
        font-size: 13px;
        background-size: 35px !important;
    }
    select#filter-sort {
        width: 180px;
    }
    select#filter-community {
        width: 260px;
    }
    .beds-baths-dropdown #toggle-beds-baths {
        width: 320px;
    }
    input#toggle-price {
        width: 190px;
    }


}   
/*1280*/

@media(max-width:1279px){
/*    select#filter-city,input#toggle-price,select#filter-sort {
        width: 20%;
    }*/
    .beds-baths-dropdown #toggle-beds-baths,input#toggle-price{
        width: 100%;
    }
    .beds-baths-dropdown,select#filter-community,select#filter-city,.beds-baths-dropdown.Price-dropdown,select#filter-sort    {
        width: 32%;
    }
    .available-homes-filter {
        justify-content: flex-start;
    }
}   
/*1200*/

@media(max-width:1199px){
    .beds-baths-dropdown, select#filter-community, select#filter-city, .beds-baths-dropdown.Price-dropdown, select#filter-sort {
        width: 49%;
    }

}   
/*768*/

@media(max-width:649px){
    .beds-baths-dropdown, select#filter-community, select#filter-city, .beds-baths-dropdown.Price-dropdown, select#filter-sort {
        width: 100%;
    }

}   
/*320*/

