<script
  src="https://challenges.cloudflare.com/turnstile/v0/api.js"
  async
  defer
></script>
<div class="turnstile">
  <div
    id="turnstile-widget"
    class="cf-turnstile"
    data-sitekey="{{ site_key }}"
  ></div>
</div>

<script>
  // Apply theme to the Turnstile widget based on the retrieved theme
  document.addEventListener("DOMContentLoaded", function () {
    const turnstileWidget = document.getElementById("turnstile-widget");
    if (turnstileWidget) {
      turnstileWidget.setAttribute("data-theme", theme);
    }
  });
</script>
