{% extends "base.html" %}
{% block title %}Login — Ageri{% endblock %}

{% block body %}
<div class="min-h-screen flex items-center justify-center px-4">
  <div class="w-full max-w-sm">
    <div class="text-center mb-8">
      <div class="inline-flex items-center justify-center w-14 h-14 rounded-2xl bg-gradient-to-br from-accent to-teal mb-4">
        <span class="text-white font-bold text-2xl">A</span>
      </div>
      <h1 class="text-xl font-bold text-white">Welcome back</h1>
      <p class="text-slate-400 text-sm mt-1">Enter your Ageri password to continue</p>
    </div>

    {% if error %}
    <div class="mb-4 px-4 py-3 rounded-lg bg-red-900/30 border border-red-700/50 text-red-300 text-sm">
      {{ error }}
    </div>
    {% endif %}

    <div class="bg-panel border border-border rounded-2xl p-8">
      <form method="POST" action="/login" class="space-y-4">
        <input type="hidden" name="next" value="{{ next }}">
        <input
          type="password"
          name="password"
          placeholder="Password"
          autofocus
          class="w-full bg-surface border border-border rounded-lg px-4 py-3 text-white text-sm placeholder-slate-500"
        >
        <button type="submit"
          class="w-full py-3 rounded-lg bg-accent hover:bg-indigo-500 text-white font-semibold text-sm transition-colors">
          Sign in
        </button>
      </form>
    </div>
  </div>
</div>
{% endblock %}