<!DOCTYPE html>
<html lang="es">
  <head>
    <%- include("../partials/head") %>
  </head>

  <body>
    <%- include("../partials/header") %>

    <main class="container mx-auto w-30 main">
      <h1 class="h1 my-4">Iniciar sesión</h1>

      <!-- Comprobación de los errores devueltos por el formulario -->
      <%- include('../components/alert-errors.ejs') %>

      <!-- Comprobación de los errores devueltos por passport -->
      <%- include('../components/alerts.ejs') %>

      <form action="" method="POST">
        <div class="mb-3">
          <label for="name" class="form-label fw-bold text-muted"
            >Correo electrónico</label
          >
          <input type="text" name="email" id="email" class="form-control" />
        </div>

        <div class="mb-3">
          <label for="password" class="form-label fw-bold text-muted"
            >Contraseña</label
          >
          <input
            type="password"
            name="password"
            id="password"
            class="form-control"
          />
        </div>

        <div class="mb-3">
          <button class="btn btn-primary" type="submit">Ingresar</button>
        </div>
      </form>

      <form class="text-center" action="/auth/google" method="get">
        <button class="login-with-google-btn mt-4" type="submit">
          Iniciar sesión con Google
        </button>
      </form>
    </main>

    <%- include('../partials/footer.ejs') %>
  </body>
</html>
