       <div class="header-section">
                <div class="container">
                    <!-- Start User Event Area -->
                    <div class="header-area">
                        <div class="header-top-area header-top-area--style-1">
                            <ul class="event-list">
                               
                                <li class="list-item">
                                    <h2 class="title text-center">Twins Apple</h2>
                                </li>
                                <li class="list-item">
                                    <ul class="list-child">
                                        <li class="list-item">
                                            <span class="notch-bg notch-bg--sunset-orange"></span>
                                            <a href="cart.php" aria-label="Cart" class="btn btn--size-33-33 btn--center btn--round btn--color-radical-red btn--bg-white btn--box-shadow">
    <i class="icon icon-carce-cart"></i>
    <span class="cart-count" id="cart-count">0</span>
</a>

<style>
    .cart-count {
        background-color: red;
        color: white;
        border-radius: 50%;
        padding: 2px 6px;
        font-size: 14px;
        position: absolute;
        top: -10px;
        right: -10px;
    }
</style>

                                        </li>
                                        <li class="list-item">
                                            <span class="notch-bg notch-bg--emerald"></span>
                                            <a href="#profile-menu-offcanvas" area-label="User" class="btn btn--size-33-33 btn--center btn--round offcanvas-toggle offside-menu">
                                                <img class="img-fluid" height="33" width="33" src="assets/images/header-top-user-img.jpg" alt="user image"></a>
                                        </li>
                                    </ul>
                                </li>
                            </ul>
                        </div>
                    </div>
                    <!-- End User Event Area -->
                </div>
            </div>
            <!-- ...:::End User Event Section:::... -->

      
                        <!--  Start Offcanvas Profile Menu Section -->
                        <div id="profile-menu-offcanvas" class="offcanvas offcanvas-rightside">
                            <!-- Start Offcanvas Header -->
                            <div class="offcanvas-header flex-start offcanvas-modify">
                                <button class="offcanvas-close" aria-label="offcanvas svg icon">
                                    <svg xmlns="http://www.w3.org/2000/svg" width="5.973" height="10.449" viewbox="0 0 5.973 10.449">
                                        <path id="Icon_ionic-ios-arrow-back" data-name="Icon ionic-ios-arrow-back" d="M13.051,11.417,17,7.466a.747.747,0,0,0-1.058-1.054l-4.479,4.476a.745.745,0,0,0-.022,1.03l4.5,4.507A.747.747,0,1,0,17,15.37Z" transform="translate(-11.251 -6.194)"></path>
                                    </svg>
                                </button>
                                <span>Home</span>
                
                            </div> <!-- End Offcanvas Header -->
                            <!-- Start Offcanvas Mobile Menu Wrapper -->
                        <?php
                        session_start();
                        
                        // Include your database connection file
                        require 'db_connection.php';
                        
                        // Check if the user is logged in
                        if (isset($_SESSION['user_id'])) {
                            $user_id = $_SESSION['user_id']; // Get the user ID from the session
                        
                            // Prepare the SQL query to fetch the wallet balance from the customer table
                            $sql_wallet = "SELECT wallet FROM customer WHERE id = ?";
                            $stmt = $conn->prepare($sql_wallet);
                            $stmt->bind_param("i", $user_id);
                            $stmt->execute();
                            $result_wallet = $stmt->get_result();
                        
                            if ($result_wallet->num_rows > 0) {
                                // Fetch the wallet balance
                                $row = $result_wallet->fetch_assoc();
                                $wallet = $row['wallet']; // Wallet balance
                            } else {
                                $wallet = 0; // Default to 0 if no wallet is found
                            }
                        
                            // Close the prepared statement
                            $stmt->close();
                        } else {
                            $wallet = 0; // Default to 0 if the user is not logged in
                        }
                        
                        // Close the database connection
                        $conn->close();
                        ?>
                <div class="offcanvas-profile-menu-wrapper">
                    <!-- ...:::Start Profile Card Section:::... -->
                <div class="offcanvas-profile-menu-wrapper">
                    <!-- ...:::Start Profile Card Section:::... -->
                <div class="profile-card-section section-gap-top-25">
                    <div class="profile-card-wrapper">
                        <div class="image">
                            <img class="img-fluid" width="96" height="96" src="assets/images/user/user-profile.png" alt="image">
                        </div>
                        <div class="content">
                            <h2 class="name"><?php echo htmlspecialchars($_SESSION['fullname']); ?></h2>
                            <span class="email"><?php echo htmlspecialchars($_SESSION['email']); ?></span>
                           
                        </div>
                        <div class="profile-shape profile-shape-1">
                            <img class="img-fluid" width="61" height="50" src="assets/images/profile-shape-1.svg" alt="image">
                        </div>
                        <div class="profile-shape profile-shape-2">
                            <img class="img-fluid" width="48" height="59" src="assets/images/profile-shape-2.svg" alt="image">
                        </div>
                    </div>
                 </div>
                  <!-- ...:::End Profile Card Section:::... -->
                        </div>

                <!-- ...:::End Profile Card Section:::... -->

                <!-- ...:::Start Profile Details Section:::... -->
                <div class="profile-details-section section-gap-top-30">
                    <div class="profile-details-wrapper">
                        <div class="profile-details-top">
                            <div class="left">
                                <span class="text">Wallet Balance</span>
                               
                                                                <span class="price"> <?php echo "$" . number_format($wallet, 2); ?></span>
                            </div>
                            <div class="right">
                                <button aria-label="Wishlist" class="btn btn--size-58-58 btn--font-size-22 btn--center btn--round btn--color-radical-red btn--bg-white btn--box-shadow"><i class="icon icon-carce-heart"></i></button>
                            </div>
                        </div>
                        <div class="profile-details-bottom">
                            <ul class="profile-user-list">
                                <li class="profile-list-item">
                                    <ul class="profile-single-list">
                                        <li class="list-item">
                                            <span class="title">Setting</span>
                                        </li>
                                        <li class="list-item">
                                            <a href="profile-settings.html" class="profile-link"><span class="icon"><i class="icon icon-carce-user"></i></span>Account Setting</a>
                                        </li>
                                        <li class="list-item">
                                            <a href="checkout.html" class="profile-link"><span class="icon"><i class="icon icon-carce-briefcase"></i></span>Billing & Payment</a>
                                        </li>
                                        <li class="list-item">
                                            <a href="notification.html" class="profile-link"><span class="icon"><i class="icon icon-carce-bell"></i></span>Notification</a>
                                        </li>
                                    </ul>
                                </li>

                                <li class="profile-list-item">
                                    <ul class="profile-single-list">
                                        <li class="list-item">
                                            <a href="logout.php" class="profile-link"><span class="icon"><i class="icon icon-carce-login"></i></span>Log Out</a>
                                        </li>
                                    </ul>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                <!-- ...:::End Profile Details Section:::... -->
            </div> <!-- End Offcanvas Mobile Menu Wrapper -->
        </div> <!-- ...:::: End Offcanvas Profile Menu Section:::... -->
