<div class="flex items-center justify-center min-h-screen bg-gray-50">
  <form method="POST" action="?/login" class="flex flex-col space-y-4 bg-white p-8 rounded border border-gray-300 w-80 shadow-none">
    <h2 class="text-2xl font-semibold text-center mb-4">Login</h2>
    <label class="flex flex-col text-gray-700">
      Email
      <input
        name="email"
        type="email"
        class="mt-1 px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-200"
        required
      />
    </label>
    <label class="flex flex-col text-gray-700">
      Password
      <input
        name="password"
        type="password"
        class="mt-1 px-3 py-2 border border-gray-300 rounded focus:outline-none focus:ring-2 focus:ring-blue-200"
        required
      />
    </label>
    <button
      type="submit"
      class="w-full py-2 bg-blue-600 text-white rounded hover:bg-blue-700 transition"
    >
      Login
    </button>
    <div class="text-center text-sm text-gray-500 mt-2">
      Don't have an account?
      <a href="/auth/signup" class="text-blue-600 hover:underline">Signup</a>
    </div>
  </form>
</div>