{% load i18n %}
{% comment %}
  Card swapped in by ``ConjuntoLoginView`` once credentials are valid
  and the user has two or more tenants to choose from. The credentials
  are no longer needed — the user identity is held in the session as
  pending login state until a tenant is picked.

  The form posts to ``login-complete`` (HTMX) which calls
  ``django.contrib.auth.login`` and stamps the chosen tenant onto the
  new session before redirecting to the original ``next`` URL.

  The outer wrapper id ``cj-login-card`` matches the swap target on
  the credentials card so this partial replaces the credentials card
  cleanly via ``hx-swap="outerHTML"``.
{% endcomment %}
<div class="card card-md" id="cj-login-card">
    <div class="card-body">
        <h2 class="h2 text-center mb-2">{% translate "Choose a tenant" %}</h2>
        <p class="text-secondary text-center mb-4">
            {% translate "Pick the workspace you want to work in. You can switch later from the statusbar." %}
        </p>
        <form method="post"
              action="{% url 'login-complete' %}"
              hx-post="{% url 'login-complete' %}"
              hx-target="#cj-login-card"
              hx-swap="outerHTML"
              hx-disabled-elt="find button[type=submit]">
            {% csrf_token %}
            <div class="list-group list-group-flush mb-4">
                {% for t in tenants %}
                    <label class="list-group-item d-flex align-items-center gap-2">
                        <input type="radio"
                               name="tenant"
                               value="{{ t.pk }}"
                               class="form-check-input m-0"
                               {% if forloop.first %}checked{% endif %}
                               required>
                        <i class="ti ti-building text-secondary"></i>
                        <span>{{ t.name }}</span>
                    </label>
                {% endfor %}
            </div>
            <div class="form-footer">
                <button type="submit" class="btn btn-primary w-100">
                    {% translate "Continue" %}
                </button>
            </div>
        </form>
    </div>
</div>