@extends('auth.layouts.app')

@section('meta_title', "تسجيل الدخول")

@section('content')

    <div class="mb-5 text-center">
        <h2 class="fw-bold">{{ __('app.Signin') }}</h2>

        @include('website.components.success-submit')
        @include('website.components.error-submit')
    </div>

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

        <div class="mb-3">
            <div class="form-floating">
                <input type="text" name="email" value="{{ old('email') }}" id="email" class="form-control @error('email') is-invalid @enderror" placeholder="" required>
                <label for="email">{{ __('labels.Email') }}</label>
            </div>

            @include('website.components.invalid-input', ['name' => 'email'])
        </div>

        <div class="mb-2">
            <div class="input-group">
                <div class="form-floating">
                    <input type="password" id="password" name="password" id="password" class="form-control @error('password') is-invalid @enderror" placeholder="" required />
                    <label for="password">{{ __('labels.Password') }}</label>
                </div>

                <span class="input-group-text" onclick="togglePasswordVisibility('password', this)">
                    <i class="show-password fa-solid fa-eye"></i>
                </span>
            </div>

            @include('website.components.invalid-input', ['name' => 'password'])
        </div>

        <div class="mb-4">
            <div class="d-flex align-items-center justify-content-between g-3">
                <div class="form-check">
                    <input type="checkbox" id="remember_me" name="remember" class="form-check-input">
                    <span class="ps-1"></span>
                    <label class="form-check-label text-capiatalize" for="remember_me">{{ __('labels.Remember me') }}</label>
                </div>

                <a href="{{ route('password.request') }}" class="color1 fs-16 text-decoration-none">{{ __('app.messages.Forgot your password') }}</a>
            </div>
        </div>

        <div class="d-grid gap-3">
            <button type="submit" class="btn btn-primary fw-bold">{{ __('app.Login') }}</button>

            <div class="lh-lg">
                <div class="text-center fs-14">
                    {{ __('app.messages.Not have account') }} 
                    <a href="{{ route('register') }}" class="text-primary text-decoration-underline fw-bold">{{ __('app.Signup') }}</a>
                </div>

                <div class="text-center fs-14">
                    عودة ل 
                    <a href="{{ route('website.index') }}" class="text-primary text-decoration-underline fw-bold">{{ __('app.Home') }}</a>
                </div>
            </div>
        </div>
    </form>

@endsection