{% trans_default_domain 'FOSUserBundle' %}

{% block styles %}
    <link rel="stylesheet" type="text/css" href="{{ asset("assets/styles/login.css")}}">
{% endblock %}





<style>
    body {
        font-family: "Poppins", sans-serif;
        background-image:url("{{ asset("assets/images/fasttrack_aeroport_casablanca.jpg") }}");
        background-repeat: no-repeat; /* Do not repeat the image */
        background-size: cover;
        /* height: 100vh; */
    }
</style>
<div id="overlay"></div>

<div class="wrapper fadeInDown">
    <div id="formContent">
        <!-- Tabs Titles -->

        <!-- Icon -->
        <div class="fadeIn first">
            <img src="{{ asset("assets/images/logo fast.png")}}" id="icon" alt="FastTrack Maroc logo" />
            <h3 style="color: #FF4500;"><b>Login Now</b></h3>
        </div>
        {% if error %}
            <div class="alert alert-danger"><strong>{{ error.messageKey|trans(error.messageData, 'security') }}</strong> Try again!</div>
        {% endif %}
        <!-- Login Form -->
        <form action="{{ path("fos_user_security_check") }}" method="post" >
            {% if csrf_token %}
                <input type="hidden" name="_csrf_token" value="{{ csrf_token }}" />
            {% endif %}

            <input type="text" id="login" class="fadeIn second" name="_username" required="required" placeholder="login">

            <input type="password" id="password" class="fadeIn third" name="_password" required="required"  placeholder="password">

            <input type="hidden" name="go_to" value="/" />
            <input type="hidden" name="back_to" value="/login" />

            <label class="container">Remember me
                <input type="checkbox" checked="checked" id="remember_me" name="_remember_me" value="on">
                <span class="checkmark"></span>
            </label>

            <input type="submit" class="fadeIn fourth" name="_submit" value="Log in">

        </form>

        <!-- Remind Passowrd -->
        <div id="formFooter">
            <a class="underlineHover" href="{{ path('fos_user_resetting_request') }}"><b>Forgot Password?</b></a>
        </div>

    </div>
</div>