/***** CARD IMOVEL *****/
.card-imovel-wrapper {
  height: 100%;
}

.card-imovel {
  background-color: white;
  position: relative;
  display: flex;
  flex-direction: column;
  border: 1px solid #ddd;
  border-radius: 6px;
  overflow: hidden;
  cursor: pointer;
  box-shadow: none;
  transition: box-shadow 0.15s ease;
  height: 100%;
}

.card-imovel:hover .contact {
  color: white;
  background-color: #ed7203; 
}

.card-imovel:hover {
  box-shadow: 0px 0px 13px rgba(0, 0, 0, 0.15);
}

.card-imovel .link-imovel {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0; 
}

.card-imovel .inner-link {
  z-index: 1; 
}

.card-imovel .marcar-favorito {
  position: absolute;
  top: 12px;
  right: 15px;
  font-size: 24px;
  color: white;
  cursor: pointer;
  z-index: 1;
}

.card-imovel:not(.grid) .carousel-card-imovel .imovel-tour-virtual {
  position: absolute;
  top: 6%;
  z-index: 1;
  right: 2.5%;
  color: #ffffffba;
  background-color: #0000008f;
  list-style: none;
  border-radius: 1.2rem;
  font-size: 12px;
}

.card-imovel .imovel-codigo {
  font-size: 12px;
  color: #666; 
}

.card-imovel .imovel-title .tipo {
  font-size: 16px;
  font-weight: 700; 
}

.card-imovel .imovel-title .endereco {
  font-size: 13px;
  font-weight: 500;
  color: #555; 
}

.card-imovel .imovel-caracteristicas {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  font-size: 15px;
  margin-top: 8px;
  color: #555; 
}

.card-imovel .imovel-caracteristicas .caracteristica {
  overflow: hidden;
  padding-right: 4px; 
}

.card-imovel .texto-anuncio {
  display: block;
  overflow: hidden;
  max-height: 40px;
  line-height: 14px;
  font-size: 12px;
  font-weight: 300;
  word-break: break-word;
  color: #666; 
}

.card-imovel .imovel-valor {
  margin-bottom: 12px; 
}

.card-imovel .imovel-valor .valor {
  font-size: 20px;
  font-weight: 600;
  color: #ed7203; 
}

.card-imovel .imovel-valor .condominio {
  font-size: 12px;
  font-weight: 500;
  color: #999; 
}

.card-imovel .info-bottom {
  display: flex;
  flex-flow: column;
  margin-top: auto; 
}

.card-imovel .actions {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  font-size: 12px;
  text-align: center;
  font-weight: 600; 
}

.card-imovel .contact {
  padding: 4px 6px;
  border-radius: 4px;
  text-decoration: none; 
}

.card-imovel .prev-icon,
.card-imovel .next-icon {
  color: white;
  padding: 3px 6px;
  border-radius: 2px;
  background-color: rgba(0, 0, 0, 0.8); 
}

.card-imovel .carousel-card-imovel {
  width: 100%; 
}

.card-imovel .carousel-card-imovel .imovel-sem-fiador {
  position: absolute;
  z-index: 1;
  bottom: 8px;
  left: 8px;
}

.card-imovel .carousel-card-imovel .imovel-sem-fiador .img-selo {
  width: 65px;
  height: 65px; 
}

.card-imovel .carousel-card-imovel .imovel-construcao {
  position: absolute;
  bottom: 6%;
  z-index: 1;
  border: 1px solid purple;
  right: 6.3%;
  padding: 2px 6px;
  color: white;
  background-color: purple;
  list-style: none;
  border-radius: 1.2rem;
  font-size: 12px; 
}

.card-imovel.grid .carousel-card-imovel img,
.card-imovel.grid .swiper-container,
.card-imovel.grid .swiper-wrapper,
.card-imovel.grid .swiper-slide {
  height: 200px;
  object-fit: cover; 
}

.card-imovel .carousel-card-imovel img,
.card-imovel .swiper-slide {
    width: 100%; 
}


