{{-- resources/views/auth/forgot-password.blade.php --}}
@extends('layouts.horizontalLayoutMaster')

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

@section('page-style')
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" />
    <style>
        .auth-wrapper {
            display: flex;
            justify-content: center;
            align-items: center;
            min-height: 100vh;
            padding: 40px;
        }

        .auth-inner {
            width: 100%;
            max-width: 420px;
        }

        .card {
            padding: 30px;
            border-radius: 10px;
        }

        .btn-primary {
            width: 100%;
            margin-top: 15px;
        }

        .form-title {
            font-size: 20px;
            margin-bottom: 15px;
            text-align: center;
        }

        .form-description {
            font-size: 14px;
            color: #6c757d;
            margin-bottom: 20px;
            text-align: center;
        }
    </style>
@endsection

@section('content')
    <div class="auth-wrapper">
        <div class="auth-inner">
            <div class="card shadow">
                <div class="card-body">
                    <h4 class="form-title">Forgot Password</h4>
                    <p class="form-description">
                        No problem. Just enter your email address and we’ll send you a password reset link.
                    </p>

                    {{-- ✅ Session Status --}}
                    @if (session('status'))
                        <div class="alert alert-success">
                            {{ session('status') }}
                        </div>
                    @endif

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

                        <div class="mb-3">
                            <label for="email" class="form-label">Email address</label>
                            <input type="email" id="email" name="email" class="form-control"
                                value="{{ old('email') }}" required autofocus>
                            @error('email')
                                <div class="text-danger mt-1">{{ $message }}</div>
                            @enderror
                        </div>

                        <button type="submit" class="btn btn-primary">
                            Email Password Reset Link
                        </button>
                    </form>
                </div>
            </div>
        </div>
    </div>
@endsection