{% load i18n static widget_tweaks %}

<section id="lockdown" class="py-5">
  <div class="row justify-content-center">
    <div class="col-lg-8 col-xl-7">
      <div class="text-center mb-4">
        <div class="bg-secondary text-white py-3 px-4 rounded-3 shadow-sm">
          <h1 class="h3 mb-2">{% trans "Investor Access" %}</h1>
        
          <p class="mb-0 fw-bold">{% trans "This website is restricted to authorized Alloy Group members. It is a website to show the services and capabilities of their upcoming Alloy Group website." %}</p>
        </div>
      </div>

      <div class="card border-0 shadow-sm">
        <div class="card-body p-4 p-md-5">
    
          {% if LOCKDOWN_IMAGE_URL or LOCKDOWN_IMAGE_STATIC %}
            <div class="text-center mb-5">
              <img
                src="{% if LOCKDOWN_IMAGE_STATIC %}{% static LOCKDOWN_IMAGE_STATIC %}{% else %}{{ LOCKDOWN_IMAGE_URL }}{% endif %}"
                alt="{% trans 'Protected access preview' %}"
                class="img-fluid rounded"
              />
            </div>
          {% endif %}

          {% if form %}
            <div class="mx-auto text-start" style="max-width: 30rem;">
              <p class="mb-3">
                {% trans "Enter the access password to continue to the protected area." %}
              </p>
              <form action="" method="post" novalidate>
                {% csrf_token %}
                {% if form.non_field_errors %}
                  <div class="alert alert-danger py-2" role="alert">
                    {% for error in form.non_field_errors %}
                      <div>{{ error }}</div>
                    {% endfor %}
                  </div>
                {% endif %}

                <div class="mb-3 row align-items-center g-0">
                  <div class="col-sm-4">
                    <label class="form-label fw-semibold mb-0" for="{{ form.password.id_for_label }}">
                      {% trans "Password" %}
                    </label>
                  </div>
                  <div class="col-sm-8">
                    {{ form.password|add_class:"form-control form-control-lg border-2"|add_error_class:"is-invalid" }}
                    {% for error in form.password.errors %}
                      <div class="invalid-feedback d-block text-danger fw-semibold">{{ error }}</div>
                    {% endfor %}
                  </div>
                </div>

                <div class="mt-4">
                  <button type="submit" class="btn btn-primary btn-sm px-3">
                    {% trans "Continue" %}
                  </button>
                </div>
              </form>
            </div>
          {% endif %}

          <div class="mt-4 pt-3 border-top text-center text-muted small">
            {% trans "Need access?" %}
            <a href="{% url 'website:contact' %}" class="fw-semibold text-decoration-none">
              {% trans "Contact us." %}
            </a>
          </div>
        </div>
      </div>
    </div>
  </div>
</section>