@extends('layouts.app', ['title' => 'Set New Password'])

@section('content')
<div class="mx-auto max-w-lg rounded-[2rem] border border-white/10 bg-slate-900/80 p-8">
    <h1 class="font-display text-3xl font-bold text-white">Create a new password</h1>
    <p class="mt-2 text-sm text-slate-400">Choose a strong password for your FinCoreHub account.</p>

    <form method="POST" action="{{ route('password.update') }}" class="mt-8 space-y-5">
        @csrf
        <input type="hidden" name="token" value="{{ $request->route('token') }}">

        <div>
            <label class="mb-2 block text-sm text-slate-300">Email address</label>
            <input type="email" name="email" value="{{ old('email', $request->email) }}" placeholder="name@company.com" class="w-full rounded-2xl border border-white/10 bg-slate-950/80 px-4 py-3 text-white" required>
        </div>

        <div>
            <label class="mb-2 block text-sm text-slate-300">New password</label>
            <input type="password" name="password" placeholder="Minimum 10 characters" class="w-full rounded-2xl border border-white/10 bg-slate-950/80 px-4 py-3 text-white" required>
        </div>

        <div>
            <label class="mb-2 block text-sm text-slate-300">Confirm password</label>
            <input type="password" name="password_confirmation" placeholder="Repeat the new password" class="w-full rounded-2xl border border-white/10 bg-slate-950/80 px-4 py-3 text-white" required>
        </div>

        <button type="submit" class="w-full rounded-2xl bg-brand-500 px-5 py-3 font-semibold text-white shadow-glow">
            Reset password
        </button>
    </form>
</div>
@endsection