{% extends "base.html" %}
{% block title %}Log in{% endblock %}
{% block content %}
<div class="auth panel">
  {% if sso %}
  <h1>Single sign-on</h1><p class="sub">Enter your work email and we'll send you to your organisation's identity provider.</p>
  {% if error %}<div class="flash err">{{ error }}</div>{% endif %}
  <form method="get" action="/sso/start">
    <input type="hidden" name="next" value="{{ next }}">
    <div class="row"><label>Work email</label><input type="email" name="email" value="{{ email or '' }}" placeholder="you@acme.com" required autofocus></div>
    <button class="btn primary block">Continue with SSO</button>
  </form>
  <p class="small muted" style="margin-top:16px"><a href="/login">Log in with a password instead</a></p>
  {% else %}
  <h1>Welcome back</h1><p class="sub">Log in to your {{ app_name }} account.</p>
  {% if sso_required %}<div class="flash err">Your organisation requires SSO for @{{ email.rsplit('@', 1)[-1] }} addresses. <a href="/sso/start?email={{ email|urlencode }}&next={{ next|urlencode }}">Sign in with SSO</a></div>
  {% elif error %}<div class="flash err">{{ error }}</div>{% endif %}
  {% if google_client_id %}
  <div id="g_id_onload" data-client_id="{{ google_client_id }}" data-login_uri="{{ base_url }}/auth/google" data-auto_prompt="false" data-use_fedcm_for_prompt="true"></div>
  <div class="g_id_signin" data-type="standard" data-size="large" data-theme="filled_black" data-text="signin_with" data-shape="rectangular" data-width="360" style="margin-bottom:14px"></div>
  <div class="small dim" style="text-align:center;margin:6px 0 14px">or with your password</div>
  {% endif %}
  <form method="post" action="/login">
    <input type="hidden" name="csrf" value="{{ csrf }}"><input type="hidden" name="next" value="{{ next }}">
    <div class="row"><label>Email</label><input type="email" name="email" value="{{ email or '' }}" required autofocus></div>
    <div class="row"><label>Password</label><input type="password" name="password" required></div>
    <button class="btn primary block">Log in</button>
  </form>
  <p class="small muted" style="margin-top:16px;display:flex;justify-content:space-between"><span>No account? <a href="/signup">Start free</a></span><a href="/forgot">Forgot password?</a></p>
  <p class="small muted" style="margin-top:8px;text-align:center"><a href="/sso/start{% if next and next != '/app' %}?next={{ next|urlencode }}{% endif %}">Sign in with SSO</a> <span class="dim">· for organisations on Enterprise</span></p>
  {% endif %}
</div>
{% endblock %}
{% block scripts %}{% if google_client_id and not sso %}<script src="https://accounts.google.com/gsi/client" async defer></script>{% endif %}{% endblock %}