{% extends "users/base.html" %}
{% from "layout/errorlist.html" import errorlist %}
{% from "questions/includes/aaq_macros.html" import progress_bar %}

{% set title = _('Log In / Sign up') %}
{% set classes = 'login register contributor light-grey-bg' if contributor else 'login register light-grey-bg' %}


{% block breadcrumbs %}
{% endblock %}


{% block contentwrap %}
{% set aaq_context = request.session.get('aaq_context') %}
{% if aaq_context and aaq_context.product_slug %}
<section class="sumo-page-section question-masthead shade-bg">
  <div class="mzp-l-content">
    {{ progress_bar(3, product_slug=aaq_context.product_slug) }}
  </div>
</section>
{% endif %}

<section class="sumo-auth--wrap">
  <div class="mzp-l-content">
    <div class="card feature-padding elevation-03">
      <div class="sumo-auth">
        <div class="sumo-auth--form">
          <div id="login-fxa">
            <article id="login" class="main login-form">
              <div class="sumo-page-section content-zero-bottom-pad">
                <h1 class="sumo-page-subheading sumo-header-medium">{{ _('Continue with a Mozilla account' ) }}</h1>
                <p class="text-body-sm">
                  {{ _('Sign in or sign up to ask questions in our forums and contact support agents.' ) }}
                </p>
                <div class="center-on-mobile">
                  <p class="login-button-wrap">
                    <a rel="nofollow" href="{{ url('users.fxa_authentication_init') }}?next={{ next_url }}"
                      class="sumo-button primary-button button-lg button-full-width">{{ _('Continue') }}</a>
                  </p>

                  <p class="help-text">
                    {% trans
                      terms_url="https://www.mozilla.org/about/legal/terms/services/",
                      privacy_url="https://www.mozilla.org/privacy/mozilla-accounts/"
                    %}
                    Continuing with your Mozilla account means you have agreed with the
                    <a href="{{ terms_url }}">Terms and Conditions</a> and
                    <a href="{{ privacy_url }}">Privacy Policy</a>.
                    {% endtrans %}
                  </p>
                  <div class="trouble-text">
                    <p class="help-text">
                      <a href="{{ url('questions.aaq_step3', product_slug='mozilla-account') }}">{{ _("I can't sign in to my Mozilla account") }}</a>
                    </p>
                  </div>
                </div>
              </div>
            </article>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>
{% endblock %}