@extends('layouts.auth')

@section('title', __('app.login') . ' - SEU CRM')

@section('content')
    <div class="container">
        <div class="row justify-content-center authentication authentication-basic align-items-center h-100">
            <div class="col-xxl-4 col-xl-5 col-lg-5 col-md-6 col-sm-8 col-12">
                <div class="mb-3 d-flex justify-content-center auth-logo"> 
                    <a href="{{ url('/') }}"> 
                        <img src="{{ asset('assets/images/brand-logos/desktop-dark.png') }}" alt="logo" class="desktop-dark"> 
                    </a> 
                </div>
                <div class="card custom-card my-4 border z-3 position-relative">
                    <div class="card-body p-0">
                        <div class="p-5">
                            <div class="d-flex align-items-center justify-content-between mb-3">
                                <span class="auth-icon">
                                    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64" id="password"><path fill="#6446fe" d="M59,8H5A1,1,0,0,0,4,9V55a1,1,0,0,0,1,1H59a1,1,0,0,0,1-1V9A1,1,0,0,0,59,8ZM58,54H6V10H58Z" class="color1d1f47 svgShape"></path><path fill="#6446fe" d="M36,35H28a3,3,0,0,1-3-3V27a3,3,0,0,1,3-3h8a3,3,0,0,1,3,3v5A3,3,0,0,1,36,35Zm-8-9a1,1,0,0,0-1,1v5a1,1,0,0,0,1,1h8a1,1,0,0,0,1-1V27a1,1,0,0,0-1-1Z" class="color0055ff svgShape"></path><path fill="#6446fe" d="M36 26H28a1 1 0 0 1-1-1V24a5 5 0 0 1 10 0v1A1 1 0 0 1 36 26zm-7-2h6a3 3 0 0 0-6 0zM32 31a1 1 0 0 1-1-1V29a1 1 0 0 1 2 0v1A1 1 0 0 1 32 31z" class="color0055ff svgShape"></path></svg>
                                </span>
                                <a href="{{ route('language.switch', app()->getLocale() == 'en' ? 'ar' : 'en') }}" class="">
                                    <img src="{{ app()->getLocale() == 'en' ? asset('assets/images/ar.png') : asset('assets/images/en.png') }}" alt="flag" class="height-20">
                                </a>
                            </div>
                            
                            <p class="h4 fw-semibold mb-0 text-center">{{ __('app.sign_in') }}</p>
                            <p class="mb-3 text-muted fw-normal text-center">{{ __('app.welcome_message') }}</p>
                            <form method="POST" action="{{ route('login') }}">
                                @csrf
                                <div class="row gy-3">
                                    <div class="col-xl-12">
                                        <label for="username" class="form-label text-default">{{ __('app.username') }}</label>
                                        <div class="position-relative">
                                            <input type="text" name="username" class="form-control form-control-lg" id="username" placeholder="{{ __('app.enter_username') }}" value="{{ old('username') }}" required>
                                        </div>
                                        @if(isset($errors) && $errors->has('username'))
                                            <div class="text-danger mt-1">{{ $errors->first('username') }}</div>
                                        @endif
                                    </div>
                                    <div class="col-xl-12 mb-2">
                                        <label for="password" class="form-label text-default d-block">{{ __('app.password') }}</label>
                                        <div class="position-relative">
                                            <input type="password" name="password" class="form-control form-control-lg" id="password" placeholder="{{ __('app.password') }}" required>
                                            <a href="javascript:void(0);" class="show-password-button text-muted" onclick="createpassword('password',this)" id="button-addon2"><i class="ri-eye-off-line align-middle"></i></a>
                                        </div>
                                        @if(isset($errors) && $errors->has('password'))
                                            <div class="text-danger mt-1">{{ $errors->first('password') }}</div>
                                        @endif
                                    </div>
                                </div>
                                <div class="d-grid mt-4">
                                    <button type="submit" class="btn btn-primary">{{ __('app.sign_in') }}</button>
                                </div>
                                <div class="text-center">
                                    <p class="fs-12 text-muted mt-3">{{ __('app.forgot_password') }} <a href="{{ route('password.request') }}" class="text-primary">{{ __('app.reset_here') }}</a></p>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
@endsection