/*
 * Validação dos formulários do site — usado por wwwroot/js/lead-form.js.
 *
 * Os dois formulários (home e Contato) têm estilos próprios dentro das views;
 * aqui ficam só os estados de erro, que precisam ser iguais nos dois. O CTA da
 * home é um card escuro, então lá o erro é claro em vez de vermelho.
 */

/* Marcador de campo obrigatório no label. */
.form-obrigatorio {
    margin-left: 3px;
    color: #d93025;
    font-weight: 700;
}

.ix-form .form-obrigatorio {
    color: #ffc9c9;
}

/* Mensagem de erro logo abaixo do campo. */
.campo-erro {
    display: block;
    margin-top: 6px;
    font-family: 'Inter', sans-serif;
    font-size: 13px;
    line-height: 1.4;
    color: #d93025;
}

.ix-form .campo-erro {
    color: #ffc9c9;
}

/* Campo com erro. O !important vence os estilos do tema e das views. */
input.campo-invalido,
select.campo-invalido,
textarea.campo-invalido {
    border-color: #d93025 !important;
    box-shadow: 0 0 0 3px rgba(217, 48, 37, .12) !important;
}

.ix-form input.campo-invalido,
.ix-form select.campo-invalido,
.ix-form textarea.campo-invalido {
    border-color: #ffc9c9 !important;
    box-shadow: 0 0 0 3px rgba(255, 201, 201, .18) !important;
}

/* Dica fixa abaixo do grupo de contato (WhatsApp/e-mail). */
.form-dica {
    display: block;
    margin: -10px 0 18px;
    font-family: 'Inter', sans-serif;
    font-size: 12.5px;
    color: #6b7280;
}

.ix-form .form-dica {
    margin: 4px 0 0;
    color: rgba(255, 255, 255, .7);
}

/* Resumo do envio. A home já define as cores dela; aqui cobre a página de Contato. */
.ct-form__feedback.is-erro {
    color: #d93025;
}

.ct-form__feedback.is-sucesso {
    color: #147a3d;
}

.lead-form__whats {
    display: inline-block;
    margin-top: 8px;
    font-weight: 600;
}