<form hx-post="{% url 'terminusgps_notifications:select triggers' %}" hx-target="this" class="flex flex-col gap-4" hx-swap="outerHTML">
    {% if form.p.errors %}<div class="animate-jiggle">Please save your trigger parameters first before moving on!</div>{% endif %}
    {% csrf_token %}
    <label for="{{ form.t.id_for_label }}" class="font-semibold">Trigger Type</label>
    <div class="flex flex-col gap-2">
        {{ form.t }}
        <p id="{{ form.t.id_for_label }}_helptext" class="text-sm">{{ form.t.help_text }}</p>
    </div>
    <h2 class="font-semibold">Trigger Parameters</h2>
    <form id="id_trigger_parameters" hx-target="this" hx-swap="outerHTML"></form>
    {% for hidden in form.hidden_fields %}
    {{ hidden }}
    {% endfor %}
    <button class="flex w-full cursor-pointer items-center justify-center gap-2 rounded border border-terminus-red-900 bg-terminus-red-800 p-2 text-center text-white transition-colors duration-300 ease-in-out hover:bg-terminus-red-400" type="submit">Next</button>
</form>
