{% extends 'base.html.twig' %}
{% block title %}{{ 'security.login.title'|trans({}, 'meta') }}{% endblock %}
{% block meta %}
    {{ include('partials/seo.html.twig', {
        title_key: 'security.login.title',
        description_key: 'security.login.description',
        robots: 'noindex,nofollow'
    }) }}
{% endblock meta %}
{% block main %}
    <div class="min-h-page bg-page">
        <div class="relative mx-auto flex max-w-2xl items-center justify-center px-4 py-10 sm:px-6 lg:min-h-page lg:px-8 lg:py-16">
            <section class="w-full bg-surface p-5 shadow-panel sm:p-7 lg:p-8">
                <div class="grid gap-5">
                    <div class="bg-surface-muted p-5 sm:p-6">
                        <p class="text-xs uppercase tracking-eyebrow text-accent">{{ 'security.login.submit'|trans }}</p>
                        {{ component('security:LoginForm', {
                            targetPath: app.request.get('_target_path')
                        }) }}
                    </div>

                    <div class="bg-surface-subtle p-5 sm:p-6">
                        <p class="text-xs uppercase tracking-eyebrow text-accent">{{ 'security.register.submit'|trans }}</p>
                        {{ component('security:RegisterForm') }}
                    </div>
                </div>
            </section>
        </div>
    </div>
{% endblock %}
