{% extends "@FerienpassAdmin/layout/modalBase.html.twig" %}

{% block main %}

    {% if form is defined %}

        <h3 class="text-base font-semibold leading-6 text-gray-900 dark:text-white">Anmeldelink senden</h3>
        <div class="mt-2 max-w-xl text-sm text-gray-500 dark:text-gray-200">
            <p>Sendet an <strong>{{ item.email }}</strong> einen einmaligen Link, mit dem sich der/die
                Account-Inhaber:in ohne Passwort und ohne Passkey anmelden kann. Ideal, wenn nur ein Passkey
                hinterlegt war und der Zugriff darauf verloren ging.</p>
        </div>

        {# Login-method context for this account, so the operator can see at a
           glance whether a password or passkey even exists before sending. #}
        <dl class="mt-4 space-y-1.5 text-sm">
            <div class="flex items-center gap-2 text-gray-600 dark:text-gray-300">
                <twig:ux:icon name="{{ hasPassword ? 'ph:check-circle' : 'ph:minus-circle' }}" class="h-4 w-4 {{ hasPassword ? 'text-green-600 dark:text-green-400' : 'text-gray-400' }}" />
                <span>{{ hasPassword ? 'Passwort hinterlegt' : 'Kein Passwort hinterlegt' }}</span>
            </div>
            <div class="flex items-center gap-2 text-gray-600 dark:text-gray-300">
                <twig:ux:icon name="{{ passkeyCount > 0 ? 'ph:check-circle' : 'ph:minus-circle' }}" class="h-4 w-4 {{ passkeyCount > 0 ? 'text-green-600 dark:text-green-400' : 'text-gray-400' }}" />
                <span>{{ passkeyCount > 0 ? '%count% Passkey(s) hinterlegt'|trans({'%count%': passkeyCount}, 'messages') : 'Kein Passkey hinterlegt' }}</span>
            </div>
            {% if magicLinksDisabled %}
                <div class="flex items-center gap-2 text-amber-700 dark:text-amber-400">
                    <twig:ux:icon name="ph:warning" class="h-4 w-4" />
                    <span>Anmeldung per E-Mail-Link ist für dieses Konto deaktiviert — der Link wird trotzdem gesendet.</span>
                </div>
            {% endif %}
        </dl>

        <div class="mt-5">
            {{ form_start(form) }}
            <twig:Admin:Button variant="primary" type="submit" class="bg-green-600 hover:bg-green-500 focus-visible:outline-green-500">Anmeldelink senden</twig:Admin:Button>
            {{ form_end(form) }}
        </div>

    {% else %}

        <div>
            <div class="mx-auto flex items-center justify-center h-12 w-12 rounded-full bg-green-100 dark:bg-green-500/10">
                <twig:ux:icon name="ph:paper-plane-tilt" class="h-6 w-6 text-green-600 dark:text-green-400" />
            </div>
            <div class="mt-3 text-center sm:mt-5">
                <h3 class="text-lg leading-6 font-medium text-gray-900 dark:text-white">Anmeldelink gesendet</h3>
                <div class="mt-2">
                    <p class="text-sm leading-5 text-gray-500 dark:text-gray-300">An {{ item.email }} wurde ein
                        Anmeldelink gesendet. Der Link ist einmalig verwendbar und läuft nach kurzer Zeit ab.</p>
                </div>
            </div>
        </div>

    {% endif %}

{% endblock %}
