{% load static %}
<!doctype html>
<html lang="pt-PT">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <title>Entrar · Portal Kreate4Web</title>
  <link rel="icon" href="{% static 'branding/kreate4web-favicon.png' %}">
  <link rel="stylesheet" href="{% static 'css/client-portal.css' %}">
</head>
<body class="portal-login-page">
<div class="portal-login-shell">
  <section class="portal-login-brand">
    <div>
      <img src="{% static 'branding/kreate4web-logo-horizontal.png' %}" alt="Kreate4Web">
      <p>LOGIN ÚNICO KREATE4WEB</p>
      <h1>Uma entrada para clientes e equipa.</h1>
      <span>O sistema identifica automaticamente o seu perfil e encaminha-o para o Backoffice ou para a Área do cliente.</span><div class="k4w-login-destinations"><b>Backoffice</b><b>Área do cliente</b></div>
      <div class="k4w-login-security-note"><strong>Proteção adicional</strong><span>As contas com autenticação de dois fatores ativa validam um código temporário após a palavra-passe.</span></div>
    </div>
  </section>
  <section class="portal-login-panel">
    <form method="post" class="portal-login-form" novalidate>
      {% csrf_token %}
      <p class="eyebrow">ACESSO RESERVADO</p>
      <h2>Bem-vindo</h2>
      <p class="muted">Utilize o nome de utilizador ou o email da conta.</p>
      {% if form.non_field_errors %}<div class="portal-alert portal-alert--error">{{ form.non_field_errors }}</div>{% endif %}
      <label>{{ form.username.label }}{{ form.username }}{% for error in form.username.errors %}<small class="field-error">{{ error }}</small>{% endfor %}</label>
      <label>{{ form.password.label }}{{ form.password }}{% for error in form.password.errors %}<small class="field-error">{{ error }}</small>{% endfor %}</label>
      {% if next %}<input type="hidden" name="next" value="{{ next }}">{% endif %}
      <button class="portal-button portal-button--primary" type="submit">Entrar</button>
      <a class="k4w-forgot-password" href="{% url 'security:password_reset' %}">Esqueci-me da palavra-passe</a>
      <div class="portal-login-switch"><span>Clientes, administradores e colaboradores entram nesta mesma janela.</span></div>
      <small>Problemas no acesso? Contacte a Kreate4Web.</small>
    </form>
  </section>
</div>
<footer class="k4w-login-footer"><span>© {% now "Y" %} Kreate4Web · K4W</span><span>Portal v{{ k4w_version }} · {{ k4w_environment }}</span></footer>
</body>
</html>
