<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>Connexion Admin - Portfolio</title>
    <script src="https://cdn.tailwindcss.com"></script>
  </head>
  <body class="min-h-screen bg-gray-100 flex items-center justify-center">
    <div class="bg-white p-8 rounded shadow-md w-96">
      <h1 class="text-xl font-bold mb-6">Connexion Admin</h1>

      @error('error')
        <div class="mb-4 p-3 bg-red-100 border border-red-400 text-red-700 rounded">
          {{ $message }}
        </div>
      @enderror

      <form action="/admin/login" method="post">
        {{{ csrfField() }}}
        <div class="mb-4">
          <label for="email" class="block text-sm font-medium text-gray-700 mb-1">Identifiant</label>
          <input
            type="text"
            name="email"
            id="email"
            value="{{ old('input.email') || '' }}"
            required
            class="w-full px-3 py-2 border border-gray-300 rounded focus:ring-2 focus:ring-blue-500"
          />
        </div>
        <div class="mb-6">
          <label for="password" class="block text-sm font-medium text-gray-700 mb-1">Mot de passe</label>
          <input
            type="password"
            name="password"
            id="password"
            required
            class="w-full px-3 py-2 border border-gray-300 rounded focus:ring-2 focus:ring-blue-500"
          />
        </div>
        <button
          type="submit"
          class="w-full bg-blue-600 text-white py-2 rounded hover:bg-blue-700"
        >
          Se connecter
        </button>
      </form>
    </div>
  </body>
</html>
