<x-guest-layout>
    <div class="max-w-md mx-auto">
        <div class="text-center mb-8">
            <h2 class="text-3xl font-bold text-gray-900 mb-2">Join Xeek</h2>
            <p class="text-gray-600">Create your account to start buying and selling.</p>
        </div>

        <form method="POST" action="{{ route('register.request') }}">
            @csrf

            <div class="mb-6">
                <x-input-label for="email" :value="__('Email Address')" />
                <x-text-input
                    id="email"
                    class="block mt-1 w-full"
                    type="email"
                    name="email"
                    :value="old('email')"
                    required
                    autofocus
                    autocomplete="username"
                    placeholder="your.email@example.com"
                />
                <x-input-error :messages="$errors->get('email')" class="mt-2" />
            </div>

            <div class="flex items-center justify-between mt-8">
                <a class="text-sm text-gray-600 hover:text-gray-900 underline" href="{{ route('login') }}">
                    Already have an account?
                </a>

                <button type="submit" class="px-8 py-3 bg-blue-600 text-white font-semibold rounded-lg hover:bg-blue-700 transition-colors">
                    Continue
                </button>
            </div>
        </form>
    </div>
</x-guest-layout>
