/* Estilos generales del body para intranet */
.body_intranet {
    font-family: 'Orbitron', sans-serif;
    height: 100vh;
    display: flex;
    width: auto;
    justify-content: center;
    align-items: center;
    margin: -25%;
    padding: 0;
}

/* Contenedor del formulario */
.login-container {
    background-color: rgba(10, 10, 10, 0.526);
    border-radius: 20px;
    box-shadow: 0 10px 30px rgba(42, 91, 116, 0.329);
    text-align: center;
    width: 50%;
    
}

/* Estilo del título */
h1 {
    font-size: 2.5rem;
    margin-bottom: 20px;
    color: #00d4ff;
    text-shadow: 2px 2px 5px rgba(5, 50, 59, 0.7);
}

/* Grupo de inputs */
.input-group {
    display: flex;
    text-align: left;
    justify-content: center;
    align-items: center;
    text-align: center;
    margin: 2%;
}

/* Estilo de las etiquetas */
label {
    display: block;
    margin-bottom: 5px;
    margin: 4%;
    color: #c0deec;
}

/* Estilo de los campos de texto y contraseña */
input[type="text"],
input[type="password"] {
    width: 80%;
    padding: 12px;
    border: none;
    border-radius: 10px;
    background-color: rgba(14, 58, 68, 0.8);
    color: #ffffff;
    transition: background-color 0.3s ease;
}

input[type="text"]:focus,
input[type="password"]:focus {
    background-color: rgb(29, 53, 58);
    outline: none;
}

/* Botón de inicio de sesión */
button {
    background-color: #4991a0a3;
    color: #ffffff;
    padding: 12px 20px 12px 20px;
    border: none;
    border-radius: 10px;
    cursor: pointer;
    font-size: 1rem;
    margin: 5%;
    transition: background-color 0.3s ease, transform 0.3s ease;
}

button:hover {
    background-color: #14457db3;
    transform: translateY(-3px);
}

/* Efecto de animación al mover el mouse sobre los inputs */
input[type="text"]:hover, input[type="password"]:hover {
    box-shadow: 0 0 8px rgba(45, 59, 119, 0.8);
}

/* Ajustes para pantallas más pequeñas */
@media (max-width: 600px) {
    .login-container {
        width: 90%;
        padding: 20px;
    }

    h1 {
        font-size: 2rem;
    }
}
