{% extends "admin/base.html" %}

{% block title %}Admin Login{% endblock %}

{% block content %}
<div class="min-h-screen flex items-center justify-center">
    <div class="max-w-md w-full bg-black/20 backdrop-blur-xl border border-white/20 rounded-lg shadow-lg p-8">
        <h2 class="text-2xl font-bold text-center mb-6 text-white">Admin Login</h2>
        
        {% include 'partials/_flash_messages.html' %}

        <form action="{{ url_for('admin_login_post') }}" method="post">
            <input type="hidden" name="csrf_token" value="{{ csrf_token }}">
            <div class="mb-4">
                <label for="username" class="block text-sm font-medium text-gray-300">Username</label>
                <input type="text" name="username" id="username" required autocomplete="username" class="mt-1 block w-full px-3 py-2 bg-white/10 border border-white/20 rounded-md shadow-sm text-white focus:outline-none focus:ring-[var(--color-primary-500)] focus:border-[var(--color-primary-500)] sm:text-sm">
            </div>
            <div class="mb-6">
                <label for="password" class="block text-sm font-medium text-gray-300">Password</label>
                <input type="password" name="password" id="password" required autocomplete="current-password" class="mt-1 block w-full px-3 py-2 bg-white/10 border border-white/20 rounded-md shadow-sm text-white focus:outline-none focus:ring-[var(--color-primary-500)] focus:border-[var(--color-primary-500)] sm:text-sm">
            </div>
            <div>
                <button type="submit" class="w-full flex justify-center py-2 px-4 border border-transparent rounded-md shadow-sm text-sm font-medium text-white bg-[var(--color-primary-600)] hover:bg-[var(--color-primary-700)] focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-[var(--color-primary-500)]">
                    Sign in
                </button>
            </div>
        </form>
    </div>
</div>
{% endblock %}