/* LISTAGEM DE IMÓVEIS DA PARK (/locacao E /vendas): BUSCA À ESQUERDA, CARTÕES À DIREITA, PAGINAÇÃO EMBAIXO. */

/* BOTÃO "FILTRAR IMÓVEIS" PRESO NA BORDA ESQUERDA (CELULAR E TABLET) */
.listagem__filtro-celular {
    position: fixed;
    top: 13%;
    left: 0;
    z-index: 10;
    display: none;
}

.listagem__abrir-filtro {
    display: flex;
    gap: 8px;
    align-items: center;
    padding: 12px 17px;
    color: #fff;
    text-decoration: underline;
    background-color: var(--cor-site-1);
    border: 0;
    border-radius: 0 30px 30px 0;
}

.listagem__abrir-filtro svg {
    fill: #fff;
}

@media (max-width: 991px) {
    .listagem__filtro-celular {
        display: block;
    }
}

/* TÍTULO, TOTAL E ORDENAÇÃO */
.listagem__titulo {
    margin-top: 3rem;
    text-align: center;
}

.listagem__barra {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 3rem;
    margin-bottom: 1rem;
}

.listagem__total {
    float: left;
    color: #666;
}

.listagem__ordem-caixa {
    text-align: center;
}

/* ORDENAÇÃO: O SELETOR DA BUSCA (css/filtro.css) COM O TAMANHO E O FUNDO DO SELECT DO SITE ANTIGO */
.listagem__ordem-caixa .filtro {
    min-width: 190px;
    margin-bottom: 0;
}

.listagem__ordem-caixa .filtro__botao {
    height: 47px;
    padding: 0 34px 0 18px;
    line-height: 45px;
    color: #333;
    -webkit-user-select: none;
    user-select: none;
    background-color: #f8f9fa;
}

.listagem__ordem-caixa .filtro__menu {
    right: 0;
    left: auto;
}

/* GRADE: BUSCA + RESULTADO */
.listagem__largura {
    width: 100%;
    padding-right: 3rem;
    padding-left: 3rem;
    margin-right: auto;
    margin-left: auto;
}

.listagem__grade {
    display: grid;
    grid-template-columns: 350px 1fr;
    column-gap: 20px;
}

.resultado {
    display: flex;
    flex-wrap: wrap;
    height: max-content;
}

.resultado .padding-card {
    flex: 0 0 50%;
    max-width: 50%;
}

@media (min-width: 1321px) {
    .resultado .padding-card {
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }
}

@media (min-width: 1600px) {
    .resultado .padding-card {
        flex: 0 0 25%;
        max-width: 25%;
    }
}

