@extends('main')

@section('content')

<section class="cs_banner cs_style_3 cs_bg_filed" data-src="assets/img/appointments/banner_bg.svg">
  <div class="cs_banner_img">
      <img src="assets/img/about/bg6.png" alt="Banner Image" class="cs_main_banner_img" style="height:600px;">
    <!--<img src="assets/img/appointments/banner_img.png" alt="Banner Image">-->
  </div>
  <div class="container">
    <div class="cs_banner_text">
      <h2 class="cs_banner_title cs_fs_72">Help Million of Persons around the World!</h2>
      <p class="cs_banner_subtitle cs_fs_20 mb-0 cs_heading_color">Help reach out to as many that are in need of medical care around the world with your expertise.</p>
    </div>
  </div>
</section>
<!-- End Banner  -->
<!-- Start Appointment -->
<section>
  <div class="cs_height_200 cs_height_xl_150 cs_height_lg_110"></div>
  <div class="container">
    <div class="row">
      <div class="col-lg-7">
          <form class="pt-3" method="post" enctype="multipart/form-data" action="{{route('register.submit')}}">
              @csrf
        
        <div class="cs_height_42 cs_height_xl_25"></div>
        <div class="row personal">
            <h2 class="cs_fs_40 cs_medium mb-3">Personal Details</h2>
          <div class="col-lg-6">
            <label class="cs_input_label cs_heading_color">First Name</label>
            <input type="text" name="first_name" class="cs_form_field" placeholder="First name">
            <div class="cs_height_42 cs_height_xl_25"></div>
          </div>
          <div class="col-lg-6">
              <label class="cs_input_label cs_heading_color">Last Name</label>
              <input type="text" name="last_name" class="cs_form_field" placeholder="Last name">
              <div class="cs_height_42 cs_height_xl_25"></div>
            </div>
            <div class="col-lg-6">
                <label class="cs_input_label cs_heading_color">Email Address</label>
                <input type="email" name="email" class="cs_form_field" placeholder="Email Address">
                <div class="cs_height_42 cs_height_xl_25"></div>
              </div>
          <div class="col-lg-6">
            <label class="cs_input_label cs_heading_color">Phone Number</label>
            <input type="tel" name="phone" class="cs_form_field" placeholder="Phone Number">
            <div class="cs_height_42 cs_height_xl_25"></div>
          </div>
          <div class="col-lg-6">
                <label class="cs_input_label cs_heading_color">Date of Birth</label>
                <input type="date" name="dob" class="cs_form_field" placeholder="Date of Birth">
                <div class="cs_height_42 cs_height_xl_25"></div>
              </div>
          <div class="col-lg-6">
            <label class="cs_input_label cs_heading_color">Medical License Number</label>
            <input type="text" name="license" class="cs_form_field" placeholder="Member License Number">
            <div class="cs_height_42 cs_height_xl_25"></div>
          </div>
          <div class="col-lg-12">
            <label class="cs_input_label cs_heading_color">Bio</label>
            <textarea rows="5" name="about" class="cs_form_field" placeholder="Brief description about yourself"></textarea>
            <div class="cs_height_42 cs_height_xl_25"></div>
          </div>
          <div class="col-lg-6">
            <label class="cs_input_label cs_heading_color">Gender</label>
            <select name="gender" class="cs_select form-control" data-placeholder="Gender">
              <!-- <option></option> -->
              <option>Male</option>
              <option>Female</option>
              
            </select>
            <div class="cs_height_42 cs_height_xl_25"></div>
          </div>
          <div class="col-lg-6">
              <label class="cs_input_label cs_heading_color">Designation</label>
              <input type="text" name="designation" class="cs_form_field" placeholder="Professional Title/Designation">
              <div class="cs_height_42 cs_height_xl_25"></div>
            </div>
            <div class="col-lg-6">
                <label class="cs_input_label cs_heading_color">Username</label>
                <input type="text" name="username" class="cs_form_field" placeholder="Username">
                <div class="cs_height_42 cs_height_xl_25"></div>
              </div>
          <div class="col-lg-6">
            <label class="cs_input_label cs_heading_color">Password</label>
            <input type="password" name="password" class="cs_form_field" placeholder="Password">
            <div class="cs_height_42 cs_height_xl_25"></div>
          </div>
          <div class="col-lg-6">
            <label class="cs_input_label cs_heading_color">Medical Professional Development </label>
            <select name="mpd" class="cs_select form-control" data-placeholder="MPD">
             <option>Select an option</option>
             <option>Residency</option>
             <option>Fellowship</option>
             <option>Board Certification</option>
             <option>Attending Physician or Consultant</option> 
            </select>
            <div class="cs_height_42 cs_height_xl_25"></div>
          </div>
          <div class="col-lg-6">
            <label class="cs_input_label cs_heading_color">Category</label>
            <select name="department" class="cs_select form-control" data-placeholder="Department">
             <option>Select Department</option>
             @if(count($department)>0)
             @foreach($department as $dept)
              <option value="{{ $dept->id }}">{{ $dept->name }}</option>
              @endforeach
              @endif
            </select>
            <div class="cs_height_42 cs_height_xl_25"></div>
          </div>
          <div class="col-lg-6">
            <label class="cs_input_label cs_heading_color">Board Certifications</label>
            <input type="text" name="certify" required class="cs_form_field" placeholder="">
            <div class="cs_height_42 cs_height_xl_25"></div>
          </div>
          
          <div class="col-lg-6">
            <label class="cs_input_label cs_heading_color">Picture</label>
            <input type="file" name="image" required class="cs_form_field" placeholder="">
            <div class="cs_height_42 cs_height_xl_25"></div>
          </div>
          <div class="col-lg-12">
            <div class="cs_height_18"></div>
            <div class="d-flex justify-content-end">
            <button type="button" class="cs_btn cs_style_1 next_1">
              <span>NEXT</span>
              <i>
                <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                <img src="assets/img/icons/arrow_white.svg" alt="Icon">
              </i>
            </button>
            </div>
          </div>
        </div>

        <div class="row degree">
          <div class="col-lg-12">
              <h2 class="cs_fs_40 cs_medium mb-3">Degree Obtained</h2>
              <div class="table-responsive">
                  <table class="table">
                      <thead>
                          <tr>
                             <th>
                                 Institution
                             </th> 
                             <th>
                                 Title
                             </th> 
                            
                             <th>
                                 Actions
                             </th>
                         </tr>
                     </thead>
                     <tbody class="deg_custom">
                         
                     </tbody>
                 </table>
          </div>
        </div>
            <div class="col-lg-12">
              <label class="cs_input_label cs_heading_color">Institution</label>
              <input type="text" name="" class="cs_form_field deg_ins" placeholder="Full name of Institution">
              <div class="cs_height_42 cs_height_xl_25"></div>
            </div>
            <div class="col-lg-12">
                <label class="cs_input_label cs_heading_color">Course of Study/Title Attained</label>
                <input type="text" name="" class="cs_form_field deg_title" placeholder="Title Attained">
                <div class="cs_height_42 cs_height_xl_25"></div>
              </div>
              
              <div class="col-lg-12 mb-5">
                  <div class="cs_height_18"></div>
                  
                  <button type="button" class="cs_btn cs_style_1" onclick="addDegree()">
                    <span>Add Degree</span>
                    <i>
                      <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                      <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                    </i>
                  </button>

                  <input id="deg_num"  type="hidden" class="form-control" value="1" required class="deg_num" name="deg_num">
                </div>

            <div class="col-lg-12">
              <div class="cs_height_18"></div>
              <div class="d-flex justify-content-between">
              <button type="button" class="cs_btn cs_style_1 prev_1">
                <span>PREV</span>
                <i>
                  <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                  <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                </i>
              </button>
              <button type="button" class="cs_btn cs_style_1 next_2">
                <span>NEXT</span>
                <i>
                  <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                  <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                </i>
              </button>
              </div>
            </div>
          </div>

          <div class="row experience">
              <div class="col-lg-12">
                  <h2 class="cs_fs_40 cs_medium mb-3">Experiences</h2>
                  <div class="table-responsive">
                      <table class="table">
                          <thead>
                              <tr>
                                 <th>
                                     Experience Title
                                 </th> 
                                
                                 <th>
                                     Actions
                                 </th>
                             </tr>
                         </thead>
                         <tbody class="exp_custom">
                             
                         </tbody>
                     </table>
              </div>
            </div>
                <div class="col-lg-12">
                  <label class="cs_input_label cs_heading_color">Experience Obtained</label>
                  <input type="text" name="" class="cs_form_field exp_title" placeholder="Experience Obtained">
                  <div class="cs_height_42 cs_height_xl_25"></div>
                </div>
                
                  <div class="col-lg-12 mb-5">
                      <div class="cs_height_18"></div>
                      <button type="button" class="cs_btn cs_style_1" onclick="addExperience()">
                        <span>Add Experience</span>
                        <i>
                          <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                          <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                        </i>
                      </button>
    
                      <input id="exp_num"  type="hidden" class="form-control" value="1" required class="exp_num" name="exp_num">
                    </div>
    
                <div class="col-lg-12">
                  <div class="cs_height_18"></div>
                  <div class="d-flex justify-content-between">
                      <button type="button" class="cs_btn cs_style_1 prev_2">
                        <span>PREV</span>
                        <i>
                          <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                          <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                        </i>
                      </button>
                      <button type="button" class="cs_btn cs_style_1 next_3">
                    <span>NEXT</span>
                    <i>
                      <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                      <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                    </i>
                  </button>
                  </div>
                </div>
              </div>

              <div class="row award">
                  <div class="col-lg-12">
                      <h2 class="cs_fs_40 cs_medium mb-3">Awards</h2>
                      <div class="table-responsive">
                          <table class="table">
                              <thead>
                                  <tr>
                                     
                                     <th>
                                         Award Title
                                     </th> 
                                    
                                     <th>
                                         Actions
                                     </th>
                                 </tr>
                             </thead>
                             <tbody class="awd_custom">
                                 
                             </tbody>
                         </table>
                  </div>
                </div>
                    <div class="col-lg-12">
                      <label class="cs_input_label cs_heading_color">Award Obtained</label>
                      <input type="text" name="" class="cs_form_field awd_title" placeholder="Award obtained">
                      <div class="cs_height_42 cs_height_xl_25"></div>
                    </div>
                    
                      
                      <div class="col-lg-12 mb-5">
                          <div class="cs_height_18"></div>
                          <button type="button" class="cs_btn cs_style_1" onclick="addAward()">
                            <span>Add Award</span>
                            <i>
                              <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                              <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                            </i>
                          </button>
        
                          <input id="awd_num"  type="hidden" class="form-control" value="0" required class="awd_num" name="awd_num">
                        </div>
        
                    <div class="col-lg-12">
                      <div class="cs_height_18"></div>
                      <div class="d-flex justify-content-between">
                          <button type="button" class="cs_btn cs_style_1 prev_3">
                            <span>PREV</span>
                            <i>
                              <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                              <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                            </i>
                          </button>
                      <button class="cs_btn cs_style_1" type="submit">
                        <span>Submit</span>
                        <i>
                          <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                          <img src="assets/img/icons/arrow_white.svg" alt="Icon">
                        </i>
                      </button>
                      </div>
                    </div>
                  </div>
      
                </form>
        </div>
      <div class="col-lg-4 offset-lg-1">
        <div class="cs_height_lg_100"></div>
        <h2 class="cs_fs_40 cs_medium mb-0">Contact Info</h2>
        <div class="cs_height_60 cs_height_xl_40"></div>
        <img src="assets/img/new/1.png" alt="Appointment" class="cs_radius_25 w-100">
        <div class="cs_height_100 cs_height_xl_60"></div>
        <ul class="cs_contact_info cs_style_1 cs_mp0">
          <li>
            <h3 class="cs_fs_24 cs_semibold mb-0">Phone</h3>
            <p class="mb-0 cs_heading_color">{{ $set->phone }}</p>
          </li>
          <li>
            <h3 class="cs_fs_24 cs_semibold mb-0">Email Us</h3>
            <p class="mb-0 cs_heading_color"><a href="" class="__cf_email__"> {{ $set->email }}</a></p>
          </li>
          <li>
            <h3 class="cs_fs_24 cs_semibold mb-0">Our Location</h3>
            <p class="mb-0 cs_heading_color">{!! $set->address !!}</p>
          </li>
        </ul>
      </div>
    </div>
  </div>
</section>
<!-- End Appointment -->
<div class="cs_height_200 cs_height_xl_150 cs_height_lg_110"></div>


@stop

