/* Imagem de fundo para a página inteira */
body {
    background: #3c3c3c;
    background: linear-gradient(to right, #3c3c3c, #000); /* Gradiente para a cor de fundo */
    background-image: url('/assets/images/gallery/fundo_login.png'); /* Caminho para sua imagem local */
    background-size: cover; /* Faz a imagem cobrir toda a tela */
    background-position: center; /* Centraliza a imagem */
    background-attachment: fixed; /* A imagem ficará fixa enquanto a página rola */
    height: 100vh; /* Garante que a imagem cubra toda a altura da tela */
    margin: 0; /* Remove a margem padrão do body */
}

/* Imagem de fundo no card */
.card {
    width: 100%;
    max-width: 400px;
    background: rgba(0, 0, 0, 0.7); /* Cor do fundo do card */
    padding: 20px;
    border-radius: 8px;
    background-image: none; /* Remove imagem de fundo do card */
    background-size: auto;
    background-position: initial;
    background-attachment: scroll;
    background-repeat: repeat;
    backdrop-filter: blur(3px);
}

/* CSS para os campos de input */
.input_login {
    background: transparent !important; /* Fundo transparente */
    border: none; /* Remove a borda padrão */
    border-bottom: 2px solid rgba(255, 255, 255, 0.6); /* Linha branca com opacidade suave */
    color: white !important; /* Texto branco */
    padding: 10px 0; /* Maior espaçamento interno */
    padding-bottom: 10px; /* Mantém o espaço da parte inferior */
    width: 100%; /* Faz o campo ocupar toda a largura */
    box-sizing: border-box; /* Garante que o padding seja incluído na largura total */
    transition: all 0.3s ease; /* Suaviza a transição */
}

/* Efeito de foco no campo */
.input_login:focus {
    outline: none; /* Remove o contorno padrão ao focar no campo */
    border-bottom: 2px solid rgba(255, 255, 255, 1); /* Linha branca mais forte quando em foco */
    background: transparent !important; /* Garante fundo transparente */
    color: white !important; /* Garante que o texto continue branco */
}

/* Garantir que o texto do placeholder seja branco */
.input_login::placeholder {
    color: rgba(255, 255, 255, 0.5); /* Cor suave do placeholder */
}

/* Quando o campo já tem valor (informação salva), garantir que o estilo seja o mesmo */
.input_login:not(:placeholder-shown) {
    background: transparent !important; /* Fundo transparente mesmo quando o campo tem valor */
    border-bottom: 2px solid rgba(255, 255, 255, 0.6); /* Linha branca suave */
    color: white !important; /* Texto branco */
}

/* ==== Corrige o autofill do Chrome para ficar transparente + texto branco ==== */
input.input_login:-webkit-autofill,
input.input_login:-webkit-autofill:hover,
input.input_login:-webkit-autofill:focus,
input.input_login:-webkit-autofill:active {
    background-color: transparent !important;                     /* fundo transparente */
    -webkit-box-shadow: 0 0 0px 1000px transparent inset !important;
            box-shadow: 0 0 0px 1000px transparent inset !important; /* aplica sombra interna transparente */
    -webkit-text-fill-color: white !important;                   /* força texto branco */
    transition: background-color 5000s ease-in-out 0s;            /* mantém o fundo mesmo após load */
    border-bottom: 2px solid rgba(255,255,255,0.6) !important;   /* sua borda suave */
    font-family: inherit !important;
    
    
}



/* Ajuste para o placeholder em diversos navegadores */
.input_login::-webkit-input-placeholder {
    color: rgba(255, 255, 255, 0.5); /* Cor para Webkit browsers */
}

.input_login:-moz-placeholder {
    color: rgba(255, 255, 255, 0.5); /* Cor para Firefox */
}

.input_login::-moz-placeholder {
    color: rgba(255, 255, 255, 0.5); /* Cor para Firefox */
}

.input_login:-ms-input-placeholder {
    color: rgba(255, 255, 255, 0.5); /* Cor para Internet Explorer */
}



/* Ajuste da cor do texto das labels */
.form-signin label {
    color: white !important; /* Faz as labels ficarem brancas */
}

/* Ajustes adicionais para o layout */
.card {
    width: 100%; 
    max-width: 400px; 
    background: rgba(0, 0, 0, 0.7); /* Fundo escuro do card */
    padding: 20px; 
    border-radius: 8px;
    backdrop-filter: blur(3px);
}

/* Estilo do botão */
.form-signin .btn-dark {
    background-color: #343a40; /* Cor do botão */
}

/* Estilo do link */
.form-signin a {
    color: #007bff; /* Cor do link */
}

/* Estilo adicional para o texto de erro */
.alert {
    color: white; /* Cor do texto da mensagem de erro */
    background-color: rgba(255, 0, 0, 0.6); /* Cor de fundo das mensagens de erro */
}