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

{% block title %}Connexion{% endblock %}

{% block body %}
    <div class="row">
        <div class="col-12 col-lg-6 order-2 order-lg-1 bg-login p-5 text-center">
            <img src="{{ asset('images/Hextra-bg-transparent.svg') }}" alt="Logo Hextra" class="mb-4 mt-md-5 d-none d-lg-block w-100">
            <h1 class="h2 text-white text-uppercase fw-normal fst-italic">Bienvenue sur l'extranet <br> Hans et associés</h1>
            <hr class="text-white">
            <p class="text-white">
                <small>
                    Bravo ! Vous venez d'atterrir sur l'Hextra, notre outil interne (et un peu externe aussi) dédié au Groupe Hans & associés. <br>
                    Vous y retrouverez de nombreuses fonctionnalités ainsi que toutes les infos Groupe. <br>
                    Vite vite, connectez-vous pour tout découvrir !
                </small>
            </p>
        </div>
        <div class="col-12 col-lg-6 order-1 order-lg-2 p-5"><form method="post">
                <img src="{{ asset('images/Hextra.svg') }}" alt="Logo Hextra" class="mb-4 mt-md-5 d-block d-lg-none bg-white w-100">
                <h2 class="h3 mb-3 font-weight-normal text-uppercase text-primary text-center fst-italic mt-md-5">S'identifier</h2>
                <p class="fst-italic text-center">
                    <small>Pour accéder à l'Hextra, connectez-vous avec votre compte Microsoft.</small>
                </p>
                <div class="text-center">
                    <a href="{{ path('app_login_start') }}" class="btn btn-fw btn-primary mb-3 fw-bold text-uppercase ls-2 py-2">Se connecter avec Microsoft</a>
                    <a class="btn btn-fw btn-grey fw-bold text-uppercase ls-2 py-2" href="{{ path('forgotten_password') }}">Je n'arrive pas à me connecter</a>
                </div>
            </form>
        </div>
    </div>
{% endblock %}