{% extends 'base.html' %}
{% block title %}Connexion · Planète Production RH{% endblock %}
{% block content %}
<section class="login-story" aria-label="Planète Production, espace collaborateurs">
 <a class="login-brand" href="https://planeteproduction.fr/" target="_blank" rel="noopener noreferrer" aria-label="Site officiel de Planète Production (nouvel onglet)"><img src="{{ url_for('static', filename='brand/logo.png') }}" alt="" width="64" height="64"><span><strong>Planète Production</strong><small>Ressources humaines</small></span></a>
 <div class="login-orbits" aria-hidden="true"><span></span><span></span><span></span></div>
 <div class="login-story-copy"><p class="login-eyebrow">L’équipe au cœur de chaque voyage</p><h1>Des horizons communs.<br><span>Une équipe, une planète.</span></h1><p>Congés, planning et rémunération : retrouvez votre quotidien professionnel dans un seul espace.</p><div class="login-topics" aria-label="Services du portail"><span>Congés</span><span>Planning</span><span>Paie</span></div></div>
 <footer class="login-story-footer"><span>Planète Production · Île Maurice</span><button class="login-motion-toggle" type="button" aria-pressed="false">Mettre l’animation en pause</button><a href="https://planeteproduction.fr/" target="_blank" rel="noopener noreferrer">Découvrir Planète <span aria-hidden="true">↗</span></a></footer>
</section>
<section class="login-access" aria-labelledby="login-heading"><div class="login-form-panel">
 <p class="login-form-eyebrow">Votre espace collaborateur</p><h2 id="login-heading">Bienvenue.</h2><p class="login-intro">Connectez-vous pour retrouver votre espace RH.</p>
 <form method="post"><input type="hidden" name="csrf_token" value="{{ csrf_token }}">
 <div class="mb-4"><label class="form-label" for="username">Identifiant</label><input class="form-control" id="username" name="username" autocomplete="username" placeholder="Votre identifiant" required autofocus></div>
 <div class="mb-4"><label class="form-label" for="password">Mot de passe</label><input class="form-control" id="password" name="password" type="password" autocomplete="current-password" placeholder="Votre mot de passe" required></div>
 <button class="btn login-submit w-100" type="submit">Se connecter <span aria-hidden="true">→</span></button></form>
 <p class="login-help">Besoin d’aide pour vous connecter ?<br>Contactez votre responsable ou l’équipe RH.</p><div class="login-form-footer">Planète Production · Portail RH</div>
</div></section>
{% endblock %}