@extends('master')

@section('content')

@php
$customer = Session::get('customer');
$categoryType = $customer['catagory_type'] ?? 0;
@endphp

<!-- =========================
     PAGE HEADER
========================= -->

<section class="bg-light border-bottom py-4">
    <div class="container">


    <div class="d-flex flex-column flex-md-row
                justify-content-between
                align-items-md-center
                gap-2">

        <div>
            <h1 class="h3 mb-1">My Account</h1>

            <p class="text-muted mb-0">
                Manage your account, orders and profile.
            </p>
        </div>

        <div class="small">

            <a href="{{ url('/') }}"
               class="text-decoration-none">
                Home
            </a>

            <span class="text-muted mx-2">/</span>

            <span class="text-muted">
                My Account
            </span>

        </div>

    </div>

</div>


</section>

<!-- =========================
     ACCOUNT
========================= -->

<main class="py-5">


<div class="container">

    <div class="row g-4">


        <!-- =========================
             SIDEBAR
        ========================= -->
        <div class="col-12 col-lg-3">

            <div class="card border-0 shadow-sm">

                <!-- Profile -->
                <div class="card-body border-bottom">

                    <div class="text-center">

                        <div class="rounded-circle
                                    bg-primary
                                    text-white
                                    d-flex
                                    align-items-center
                                    justify-content-center
                                    mx-auto
                                    mb-3"
                             style="width:70px;height:70px;">

                            <span class="fs-3 fw-bold">
                                {{ strtoupper(substr($customer['name'] ?? 'U', 0, 1)) }}
                            </span>

                        </div>

                        <h5 class="mb-1">
                            {{ $customer['name'] ?? '-' }}
                        </h5>

                        <p class="text-muted mb-0">
                            {{ $customer['mobile'] ?? '-' }}
                        </p>

                    </div>

                </div>


                <!-- Navigation -->
                <div class="list-group list-group-flush">


                    @if($categoryType == 0)

                        <a href="#orders"
                           class="list-group-item
                                  list-group-item-action
                                  active"
                           data-bs-toggle="tab"
                           data-bs-target="#orders">

                            <i class="bi bi-box-seam me-2"></i>
                            My Orders

                        </a>

                    @elseif($categoryType == 1)

                        <a href="#ordersToAccept"
                           class="list-group-item
                                  list-group-item-action
                                  active"
                           data-bs-toggle="tab"
                           data-bs-target="#ordersToAccept">

                            <i class="bi bi-cart-check me-2"></i>
                            Order To Accept

                        </a>


                        <a href="#ordersToDeliver"
                           class="list-group-item
                                  list-group-item-action"
                           data-bs-toggle="tab"
                           data-bs-target="#ordersToDeliver">

                            <i class="bi bi-truck me-2"></i>
                            Order To Deliver

                        </a>

                    @endif


                    <a href="#profile"
                       class="list-group-item
                              list-group-item-action"
                       data-bs-toggle="tab"
                       data-bs-target="#profile">

                        <i class="bi bi-person me-2"></i>
                        Profile

                    </a>


                    <a href="{{ url('/user-logout') }}"
                       class="list-group-item
                              list-group-item-action
                              text-danger">

                        <i class="bi bi-box-arrow-right me-2"></i>
                        Log Out

                    </a>

                </div>

            </div>

        </div>


        <!-- =========================
             CONTENT
        ========================= -->
        <div class="col-12 col-lg-9">

            <div class="tab-content">


                <!-- ==================================================
                     CUSTOMER ORDERS
                =================================================== -->
                @if($categoryType == 0)

                    <div class="tab-pane fade show active"
                         id="orders">

                        <div class="card border-0 shadow-sm">

                            <div class="card-body">

                                <div class="d-flex
                                            flex-column
                                            flex-md-row
                                            justify-content-between
                                            align-items-md-center
                                            gap-2
                                            mb-4">

                                    <div>

                                        <h2 class="h4 mb-1">
                                            My Orders
                                        </h2>

                                        <p class="text-muted mb-0">
                                            View your order history.
                                        </p>

                                    </div>

                                </div>


                                <!-- Table -->
                                <div class="table-responsive">

                                    <table class="table
                                                  table-hover
                                                  align-middle
                                                  mb-0">

                                        <thead class="table-light">

                                            <tr>

                                                <th>
                                                    SL. No
                                                </th>

                                                <th>
                                                    Voucher No
                                                </th>

                                                <th>
                                                    Unit
                                                </th>

                                                <th>
                                                    Price
                                                </th>

                                                <th>
                                                    Status
                                                </th>

                                                <th>
                                                    View
                                                </th>

                                            </tr>

                                        </thead>


                                        <tbody>

                                            @if(empty($userProducts))

                                                <tr>

                                                    <td colspan="6"
                                                        class="text-center
                                                               text-muted
                                                               py-4">

                                                        No Data Available!

                                                    </td>

                                                </tr>

                                            @else

                                                @foreach($userProducts as $userProduct)

                                                    <tr>

                                                        <td>
                                                            {{ $userProduct['Serial'] }}
                                                        </td>

                                                        <td>
                                                            <span class="fw-semibold">
                                                                {{ $userProduct['Voucher'] }}
                                                            </span>
                                                        </td>

                                                        <td>
                                                            {{ $userProduct['Unit'] }}
                                                        </td>

                                                        <td>
                                                            <span class="fw-semibold">
                                                                {{ $userProduct['Amount'] }}
                                                            </span>
                                                        </td>

                                                        <td>

                                                            @if($userProduct['Staus'] == 0)

                                                                <span class="badge
                                                                             bg-warning
                                                                             text-dark">

                                                                    Pending

                                                                </span>

                                                            @else

                                                                <span class="badge bg-success">

                                                                    Shipped

                                                                </span>

                                                            @endif

                                                        </td>

                                                        <td>

                                                            <button type="button"
                                                                    class="btn btn-sm
                                                                           btn-outline-primary"
                                                                    onclick="sendAjaxRequest('{{ $userProduct['Voucher'] }}')">

                                                                <i class="bi bi-eye me-1"></i>
                                                                View

                                                            </button>

                                                        </td>

                                                    </tr>

                                                @endforeach

                                            @endif

                                        </tbody>

                                    </table>

                                </div>

                            </div>

                        </div>

                    </div>


                    <!-- =========================
                         ORDER DETAILS MODAL
                    ========================= -->
                    <div class="modal fade"
                         id="productDetailModal"
                         tabindex="-1"
                         aria-labelledby="productDetails"
                         aria-hidden="true">

                        <div class="modal-dialog modal-dialog-centered">

                            <div class="modal-content">

                                <div class="modal-header">

                                    <h5 class="modal-title"
                                        id="productDetails">

                                        Voucher Details

                                    </h5>

                                    <button type="button"
                                            class="btn-close"
                                            data-bs-dismiss="modal">
                                    </button>

                                </div>


                                <div class="modal-body">

                                    <div class="row g-3">

                                        <div class="col-5">
                                            <strong>
                                                Product Name
                                            </strong>
                                        </div>

                                        <div class="col-7">
                                            <span id="productName">
                                            </span>
                                        </div>


                                        <div class="col-5">
                                            <strong>
                                                Product Quantity
                                            </strong>
                                        </div>

                                        <div class="col-7">
                                            <span id="productQty">
                                            </span>
                                        </div>


                                        <div class="col-5">
                                            <strong>
                                                Product Amount
                                            </strong>
                                        </div>

                                        <div class="col-7">
                                            <span id="productAmount">
                                            </span>
                                        </div>

                                    </div>

                                </div>


                                <div class="modal-footer">

                                    <div class="alert alert-warning
                                                w-100
                                                text-center
                                                mb-0">

                                        You have to take product
                                        within 90 days.

                                    </div>

                                </div>

                            </div>

                        </div>

                    </div>


                <!-- ==================================================
                     AGENT ORDERS
                =================================================== -->
                @elseif($categoryType == 1)


                    <!-- =========================
                         ORDERS TO ACCEPT
                    ========================= -->
                    <div class="tab-pane fade show active"
                         id="ordersToAccept">

                        <div class="card border-0 shadow-sm">

                            <div class="card-body">

                                <div class="d-flex
                                            flex-column
                                            flex-lg-row
                                            justify-content-between
                                            align-items-lg-center
                                            gap-3
                                            mb-4">

                                    <div>

                                        <h2 class="h4 mb-1">
                                            My Orders To Accept
                                        </h2>

                                        <p class="text-muted mb-0">
                                            Orders waiting for your acceptance.
                                        </p>

                                    </div>


                                    <div class="d-flex gap-2">

                                        <input type="text"
                                               id="ordersToAcceptSearchInput"
                                               class="form-control"
                                               placeholder="Search"
                                               style="max-width:180px;">

                                        <button type="button"
                                                id="ordersToAcceptSearchBtn"
                                                class="btn btn-primary">

                                            <i class="bi bi-search me-1"></i>
                                            Search

                                        </button>

                                    </div>

                                </div>


                                <div class="table-responsive">

                                    <table class="table
                                                  table-hover
                                                  align-middle
                                                  mb-0">

                                        <thead class="table-light">

                                            <tr>

                                                <th>
                                                    SL. No
                                                </th>

                                                <th>
                                                    Name
                                                </th>

                                                <th>
                                                    Voucher No
                                                </th>

                                                <th>
                                                    Point
                                                </th>

                                                <th>
                                                    Amount
                                                </th>

                                                <th>
                                                    Adjust Point
                                                </th>

                                                <th>
                                                    Action
                                                </th>

                                            </tr>

                                        </thead>


                                        <tbody id="ordersToAcceptData">

                                            @if(empty($ordersToAccept))

                                                <tr>

                                                    <td colspan="7"
                                                        class="text-center
                                                               text-muted
                                                               py-4">

                                                        No Data Available!

                                                    </td>

                                                </tr>

                                            @else

                                                @foreach($ordersToAccept as $key => $order)

                                                    <tr>

                                                        <td>
                                                            {{ $key + 1 }}
                                                        </td>

                                                        <td>
                                                            {{ $order['Name'] }}
                                                        </td>

                                                        <td>
                                                            <span class="fw-semibold">
                                                                {{ $order['Voucher'] }}
                                                            </span>
                                                        </td>

                                                        <td>
                                                            {{ $order['Point'] }}
                                                        </td>

                                                        <td>
                                                            {{ $order['Amount'] }}
                                                        </td>

                                                        <td>
                                                            {{ $order['adjustPoint'] }}
                                                        </td>

                                                        <td>

                                                            <div class="d-flex
                                                                        flex-wrap
                                                                        gap-1">

                                                                <a href="{{ url('voucher-details/' . $order['Voucher']) }}"
                                                                   class="btn btn-sm
                                                                          btn-outline-primary">

                                                                    Details

                                                                </a>


                                                                <a href="{{ url('order-action/' . $order['Voucher'] . '/accept') }}"
                                                                   class="btn btn-sm
                                                                          btn-success">

                                                                    Accept

                                                                </a>


                                                                <a href="{{ url('order-action/' . $order['Voucher'] . '/decline') }}"
                                                                   class="btn btn-sm
                                                                          btn-danger">

                                                                    Decline

                                                                </a>

                                                            </div>

                                                        </td>

                                                    </tr>

                                                @endforeach

                                            @endif

                                        </tbody>

                                    </table>

                                </div>

                            </div>

                        </div>

                    </div>


                    <!-- =========================
                         ORDERS TO DELIVER
                    ========================= -->
                    <div class="tab-pane fade"
                         id="ordersToDeliver">

                        <div class="card border-0 shadow-sm">

                            <div class="card-body">

                                <div class="d-flex
                                            flex-column
                                            flex-lg-row
                                            justify-content-between
                                            align-items-lg-center
                                            gap-3
                                            mb-4">

                                    <div>

                                        <h2 class="h4 mb-1">
                                            My Orders To Deliver
                                        </h2>

                                        <p class="text-muted mb-0">
                                            Orders waiting for delivery.
                                        </p>

                                    </div>


                                    <div class="d-flex gap-2">

                                        <input type="text"
                                               id="ordersToDeliverSearchInput"
                                               class="form-control"
                                               placeholder="Search"
                                               style="max-width:180px;">

                                        <button type="button"
                                                id="ordersToDeliverSearchBtn"
                                                class="btn btn-primary">

                                            <i class="bi bi-search me-1"></i>
                                            Search

                                        </button>

                                    </div>

                                </div>


                                <div class="table-responsive">

                                    <table class="table
                                                  table-hover
                                                  align-middle
                                                  mb-0">

                                        <thead class="table-light">

                                            <tr>

                                                <th>
                                                    SL. No
                                                </th>

                                                <th>
                                                    Name
                                                </th>

                                                <th>
                                                    Voucher No
                                                </th>

                                                <th>
                                                    Point
                                                </th>

                                                <th>
                                                    Amount
                                                </th>

                                                <th>
                                                    Action
                                                </th>

                                            </tr>

                                        </thead>


                                        <tbody id="ordersToDeliverData">

                                            @if(empty($ordersToDeliver))

                                                <tr>

                                                    <td colspan="6"
                                                        class="text-center
                                                               text-muted
                                                               py-4">

                                                        No Data Available!

                                                    </td>

                                                </tr>

                                            @else

                                                @foreach($ordersToDeliver as $key => $order)

                                                    <tr>

                                                        <td>
                                                            {{ $key + 1 }}
                                                        </td>

                                                        <td>
                                                            {{ $order['Name'] }}
                                                        </td>

                                                        <td>
                                                            <span class="fw-semibold">
                                                                {{ $order['Voucher'] }}
                                                            </span>
                                                        </td>

                                                        <td>
                                                            {{ $order['Point'] }}
                                                        </td>

                                                        <td>
                                                            {{ $order['Amount'] }}
                                                        </td>

                                                        <td>

                                                            <div class="d-flex
                                                                        flex-wrap
                                                                        gap-1">

                                                                <a href="{{ url('voucher-details/' . $order['Voucher']) }}"
                                                                   class="btn btn-sm
                                                                          btn-outline-primary">

                                                                    Details

                                                                </a>


                                                                <a href="{{ url('order-action/' . $order['Voucher'] . '/deliver') }}"
                                                                   class="btn btn-sm
                                                                          btn-success">

                                                                    Deliver

                                                                </a>

                                                            </div>

                                                        </td>

                                                    </tr>

                                                @endforeach

                                            @endif

                                        </tbody>

                                    </table>

                                </div>

                            </div>

                        </div>

                    </div>

                @endif


                <!-- ==================================================
                     PROFILE
                =================================================== -->
                <div class="tab-pane fade"
                     id="profile">

                    <div class="card border-0 shadow-sm">

                        <div class="card-body">

                            <div class="d-flex
                                        flex-column
                                        flex-md-row
                                        justify-content-between
                                        align-items-md-center
                                        gap-2
                                        mb-4">

                                <div>

                                    <h2 class="h4 mb-1">
                                        Profile
                                    </h2>

                                    <p class="text-muted mb-0">
                                        Your personal information.
                                    </p>

                                </div>


                                <button type="button"
                                        class="btn btn-primary"
                                        data-bs-toggle="modal"
                                        data-bs-target="#editProfileModal">

                                    <i class="bi bi-pencil me-1"></i>
                                    Edit Profile

                                </button>

                            </div>


                            <!-- Profile Information -->
                            <div class="row g-3">


                                <div class="col-12 col-md-6">

                                    <div class="border rounded p-3 h-100">

                                        <small class="text-muted d-block">
                                            Name
                                        </small>

                                        <strong>
                                            {{ $customer['name'] ?? '-' }}
                                        </strong>

                                    </div>

                                </div>


                                <div class="col-12 col-md-6">

                                    <div class="border rounded p-3 h-100">

                                        <small class="text-muted d-block">
                                            Mobile
                                        </small>

                                        <strong>
                                            {{ $customer['mobile'] ?? '-' }}
                                        </strong>

                                    </div>

                                </div>


                                <div class="col-12">

                                    <div class="border rounded p-3">

                                        <small class="text-muted d-block">
                                            Address
                                        </small>

                                        <strong>
                                            {{ $customer['address'] ?? '-' }}
                                        </strong>

                                    </div>

                                </div>


                                <div class="col-12 col-md-6">

                                    <div class="border rounded p-3 h-100">

                                        <small class="text-muted d-block">
                                            Profession
                                        </small>

                                        <strong>
                                            {{ $customer['profession'] ?? '-' }}
                                        </strong>

                                    </div>

                                </div>


                                <div class="col-12 col-md-6">

                                    <div class="border rounded p-3 h-100">

                                        <small class="text-muted d-block">
                                            NID
                                        </small>

                                        <strong>
                                            {{ $customer['nid'] ?? '-' }}
                                        </strong>

                                    </div>

                                </div>


                                <div class="col-12 col-md-6">

                                    <div class="border rounded p-3 h-100">

                                        <small class="text-muted d-block">
                                            Father Name
                                        </small>

                                        <strong>
                                            {{ $customer['father_name'] ?? '-' }}
                                        </strong>

                                    </div>

                                </div>


                                <div class="col-12 col-md-6">

                                    <div class="border rounded p-3 h-100">

                                        <small class="text-muted d-block">
                                            Mother Name
                                        </small>

                                        <strong>
                                            {{ $customer['mother_name'] ?? '-' }}
                                        </strong>

                                    </div>

                                </div>


                                <div class="col-12 col-md-6">

                                    <div class="border rounded p-3 h-100">

                                        <small class="text-muted d-block">
                                            Facebook ID
                                        </small>

                                        <strong>
                                            {{ $customer['facebook'] ?? '-' }}
                                        </strong>

                                    </div>

                                </div>


                                <div class="col-12 col-md-6">

                                    <div class="border rounded p-3 h-100">

                                        <small class="text-muted d-block">
                                            Blood Group
                                        </small>

                                        <strong>
                                            {{ $customer['blood'] ?? '-' }}
                                        </strong>

                                    </div>

                                </div>


                                <div class="col-12">

                                    <div class="border rounded p-3">

                                        <small class="text-muted d-block">
                                            Nominee Name
                                        </small>

                                        <strong>
                                            {{ $customer['nominee'] ?? '-' }}
                                        </strong>

                                    </div>

                                </div>

                            </div>


                            <!-- =========================
                                 LOGIN DETAILS
                            ========================= -->
                            <hr class="my-5">


                            <div class="d-flex
                                        flex-column
                                        flex-md-row
                                        justify-content-between
                                        align-items-md-center
                                        gap-2
                                        mb-4">

                                <div>

                                    <h3 class="h5 mb-1">
                                        Login Details
                                    </h3>

                                    <p class="text-muted mb-0">
                                        Manage your login password.
                                    </p>

                                </div>


                                <button type="button"
                                        class="btn btn-outline-primary"
                                        data-bs-toggle="modal"
                                        data-bs-target="#editLoginModal">

                                    <i class="bi bi-pencil me-1"></i>
                                    Change Password

                                </button>

                            </div>


                            <div class="border rounded p-3">

                                <small class="text-muted d-block">
                                    User Name
                                </small>

                                <strong>
                                    {{ Session::get('user_name') }}
                                </strong>

                            </div>

                        </div>

                    </div>


                    <!-- ==================================================
                         EDIT PROFILE MODAL
                    =================================================== -->
                    <div class="modal fade"
                         id="editProfileModal"
                         tabindex="-1"
                         aria-labelledby="editProfileModalLabel"
                         aria-hidden="true">

                        <div class="modal-dialog modal-lg modal-dialog-centered">

                            <div class="modal-content">

                                <div class="modal-header">

                                    <h5 class="modal-title"
                                        id="editProfileModalLabel">

                                        Edit Profile Details

                                    </h5>

                                    <button type="button"
                                            class="btn-close"
                                            data-bs-dismiss="modal">
                                    </button>

                                </div>


                                <form method="POST"
                                      action="{{ url('update-user') }}">

                                    @csrf

                                    <div class="modal-body">

                                        <input type="hidden"
                                               name="user_id"
                                               value="{{ $customer['id'] }}">


                                        <input type="hidden"
                                               name="birth"
                                               value="0">


                                        <div class="row g-3">


                                            <div class="col-12 col-md-6">

                                                <label class="form-label">
                                                    Name
                                                </label>

                                                <input type="text"
                                                       name="name"
                                                       class="form-control"
                                                       value="{{ $customer['name'] ?? '' }}"
                                                       placeholder="Enter your name">

                                            </div>


                                            <div class="col-12 col-md-6">

                                                <label class="form-label">
                                                    Mobile
                                                </label>

                                                <input type="text"
                                                       name="mobile"
                                                       class="form-control"
                                                       value="{{ $customer['mobile'] ?? '' }}"
                                                       placeholder="Enter your mobile">

                                            </div>


                                            <div class="col-12">

                                                <label class="form-label">
                                                    Address
                                                </label>

                                                <input type="text"
                                                       name="address"
                                                       class="form-control"
                                                       value="{{ $customer['address'] ?? '' }}"
                                                       placeholder="Street address">

                                            </div>


                                            <div class="col-12 col-md-6">

                                                <label class="form-label">
                                                    Profession
                                                </label>

                                                <input type="text"
                                                       name="profession"
                                                       class="form-control"
                                                       value="{{ $customer['profession'] ?? '0' }}"
                                                       placeholder="Enter profession">

                                            </div>


                                            <div class="col-12 col-md-6">

                                                <label class="form-label">
                                                    NID
                                                </label>

                                                <input type="text"
                                                       name="nid"
                                                       class="form-control"
                                                       value="{{ $customer['nid'] ?? '0' }}"
                                                       placeholder="Enter NID number">

                                            </div>


                                            <div class="col-12 col-md-6">

                                                <label class="form-label">
                                                    Father Name
                                                </label>

                                                <input type="text"
                                                       name="f_name"
                                                       class="form-control"
                                                       value="{{ $customer['father_name'] ?? '0' }}"
                                                       placeholder="Enter father name">

                                            </div>


                                            <div class="col-12 col-md-6">

                                                <label class="form-label">
                                                    Mother Name
                                                </label>

                                                <input type="text"
                                                       name="m_name"
                                                       class="form-control"
                                                       value="{{ $customer['mother_name'] ?? '0' }}"
                                                       placeholder="Enter mother name">

                                            </div>


                                            <div class="col-12 col-md-6">

                                                <label class="form-label">
                                                    Facebook ID
                                                </label>

                                                <input type="text"
                                                       name="fb"
                                                       class="form-control"
                                                       value="{{ $customer['facebook'] ?? '0' }}"
                                                       placeholder="Enter Facebook ID">

                                            </div>


                                            <div class="col-12 col-md-6">

                                                <label class="form-label">
                                                    Blood Group
                                                </label>

                                                <input type="text"
                                                       name="blood"
                                                       class="form-control"
                                                       value="{{ $customer['blood'] ?? '0' }}"
                                                       placeholder="Enter blood group">

                                            </div>


                                            <div class="col-12">

                                                <label class="form-label">
                                                    Nominee Name
                                                </label>

                                                <input type="text"
                                                       name="n_name"
                                                       class="form-control"
                                                       value="{{ $customer['nominee'] ?? '0' }}"
                                                       placeholder="Enter nominee name">

                                            </div>

                                        </div>

                                    </div>


                                    <div class="modal-footer">

                                        <button type="button"
                                                class="btn btn-secondary"
                                                data-bs-dismiss="modal">

                                            Cancel

                                        </button>

                                        <button type="submit"
                                                class="btn btn-primary">

                                            <i class="bi bi-check-lg me-1"></i>
                                            Save Profile

                                        </button>

                                    </div>

                                </form>

                            </div>

                        </div>

                    </div>


                    <!-- ==================================================
                         CHANGE PASSWORD MODAL
                    =================================================== -->
                    <div class="modal fade"
                         id="editLoginModal"
                         tabindex="-1"
                         aria-labelledby="editLoginModalLabel"
                         aria-hidden="true">

                        <div class="modal-dialog modal-dialog-centered">

                            <div class="modal-content">

                                <div class="modal-header">

                                    <h5 class="modal-title"
                                        id="editLoginModalLabel">

                                        Change Password

                                    </h5>

                                    <button type="button"
                                            class="btn-close"
                                            data-bs-dismiss="modal">
                                    </button>

                                </div>


                                <form method="POST"
                                      action="{{ url('update-password') }}">

                                    @csrf

                                    <div class="modal-body">

                                        <div class="mb-3">

                                            <label class="form-label">
                                                User Name
                                            </label>

                                            <input type="text"
                                                   class="form-control"
                                                   value="{{ Session::get('user_name') }}"
                                                   disabled>

                                        </div>


                                        <input type="hidden"
                                               name="category"
                                               value="">


                                        <div class="mb-3">

                                            <label class="form-label">
                                                Current Password
                                            </label>

                                            <input type="password"
                                                   name="old_password"
                                                   class="form-control"
                                                   placeholder="Current Password">

                                        </div>


                                        <div class="mb-3">

                                            <label class="form-label">
                                                New Password
                                            </label>

                                            <input type="password"
                                                   name="new_password"
                                                   class="form-control"
                                                   placeholder="New Password">

                                        </div>


                                        <div class="mb-3">

                                            <label class="form-label">
                                                Confirm Password
                                            </label>

                                            <input type="password"
                                                   name="again_password"
                                                   class="form-control"
                                                   placeholder="Confirm Password">

                                            <small class="text-muted">
                                                To confirm, type the new password again.
                                            </small>

                                        </div>

                                    </div>


                                    <div class="modal-footer">

                                        <button type="button"
                                                class="btn btn-secondary"
                                                data-bs-dismiss="modal">

                                            Cancel

                                        </button>

                                        <button type="submit"
                                                class="btn btn-primary">

                                            <i class="bi bi-check-lg me-1"></i>
                                            Save Changes

                                        </button>

                                    </div>

                                </form>

                            </div>

                        </div>

                    </div>

                </div>

            </div>

        </div>

    </div>

</div>


</main>

<script src="{{ asset('front/js/account.js') }}"></script>

@endsection