/* =========================================
   ESTILO DA PÁGINA DE LOGIN (v2.0)
   ========================================= */

:root {
    --cor-header-fundo: #1E3170;
    --cor-header-texto-icones: #C2A146;
    
    /* ✅ NOVO: UM TOM DE AZUL MAIS FRACO */
    --cor-azul-fraco: #6A89C8; 
}

body.login-page {
    font-family: 'Montserrat', sans-serif;
    min-height: 100vh;
    
   
   
}

.login-wrapper {
    /* Caminho absoluto para a foto (correto) */
    background-image: url('2.png'); 
    
    /* Mostra a foto inteira sem cortes */
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    /* ✅ USA O NOVO AZUL FRACO */
    /* Preenche o espaço vazio (em cima/em baixo) com o azul mais claro */
  background-attachment: fixed;
    
 
background-position: center center;
 /* Efeito suave e centralizado */
filter: brightness(0.85);
  
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    padding: 20px;
    box-sizing: border-box; 
}

.login-box {
    /* MAIS TRANSPARENTE (0.8) */
    background: rgba(255, 255, 255, 0.4); 
    
    /* A borda dourada no "cartão" */
    border: 2px solid var(--cor-header-texto-icones);
    
    /* ✅ BORDAS MAIS MACIAS */
    /* Aumentado de 16px para 24px */
    border-radius: 24px; 
    
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1); /* Sombra suave */
    backdrop-filter: blur(6px); /* Efeito de "vidro" */
    padding: 2.5rem;
    width: 100%;
    max-width: 450px;
}

.login-box .logo {
    font-family: 'Damion', cursive;
    font-size: 3rem;
    color: var(--cor-header-fundo); 
    margin: 0;
}
.login-box .logo span {
    color: var(--cor-header-texto-icones); 
}

.login-box .form-label {
    font-weight: 600;
    color: #333;
}

.login-box .form-control {
    padding: 12px;
    border-radius: 8px;
    border: 1px solid #ddd;
}
.login-box .form-control:focus {
    border-color: var(--cor-header-fundo);
    box-shadow: 0 0 0 3px rgba(30, 49, 112, 0.15);
}

.login-box .btn-primary {
    background-color: var(--cor-header-fundo);
    border-color: var(--cor-header-fundo);
    font-weight: 600;
    padding: 12px;
    font-size: 1rem;
    border-radius: 8px;
    transition: all 0.2s ease;
}
.login-box .btn-primary:hover {
    background-color: #152450;
    border-color: #152450;
    box-shadow: 0 4px 12px rgba(30, 49, 112, 0.2);
}
.password-wrapper {
    position: relative;
}

/* ✅ --- CORREÇÃO DE ALINHAMENTO --- ✅ */
.password-toggle-icon {
    position: absolute;
    /* Posição corrigida para alinhar verticalmente com o input */
    /* Remove 'top' e 'transform' */
    bottom: 14px; 
    right: 15px;
    color: #6c757d; 
    cursor: pointer;
    z-index: 10;
}
/* O @media query foi removido por não ser mais necessário */
/* ✅ --- FIM DA CORREÇÃO --- ✅ */


/* Adiciona espaço no input para o ícone não sobrepor o texto */
.login-box .form-control[type="password"],
.login-box .form-control[type="text"].form-control {
    padding-right: 45px !important;
}