/* Ajustando a fonte */
body {
    font-family: "Lato", sans-serif;
}

.main-head {
    height: 150px;
    background: #FFF;
}

.sidenav {
    height: 100%;
    background-color: #0e2c66;
    overflow-x: hidden;
    padding-top: 20px;
    text-align: center; /* Centraliza o conteúdo */
}

.main {
    padding: 0px 100px;
}

/* Responsividade para telas menores */
@media screen and (max-height: 450px) {
    .sidenav {
        padding-top: 15px;
    }
}

/* Responsividade para telas pequenas */
@media screen and (max-width: 450px) {
    .login-form {
        margin-left: 5%;  /* Ajusta a margem esquerda para centralizar mais à esquerda */
        margin-right: 5%; /* Ajusta a margem direita, se necessário */
    }

    .main {
        padding: 0px 20px; /* Ajusta o padding geral para telas menores */
    }

    .login-main-text {
        margin-top: 10%; /* Ajusta a margem superior, se necessário */
    }
}


/* Responsividade para telas maiores */
@media screen and (min-width: 768px) {
    .main {
        margin-left: 40%;
    }

    .sidenav {
        width: 40%;
        position: fixed;
        z-index: 1;
        top: 0;
        left: 0;
    }

    .login-form {
        margin-top: 60%;
    }

    .register-form {
        margin-top: 20%;
    }
}

.login-main-text {
    margin-top: 30%;
    padding: 20px;
    color: #fff;
    width: 90%; /* Responsivo para telas menores */
    margin-left: auto;
    margin-right: auto;
    text-align: center; /* Centraliza o texto */
}

.login-main-text img {
    max-width: 100%; /* Garante que a imagem não ultrapasse o container */
    height: auto;
}

.login-main-text h5 {
    margin-top: 0px;
    font-size: 1.5rem;
    color: #fff;
    position: relative;
    left: -31px; /* Move o texto 10px para a direita */
}


/* Estilizando os campos de entrada */
.form-control {
    padding: 15px;  /* Aumenta o tamanho do campo */
    font-size: 1rem; /* Aumenta o tamanho da fonte */
    border-radius: 25px; /* Bordas arredondadas */
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Sombra suave */
    transition: all 0.3s ease; /* Transição suave para o efeito de foco */
}

.form-control:focus {
    border-color: #0e2c66; /* Altera a cor da borda quando o campo está em foco */
    box-shadow: 0 0 10px rgba(14, 44, 102, 0.4); /* Aumenta a sombra no foco */
    outline: none; /* Remove a borda padrão de foco */
}

/* Estilizando o botão de envio */
.btn-primary {
    background-color: #0e2c66 !important;
    color: #fff;
    font-size: 1.2rem; /* Aumenta o tamanho da fonte do botão */
    padding: 12px; /* Aumenta o tamanho do botão */
    border-radius: 25px; /* Bordas arredondadas no botão */
    transition: all 0.3s ease; /* Transição suave */
}

.btn-primary:hover {
    background-color: #0b2447; /* Alterar a cor do botão quando o usuário passar o mouse */
}

/* Estilo para a mensagem de erro */
p {
    color: red;
}

.input-group-text {
  border-radius: 1.375rem; /* Arredonda o ícone para combinar com o campo */
  cursor: pointer; /* Para mostrar que o ícone é clicável */
}

.input-group-text i {
  font-size: 1.2rem; /* Ajusta o tamanho do ícone, se necessário */
}