{% extends 'base.html' %}
{% block title %}Wymagane hasło główne{% endblock %}
{% block content %}

<section class="text-center mb-4">
  <h2 class="mb-2">{{ ui_icon('login') }} Podaj hasło główne</h2>
  <p class="text-secondary mb-0">Dostęp do aplikacji jest chroniony dodatkowym hasłem wejściowym.</p>
</section>

<div class="card bg-dark text-white">
  <div class="card-body">
    <form method="post">
      <div class="mb-3">
        <div class="input-group ui-password-group">
          <input type="password" name="password" placeholder="Hasło"
            class="form-control bg-dark text-white border-secondary ui-consistent-input" required>
        </div>
      </div>
      <button type="submit" class="btn btn-success w-100">{{ ui_icon('lock-open') }} Wejdź</button>
    </form>
  </div>
</div>

{% block scripts %}
<script>
  document.addEventListener('DOMContentLoaded', function () {
    document.querySelector('input[name="password"]').focus();
  });
</script>
{% endblock %}

{% endblock %}