{% extends 'base.html.twig' %}
{% block title %}Connexion{% endblock %}
{% block body_class %}login-page{% endblock %}

{% block content %}
<div class="login-wrapper">
    <div class="login-card">

        <div class="login-logo">
            <div class="brand-emblem">
                <svg viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg" aria-hidden="true">
                    <path d="M20 8 L24 16 L33 16 L26 22 L29 31 L20 25 L11 31 L14 22 L7 16 L16 16 Z" fill="white"/>
                </svg>
            </div>
            <h1 style="font-family:'Oswald',sans-serif; font-size:20px; margin:0 0 4px; color:var(--fff-bleu)">
                Ligue de Football de Martinique
            </h1>
            <p style="font-size:13px; color:var(--fff-gris-muted); margin:0">
                Gestion des amendes disciplinaires
            </p>
        </div>

        {% if error %}
            <div class="alert alert-danger">
                <span class="alert-icon">✕</span>
                {{ error.messageKey|trans(error.messageData, 'security') }}
            </div>
        {% endif %}

        <form method="post" action="{{ path('app_login') }}">
            <input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">

            <div class="form-group">
                <label class="form-label" for="email">Adresse email du club</label>
                <input type="email" id="email" name="_username"
                       value="{{ last_username }}"
                       class="form-input form-input-full"
                       placeholder="club@example.com"
                       autocomplete="email" required autofocus>
            </div>

            <div class="form-group">
                <label class="form-label" for="password">Mot de passe</label>
                <input type="password" id="password" name="_password"
                       class="form-input form-input-full"
                       placeholder="••••••••"
                       autocomplete="current-password" required>
            </div>

            <label class="checkbox-label" style="margin-bottom:20px">
                <input type="checkbox" name="_remember_me">
                <span>Rester connecté sur cet appareil</span>
            </label>
<a href="{{ path('reset_password_request') }}">Mot de passe oublié ?</a>
            <button type="submit" class="btn btn-primary btn-block btn-lg">
                Se connecter
            </button>
        </form>

        <div style="text-align:center; margin-top:20px; font-size:12.5px; color:var(--fff-gris-muted);">
            Problème de connexion ?<br>
            Contactez votre administrateur de ligue.
        </div>
    </div>
</div>
{% endblock %}