/* Listagem de imóveis (/imoveis) — Fase 3.3 */

.pagina-imoveis {
  padding: 32px 20px 64px;
}

.pagina-imoveis__cabecalho {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 24px;
}

.pagina-imoveis__contagem {
  color: var(--cinza-texto-suave);
  font-weight: 400;
  font-size: 1rem;
}

.pagina-imoveis__ordenar {
  display: flex;
  align-items: center;
  gap: 10px;
}

.pagina-imoveis__ordenar .select {
  width: auto;
  padding: 10px 14px;
}

.pagina-imoveis__botao-filtros {
  display: none;
}

.pagina-imoveis__corpo {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 32px;
  align-items: start;
}

.filtros-imoveis {
  position: sticky;
  top: 92px;
  background: var(--branco);
  border-radius: 0;
  box-shadow: var(--sombra-card);
  padding: 20px;
}

.filtros-imoveis__topo {
  display: none;
}

.filtros-imoveis__form {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.filtros-imoveis__acoes {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 6px;
}

.filtros-imoveis__limpar {
  text-align: center;
  font-size: 0.85rem;
  color: var(--cinza-texto);
  text-decoration: underline;
}

.pagina-imoveis__vazio {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  padding: 40px;
  border-radius: 0;
  background: var(--cinza-fundo);
  color: var(--cinza-texto);
}

/* Fundo atrás do painel de filtros (só existe no celular) */
.filtros-fundo {
  display: none;
}

@media (max-width: 860px) {
  .pagina-imoveis__corpo {
    grid-template-columns: 1fr;
  }

  .pagina-imoveis__botao-filtros {
    display: inline-flex;
  }

  .filtros-imoveis {
    position: fixed;
    inset: 0 0 0 auto;
    top: 0;
    height: 100%;
    width: min(320px, 85vw);
    transform: translateX(100%);
    transition: transform var(--transicao);
    z-index: 200;
    border-radius: 0;
    overflow-y: auto;
  }

  .filtros-imoveis--aberto {
    transform: translateX(0);
  }

  .filtros-imoveis__topo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-weight: 700;
    margin-bottom: 16px;
  }

  .filtros-imoveis__fechar {
    border: 0;
    background: transparent;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    padding: 10px;
    margin: -10px;
  }

  .filtros-fundo {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 150; /* acima do header (100), abaixo do painel (200) */
    background: rgba(13, 13, 13, 0.35);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    opacity: 0;
    visibility: hidden;
    /* esconde só depois do fade, senão some de estalo */
    transition: opacity var(--transicao), visibility 0s linear 0.3s;
  }

  .filtros-fundo--visivel {
    opacity: 1;
    visibility: visible;
    transition: opacity var(--transicao);
  }

  /* Trava a rolagem da página enquanto o painel está aberto. A regra fica
     dentro desta faixa de propósito: quem abrir o painel e alargar a janela
     volta a rolar, mesmo com o painel ainda marcado como aberto. */
  body.filtros-aberto {
    overflow: hidden;
  }
}


.pagina-imoveis__titulo {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.pagina-imoveis__termo {
  margin: 0;
  font-size: 0.9rem;
  color: var(--cinza-texto);
}

.pagina-imoveis__limpar {
  margin-left: 8px;
  color: var(--vermelho);
}
