{% import 'macros/forms.html' as forms %}

{% extends "auth/layout.html" %}

{% block head_title %}{{ _('Sign in') }}{% endblock %}

{% block title %}{{ _('Welcome back!') }}{% endblock %}

{% block auth_form %}
  <form method="POST" action="{{ tenant.url_path_for(request, 'auth:login') }}">
    <div class="space-y-4">
      {{ forms.form_field(form.email) }}
      {{ forms.form_field(form.password) }}
      {{ forms.form_csrf_token(form) }}
    </div>
    <div class="flex items-center justify-between mt-6">
      <div class="mr-1">
        <a class="text-sm underline hover:no-underline" href="{{ tenant.url_path_for(request, 'reset:forgot') }}">{{ _('I forgot my password') }}</a>
      </div>
      <button type="submit" class="btn bg-primary hover:bg-primary-hover text-white ml-3">{{ _('Sign in') }}</button>
    </div>
  </form>
  {% if oauth_providers | length > 0 %}
    <div class="pt-5 mt-6 border-t border-light space-y-2">
      {% for oauth_provider in oauth_providers %}
        {% set display_name, logo_svg = get_oauth_provider_branding(oauth_provider) %}
        <a href="{{ url_for('oauth:authorize') }}?tenant={{ tenant.id }}&provider={{ oauth_provider.id }}" class="btn w-full justify-start border border-primary hover:border-primary-hover text-primary-500 hover:text-primary-hover">
          {% if logo_svg %}
            <img src="data:image/svg+xml;base64,{{ logo_svg }}" class="w-4 mr-4" />
          {% endif %}
          {{ _('Sign in with %(provider)s', provider=display_name) }}
        </a>
      {% endfor %}
    </div>
  {% endif %}
  {% if tenant.registration_allowed %}
    <div class="pt-5 mt-6 border-t border-light">
      <div class="text-sm">
        {{ _("Don't have an account?") }}
        <a href="{{ tenant.url_path_for(request, 'register:register') }}" class="font-medium text-primary-500 hover:text-primary-600">{{ _('Sign up') }}</a>
      </div>
    </div>
  {% endif %}
{% endblock %}
