@extends('layouts.guest')
@section('title', __('Set a new password'))

@section('content')
<div>
    <h1 class="text-3xl font-semibold tracking-tight text-slate-900 dark:text-white">{{ __('Set a new password') }}</h1>
    <p class="mt-2 text-sm text-slate-500 dark:text-slate-400">{{ __('Choose a strong password to secure your workspace.') }}</p>

    @if($errors->any())
        <div class="mt-6 mb-4 px-4 py-3 rounded-xl bg-rose-50 text-rose-700 dark:bg-rose-900/30 dark:text-rose-300 text-sm">{{ $errors->first() }}</div>
    @endif

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

        <div>
            <label class="form-label">{{ __('Email') }}</label>
            <input name="email" type="email" required value="{{ old('email', $request->email) }}" class="form-input">
        </div>
        <div>
            <label class="form-label">{{ __('New password') }}</label>
            <input name="password" type="password" required class="form-input" autocomplete="new-password">
        </div>
        <div>
            <label class="form-label">{{ __('Confirm password') }}</label>
            <input name="password_confirmation" type="password" required class="form-input" autocomplete="new-password">
        </div>
        <button class="btn-primary w-full">{{ __('Reset password') }}</button>
    </form>

    <p class="mt-8 text-center text-sm text-slate-500 dark:text-slate-400">
        <a href="{{ route('login') }}" class="font-medium text-slate-900 dark:text-white hover:underline">{{ __('Back to sign in') }}</a>
    </p>
</div>
@endsection