@extends('Client.layouts.layout')

@section('content')
    <style>
        .iti {
            width: 100%;
        }
    </style>

    <section class="py-5">
    	<div class="container">
    		<div class="row justify-content-center">
    			<div class="col-lg-12 col-sm-12 col-xl-8 col-md-12 col-12">
    				<div class="card text-center p-4">
    					<form action="{{ route('client.forget-select-otp') }}" class="card-body" method="POST">
    					    @csrf
    						<h5 class="card-title h1 fw-semibold text-dark">@lang('trans.forget_password')</h5>
    						<p class="card-text text-dark text-normal mb-4">
    						    @lang('trans.forget_text')
    						</p>

    						<!-- End checkbox -->
    						<div class="row mb-4 placeholder-color">
    							<label for="" class="text-dark d-flex justify-content-start mb-2 mt-3  fw-semibold">@lang('trans.phone')</label>
    							<div class="col-sm-12">
    								<input type="tel" name="phone" id="phone" required class="form-control" type="tel" minlength="{{ Country()->length }}" maxlength="{{ Country()->length }}" size="{{ Country()->length }}"/>
                					<input type="hidden" name="country_code" id="country_code" value="{{ country_code() }}">
                					<input required type="hidden" name="phone_code" id="phone_code" value="{{ phone_code() }}">
    							</div>
    						</div>

    						<div class="mb-3">
    							<button type="submit" class="btn main_bt rounded-2 col-sm-12 fw-semibold"> @lang('trans.Submit') </button>
    						</div>
    						<span class="text-dark">@lang('trans.haveAccount') <a href="{{ route('client.login') }}" class="text-decoration-none fw-semibold">  @lang('trans.login') </a></span>
    					</form>
    				</div>
    			</div>
    		</div>
    	</div>
    </section>


	@include('intlTelInput')
	
@endsection