:root {
    --auth-bg-color: #ffffff; /* Fundo principal branco */
    --auth-card-bg-color: #f8f9fa; /* Fundo do card um pouco cinza (pode ser branco também) */
    --auth-text-color: #212529; /* Texto principal preto/cinza escuro */
    --auth-text-muted-color: #6c757d; /* Texto secundário/muted cinza */
    --auth-primary-orange: #fd7e14; /* Laranja principal */
    --auth-primary-orange-hover: #e66800; /* Laranja para hover */
    --auth-border-color: #dee2e6; /* Cor da borda */
}

/* Aplicar cores ao body e ao wrapper da página de autenticação */
body {
    background-color: var(--auth-bg-color);
    color: var(--auth-text-color);
}

.auth-page-wrapper {
    /* Pode adicionar um gradiente sutil ou imagem de fundo aqui se desejar */
}

/* Estilo do Card de Autenticação */
.auth-page-wrapper .card {
    background-color: var(--auth-card-bg-color);
    border: 1px solid var(--auth-border-color);
}

/* Títulos e Textos */
.auth-page-wrapper h5,
.auth-page-wrapper h3,
.auth-page-wrapper label {
    color: var(--auth-text-color);
}

.auth-page-wrapper p,
.auth-page-wrapper .text-muted {
    color: var(--auth-text-muted-color);
}

/* Inputs */
.auth-page-wrapper .form-control {
    background-color: #ffffff; /* Fundo do input branco */
    border-color: var(--auth-border-color);
    color: var(--auth-text-color);
}

.auth-page-wrapper .form-control:focus {
    border-color: var(--auth-primary-orange);
    box-shadow: 0 0 0 0.2rem rgba(253, 126, 20, 0.25); /* Sombra laranja no foco */
}

/* Botão Primário (Laranja) */
.auth-page-wrapper .btn-primary {
    background-color: var(--auth-primary-orange);
    border-color: var(--auth-primary-orange);
    color: #ffffff; /* Texto branco no botão laranja */
    transition: background-color 0.2s ease-in-out, border-color 0.2s ease-in-out; /* Micro-animação */
}

.auth-page-wrapper .btn-primary:hover,
.auth-page-wrapper .btn-primary:focus,
.auth-page-wrapper .btn-primary:active {
    background-color: var(--auth-primary-orange-hover);
    border-color: var(--auth-primary-orange-hover);
    color: #ffffff;
}

/* Links */
.auth-page-wrapper a {
    color: var(--auth-primary-orange);
}

.auth-page-wrapper a:hover {
    color: var(--auth-primary-orange-hover);
}

/* Opcional: Remover a imagem lateral ou ajustar seu fundo */
.auth-page-wrapper .auth-card {
     /* display: none; /* Descomente para remover a coluna lateral com a imagem */
     /* background-color: var(--auth-text-color); /* Mudar fundo da coluna lateral para preto */
}

/* Ajustes finos podem ser necessários dependendo da estrutura HTML exata */