{% extends "ui/templates/base/layout.html" %}
{% block content %}
  <div class="max-w-md rounded-2xl bg-white border p-6">
    <h1 class="text-2xl font-semibold">Login</h1>
    <p class="text-slate-600 mt-1 text-sm">Use bootstrap admin (first run). Lockout + CSRF are enabled.</p>

    <form method="post" class="mt-5 grid gap-3">
      <input type="hidden" name="csrf_token" value="{{ csrf_token }}" />

      <label class="grid gap-1">
        <span class="text-sm text-slate-600">Email</span>
        <input class="border rounded-xl px-3 py-2" name="email" type="email" required />
      </label>

      <label class="grid gap-1">
        <span class="text-sm text-slate-600">Password</span>
        <input class="border rounded-xl px-3 py-2" name="password" type="password" required />
      </label>

      <button class="rounded-xl bg-slate-900 text-white px-4 py-2 text-sm mt-2" type="submit">Sign in</button>
    </form><div class="mt-4 text-sm"><a class="text-brand-700 underline" href="/forgot-password">Forgot password?</a></div>
  </div>
{% endblock %}