/* =============================================================
   CADASTRE SEU IMÓVEL (anuncie-seu-imovel.php DO SITE ANTIGO, TEMA QUARTER): ABAS ltn__tab-menu-3, CAMPOS input-item
   COM O LÁPIS VERMELHO, LISTAS nice-select E OS BOTÕES btn-effect-1. LÁ HÁ DOIS .container E DOIS pb-120 UM DENTRO DO
   OUTRO: O FORMULÁRIO FICA 15PX PARA DENTRO DO TÍTULO E 240PX ACIMA DO RODAPÉ.
   ============================================================= */
.an-pagina {
    padding-bottom: 240px;
    color: var(--cor-paragrafo);
    font-size: 16px;
    line-height: 1.8;
}

.an-dentro {
    margin: 0 15px;
}

/* ABAS: TEXTO DE 20PX COM A LINHA E A BOLINHA VERMELHAS NA ATIVA */
.an-abas {
    margin-bottom: 50px;
    text-align: center;
}

.an-abas a {
    position: relative;
    display: inline-block;
    margin: 0 50px 10px 0;
    padding: 1px;
    border-bottom: 2px solid transparent;
    color: var(--cor-titulo);
    font-size: 20px;
    font-weight: 600;
    line-height: 1.2;
    transition: all .3s ease 0s;
}

.an-abas a:last-child {
    margin-right: 0;
}

.an-abas a::before {
    content: "";
    position: absolute;
    top: 100%;
    right: 45%;
    width: 10px;
    height: 10px;
    border: 3px solid transparent;
    border-radius: 100%;
    transform: translateY(-40%);
}

.an-abas a.is-ativa {
    border-color: var(--cor-site-1);
    color: var(--cor-site-1);
}

.an-abas a.is-ativa::before {
    background: var(--cor-site-1);
    border-color: #fff;
}

/* ETAPAS: SÓ A ATIVA APARECE (fade DO BOOTSTRAP) */
.an-etapa {
    display: none;
}

.an-etapa.is-ativa {
    display: block;
    animation: anAparece .15s linear;
}

@keyframes anAparece {
    from {
        opacity: 0;
    }
}

.an-subtitulo {
    margin: 0 0 15px;
    color: var(--cor-titulo);
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
}

/* .row: O QUE NÃO É COLUNA (SUBTÍTULO E A CAIXA DAS OBSERVAÇÕES) PEGA O 12PX DO BOOTSTRAP, AS COLUNAS O 15PX DO TEMA */
.an-linha {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -15px;
}

.an-linha > * {
    flex-shrink: 0;
    width: 100%;
    max-width: 100%;
    padding: 0 12px;
}

.an-linha > .an-metade,
.an-linha > .an-terco,
.an-linha > .an-quarto {
    padding: 0 15px;
}

/* CAMPOS: 65PX DE ALTURA, BORDA DE 2PX E 30PX ENTRE ELES; NO FOCO A BORDA FICA DE 1PX VERMELHA, COMO LÁ */
.an-campo {
    position: relative;
}

.an-input,
.an-select {
    display: block;
    width: 100%;
    height: 65px;
    margin: 0 0 30px;
    padding: 0 40px 0 20px;
    background: #fff;
    border: 2px solid #e4ecf2;
    border-radius: 0;
    box-shadow: none;
    color: var(--cor-paragrafo);
    font-family: var(--fonte);
    font-size: 16px;
}

.an-input:focus {
    border: 1px solid var(--cor-site-1);
    outline: none;
}

.an-input::placeholder {
    color: var(--cor-paragrafo);
    font-size: 14px;
    opacity: 1;
}

.an-input--texto {
    min-height: 150px;
    padding: 15px 20px;
    resize: vertical;
}

/* LISTAS (nice-select): BORDA MAIS CLARA, TEXTO EM NEGRITO DE 14PX E A SETA PARA BAIXO */
.an-select {
    padding: 0 30px 0 18px;
    border-color: #e5eaee;
    font-size: 14px;
    font-weight: 700;
    line-height: 60px;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
}

.an-select:focus {
    outline: none;
}

