@extends('auth.layouts.guest')

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

@section('content')
    <div class="text-center text-lg-start mb-4">
        <p class="text-uppercase text-muted small fw-semibold mb-1" style="letter-spacing: 0.14em;">Password reset</p>
        <h1 class="h3 fw-bold mb-1">Forgot your password?</h1>
        <p class="text-muted small mb-0">Enter your account email and we will send you a link to reset your password.</p>
    </div>

    @if(session('status'))
        <div class="alert alert-success py-2 small mb-3" role="alert">{{ session('status') }}</div>
    @endif

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

        <div class="mb-3">
            <label for="company" class="form-label small fw-semibold">Company code</label>
            <input
                id="company"
                type="text"
                name="company"
                value="{{ old('company') }}"
                autocomplete="organization"
                class="form-control @error('company') is-invalid @enderror"
                placeholder="e.g. demo (blank for platform admin)"
            >
            @error('company')
                <div class="invalid-feedback">{{ $message }}</div>
            @enderror
        </div>

        <div class="mb-4">
            <label for="email" class="form-label small fw-semibold">Email address</label>
            <input
                id="email"
                type="email"
                name="email"
                value="{{ old('email') }}"
                required
                autofocus
                autocomplete="email"
                inputmode="email"
                class="form-control @error('email') is-invalid @enderror"
                placeholder="you@company.com"
            >
            @error('email')
                <div class="invalid-feedback">{{ $message }}</div>
            @enderror
        </div>

        <button type="submit" class="btn btn-kiyo w-100 login-submit-btn">Send reset link</button>
    </form>

    <p class="text-center small text-muted mt-4 mb-0">
        Remember your password?
        <a href="{{ route('login') }}" class="fw-semibold text-decoration-none" style="color: var(--kiyo-primary-dark);">Sign in</a>
    </p>
@endsection