{% extends 'main/base.html' %}

{% block title %}Login - Siakad{% endblock %}

{% block content %}
<div class="flex items-center justify-center h-screen">

    <div class="bg-white p-8 rounded-2xl shadow-xl w-96 text-center">

        <h1 class="text-2xl font-bold tracking-widest text-gray-900 uppercase mb-6">
            SI<span class="text-lime-600">AKAD</span>
        </h1>

        {% if error %}
            <div class="bg-red-100 text-red-600 p-2 rounded mb-4 text-sm">
                {{ error }}
            </div>
        {% endif %}

        <form method="post" class="space-y-4 text-left">
            {% csrf_token %}

            <input type="text" name="username" placeholder="Username"
                class="w-full p-3 border rounded-lg focus:ring-2 focus:ring-lime-400">

            <input type="password" name="password" placeholder="Password"
                class="w-full p-3 border rounded-lg focus:ring-2 focus:ring-lime-400">

            <button 
                class="w-full bg-lime-600 text-white py-3 rounded-lg hover:bg-lime-700 transition">
                Login
            </button>
        </form>

    </div>

</div>
{% endblock %}