/* LÁPIS VERMELHO A 30PX DO TOPO (ÍCONE DA MENSAGEM, QUE LÁ VALE PARA TODOS OS CAMPOS); NA LISTA, A SETA NO MEIO */
.an-campo::before {
    content: "";
    position: absolute;
    top: 30px;
    right: 20px;
    z-index: 1;
    width: 1em;
    height: 1em;
    background: var(--cor-site-1);
    transform: translateY(-50%);
    pointer-events: none;
    -webkit-mask: var(--icone) center / contain no-repeat;
    mask: var(--icone) center / contain no-repeat;
    --icone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M410.3 231l11.3-11.3-33.9-33.9-62.1-62.1L291.7 89.8l-11.3 11.3-22.6 22.6L58.6 322.9c-10.4 10.4-18 23.3-22.2 37.4L1 480.7c-2.5 8.4-.2 17.5 6.1 23.7s15.3 8.5 23.7 6.1l120.3-35.4c14.1-4.2 27-11.8 37.4-22.2L387.7 253.7 410.3 231zM160 399.4l-9.1 22.7c-4 3.1-8.5 5.4-13.3 6.9L59.4 452l23-78.1c1.4-4.9 3.8-9.4 6.9-13.3l22.7-9.1v32c0 8.8 7.2 16 16 16h32zM362.7 18.7L348.3 33.2 325.7 55.8 314.3 67.1l33.9 33.9 62.1 62.1 33.9 33.9 11.3-11.3 22.6-22.6 14.5-14.5c25-25 25-65.5 0-90.5L453.3 18.7c-25-25-65.5-25-90.5 0zm-47.4 168l-144 144c-6.2 6.2-16.4 6.2-22.6 0s-6.2-16.4 0-22.6l144-144c6.2-6.2 16.4-6.2 22.6 0s6.2 16.4 0 22.6z'/%3E%3C/svg%3E");
}

.an-campo--lista::before {
    top: 32.5px;
    width: .75em;
    font-size: 14px;
    --icone: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 370.8 224 64c0-17.7-14.3-32-32-32s-32 14.3-32 32l0 306.7L54.6 265.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z'/%3E%3C/svg%3E");
}

/* BOTÕES (btn theme-btn-1 btn-effect-1 / btn-success mx-4): NO HOVER O BRANCO ENTRA DA ESQUERDA E O TEXTO ESCURECE */
.an-botao-caixa {
    text-align: center;
}

.an-botao-caixa--enviar {
    display: flex;
}

.an-botao {
    position: relative;
    z-index: 1;
    display: inline-block;
    overflow: hidden;
    padding: 17px 40px;
    background: var(--cor-site-1);
    border: 1px solid transparent;
    border-radius: 0;
    color: #fff;
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    text-align: center;
    text-transform: uppercase;
    cursor: pointer;
    transition: all .3s ease 0s;
}

.an-botao::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    width: 0;
    height: 100%;
    background: #fff;
    transition: all .3s;
}

.an-botao:hover {
    background: #000;
    color: var(--cor-titulo);
}

.an-botao:hover::after {
    width: 100%;
}

.an-botao--enviar {
    margin: 0 1.5rem;
    background: #198754;
    border-color: #198754;
}

.an-botao--enviar:hover {
    background: #157347;
    border-color: #146c43;
}

/* CAMPO-ARMADILHA CONTRA ROBÔ: FORA DA TELA */
.form-lead__armadilha {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

/* AVISO DO ENVIO SEM JAVASCRIPT (pages/partials/aviso-envio.php); COM JAVASCRIPT O RESULTADO SAI NA JANELINHA. */
.an-pagina .aviso {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 16px;
    padding: 12px 14px;
    border-radius: 8px;
    font-size: 14px;
}

.an-pagina .aviso--ok { background: #e9f7ef; color: #1e7e46; }
.an-pagina .aviso--erro { background: #fdecec; color: #b42318; }

@media (min-width: 768px) {
    .an-linha > .an-metade,
    .an-linha > .an-terco {
        width: 50%;
        max-width: 50%;
    }

    .an-linha > .an-quarto {
        width: 25%;
        max-width: 25%;
    }
}

@media (min-width: 992px) {
    .an-linha > .an-terco {
        width: 33.333333%;
        max-width: 33.333333%;
    }
}

@media (max-width: 1200px) {
    .an-abas a {
        margin-right: 30px;
        font-size: 18px;
    }
}

/* ATÉ 991PX: ABAS DE 14PX E TEXTO/SUBTÍTULOS MENORES (responsive.css DE LÁ) */
@media (max-width: 991px) {
    .an-pagina {
        font-size: 14px;
    }

    .an-abas a {
        margin-right: 20px;
        font-size: 14px;
    }

    .an-subtitulo {
        font-size: 15px;
    }
}

@media (max-width: 767px) {
    .an-subtitulo {
        font-size: 14px;
    }
}