body {
    font-family: Arial, sans-serif;
    background-color: #f0f8ff; /* Color de fondo azul claro */
    color: #333; /* Color del texto */
    margin: 0;
    padding: 0; /* Eliminar relleno global */
    display: flex; /* Flexbox para centrar */
    flex-direction: column; /* Alineación vertical */
    align-items: center; /* Centrado horizontal */
    justify-content: flex-start; /* Alinear elementos en la parte superior */
    height: 100vh; /* Altura completa de la ventana */
    padding-top: 50px; /* Espaciado desde la parte superior */
}

h2 {
    color: #003366; /* Color del encabezado azul oscuro */
    text-align: center;
    margin-bottom: 20px; /* Espaciado entre el título y los botones */
}

button {
    background-color: #007bff; /* Color de fondo del botón azul */
    color: white; /* Color del texto en el botón */
    border: none;
    padding: 10px 20px;
    margin: 10px; /* Espaciado entre botones */
    cursor: pointer;
    border-radius: 5px; /* Bordes redondeados */
    transition: background-color 0.3s;
    text-align: center;
    display: inline-block; /* Asegura que los botones respeten el flujo */
}

button:hover {
    background-color: #0056b3; /* Color de fondo del botón al pasar el mouse */
}

form {
    background-color: white; /* Fondo del formulario blanco */
    padding: 20px;
    border-radius: 5px; /* Bordes redondeados para el formulario */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); /* Sombra suave */
    max-width: 400px; /* Ancho máximo del formulario */
    margin: 20px auto; /* Centrar el formulario */
}

label {
    display: block; /* Hacer que las etiquetas ocupen toda la línea */
    margin-bottom: 10px;
}

input[type="email"],
input[type="password"],
input[type="text"] {
    width: 90%; /* Ancho completo */
    padding: 10px;
    margin-top: 5px;
    border: 1px solid #007bff; /* Borde azul */
    border-radius: 5px; /* Bordes redondeados para los campos de entrada */
}

input[type="email"]:focus,
input[type="password"]:focus,
input[type="text"]:focus {
    border-color: #0056b3; /* Color del borde al enfocar */
    outline: none; /* Quitar el borde por defecto */
}

button[type="submit"] {
    background-color: #28a745; /* Color de fondo del botón de enviar */
}

button[type="submit"]:hover {
    background-color: #218838; /* Color de fondo al pasar el mouse */
}