/* ===========================================================================
   BUSCA ("Busque seu imóvel", pages/partials/busca.php): NA HOME E NO TOPO DA LISTAGEM.
   =========================================================================== */

.busca {
    position: relative;
    padding: 30px 0 20px;
    background-color: #fff;
}

.busca__titulo {
    margin: 0 0 30px;
    font-size: 20px;
    font-weight: 500;
    line-height: 20px;
}

.busca__lupa {
    margin-right: 8px;
}

@media (max-width: 991px) {
    .busca__lupa { display: none; }
}

@media (max-width: 767px) {
    .busca__titulo { font-size: 16px; line-height: 16px; }
}

.busca__campo {
    float: left;
    width: 50%;
    margin-bottom: 13px;
}

.busca__campo--buscar,
.busca__campo--codigo {
    width: 100%;
}

@media (min-width: 768px) {
    .busca__campo--tipo,
    .busca__campo--cidade,
    .busca__campo--bairro,
    .busca__campo--faixa { width: 25%; }

    .busca__campo--avancada,
    .busca__campo--numero { width: 16.66666667%; }

    .busca__campo--buscar {
        float: right;
        width: 16.66666667%;
    }

    .busca__campo--codigo {
        width: 50%;
        margin-bottom: 0;
    }
}

@media (min-width: 992px) {
    .busca__campo--bairro,
    .busca__campo--faixa { width: 16.66666667%; }

    .busca__campo--codigo { width: 33.33333333%; }
}

.busca__botao {
    display: block;
    width: 100%;
    padding: 11px 15px;
    border: 0;
    border-radius: 4px;
    background-color: var(--azul);
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.42857;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
}

@media (max-width: 991px) {
    .busca__botao { padding: 15px; }
}

@media (max-width: 767px) {
    .busca__botao { font-size: 12px; }
    .busca__botao--buscar { font-weight: 400; }
}

.busca__botao--avancada {
    font-weight: 400;
}

.busca__botao--avancada .icone {
    margin-right: 6px;
    font-size: 15px;
}

/* NO "Buscar" A LUPA FLUTUA NA ESQUERDA E O TEXTO FICA NO MEIO. */
.busca__botao--buscar .icone {
    float: left;
    margin-top: 3px;
    margin-right: 5px;
}

@media (max-width: 767px) {
    .busca__botao--buscar .icone { margin-top: 1px; }
}

.busca__botao--buscar:hover,
.busca__botao--buscar:focus {
    background-color: var(--vermelho);
}

.busca__botao--buscar:active {
    background-color: var(--azul);
}

.busca__avancada {
    padding-top: 13px;
    transition: height .4s ease;
}

/* SÓ DURANTE O DESLIZE: ABERTA, A LISTA DOS SELETORES DE DENTRO PRECISA PASSAR DA BORDA. */
.busca__avancada.deslizando {
    overflow: hidden;
}

.busca__avancada::after {
    content: "";
    display: table;
    clear: both;
}

/* O form-control DO BOOTSTRAP: 34px EM QUALQUER LARGURA (O 50px DO TEMA PERDE PARA ELE). */
.busca__texto {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background-color: #fff;
    color: #555;
    font-size: 14px;
    font-weight: 300;
    line-height: 1.42857143;
    transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
}

.busca__texto::placeholder {
    color: #999;
}

.busca__texto:focus {
    border-color: #66afe9;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075), 0 0 8px rgba(102, 175, 233, .6);
}


/* A BUSCA DA FICHA ($buscaVariante = 'ficha'): SEM O RESPIRO DE BAIXO; TIPO, CIDADE E BAIRRO EM TERÇOS ATÉ 991px,
   EM QUARTOS ATÉ 1199px (O BAIRRO SÓ ESTREITA A PARTIR DE 1200px); OS DOIS BOTÕES EM METADES ATÉ 1199px, COM O
   "Buscar" SEMPRE À DIREITA. */
.busca--ficha {
    padding-bottom: 0;
}

