@extends('layouts.app')

@section('content')


<div class="layout-wrapper layout-content-navbar">
    <div class="layout-container">
      <!-- Menu -->

      @include('includes.sidebar')
      <!-- / Menu -->

      <!-- Layout container -->
      <div class="layout-page">
        <!-- Navbar -->

        @include('includes.header')

        <!-- / Navbar -->

        <!-- Content wrapper -->
        <div class="content-wrapper">
            <!-- Content -->
            {{-- @dd($contents) --}}
            <div class="container-xxl flex-grow-1 container-p-y">
                <h4 class="fw-bold py-3 mb-4"><span class="text-muted fw-light">Service Users/</span> Add New</h4>
  
                <!-- Basic Layout -->
                <div class="row">
                  <div class="col-xl">
                    <div class="card mb-4">
                      <div class="card-header d-flex justify-content-between align-items-center">
                        <h5 class="mb-0">Basic Details</h5>
                        {{-- <small class="text-muted float-end">Default label</small> --}}
                      </div>
                      <div class="card-body">
                        <form method="post" action="{{url('/addUser')}}">
                            @csrf
                          <div class="mb-3 row">
                            <div class="col-md-4">
                                <label class="form-label" for="first_name">First Name</label>
                                <input type="text" name="first_name" class="form-control" id="first_name" placeholder="John" />
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" for="middle_name">Middle Name</label>
                                <input type="text" name="middle_name" class="form-control" id="middle_name" placeholder="Doe" />
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" for="last_name">Last Name</label>
                                <input type="text" name="last_name" class="form-control" id="last_name" placeholder="John" />
                            </div>
                          </div>
                          <div class="mb-3 row">
                            <div class="col-md-4">
                                <label class="form-label" for="dob">DOB</label>
                                <input type="date" name="dob" class="form-control" id="dob" />
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" for="gender">Gender</label>
                                <select class="form-select" name="gender" id="gender" aria-label="Select Gender">
                                  <option value="">--</option>
                                  <option value="male">Male</option>
                                  <option value="female">Female</option>
                                  <option value="other">Other Gender</option>
                                </select>
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" for="basic-default-fullname">Ethnicity</label>
                                <input type="text" name="ethnicity" class="form-control" id="basic-default-fullname" />
                            </div>
                          </div>
                          <div class="mb-3 row">
                            <div class="col-md-4">
                                <label class="form-label" for="first_language">First Language</label>
                                <input type="text" name="first_language" class="form-control" id="first_language" />
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" for="second_language">Second Language</label>
                                <input type="text" name="second_language" class="form-control" id="second_language" />
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" for="religion">Religion</label>
                                <input type="text" name="religion" class="form-control" id="religion" />
                            </div>
                          </div>
                          <div class="mb-3 row">
                            <div class="col-md-4">
                                <label class="form-label" for="phone_number">Mobile Number</label>
                                <input type="text" name="phone_number" class="form-control" id="phone_number" />
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" for="email">Email Address</label>
                                <input type="email" name="email" class="form-control" id="email" />
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" for="marital_status">Marital Status</label>
                                <select class="form-select" name="marital_status" id="marital_status" aria-label="Select Marital Status">
                                    <option value="">--</option>
                                    <option value="Single">Single</option>
                                    <option value="Married">Married</option>
                                    <option value="Divorced">Divorced</option>
                                    <option value="Widowed">Widowed</option>
                                  </select>
                            </div>
                          </div>
                          <div class="mb-3 row">
                            <div class="col-md-4">
                                <label class="form-label" for="ni_details">NI Details</label>
                                <input type="text" name="ni_details" class="form-control" id="ni_details" />
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" for="nhs_no">NHS Number</label>
                                <input type="text" name="nhs_no" class="form-control" id="nhs_no" />
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" for="passport_no">Passport Number</label>
                                <input type="text" name="passport_no" class="form-control" id="passport_no" />
                            </div>
                          </div>
                          <div class="mb-3 row">
                            <div class="col-md-6">
                                <label class="form-label" for="permanent_address">Permanent address</label>
                                <input type="text" name="permanent_address" class="form-control" id="permanent_address" />
                            </div>
                            <div class="col-md-6">
                                <label class="form-label" for="current_address">Current address (if different from permanent address)</label>
                                <input type="text" name="current_address" class="form-control" id="current_address" />
                            </div>
                          </div>
                          <div class="mb-3 row">
                            <div class="col-md-4">
                                <label class="form-label" for="birth_certificate_no">Birth certificate Number</label>
                                <input type="text" name="birth_certificate_no" class="form-control" id="birth_certificate_no" />
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" for="asylum_arc_card">Asylum ARC Card</label>
                                <input type="text" name="asylum_arc_card" class="form-control" id="asylum_arc_card" />
                            </div>
                            <div class="col-md-4">
                                <label class="form-label" for="biometric_card">Biometric Card</label>
                                <input type="text" name="biometric_card" class="form-control" id="biometric_card" />
                            </div>
                          </div>
                          <div class="mb-3 row">
                            <div class="col-md-6">
                                <label class="form-label" for="driving_license">Driving Licence</label>
                                <input type="text" name="driving_license" class="form-control" id="driving_license" />
                            </div>
                            <div class="col-md-6">
                                <label class="form-label" for="doa">Date of application</label>
                                <input type="text" name="doa" class="form-control" id="doa" />
                            </div>
                          </div>
                          <button type="submit" class="btn btn-primary">Proceed</button>
                        </form>
                      </div>
                    </div>
                  </div>
                  
                </div>
              </div>
            
            <!-- / Content -->

            <!-- Footer -->
            @include('includes.footer')
            <!-- / Footer -->

            <div class="content-backdrop fade"></div>
        </div>
        <!-- Content wrapper -->
      </div>
      <!-- / Layout page -->
    </div>

    <!-- Overlay -->
    <div class="layout-overlay layout-menu-toggle"></div>
</div>
@endsection