@props([
    'scriptUrl' => '',
    'siteKey' => '',
    'wrapperClass' => 'mb-3',
    'submitOnSuccess' => false,
    'pendingTarget' => '',
    /** Si true: error/timeout/script caído envían el form vacío (fail_open en servidor). */
    'submitOnUnavailable' => false,
    'unavailableTimeoutMs' => 8000,
])

<script>
    window.__lobbyCaptchaToken = null;
    window.__lobbyCaptchaResuelto = false;

    function lobbyCaptchaMarcarResuelto() {
        window.__lobbyCaptchaResuelto = true;
    }

    function lobbyCaptchaEnviarFormulario(token) {
        var el = document.getElementById('lobby-captcha-token');
        if (!el || !el.form || el.form.dataset.enviado) {
            return;
        }
        el.form.dataset.enviado = '1';
        if (typeof token === 'string') {
            window.__lobbyCaptchaToken = token;
            el.value = token;
        }
        @if($pendingTarget !== '')
        var estado = document.getElementById(@json($pendingTarget));
        if (estado && estado.getAttribute('data-pending')) {
            estado.textContent = estado.getAttribute('data-pending');
        }
        @endif
        el.form.submit();
    }

    function onLobbyTurnstileSuccess(token) {
        lobbyCaptchaMarcarResuelto();
        @if($submitOnSuccess)
        lobbyCaptchaEnviarFormulario(token);
        @else
        window.__lobbyCaptchaToken = token;
        var el = document.getElementById('lobby-captcha-token');
        if (el) {
            el.value = token;
        }
        @endif
    }

    @if($submitOnUnavailable)
    function onLobbyTurnstileUnavailable() {
        if (window.__lobbyCaptchaResuelto) {
            return;
        }
        lobbyCaptchaMarcarResuelto();
        lobbyCaptchaEnviarFormulario('');
    }

    function onLobbyTurnstileScriptError() {
        onLobbyTurnstileUnavailable();
    }

    setTimeout(function () {
        onLobbyTurnstileUnavailable();
    }, {{ (int) $unavailableTimeoutMs }});
    @endif
</script>
<script src="{{ $scriptUrl }}" async defer
    @if($submitOnUnavailable) onerror="onLobbyTurnstileScriptError()" @endif></script>
<input type="hidden" id="lobby-captcha-token" name="captcha_token" value="">
<div class="{{ $wrapperClass }}">
    <div class="cf-turnstile"
        data-sitekey="{{ $siteKey }}"
        data-callback="onLobbyTurnstileSuccess"
        @if($submitOnUnavailable)
        data-error-callback="onLobbyTurnstileUnavailable"
        data-timeout-callback="onLobbyTurnstileUnavailable"
        data-unsupported-callback="onLobbyTurnstileUnavailable"
        @endif
    ></div>
</div>