.main-base-propiedades{
    padding-left: 2.5vw;

    @media (max-width:800px) {
        padding-left: 1.5vw;
      }
}
.contenedor-filtros-propiedades{
    width: 100%;
    min-height: 100vh;
    display: flex;
    padding: 1vh;
    /* border: solid 1px; */
    display: flex;
    gap: 3vw;

    @media (max-width:1000px) {
        flex-direction: column;
        align-items: center;
    }
}

/* FILTROS */
    .filtros{
        /* position: fixed; */
        /* border: solid 2px var(--grisOscuro); */
        border-radius: 1cap;
        /* padding: 1vh; */
        width: 15%;
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        box-shadow: 1px 1px 10px #c7c7c7;

        @media (max-width:1000px) {
            width: 100%;
        }
    }

    .h5-filtros{
        font-size: 3vh;
        background-color: var(--naranja);
        width: 100%;
        text-align: center;
        border-radius: .5cap .5cap 0 0;
        color: white;
        font-weight: 500;
    }

    .filtro-activo{
        /* border: solid 1px; */
        text-align: center;
        font-size: 1.5vh;
        font-weight: 400;
        color: var(--grisOscuro);
    }

    .contenido-filtros{
        display: flex;
        flex-direction: column;
        padding: 2vh 1vh;
        background-color: white;
        border-radius: 0 0 1cap 1cap;
        /* border: solid 1px; */
        width: 100%;
        gap: 1.5vh;
        /* @media (max-width:800px) {
            overflow-y: scroll;
            gap: 1vh;
            height: 30vh;
          } */

          @media (max-width:1000px) {
            flex-direction: row;
            align-items: center;
            overflow-x: scroll;
            padding: 5vh 0;
        }
    
    }

    .div-titulo-flecha{
        display: flex;
        justify-content: space-between;
        width: 100%;
        align-items: center;
        color: var(--grisOscuro);
        cursor: pointer;

        i{
            font-size: 1.5vh;
        }

        &:hover{
            color: var(--naranja);
        }

        @media (max-width:1000px) {
            gap: 1vh;
            width: max-content;
        }


    }
    
    
    .titulo-filtro{
        font-size: 1.8vh;
        font-weight: 500;
        @media (max-width:800px) {
            font-size: 1.5vh;
          }
    
    }

    .ul-filtros{
        display: none;
        flex-direction: column;
        gap: 1vh;
        /* background-color: white; */
        /* box-shadow: 2px 2px 20px #fca266; */
        padding: 1vh;
        /* border-radius: 1cap 0 0 1cap; */
        background-color: #ebebeb;
        max-height: 35vh;
        overflow-y: auto;
        border-radius: .5cap;
    
    }

    .ul-filtros-precio{
        border-radius: .5cap;
        @media (max-width:1000px) {
            width: 50vw;

        }

        label{
            @media (max-width:1000px) {
                font-size: 2vh;
    
            }
        }
    }

    /* .ul-filtros-ubicacion{
        height: 30vh;
        overflow-y: scroll;
    } */

    /* Personalizar el scrollbar */
    .ul-filtros::-webkit-scrollbar {
        width: 5px; /* Ancho del scrollbar */
        height: 10px; /* Altura del scrollbar horizontal */
    }
    
    /* Personalizar el track (fondo del scrollbar) */
    .ul-filtros::-webkit-scrollbar-track {
        background: var(--grisClaro); /* Color del fondo */
        border-radius: 5px; /* Bordes redondeados */
    }
    
    /* Personalizar el thumb (la parte que se mueve) */
    .ul-filtros::-webkit-scrollbar-thumb {
        background: var(--naranja); /* Color del scrollbar */
        border-radius: 5px; /* Bordes redondeados */
    }
    
    
    .ul-filtros a{
        text-decoration: none;
        color: var(--grisOscuro);
        font-size: 1.6vh;
        font-weight: 400;
    
        &:hover{
        color: var(--naranja);
        }
    }
    




/* PROPIEDADES */
    .propiedades{
        width: 85%;
        height: fit-content;
        display: flex;
        padding-left: 1vw;
        /* justify-content: center; */
        gap: 5vh;
        flex-wrap: wrap;

        @media (max-width:1000px) {
            gap: 2.5vh;
            width: 100%;
            justify-content: center;
            padding-left: 0;
        }
    }

    .div-propiedad{
        width: 25%;
        height:30vh;
        border-radius: 1cap;
        box-shadow: 1px 1px 10px #c7c7c7;
        /* padding: 5px; */

        &:hover{
            cursor: pointer;

            .img-propiedad{
                filter: brightness(.7);
            }

            .div-info-propiedad{
                background-color: #ededed;
            }

        }

        @media (max-width:1000px) {
            /* width: 30%; */
            min-width: 250px;
        }

        @media (max-width:600px) {
            width: 100%;
            height: 35vh;
        }
    }

    .div-img-propiedad{
        width: 100%;
        height: 60%;
        border-radius: 1cap 1cap 0 0;
    }

    .img-propiedad{
        width: 100%;
        height: 100%;
        border-radius: 1cap 1cap 0 0;
        /* filter: brightness(.8); */
    }

    .etiqueta-favorito, .etiqueta-nuevo-ingreso{
        position: absolute;
        padding: .5vh;
        z-index: 1;
        font-weight: 400;
        font-size: 1.5vh;
        border-radius: 0 1cap 1cap 0;
        margin-top: 25px;
        box-shadow: 1px 1px 5px rgb(119, 119, 119);
    }
    
    .etiqueta-favorito{
        background-color: gold;
        color: black;
    }
    
    .etiqueta-nuevo-ingreso{
        background-color: rgb(149, 221, 40);
        color: black;
    }
    

    .div-info-propiedad{
        background-color: rgb(255, 255, 255);
        width: 100%;
        height: 40%;
        border-top: solid 5px #ff7700;
        /* border: solid 1px; */
        display: flex;
        flex-direction: column;
        padding: 1vh;
        justify-content: space-between;
        border-radius: 0 0 1cap 1cap;
        /* align-items: center;
        overflow-x: hidden;
        flex-wrap: nowrap; */
    }

    .titulo-propiedad{
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        color: var(--grisOscuro);
        font-weight: 400;
        font-size: 1.5vh;

        @media (max-width:800px) {
            font-size: 2vh;
        }
    }

    .ubicacion-propiedad{
        text-align: center;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        color: var(--naranja);
        /* border-radius: .3cap; */
        font-weight: 600;
        font-size: 2.5vh;
        border-bottom: solid 2px #d8d8d8;
        /* border-top: solid 1px #d8d8d8; */

        @media (max-width:800px) {
            margin: .5vh 0;
        }

    }

    .div-precio-area{
        display: flex;
        /* border: solid 1px blue; */
        width: 100%;
        /* background-color: #dfdfdf; */
        /* border-radius: .5cap; */
        font-size: 1.5vh;
        font-weight: 500;
        color: var(--grisOscuro);
        /* align-items: center; */
        justify-content: space-evenly;

        i{
            color: var(--naranja);
        }

        @media (max-width:800px) {
            font-size: 2vh;
        }
    }

    .precio-propiedad, .area-propiedad{
        display: flex;
        align-items: baseline;
        justify-content: center;
        width: 100%;
        gap: .5vw;
    }


    .mensaje-error-filtros{
        color:var(--grisOscuro);
        text-align: center;
        font-weight: 500;
    }

