{{--
    Widget Cloudflare Turnstile (JOS-147) — rendu **explicite** (`turnstile.
    render()`), pas implicite (`.cf-turnstile` scanné automatiquement par le
    script) : le mode implicite ne se redéclenche qu'au chargement initial du
    script, alors que `switchToLogin()`/`switchToRegister()` démontent puis
    remontent ce bloc à chaque bascule de mode (il vit dans un `@if/@else`
    Blade, un seul des deux formulaires existe dans le DOM à la fois) — sans
    rendu explicite, la deuxième apparition du widget resterait vide.
    `x-init` s'exécute justement à chaque insertion de l'élément, contrairement
    à l'`onload` du script (qui ne tire qu'une fois pour toute la page) : il
    sert de secours pour le tout premier rendu, avant que `window.turnstile`
    n'existe encore.

    `$wire.set('turnstileToken', ...)` (magie Alpine posée par Livewire) pousse
    le jeton directement dans la propriété publique du composant qui rend
    cette vue (`CreateWorkspace`) — pas besoin d'une fonction globale nommée
    comme le voudrait `data-callback` en mode implicite.

    Coins arrondis : Cloudflare rend le widget dans un iframe cross-origin,
    dont le CSS interne n'est pas accessible — le contourner en dimensionnant
    ce conteneur exactement à la taille du widget ("normal", 300×65) et en lui
    posant `overflow-hidden` : l'iframe la remplit pile, donc l'arrondi du
    conteneur rogne visuellement ses angles.

    Thème clair/sombre : lu sur `<html class="dark">`, posé par Filament lui-
    même (`dark-mode.js`). Fixé au rendu, pas resynchronisé si la personne
    bascule le thème *pendant* qu'elle regarde cet écran précis — un cas rare
    sur une page d'inscription, pas retenu comme suffisant pour justifier un
    `MutationObserver` de plus.

    N'affiche rien si aucune clé n'est configurée (`TURNSTILE_SITE_KEY` vide
    en local/dev) — voir le docblock de `VerifiesTurnstile`, qui applique le
    même interrupteur côté vérification.
--}}
@if (filled(config('services.turnstile.site_key')))
    @once
        <script src="https://challenges.cloudflare.com/turnstile/v0/api.js?onload=__joseph_turnstile_onload&render=explicit" async defer></script>
    @endonce

    <div
        wire:ignore
        x-data
        x-init="
            const render = () => window.turnstile?.render($el, {
                sitekey: @js(config('services.turnstile.site_key')),
                theme: document.documentElement.classList.contains('dark') ? 'dark' : 'light',
                callback: (token) => $wire.set('turnstileToken', token),
                'expired-callback': () => $wire.set('turnstileToken', ''),
            });
            window.turnstile ? render() : (window.__joseph_turnstile_onload = render);
        "
        class="mx-auto overflow-hidden rounded-lg"
        style="width: 300px; height: 65px;"
    ></div>
@endif