{% extends 'base.html.twig' %}

{% block title %}Connexion - Mercuriale.io{% endblock %}

{% block stylesheets %}
    {{ parent() }}
    <link rel="stylesheet" href="{{ asset('css/login.css') }}">
{% endblock %}

{% block body %}
<div class="login-container">
    <div class="login-logo">
        <img src="{{ asset('images/logo-mercuriale-rectangulaire.png') }}" alt="Mercuriale.io" class="login-logo__img">
    </div>
    <h1 class="login-title">Mercuriale.io</h1>
    <h2 class="login-subtitle">Connexion</h2>

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

    <form method="post">
        <div class="form-group">
            <label for="username">Email</label>
            <input type="email" id="username" name="_username" value="{{ last_username }}" required autofocus>
        </div>

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

        <input type="hidden" name="_csrf_token" value="{{ csrf_token('authenticate') }}">

        <div class="remember-me">
            <label>
                <input type="checkbox" name="_remember_me">
                Se souvenir de moi
            </label>
        </div>

        <button type="submit" class="btn-login">
            Se connecter
        </button>
    </form>

    <p class="register-login-link">
        Pas encore de compte ? <a href="{{ path('app_register') }}">Creer un compte</a>
    </p>
</div>
{% endblock %}