@extends('layouts.admin-auth')

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

@section('content')
<div class="mb-6 text-sm text-gray-600">
    Forgot your password? No problem. Just let us know your email address and we will email you a password reset link.
</div>

<!-- Session Status -->
@if (session('status'))
    <div class="mb-6 p-3 bg-green-100 border border-green-300 text-green-700 rounded">
        {{ session('status') }}
    </div>
@endif

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

    <!-- Email Address -->
    <div>
        <label for="email" class="block font-medium text-sm text-gray-700">Email</label>
        <input id="email" type="email" name="email" value="{{ old('email') }}" required autofocus
            class="mt-1 block w-full px-3 py-2 bg-white border border-gray-300 rounded-md shadow-sm placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-red-500 focus:border-red-500 sm:text-sm @error('email') border-red-500 @enderror">
        
        @error('email')
            <span class="text-red-500 text-xs mt-1">{{ $message }}</span>
        @enderror
    </div>

    <div class="flex items-center justify-between mt-6">
        <a href="{{ route('admin.login') }}" class="text-sm text-red-600 hover:text-red-800">
            Back to login
        </a>

        <button type="submit" class="ml-4 inline-flex items-center px-4 py-2 bg-red-600 border border-transparent rounded-md font-semibold text-xs text-white uppercase tracking-widest hover:bg-red-700 focus:outline-none focus:border-red-700 focus:ring focus:ring-red-200 active:bg-red-600 disabled:opacity-25 transition">
            Email Password Reset Link
        </button>
    </div>
</form>
@endsection