@extends('admin.main.plane')
@section('content')
<section id="page-header" class="page-login">
   <div class="container-swarkul">
      <nav aria-label="breadcrumb" class="d-none d-sm-block">
         <ol class="breadcrumb">
            <li class="breadcrumb-item"><a href="/">Home</a></li>
            <li class="breadcrumb-item active" aria-current="page">Teacher Registration</li>
         </ol>
      </nav>
      <div class="page-title" style="max-width: 435px;">Teacher Registration</div>
   </div>
</section>
<div class="container">
   <div class="content-wrapper">
      <div class="content-header row"></div>
      <div class="content-body">
         <div class="col-xl-12 col-12 mb-5">
            <div class="bg-authentication mb-0">
               <div class="row m-0">
                  <!-- left section-login -->
                  <div class="col-md-6 px-0">
                     <div class="card mb-0 p-2 h-100 d-flex justify-content-center">
                        <div class="card-content">
                           <div class="card-body">
                              <form method="POST" action="{{ url('teacher-registration') }}" id="teacherRegister">
                                 @csrf
                                 <div class="form-group mb-50">
                                    <label class="text-bold-600">Teacher Name<span class="red-star">*</span></label>
                                    <input type="text" name="academy_name" maxlength="100" class="form-control">
                                 </div>
                                 <div class="form-group mb-50 ">
                                    <label class="text-bold-600" for="exampleInputEmail1">Email ID<span class="red-star">*</span></label>
                                    <input type="email" name="email" maxlength="255" class="form-control" id="exampleInputEmail1">
                                 </div>
                                 <div class="row">
                                    <div class="form-group col-md-6 col-12">
                                       <label class="text-bold-600">Password<span class="red-star">*</span></label>
                                       <input type="password" name="password" class="form-control" id="password">
                                       <label class="text-bold-600" style="margin-top: 10px;">Confirm Password<span class="red-star">*</span></label>
                                       <input type="password" name="confirm_password" id="confirm_password" class="form-control">
                                    </div>
                                    <div class="form-group col-md-6 col-12">
                                       <div class="alert alert-warning password-alert d-sm-block" role="alert" style="margin-top: 25px;">          
                                          <p class="requirements leng"><i class="icofont-check-alt fa-check" style="color: green;"></i><i class="icofont-close-line fa-times" style="color: red;"></i> 8 or more letters</p>
                                          <p class="requirements big-letter"><i class="icofont-check-alt fa-check" style="color: green;"></i><i class="icofont-close-line fa-times" style="color: red;"></i> atleast 1 capital letter</p>
                                          <p class="requirements num"><i class="icofont-check-alt fa-check" style="color: green;"></i><i class="icofont-close-line fa-times" style="color: red;"></i> at least 1 number</p>
                                          <p class="requirements special-char"><i class="icofont-check-alt fa-check" style="color: green;"></i><i class="icofont-close-line fa-times" style="color: red;"></i> at least 1 special character</p>     
                                       </div>
                                    </div>                                    
                                    <div class="form-group col-md-12 col-12">
                                       <label class="text-bold-600">Address 1<span class="red-star">*</span></label>
                                       <input type="text" maxlength="100" name="address_1" class="form-control">
                                    </div>
                                    <div class="form-group col-md-12 col-12">
                                       <label class="text-bold-600">Address 2</label>
                                       <input type="text" maxlength="100" name="address_2" class="form-control">
                                    </div>
                                    <div class="form-group col-md-6 col-12">
                                       <label class="text-bold-600">City<span class="red-star">*</span></label>
                                       <input type="text" maxlength="45" name="city" class="form-control">
                                    </div>
                                    <div class="form-group col-md-6 col-12">
                                       <label class="text-bold-600">State<span class="red-star">*</span></label>
                                       <input type="text" name="state" class="form-control">
                                    </div>
                                    <div class="form-group col-md-6 col-12">
                                       <label class="text-bold-600">Zip code<span class="red-star">*</span></label>
                                       <input type="text" name="zipcode" maxlength="11" class="form-control js-number">
                                    </div>
                                    <div class="form-group col-md-6 col-12">
                                       <label class="text-bold-600">Country<span class="red-star">*</span></label>
                                        {!! Form::select('country', array(''=>'Select')+$country,null,['class'=>'form-control','id'=>'country']) !!}
                                    </div>
                                    <div class="form-group col-md-12 col-12">
                                       <label class="text-bold-600" for="exampleInputPassword1">Phone<span class="red-star">*</span></label>
                                       <div class="row">
                                          <div class="col-md-1">
                                             <i class='bx bx-plus' style="font-size: 1.20em; padding: 8px;"></i>
                                          </div>
                                          <div class="col-md-2">
                                             <input maxlength="3" type="text" name="code" class="form-control js-number" placeholder="" style="width:60px;">
                                          </div>
                                          <div class="col-md-4">
                                             <input type="text" maxlength="10" name="phone" class="form-control js-number" id="phone">
                                          </div>
                                       </div>
                                    </div>
                                    <div class="form-group col-md-12 col-12">
                                       <label class="text-bold-600" for="music_academy">Academy Name</label>
                                       <input type="text" name="music_academy" maxlength="100" class="form-control">
                                    </div>
                                    <div class="form-group col-md-12 col-12">
                                       <label class="text-bold-600" for="teacher_name">Genre</label>
                                       <input type="text" name="music_stream" maxlength="100" class="form-control">
                                    </div>
									         <div class="form-group col-md-6 col-6">
                                       <label class="text-bold-600" for="teacher_name">Is Academy</label>
									            <select name="is_academy" class="form-control">
										            <option value="1">Yes</option>
										            <option value="0">No</option>
										         </select>                                       
                                    </div>
									         <div class="form-group col-md-6 col-6">
                                       <label class="text-bold-600" for="teacher_name">Status</label>
                                       <select name="status" class="form-control">
										            <option value="Active">Active</option>
										            <option value="Inactive">Deactivate</option>
										         </select>
                                    </div>
                                 </div>
                                 <button type="submit" class="btn btn-primary glow w-100 position-relative">Register <i id="icon-arrow" class="bx bx-right-arrow-alt"></i></button>
                                 <br>
                                 <div class="text-center">Already have an account <a href="{{ url('login') }}" class="card-link"><b>login ?</b></a></div>
                              </form>
                           </div>
                        </div>
                     </div>
                  </div>
                  <!-- right section image -->
                  <div class="col-md-6 text-center align-self-center p-3">
                     <img class="img-fluid" src="{{asset('images/admin/images/pages/login.jpg')}}" alt="branding logo">
                  </div>
               </div>
            </div>
         </div>
      </div>
   </div>
</div>
@endsection