@extends($site->themeView('layout'))

{{-- Sign in / sign up of a visitor (only used to rate and review). --}}
@section('content')
    <div class="container-site max-w-md py-12">
        <div class="rounded-3xl bg-white/5 p-6 ring-1 ring-white/10 sm:p-8">
            <h1 class="text-2xl font-black tracking-tight text-white">{{ $mode === 'login' ? __('movies.sign_in') : __('movies.sign_up') }}</h1>
            <p class="mt-1 text-sm text-white/60">{{ __('movies.account_why') }}</p>
            @if (session('status'))<p class="mt-4 rounded-xl bg-emerald-500/15 p-3 text-sm text-emerald-200">{{ session('status') }}</p>@endif
            <form method="post" action="{{ $mode === 'login' ? route('member.login', [], false) : route('member.register', [], false) }}" class="mt-6 space-y-4">
                @csrf
                <input type="hidden" name="redirect" value="{{ request('redirect', lpath('/')) }}">
                @if ($mode === 'register')
                    <label class="block text-sm"><span class="text-white/70">{{ __('movies.display_name') }}</span><input name="name" value="{{ old('name') }}" required maxlength="40" autocomplete="nickname" class="cn-field mt-1 w-full"></label>
                    @error('name')<p class="text-sm text-rose-300">{{ $message }}</p>@enderror
                    {{-- Honeypot --}}
                    <div class="hidden" aria-hidden="true"><input name="website" tabindex="-1" autocomplete="off"></div>
                @endif
                <label class="block text-sm"><span class="text-white/70">{{ __('movies.email') }}</span><input name="email" type="email" value="{{ old('email') }}" required autocomplete="email" class="cn-field mt-1 w-full"></label>
                @error('email')<p class="text-sm text-rose-300">{{ $message }}</p>@enderror
                <label class="block text-sm"><span class="text-white/70">{{ __('movies.password') }}</span><input name="password" type="password" required autocomplete="{{ $mode === 'login' ? 'current-password' : 'new-password' }}" class="cn-field mt-1 w-full"></label>
                @error('password')<p class="text-sm text-rose-300">{{ $message }}</p>@enderror
                @if ($mode === 'register')
                    <label class="block text-sm"><span class="text-white/70">{{ __('movies.password_confirm') }}</span><input name="password_confirmation" type="password" required autocomplete="new-password" class="cn-field mt-1 w-full"></label>
                    <label class="flex items-start gap-2 text-sm text-white/70"><input type="checkbox" name="terms" value="1" required class="mt-1 rounded"> <span>{{ __('movies.accept_rules') }}</span></label>
                    @error('terms')<p class="text-sm text-rose-300">{{ $message }}</p>@enderror
                @else
                    <label class="flex items-center gap-2 text-sm text-white/70"><input type="checkbox" name="remember" value="1" class="rounded"> {{ __('movies.remember_me') }}</label>
                @endif
                <button class="btn w-full bg-accent py-3 font-bold text-black hover:brightness-110">{{ $mode === 'login' ? __('movies.sign_in') : __('movies.create_account') }}</button>
            </form>
            <p class="mt-5 text-center text-sm text-white/60">
                @if ($mode === 'login')
                    {{ __('movies.no_account') }} <a href="{{ route('member.register', [], false) }}?redirect={{ urlencode(request('redirect', '')) }}" class="font-semibold text-accent underline">{{ __('movies.sign_up') }}</a>
                @else
                    {{ __('movies.have_account') }} <a href="{{ route('member.login', [], false) }}?redirect={{ urlencode(request('redirect', '')) }}" class="font-semibold text-accent underline">{{ __('movies.sign_in') }}</a>
                @endif
            </p>
        </div>
    </div>
@endsection