@media (max-width: 600px) {
    .resultado .padding-card {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

.listagem__vazio {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.listagem__vazio h4 {
    text-align: center;
}

.listagem__voltar {
    display: inline-block;
    padding: .375rem .75rem;
    font-size: 1rem;
    line-height: 1.5;
    color: #fff;
    text-align: center;
    text-decoration: none;
    vertical-align: middle;
    background-color: #b0802a;
    border: 1px solid #b0802a;
    border-radius: .25rem;
}

.listagem__voltar:hover {
    color: #fff;
    background-color: #edc564;
    border-color: #edc564;
}

@media (max-width: 1024px) and (min-width: 993px) {
    .listagem__grade {
        grid-template-columns: 300px 1fr;
    }

    .listagem__largura {
        padding: 0 10px;
    }
}

@media (max-width: 992px) {
    .listagem__grade {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 991px) {
    .listagem__grade {
        display: flex;
        flex-direction: column;
    }

    .listagem__lateral {
        display: none;
    }
}

@media (max-width: 600px) {
    .listagem__largura {
        padding: 0 10px;
    }
}

/* BUSCA ("REFINE SUA BUSCA") */
.busca-lista--lateral {
    padding: 25px;
    color: #000;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .2);
}

.busca-lista__titulo {
    position: relative;
    padding-bottom: 10px;
    margin-bottom: 20px;
    font-size: 22px;
    font-weight: 600;
    color: var(--cor-site-1);
}

.busca-lista__titulo::after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 50px;
    height: 3px;
    content: "";
    background: var(--cor-site-3);
}

.busca-lista__faixa {
    display: flex;
    gap: 15px;
    margin-bottom: 10px;
}

.busca-lista__preco,
.busca-lista__area {
    position: relative;
    flex: 1;
}

.busca-lista__preco input,
.busca-lista__area input {
    width: 100%;
    height: 40px;
    padding: 10px 15px;
    font-size: 14px;
    color: var(--cor-site-5);
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 4px;
}

.busca-lista__preco input {
    padding-left: 35px;
}

.busca-lista__moeda {
    position: absolute;
    top: 50%;
    left: 12px;
    color: var(--cor-site-3);
    transform: translateY(-50%);
}

.busca-lista__unidade {
    position: absolute;
    top: 50%;
    right: 10px;
    font-size: 12px;
    color: var(--cor-site-1);
    transform: translateY(-50%);
}

.busca-lista__codigo {
    margin-bottom: 10px;
}

.busca-lista__palavra {
    margin-bottom: 25px;
}

.busca-lista__texto {
    display: block;
    width: 100%;
    height: 42px;
    padding: 10px 15px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    color: var(--cor-site-5);
    background: #fff;
    background-clip: padding-box;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}

.busca-lista__acoes {
    display: flex;
    gap: 20px;
    align-items: center;
    justify-content: space-between;
}

.busca-lista__limpar {
    font-size: 14px;
    color: var(--cor-site-1);
    cursor: pointer;
    transition: color .3s;
}

.busca-lista__limpar:hover {
    color: var(--cor-site-2);
    text-decoration: underline;
}

.busca-lista__buscar {
    display: flex;
    flex: 1;
    gap: 8px;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 200px;
    height: 50px;
    padding: 12px 25px;
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    background: var(--cor-site-1);
    border: none;
    border-radius: 8px;
    transition: all .3s;
}

.busca-lista__buscar:hover {
    color: #fff;
    background: var(--cor-site-2);
    box-shadow: 0 5px 15px rgba(0, 0, 0, .2);
    transform: translateY(-2px);
}

@media (max-width: 1024px) and (min-width: 993px) {
    .busca-lista__acoes {
        flex-direction: column;
        gap: 7px;
    }
}

@media (max-width: 768px) {
    .busca-lista--lateral {
        padding: 15px;
    }

    .busca-lista__faixa {
        flex-direction: column;
        gap: 10px;
    }

    .busca-lista__buscar {
        max-width: 100%;
    }
}

/* PAINEL "REFINE SUA BUSCA" DO CELULAR */
.filtro-celular {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    /* ACIMA DO BALÃO DO CHAT DO PAINEL (z-index 999999) E DOS AVISOS DO RODAPÉ (1000000) */
    z-index: 1000020;
    display: flex;
    flex-direction: column;
    width: 400px;
    max-width: 100%;
    visibility: hidden;
    background-color: #fff;
    background-clip: padding-box;
    border-right: 1px solid rgba(0, 0, 0, .2);
    outline: 0;
    transform: translateX(-100%);
    transition: transform .3s ease-in-out, visibility .3s;
}

.filtro-celular.aberto {
    visibility: visible;
    transform: none;
}

.filtro-celular__fundo {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000010;
    width: 100vw;
    height: 100vh;
    background-color: #000;
    opacity: .5;
}

.filtro-celular__fundo[hidden] {
    display: none;
}

.filtro-celular__topo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem;
}

.filtro-celular__titulo {
    margin-bottom: .5rem;
}

.filtro-celular__fechar {
    box-sizing: content-box;
    width: 1em;
    height: 1em;
    padding: .5rem;
    margin: -.5rem -.5rem -.5rem auto;
    color: inherit;
    background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center / 1em auto no-repeat;
    border: 0;
    border-radius: .25rem;
    opacity: .5;
}

.filtro-celular__fechar:hover {
    opacity: .75;
}

.filtro-celular__corpo {
    flex-grow: 1;
    height: 84%;
    /* ESPAÇO NO PÉ PARA A BARRA FIXA DOS BOTÕES NÃO COBRIR OS ÚLTIMOS FILTROS */
    padding: 0 1rem 96px;
    overflow-y: auto;
}

/* BARRA DOS BOTÕES PRESA NO PÉ DO PAINEL, COM FUNDO PRÓPRIO (ANTES FICAVA TRANSPARENTE POR CIMA DOS CAMPOS) */
.busca-lista__acoes--celular {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 2;
    flex-direction: row;
    gap: 20px;
    justify-content: center;
    padding: 14px 1rem;
    background-color: #fff;
    border-top: 1px solid #e2e8f0;
    box-shadow: 0 -4px 12px rgba(0, 0, 0, .06);
}

/* PAGINAÇÃO */
.paginacao {
    display: flex;
    justify-content: center;
    margin: 32px 0 16px;
}

.paginacao ul {
    display: flex;
    gap: 4px;
}

.paginacao li {
    display: flex;
    align-items: center;
}

.paginacao a,
.paginacao span {
    display: block;
    min-width: 36px;
    padding: 8px 14px;
    font-size: 16px;
    font-weight: 500;
    color: var(--cor-site-1);
    text-align: center;
    text-decoration: none;
    cursor: pointer;
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 6px;
    transition: background .22s, color .22s, border .22s;
}

.paginacao li.ativo a {
    font-weight: 700;
    color: #fff;
    pointer-events: none;
    cursor: default;
    background: var(--cor-site-1);
    border-color: var(--cor-site-1);
}

.paginacao a:hover {
    color: #fff;
    background: var(--cor-site-2);
    border-color: var(--cor-site-2);
}

.paginacao span {
    color: #888;
    cursor: default;
    background: #eee;
    border-color: #eee;
}

@media (max-width: 600px) {
    .paginacao a,
    .paginacao span {
        min-width: 28px;
        padding: 7px 8px;
        font-size: 14px;
    }

    .paginacao {
        margin: 18px 0 10px;
    }
}
