@extends('affiliate-portal.layout')

@section('content')
    <section class="affiliate-portal-auth card">
        <div class="affiliate-portal-auth__icon"><i class="ic">verified_user</i></div>
        <span class="affiliate-portal__eyebrow">Convite individual</span>
        <h1>Ativar acesso</h1>
        <p>Crie uma senha com pelo menos 12 caracteres, incluindo letras maiúsculas, minúsculas e números.</p>
        <form method="post" action="{{ url('/area-afiliado/convite') }}" data-affiliate-invite-form>
            @csrf
            <input type="hidden" name="token" value="{{ old('token', '') }}" data-affiliate-invite-token>
            <div class="field"><label for="affiliate-new-password">Nova senha</label><input id="affiliate-new-password" name="password" type="password" required minlength="12" autocomplete="new-password"></div>
            <div class="field"><label for="affiliate-password-confirm">Confirmar senha</label><input id="affiliate-password-confirm" name="password_confirmation" type="password" required minlength="12" autocomplete="new-password"></div>
            <button class="btn btn--primary btn--block" type="submit"><i class="ic">lock</i> Ativar acesso</button>
        </form>
        <p class="affiliate-portal-auth__foot">Por segurança, o convite é individual, de uso único e expira após 60 minutos.</p>
    </section>
    <script nonce="{{ $cspNonce }}">
        (() => {
            const form = document.querySelector('[data-affiliate-invite-form]');
            const field = document.querySelector('[data-affiliate-invite-token]');
            const token = window.location.hash.slice(1);
            if (form && field && /^[A-Za-z0-9]{64}$/.test(token)) field.value = token;
        })();
    </script>
@endsection