@extends('layouts.app')

@section('title', 'Lupa Password')

@section('content')
<div class="max-w-md mx-auto mt-10 bg-white dark:bg-gray-800 p-6 rounded shadow">
    <h1 class="text-2xl font-bold mb-4 text-gray-800 dark:text-white">🔐 Lupa Password</h1>

    @if (session('status'))
        <div class="mb-4 text-green-600 dark:text-green-400">
            {{ session('status') }}
        </div>
    @endif

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

        <div class="mb-4">
            <label for="email" class="block text-sm font-medium text-gray-700 dark:text-white">Alamat Email</label>
            <input type="email" name="email" id="email"
                   class="w-full mt-1 border rounded px-3 py-2 bg-white dark:bg-gray-900 text-gray-800 dark:text-white"
                   required autofocus>
            @error('email')
                <p class="text-red-500 text-sm mt-1">{{ $message }}</p>
            @enderror
        </div>

        <div class="flex justify-end">
            <button type="submit"
                    class="bg-blue-600 text-white px-4 py-2 rounded hover:bg-blue-700">
                Kirim Link Reset
            </button>
        </div>
    </form>
</div>
@endsection