@extends('superadmin::layouts.master')
@section('navbar') @endsection
@section('sidebar') @endsection
@section('header') @endsection
@section('footer') @endsection
{{-- this to override the default body attributes then add the login page specfic attribnutes --}}
@section('custom_body_attr') data-col="1-column" class="vertical-layout vertical-menu 1-column blank-page blank-page
pace-done" @endsection
@section('title','Register')
@section('content')

<section class="flexbox-container logo-section">
    <div class="col-md-4 offset-md-4 col-xs-10 offset-xs-1  box-shadow-2 p-0 my-3">
        <div class="card border-grey border-lighten-3 m-0">
            <div class="card-header no-border">
                <li class="dropdown dropdown-language nav-item" style="list-style-type: none;">
                    <a id="dropdown-flag" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
                        class="dropdown-toggle nav-link"><i
                            class="flag-icon @if(app()->getLocale() === 'en') flag-icon-us @else flag-icon-sa @endif"></i><span
                            class="selected-language"></span></a>
                    <div aria-labelledby="dropdown-flag" class="dropdown-menu">
                        <a href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale() === 'en' ? 'ar' : 'en') }}"
                            class="dropdown-item"><i
                                class="flag-icon @if(app()->getLocale() === 'en') flag-icon-sa @else flag-icon-us @endif"></i>
                            {{ LaravelLocalization::getCurrentLocale() === 'en' ? 'العربية' : 'English' }}</a>

                    </div>
                </li>
                <div class="card-title text-xs-center">
                    <div class="p-1"><img src="{{asset('/assets/images/logo/colored-logo.png')}}" alt="Vom logo" class="logo">
                        <h1 class="login-title">VOM</h1>
                    </div>
                </div>
                <h6 class="card-subtitle line-on-side text-muted text-xs-center font-small-3 ">
                    <span>@lang('Register')</span></h6>
            </div>

            <div class="card-body collapse in">
                <div class="card-block">
                    @include('superadmin::errors.lists')
                    <form method="POST" action="{{ route('register') }}" novalidate>
                         @csrf
                        <fieldset class="form-group position-relative has-icon-left">
                            <input type="text" id="uname"
                                class="form-control form-control-lg input-lg @error('uname') is-invalid @enderror "
                                name="uname" value="{{ old('uname') }}" required autocomplete="uname"
                                placeholder="{{__('Name')}}" autofocus>
                            <div class="form-control-position">
                                <i class="ft-user"></i>
                            </div>
                            @error('uname')
                            <span class="invalid-feedback" role="alert">
                                <p>{{ $message }}</p>
                            </span>
                            @enderror
                        </fieldset>
                        <fieldset class="form-group position-relative has-icon-left">
                            <input type="email"
                                class="form-control form-control-lg input-lg @error('email') is-invalid @enderror "
                                name="email" value="{{ old('email') }}" id="user-name" required
                                placeholder="{{__('Enter Email Address')}}">
                            <div class="form-control-position">
                                <i class="ft-mail"></i>
                            </div>
                            @error('email')
                            <span class="invalid-feedback" role="alert">
                                <p>{{ $message }}</p>
                            </span>
                            @enderror
                        </fieldset>
                        <fieldset class="form-group position-relative has-icon-left">
                            <input type="password" id="password"
                                class="form-control form-control-lg input-lg  @error('password') is-invalid @enderror"
                                name="password" id="user-password" required placeholder="@lang('Password')" autocomplete="new-password"
                                onpaste="return false;">
                                <span style="font-style: italic;color: #a9a6a6;font-size: 12px;">
                                 @lang('Hint: Password should be between 8 and 16 characters and contain Lowercase, uppercase letters and number')
                                </span>
                                @error('password')
                                <span class="invalid-feedback" role="alert">
                                    <p>{{ $message }}</p>
                                </span>
                                @enderror
                            <div class="form-control-position">
                                <i class="fa fa-key"></i>
                            </div>
                        </fieldset>
                        <fieldset class="form-group position-relative has-icon-left">
                            <input type="password" id="password-confirm"
                                class="form-control form-control-lg input-lg  @error('password_confirmation') is-invalid @enderror"
                                name="password_confirmation" id="password-confirm"  required placeholder="@lang('Confirm Password')"  autocomplete="new-password"
                                onpaste="return false;">
                                @error('password_confirmation')
                                <span class="invalid-feedback" role="alert">
                                    <p>{{ $message }}</p>
                                </span>
                                @enderror
                            <div class="form-control-position">
                                <i class="fa fa-key"></i>
                            </div>
                        </fieldset>
                        <button type="submit" class="btn btn-primary btn-lg btn-block"><i class="ft-unlock"></i>
                            @lang('Register')</button>
                    </form>
                </div>
            </div>
        </div>
    </div>
</section>

@endsection