/* Estilos generales para el main */
.main-login {
    display: flex;
    justify-content: center; /* Centra horizontalmente */
    align-items: center; /* Centra verticalmente */
    height: 100vh; /* Ocupa toda la altura de la ventana */
    background-color: #f8f9fa30; /* Color de fondo suave */
}

/* Estilos para el div de login */
.login-div {
    background-color: #ffffff30; /* Fondo blanco */
    border-radius: 8px; /* Bordes redondeados */
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); /* Sombra sutil */
    padding: 40px; /* Espaciado interno */
    width: 400px; /* Ancho fijo para el formulario */
}

/* Estilos para el título del formulario */
.login-h2 {
    font-size: 1.8em; /* Tamaño de fuente */
    color: #ffffff; /* Color oscuro */
    text-align: center; /* Centrado */
    margin-bottom: 20px; /* Espaciado inferior */
}

/* Estilos para el formulario */
.form-login {
    display: flex;
    flex-direction: column; /* Organiza los elementos en columnas */
}

/* Estilos para las etiquetas */
label {
    font-size: 1em; /* Tamaño de fuente */
    margin-bottom: 5px; /* Espaciado inferior */
    color: #ffffff; /* Color del texto */
}

/* Estilos para los inputs */
.input-login {
    padding: 10px; /* Espaciado interno */
    border: 1px solid #ced4da; /* Color del borde */
    border-radius: 5px; /* Bordes redondeados */
    margin-bottom: 15px; /* Espaciado inferior */
    font-size: 1em; /* Tamaño de fuente */
}

/* Estilos para el botón */
.boton-login {
    padding: 10px; /* Espaciado interno */
    background-color: #007bff; /* Color de fondo */
    color: #ffffff; /* Color del texto */
    border: none; /* Sin borde */
    border-radius: 5px; /* Bordes redondeados */
    font-size: 1em; /* Tamaño de fuente */
    cursor: pointer; /* Cambia el cursor al pasar el mouse */
    transition: background-color 0.3s ease; /* Transición suave */
}

/* Estilos para el botón al pasar el mouse */
.boton-login:hover {
    background-color: #0056b3; /* Color más oscuro al pasar el mouse */
}
/* Estilos para el enlace de registro */
.refistro-login {
    display: inline-block; /* Permite padding y margen */
    margin-top: 20px; /* Espaciado superior */
    padding: 10px 15px; /* Espaciado interno */
    background-color: #28a745; /* Color de fondo verde */
    color: #ffffff; /* Color del texto */
    text-decoration: none; /* Sin subrayado */
    border-radius: 5px; /* Bordes redondeados */
    font-size: 1em; /* Tamaño de fuente */
    transition: background-color 0.3s ease; /* Transición suave para el color */
}

/* Estilos para el enlace de registro al pasar el mouse */
.refistro-login:hover {
    background-color: #218838; /* Color más oscuro al pasar el mouse */
}

/* Estilo de texto cuando el enlace no es un botón */
.refistro-login:active {
    background-color: #1e7e34; /* Color aún más oscuro cuando se hace clic */
}


.error-message {
    color: red; /* Color del texto de error */
    margin-bottom: 10px; /* Espacio debajo del mensaje */
}