{% extends 'auth_base.html' %}
{% load static %}

{% block title %}ورود به حساب{% endblock %}

{% block extra_css %}
<link rel="stylesheet" href="{% static 'css/dashboard/login.css' %}">
{% endblock %}

{% block content %}

<div class="container my-5 d-flex justify-content-center" >

    <div class="login-card p-4">

        <div class="login-header " >
            <h1><i class="fa-solid fa-user-lock"></i> خوش آمدید</h1>
            <p>برای ورود به حساب کاربری اطلاعات خود را وارد کنید</p>
        </div>
        {% if form.errors %}
            <div class="alert alert-danger text-center">
                نام کاربری یا رمز عبور اشتباه است
            </div>
        {% endif %}
        <form method="post" class="login-form">
            {% csrf_token %}

            <div class="mb-3">
                <label class="form-label">نام کاربری</label>
                <input type="text" name="username" class="form-control" placeholder="نام کاربری">
            </div>

            <div class="mb-3">
                <label class="form-label">رمز عبور</label>
                <input type="password" name="password" class="form-control" placeholder="••••••••">
            </div>

            <div class="d-flex justify-content-between align-items-center mb-3">
                <label class="remember-me">
                    <input type="checkbox">
                    مرا به خاطر بسپار
                </label>

                <a href="#" class="forgot-link">فراموشی رمز؟</a>
            </div>

            <button type="submit" class="btn btn-submit w-100">
                ورود به حساب
            </button>

        </form>

    </div>

</div>

{% endblock %}