{#
/**
 * @file
 * Vartheme BS5 Starter Kit implementation for the main page.
 * Available config:
 *  - is_front: true | false -> to determine if page is front or not
 */
#}

<div class="page d-flex flex-column">

  {% include "vartheme_bs5:page-header" %}

  <main class="mb-3">
    <a id="main-content" tabindex="-1"></a>{# link is in html.html.twig #}

    <div role="main" class="main-container container">
      <div class="row justify-content-center">
        <div id="auth-box" class="register col-10 col-sm-8 col-lg-5 col-xl-4">
          <div id="top-part">
            {% include 'vartheme_bs5:heading' with {
                html_tag: 'h1',
                content: 'Register a new account'|t
              } only
            %}
          </div>
          <div id="middle-part">
            {% include 'vartheme_bs5:page-better-login' with { without_blocks: without_blocks } %}
            {% if (varbase.we_do_have_enabled_social_auth_modules.value) and (page.content.vartheme_bs5_socialauthlogin) %}
              <div class="social-auth-login-hint">{{ 'Sign up with a linked account'|t }}</div>
              {{ page.content.vartheme_bs5_socialauthlogin }}
              <div class="separator">
                <div class="separator-start"></div>
                  <span class="separator-text">{{ 'or'|t }}</span>
                <div class="separator-end"></div>
              </div>
              <div class="account-auth-login-hint">{{ 'Register with your email'|t }}</div>
              {{ page.content|without('vartheme_bs5_socialauthlogin') }}
            {% else %}
              <div class="account-auth-login-hint">{{ 'Register with your email'|t }}</div>
              {{ page.content }}
            {% endif %}
          </div>
          <div id="bottom-part">
          {% if not logged_in %}
            <div class="login-link">
              <a href="{{ path('user.login') }}">{% include 'vartheme_bs5:icon' with { name: 'bi-box-arrow-in-right', rtl: 'bi-box-arrow-in-left', lang_dir: lang_dir } only %} {{ 'Login'|t }}</a>
            </div>
          {% endif %}
            <div class="back-link">
              <a href="{{ url('<front>') }}">{% include 'vartheme_bs5:icon' with { name: 'bi-house-door-fill' } only %} {{ 'Back to'|t }}  {{ site_name }}</a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </main>

  {% include "vartheme_bs5:page-footer" %}

</div>
