@extends('auth.layout')

@section('title', 'Registreren')

@section('content')
    <h1 class="auth-title">Registreren</h1>

    @if ($errors->any())
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <strong>Error:</strong> {{ $errors->first() }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif

    <form method="POST" action="{{ url('/register') }}">
        @csrf
        <div class="mb-3">
            <label for="name" class="form-label">Naam</label>
            <input type="text" class="form-control" id="name" name="name" required autofocus value="{{ old('name') }}" placeholder="Je naam">
        </div>
        <div class="mb-3">
            <label for="email" class="form-label">E-mailadres</label>
            <input type="email" class="form-control" id="email" name="email" required value="{{ old('email') }}" placeholder="E-mail">
        </div>
        <div class="mb-3">
            <label for="password" class="form-label">Wachtwoord</label>
            <input type="password" class="form-control" id="password" name="password" required autocomplete="new-password" placeholder="Wachtwoord">
        </div>
        <div class="mb-4">
            <label for="password_confirmation" class="form-label">Herhaal wachtwoord</label>
            <input type="password" class="form-control" id="password_confirmation" name="password_confirmation" required autocomplete="new-password" placeholder="Herhaal wachtwoord">
        </div>
        <button type="submit" class="btn btn-primary w-100">Registreren</button>
        <div class="text-center mt-3">
            <a href="{{ route('login') }}" class="small">Al een account? Inloggen</a>
        </div>
        <input type="hidden" id="recaptcha_token" name="recaptcha_token" value="">
    </form>
@endsection