{% extends "base.html" %}
{% load i18n %}
{% load widget_tweaks %}

{% block title %}{% trans "Connexion" %} - ServicesCRM{% endblock %}

{% block content %}
<div class="container py-5">
    <div class="row justify-content-center">
        <div class="col-12 col-md-8 col-lg-5">
            <div class="card auth-card border-0 shadow-sm">
                <div class="card-body p-4 p-md-5">
                    <h1 class="auth-title mb-3">Log in</h1>
                    <p class="auth-subtitle mb-4">Access your space.</p>

                    <form method="post" action="{% url 'account_login' %}">
                        {% csrf_token %}

                        {% if form.non_field_errors %}
                            <div class="alert alert-danger" role="alert">
                                {% for error in form.non_field_errors %}
                                    <div>{{ error }}</div>
                                {% endfor %}
                            </div>
                        {% endif %}

                        {% for field in form %}
                            {% if field.is_hidden %}
                                {{ field }}
                            {% else %}
                                <div class="mb-3">
                                    {% if field.field.widget.input_type == "checkbox" %}
                                        <div class="form-check">
                                            {{ field|add_class:"form-check-input" }}
                                            <label class="form-check-label text-white" for="{{ field.id_for_label }}">{{ field.label }}</label>
                                        </div>
                                    {% elif field.field.widget.input_type == "text" or field.field.widget.input_type == "password" or field.field.widget.input_type == "email" %}
                                        <label class="form-label" for="{{ field.id_for_label }}">{{ field.label }}</label>
                                        {{ field|add_class:"form-control auth-text-field" }}
                                    {% else %}
                                        <label class="form-label" for="{{ field.id_for_label }}">{{ field.label }}</label>
                                        {{ field|add_class:"form-control" }}
                                    {% endif %}
                                    {% if field.help_text %}
                                        <div class="form-text auth-help-text">{{ field.help_text|safe }}</div>
                                    {% endif %}
                                    {% if field.errors %}
                                        <div class="invalid-feedback d-block">
                                            {% for error in field.errors %}
                                                <div>{{ error }}</div>
                                            {% endfor %}
                                        </div>
                                    {% endif %}
                                </div>
                            {% endif %}
                        {% endfor %}

                        {% if redirect_field_value %}
                            <input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}">
                        {% endif %}

                        <button class="btn btn-light w-100 fw-semibold" type="submit">Log in</button>
                    </form>

                    <div class="mt-4 text-center text-white-50">
                        <p class="mb-2"><a href="{% url 'account_reset_password' %}" class="auth-link">Forgot password?</a></p>
                        <p class="mb-0">No account yet? <a href="{% url 'account_signup' %}" class="auth-link">Register</a></p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}