.card-imovel .imovel-info {
  position: relative;
  padding: 21px 21px;
  display: flex;
  flex-flow: column;
  justify-content: flex-start; 
}

/***** SKELETON *****/
.skeleton .card-imovel {
    height: 468px;
    border: 1px solid #ddd;
    margin-bottom: 18px;
    display: flex;
    flex-flow: row wrap; 
    cursor: default;
}

.skeleton .card-imovel:hover {
  box-shadow: none;
}

  .skeleton .card-imovel.grid {
    height: 468px; 
}
  .skeleton .card-imovel.grid .carousel-card-imovel-placeholder {
    height: 200px;
    width: 100%; 
}
  .skeleton .card-imovel .carousel-card-imovel-placeholder {
    height: 200px;
    width: 100%; 
}
  .skeleton .card-imovel .imovel-info,
  .skeleton .card-imovel .subtitle,
  .skeleton .card-imovel .description {
    margin-bottom: 2rem; 
}
  .skeleton .card-imovel .imovel-info {
    display: flex;
    flex-flow: column;
    flex: 1;
    padding: 12px; 
}
  .skeleton .card-imovel .title {
    margin-bottom: 1rem;
    height: 18px;
    width: 60%; 
}
  .skeleton .card-imovel .subtitle {
    height: 16px;
    width: 40%; 
}
  .skeleton .card-imovel .description {
    height: 60px;
    width: 80%; 
}
  .skeleton .card-imovel .value {
    margin-top: auto;
    height: 16px;
    width: 25%; 
}


/* MD */
@media (min-width: 768px) {
    .skeleton .card-imovel {
        height: 250px; 
    }
    .skeleton .card-imovel .carousel-card-imovel-placeholder {
        height: 100%;
        width: 300px; 
    }
    .imoveis .card-imovel:not(.grid) {
        flex-direction: row;
        height: 270px; 
    }
    .imoveis .card-imovel:not(.grid) .carousel-card-imovel {
        max-width: 360px;
        min-width: 280px;
        position: relative;
        display: block; 
    }
    .imoveis .card-imovel:not(.grid) .carousel-card-imovel,
    .imoveis .card-imovel:not(.grid) .carousel-card-imovel .carousel-item,
    .imoveis .card-imovel:not(.grid) .carousel-card-imovel .carousel-inner {
        height: 100%; 
    }
    .imoveis .card-imovel:not(.grid) .carousel-card-imovel img,
    .imoveis .card-imovel:not(.grid) .swiper-slide {
        height: 100%;
    }

    .imoveis .card-imovel:not(.grid) .marcar-favorito {
        color: #642D8F; 
    }
    .imoveis .card-imovel:not(.grid) .imovel-info {
        width: 100%; 
    }
    .imoveis .card-imovel:not(.grid) .imovel-info .imovel-title,
    .imoveis .card-imovel:not(.grid) .imovel-info .imovel-caracteristicas,
    .imoveis .card-imovel:not(.grid) .imovel-info .texto-anuncio,
    .imoveis .card-imovel:not(.grid) .imovel-info .info-bottom {
        max-width: 100%; 
    }
    .imoveis .card-imovel:not(.grid) .imovel-info .ultima-atualizacao {
        font-size: 12px; 
    }
    .imoveis .card-imovel:not(.grid) .imovel-info .imovel-caracteristicas {
        justify-content: flex-start; 
    }
    .imoveis .card-imovel:not(.grid) .imovel-info .imovel-caracteristicas .caracteristica {
        margin-right: 15px; 
    }
    .imoveis .card-imovel:not(.grid) .imovel-info .imovel-caracteristicas .caracteristica .descricao {
        display: inline; 
    }
    .imoveis .card-imovel:not(.grid) .imovel-info .info-bottom {
        margin-top: auto;
        flex-flow: row;
        justify-content: space-between; 
    }
    .imoveis .card-imovel:not(.grid) .imovel-info .info-bottom .imovel-valor {
        margin: 0; 
    }
    .imoveis .card-imovel:not(.grid) .imovel-info .info-bottom .actions {
        text-align: right;
        align-self: flex-end;
        display: block; 
    }
}
