{% extends 'base.html' %}

{% block title %}Connexion Admin{% endblock %}

{% block content %}
<div class="max-w-md mx-auto bg-white p-8 rounded-xl border border-gray-100 shadow-lg mt-12">
    <h1 class="text-2xl font-bold text-gray-900 mb-6 text-center">Connexion Admin</h1>
    
    {% with messages = get_flashed_messages() %}
        {% if messages %}
            {% for message in messages %}
                <div class="bg-red-50 text-red-600 border border-red-200 p-3 rounded mb-4 text-center text-sm">{{ message }}</div>
            {% endfor %}
        {% endif %}
    {% endwith %}

    <form method="POST">
        <div class="mb-6">
            <label class="block text-gray-700 text-sm font-bold mb-2" for="password">Mot de passe</label>
            <input class="w-full bg-gray-50 text-gray-900 border border-gray-300 rounded-lg py-3 px-4 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent" type="password" name="password" id="password" required>
        </div>
        <div>
            <button class="w-full bg-red-600 hover:bg-red-700 text-white font-bold py-3 px-4 rounded-lg focus:outline-none focus:shadow-outline transition-transform active:scale-95" type="submit">
                Connexion
            </button>
        </div>
    </form>
</div>
{% endblock %}