@extends('layouts.public')

@section('title', 'Aceitar Convite · Cavendral Beta')

@section('content')
<div class="bg-[#161b22] border border-[#30363d] rounded-md p-8 shadow-2xl">
    <div class="text-center mb-6">
        <div class="inline-flex items-center gap-2 font-mono text-lg">
            <span class="px-2 py-1 rounded bg-[#1f6c92]/20 text-[#80b9d5]">[B]</span>
            <span class="font-bold">CAVENDRAL BETA</span>
        </div>
        <p class="text-xs text-[#7d8590] mt-2 font-mono">ACEITAR CONVITE</p>
    </div>

    <p class="text-sm text-[#7d8590] mb-4 text-center">
        Cole o token recebido no email de convite:
    </p>

    <form method="GET" action="{{ route('invite.accept') }}" class="space-y-4">
        @csrf
        <textarea name="token" rows="3" required
                  placeholder="Cole o token de 64 caracteres aqui"
                  class="w-full px-3 py-2 bg-[#21262d] border border-[#30363d] rounded text-sm font-mono focus:border-[#1f6c92] focus:ring-2 focus:ring-[#80b9d5]/40 outline-none">{{ old('token') }}</textarea>
        @error('token') <p class="text-xs text-[#f85149]">{{ $message }}</p> @enderror

        <button type="submit"
                class="w-full bg-[#1f6c92] hover:bg-[#80b9d5] text-white font-bold py-2 rounded transition-colors">
            VALIDAR TOKEN
        </button>
    </form>

    <div class="mt-6 border-t border-[#30363d] pt-4 text-center">
        <a href="{{ route('login') }}" class="text-xs text-[#6e7681] hover:text-[#80b9d5]">← Voltar ao login</a>
    </div>
</div>
@endsection