@extends('layouts.dashboard-template')
 @section('page-content')
 <div class="main-content">

     <div class="page-content">
         <div class="container-fluid">

             <!-- start page title -->
             <div class="row">
                 <div class="col-12">
                     <div class="page-title-box d-sm-flex align-items-center justify-content-between">
                         <h4 class="mb-sm-0">Reset Password</h4>

                         <div class="page-title-right">
                             <ol class="breadcrumb m-0">
                                 <li class="breadcrumb-item"><a href="javascript: void(0);">Reset Password</a></li>
                             </ol>
                         </div>

                     </div>
                 </div>
             </div>
             <!-- end page title -->

             <div class="row">


                 <div class="col-xxl-3">
                     <div class="card">
                         @if(\Session::get('success'))
                         <div class="alert alert-success alert-dismissible fade show" role="alert">
                             <div class="alert-body">
                                 {{ \Session::get('success') }}
                             </div>
                             <button type="button" class="btn-close" data-dismiss="alert" aria-label="Close"></button>
                         </div>
                         @endif
                         {{ \Session::forget('success') }}
                         @if(\Session::get('error'))
                         <div class="alert alert-danger alert-dismissible fade show" role="alert">
                             <div class="alert-body">
                                 {{ \Session::get('error') }}
                             </div>
                             <button type="button" class="btn-close" data-dismiss="alert" aria-label="Close"></button>
                         </div>
                         @endif
                         <div class="mt-4 mb-3 border-bottom pb-2">
                             <div class="text-center">
                                 <h2>Reset Password</h2>
                             </div>
                         </div>
                         <div class="card-body p-4">
                             <form method="post" action="{{ route('admin.update-password') }}">
                                 {{ csrf_field() }}
                                 <div class="row g-2">

                                     <div class="col-md-8 offset-md-2">
                                         <div>
                                             <label for="newpasswordInput" class="form-label">New
                                                 Password*</label>
                                             <div class="position-relative auth-pass-inputgroup mb-3">
                                                 <input type="password" class="form-control pe-5" placeholder="Enter password" id="password-input" name="password">
                                                 <button id="pswd" class="btn btn-link position-absolute end-0 top-0 text-decoration-none text-muted" type="button" onclick="myFunction()" id="password-addon"><i class="ri-eye-fill align-middle"></i></button>
                                             </div>
                                             <!-- <input type="password" class="form-control" name="password" required placeholder="Enter new password" minlength="6"> -->

                                         </div>
                                     </div>

                                     <div class="col-md-8 offset-md-2">
                                         <div>
                                             <label for="confirmpasswordInput" class="form-label">Confirm
                                                 Password*</label>
                                             <div class="position-relative auth-pass-inputgroup mb-3">
                                                 <input type="password" class="form-control pe-5" placeholder="Enter password" id="confirm-password-input" name="confirm_password">
                                                 <button id="confirmpswd" class="btn btn-link position-absolute end-0 top-0 text-decoration-none text-muted" type="button" onclick="myFunction()" id="password-addon"><i class="ri-eye-fill align-middle"></i></button>
                                             </div>
                                         </div>
                                     </div>

                                     <div class="col-lg-12">
                                         <div class="text-center">
                                             <button type="submit" class="btn btn-success">Change
                                                 Password</button>
                                         </div>
                                     </div>

                                 </div>

                             </form>
                         </div>

                     </div>
                     <!--end card-->
                 </div>
                 <!--end col-->

             </div>
             <!--end row-->
         </div>
         <!-- container-fluid -->
     </div>
     <!-- End Page-content -->
     <script>
         $('#pswd').click(function(e) {
             var x = document.getElementById("password-input");
             if (x.type === "password") {
                 x.type = "text";
             } else {
                 x.type = "password";
             }
         });

         $('#confirmpswd').click(function(e) {
             var x = document.getElementById("confirm-password-input");
             if (x.type === "password") {
                 x.type = "text";
             } else {
                 x.type = "password";
             }
         });
     </script>
     @endsection