    <style>
.checked {
    color: orange;
}
    </style>
    <div class="content-header">
        <div class="container-fluid">
            <div class="row mb-2">
                <div class="col-sm-6">
                    <h1 class="m-0 text-dark">User Profile</h1>
                </div>

            </div>
        </div>
    </div>
    <section class="content">
        <div class="container-fluid">
            <div class="card mx-auto">
                <div class="card-header">
                    <strong>General Info</strong>
                </div>
                <div class="card-body p-0">
                    <table class="table table-bordered mb-0">
                        <tbody>
                            <tr>
                                <td colspan="4" style="text-align: center;">
                                    <img class="img-fluid" width="350" height="350" src="https://static.vecteezy.com/system/resources/thumbnails/000/439/863/small_2x/Basic_Ui__28186_29.jpg">
                                </td>

                            </tr>
                            <tr>
                                <th>Name</th>
                                <td>John Doe</td>
                                <th>Email</th>
                                <td>john@gmail.com</td>
                            </tr>
                            <tr>
                                <th>Phone Number</th>
                                <td>+10123555666</td>
                                <th>Age</th>
                                <td>24 Years</td>
                            </tr>
                            <tr>
                                <th>WhatsApp</th>
                                <td>+10123555666</td>
                                <th>Street Address</th>
                                <td>Street 47</td>
                            </tr>
                            <tr>
                                <th>City</th>
                                <td>New York City</td>
                                <th>Zipcode</th>
                                <td>66601</td>
                            </tr>
                            <tr>
                                <th>State</th>
                                <td>New York</td>
                                <th>Country</th>
                                <td>USA</td>
                            </tr>


                        </tbody>
                    </table>
                </div>
            </div>

        </div>
    </section>
    <section class="content mt-5">
        <div class="container-fluid">
            <div class="card mx-auto">
                <div class="card-header">
                    <strong>Recent Orders</strong>
                </div>
                <div class="card-body p-0">
                    <table class="table table-stripped mb-0">
                        <thead class="thead-dark">
                            <tr>
                                <th>User Name</th>
                                <th>Restaurant</th>
                                <th>Products</th>
                                <th>Total Price</th>
                                <th>Platform Commision</th>
                                <th>Status</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>
                                    John Doe
                                </td>
                                <td>
                                    Mama's Kitchen
                                </td>
                                <td>
                                    Product 1<br>
                                    Product 2<br>
                                    Product 3<br>
                                </td>
                                <td>$145</td>
                                <td>$25</td>
                                <td>Delivered</td>
                                <!-- <td>
                                    <button class="btn btn-danger btn-block mt-2">Delete</button>
                                </td> -->
                            </tr>
                            <tr>
                                <td>
                                    John Doe
                                </td>
                                <td>
                                    Mama's Kitchen
                                </td>
                                <td>
                                    Product 1<br>
                                    Product 2<br>
                                    Product 3<br>
                                </td>
                                <td>$200</td>
                                <td>$40</td>
                                <td>Processing</td>
                                <!-- <td>
                                    <button class="btn btn-danger btn-block mt-2">Delete</button>
                                </td> -->
                            </tr>

                        </tbody>
                    </table>
                </div>
            </div>

        </div>
    </section>
    <section class="content mt-5">
        <div class="container-fluid">
            <div class="card mx-auto">
                <div class="card-header">
                    <strong>Recent Rides</strong>
                </div>
                <div class="card-body p-0">
                    <table class="table table-stripped mb-0">
                        <thead class="thead-dark">
                            <tr>
                                <th>Driver Name</th>
                                <th>Pick Location</th>
                                <th>Drop Location</th>
                                <th>Rent</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td>Mr. Jacob</td>
                                <td>G11 Markaz</td>
                                <td>F10 Markz</td>
                                <td>$45</td>

                            </tr>

                        </tbody>
                    </table>
                </div>
            </div>

        </div>
    </section>
    <!-- <section class="content mt-5">
        <div class="container-fluid">
            <div class="card mx-auto">
                <div class="card-header">
                    <strong>Location Map</strong>
                </div>
                <div class="card-body p-0">
                    <table class="table table-bordered mb-0">
                        <tbody>
                            <tr>
                                <th>
                                    <img class="img-fluid" src="https://elfsight.com/wp-content/uploads/2020/03/google-maps-examples1.jpg">
                                </th>

                            </tr>


                        </tbody>
                    </table>
                </div>
            </div>

        </div>
    </section>
    <section class="content mt-5">
        <div class="container-fluid">
            <div class="card mx-auto">
                <div class="card-header">
                    <strong>Owner Information</strong>
                </div>
                <div class="card-body p-0">
                    <table class="table table-bordered mb-0">
                        <tbody>
                            <tr>
                                <td colspan="2">
                                    <img class="img-fluid rounded-circle" src="https://campaignagent.com.au/UAT/wp-content/uploads/2021/12/Ca-Agent.jpg" width="100" height="100">

                                </td>
                                <th>Name</th>
                                <td>Dwayn Johnson</td>
                            </tr>
                            <tr>
                                <th>Email</th>
                                <td>agent@sample.com</td>
                                <th>Phone</th>
                                <td>+1234567890</td>
                            </tr>
                            <tr>
                                <th><button class="btn btn-success">Send Message</button></th>
                                <td></td>
                                <th></th>
                                <td></td>
                            </tr>

                        </tbody>
                    </table>
                </div>
            </div>

        </div>
    </section> -->