<form id="login-form"
      hx-post="/api/htmx/auth/otp/gdpr"
      hx-target="#login-form"
      hx-swap="outerHTML"
      class="flex flex-col gap-4">

  <h2 class="text-xl font-semibold text-base-content">{{ gdpr_title }}</h2>
  <p class="text-sm text-base-content/70">{{ gdpr_description }}</p>

  {% if error %}
  <p class="text-error text-sm" role="alert">{{ error }}</p>
  {% endif %}

  <input type="hidden" name="pending_token" value="{{ pending_token }}">
  {% if return_url %}<input type="hidden" name="return_url" value="{{ return_url }}">{% endif %}

  <label class="flex items-start gap-3 cursor-pointer">
    <input type="checkbox"
           id="gdpr-required"
           name="gdpr_required"
           value="1"
           required
           class="w-4 h-4 mt-1 shrink-0 cursor-pointer rounded"
           style="accent-color:hsl(var(--p))">
    <span class="text-sm text-base-content">{{ gdpr_required_label | safe }}</span>
  </label>

  <label class="flex items-start gap-3 cursor-pointer">
    <input type="checkbox"
           id="gdpr-marketing"
           name="gdpr_marketing"
           value="1"
           class="w-4 h-4 mt-1 shrink-0 cursor-pointer rounded"
           style="accent-color:hsl(var(--p))">
    <span class="text-sm text-base-content/70">{{ gdpr_marketing_label }}</span>
  </label>

  <button type="submit" class="btn btn-primary w-full">{{ gdpr_submit_btn }}</button>
</form>