/* NO DESKTOP O CABEÇALHO É FIXO E COBRIRIA A BUSCA DA FICHA (O SITE ANTIGO TINHA ESSE DEFEITO): ELA COMEÇA ABAIXO
   DELE (OS 75px DAS PÁGINAS INTERNAS) COM O RESPIRO DE SEMPRE. */
@media (min-width: 992px) {
    .busca--ficha { padding-top: 105px; }
}

.busca--ficha .busca__campo--buscar {
    float: right;
}

/* NO CELULAR, UM CAMPO POR LINHA; A "Busca Avançada" NÃO TEM O RESPIRO DE BAIXO DOS OUTROS. */
.busca--ficha .busca__campo--tipo,
.busca--ficha .busca__campo--cidade,
.busca--ficha .busca__campo--bairro,
.busca--ficha .busca__campo--avancada {
    width: 100%;
}

.busca--ficha .busca__campo--avancada {
    margin-bottom: 0;
}

@media (min-width: 768px) {
    .busca--ficha .busca__campo--tipo,
    .busca--ficha .busca__campo--cidade,
    .busca--ficha .busca__campo--bairro { width: 33.33333333%; }

    .busca--ficha .busca__campo--avancada,
    .busca--ficha .busca__campo--buscar { width: 50%; }
}

@media (min-width: 992px) {
    .busca--ficha .busca__campo--tipo,
    .busca--ficha .busca__campo--cidade,
    .busca--ficha .busca__campo--bairro { width: 25%; }
}

@media (min-width: 1200px) {
    .busca--ficha .busca__campo--bairro,
    .busca--ficha .busca__campo--avancada,
    .busca--ficha .busca__campo--buscar { width: 16.66666667%; }
}

/* "Limpar Filtro" (SÓ NA LISTAGEM, NO FIM DA BUSCA AVANÇADA): O MESMO BOTÃO DO "Buscar", COM O X NO LUGAR DA LUPA. */
.busca__limpar,
.busca__limpar:hover,
.busca__limpar:focus {
    color: #fff;
    text-decoration: none;
}

/* TUDO NA MESMA ALTURA (pedido do Sami): BOTÕES, CAIXAS DE ESCOLHA E O CAMPO DO CÓDIGO COM 34px NO DESKTOP E 50px
   ATÉ 991px (A ALTURA DAS CAIXAS DE ESCOLHA DO SITE ANTIGO). NO SITE ANTIGO OS BOTÕES TINHAM 42px. */
.busca__botao {
    height: 34px;
    padding-top: 0;
    padding-bottom: 0;
    line-height: 34px;
}

/* A LUPA (E O X DO "Limpar Filtro") NO MEIO DA ALTURA, À ESQUERDA, COM O TEXTO CENTRALIZADO, COMO ANTES. */
.busca__botao--buscar {
    position: relative;
}

.busca__botao--buscar .icone {
    position: absolute;
    top: 50%;
    left: 15px;
    float: none;
    margin: 0;
    transform: translateY(-50%);
}

@media (max-width: 991px) {
    .busca__botao,
    .busca__texto { height: 50px; }

    .busca__botao { line-height: 50px; }
}

/* TABLET (768 A 991px): TIPO, CIDADE E BAIRRO EM TERÇOS NA PRIMEIRA LINHA E OS DOIS BOTÕES MEIO A MEIO NA SEGUNDA.
   NO SITE ANTIGO A PRIMEIRA LINHA SOMAVA MAIS DE 100% (3 x 25% + 2 x 16,7%) E O "Buscar" CAÍA SOZINHO. */
@media (min-width: 768px) and (max-width: 991px) {
    .busca__campo--tipo,
    .busca__campo--cidade,
    .busca__campo--bairro { width: 33.33333333%; }

    .busca__campo--avancada,
    .busca__campo--buscar { width: 50%; }
}

/* 992 A 1199px: O BOTÃO TEM ~130px E "Busca Avançada" COM A ENGRENAGEM NÃO CABIA (VAZAVA PARA FORA). */
@media (min-width: 992px) and (max-width: 1199px) {
    .busca__botao {
        padding-right: 8px;
        padding-left: 8px;
        font-size: 13px;
    }

    .busca__botao--buscar .icone { left: 10px; }
}
