:root {
    --unicbe-blue: #1e2a4a;
    --unicbe-orange: #f37021;
    --unicbe-white: #ffffff;
    --unicbe-light-gray: #f0f2f5;
    --unicbe-dark-gray: #333333;
    --unicbe-medium-gray: #666666;
    --unicbe-red-error: #dc2626;
    --font-family: 'Inter', sans-serif;
}

html {
    scroll-behavior: smooth;
}

body {
    font-family: var(--font-family);
    background-color: var(--unicbe-light-gray);
}
.form-input {
    border-left: 4px solid var(--unicbe-orange);
    transition: all 0.2s;
}
.form-input:focus {
    border-left-color: var(--unicbe-blue);
    box-shadow: 0 0 0 1px var(--unicbe-blue);
}
.input-group {
    border-left: 4px solid var(--unicbe-orange);
    border: 1px solid var(--unicbe-medium-gray);
    transition: all 0.2s;
}
.input-group:focus-within {
    border-left-color: var(--unicbe-blue) !important;
    box-shadow: 0 0 0 1px var(--unicbe-blue);
    border-color: var(--unicbe-blue) !important;
}

.cta-button {
    transition: all 0.3s;
    background-color: var(--unicbe-orange);
}
.cta-button:hover {
    background-color: #e0661e; /* Um tom um pouco mais escuro de laranja */
    transform: scale(1.02);
}

/* Estilo para a mensagem de erro */
.error-message {
    color: var(--unicbe-red-error);
    font-size: 0.875rem; /* text-sm do Tailwind */
    margin-top: 0.25rem; /* mt-1 do Tailwind */
}

/* Estilos de erro que serão aplicados pelo JS */
.error-border {
    border-color: var(--unicbe-red-error) !important;
    border-left-color: var(--unicbe-red-error) !important;
    box-shadow: 0 0 0 1px var(--unicbe-red-error) !important;
}
.input-group.error-border {
    border-color: var(--unicbe-red-error) !important;
    box-shadow: 0 0 0 1px var(--unicbe-red-error) !important;
}