{% extends 'layouts/base.html' %}
{% load i18n %}
{% load static %}

{% block content %}
  {% include 'header.html' with view_type="onboarding" %}
  <main id="main-content">
    <section>
      <div>
        <h1>{% translate 'KAT setup' %}</h1>
        {% include 'partials/stepper.html' %}
        <h2>{% translate 'Account setup' %}</h2>
        <h3>{% translate 'Users' %}</h3>
        <p>
          {% translate 'Within KAT there are three types of user accounts. Each has its own functions.' %}
        </p>
        <ul>
          <li>
            <strong>{% translate 'Admin' %}</strong>
            <span>{% translate 'Each organization must have an admin. The admin can create and manage user accounts as well as organization details.' %}</span>
          </li>
          <li>
            <strong>{% translate 'Red teamer' %}</strong>
            <span>{% translate 'A red teamer account can run scans and generate reports.' %}</span>
          </li>
          <li>
            <strong>{% translate 'Client account' %}</strong>
            <span>{% translate 'A client account can access reports.' %}</span>
          </li>
        </ul>
        <p>
          {% blocktranslate trimmed %}
            Each organization requires at least one admin and one red teamer
            account to function. This introduction will guide you through the
            setup of both. After that you can choose to add a client account as well.
         {% endblocktranslate %}
        </p>
        <a href="{% url 'step_account_setup_admin' %}" class="button">{% translate "Let's add accounts" %}</a>
      </div>
    </section>
  </main>
{% endblock content %}
