<?php include 'header.php'; ?>
<?php include '_top-header.php'; ?>

<div class="page">

    <div class="container p-0">

        <div class="profile-layout">

            <div class="start">
                <?php include '_profile-layout-side-menu.php' ?>
            </div><!-- start -->

            <div class="end">

                <div class="card">

                    <div class="flex-between mb-3">
                        <ol class="breadcrumb">
                            <li class="breadcrumb-item"><a href="#"> Help center </a></li>
                            <li class="breadcrumb-item"><a href="#"> Customer Support </a></li>
                            <li class="breadcrumb-item active"> Issue #3252671005 </li>
                        </ol>
                    </div>

                    <div class="ticket-and-title-wrapper">

                        <div class="mb-3">

                            <p class="font-light color-gray mb-1 text-center"> Issue #3252671005 </p>

                            <p class="lead font-medium headline text-center"> Issue Subject Issue Subject Issue Subject Issue Subject Issue Subject Issue Subject Issue Subject </p>

                        </div>

                        <div class="ticket-wrapper">


                            <div class="all-messages">


                                <div class="message my-message-wrapper">

                                    <div class="start">
                                        <div class="w-40px h-40px rounded-pill overflow-hidden">
                                            <div class="shimmer"></div>
                                        </div>
                                    </div>

                                    <div class="end">
                                        <div class="w-100 h-40px base-border-radius overflow-hidden">
                                            <div class="shimmer"></div>
                                        </div>
                                    </div>

                                </div>







                                <?php foreach (range(1, 8) as $i) { ?>

                                    <div class="message my-message-wrapper">
                                        <div class="start">
                                            <img src="assets/img/thumbs/users/01.jpg" class="user-image w-40px h-40px rounded-circle object-cover">
                                        </div>
                                        <div class="end">
                                            <p class="mb-1 message-text"> i'm not able to see my bonusi'm not able to see my bonusi'm not able to see my bonusi'm not able to see my bonusi'm not able to see my bonusi'm not able to see my bonusi'm not able to see my bonusi'm not able to see my bonusi'm not able to see my bonusi'm not able to see my bonusi'm not able to see my bonusi'm not able to see my bonusi'm not able to see my bonusi'm not able to see my bonusi'm not able to see my bonusi'm not able to see my bonus </p>
                                            <p class="m-0 color-gray small font-light"> 3:00 pm 02 aug 2025 </p>
                                        </div>
                                    </div>

                                    <div class="message admin-message-wrapper">
                                        <div class="start">
                                            <img src="assets/img/logo-1.png" class="user-image w-40px h-40px rounded-circle object-cover">
                                        </div>
                                        <div class="end">
                                            <p class="mb-1 message-text"> how can i help you ? </p>
                                            <p class="m-0 color-gray small font-light"> 3:00 pm 02 aug 2025 </p>
                                        </div>
                                    </div>

                                <?php } ?>

                            </div><!-- all-messages -->




                            <div class="send-message-wrapper add-comment-container relative">


                                <form class="add-comment-wrapper w-100">


                                    <div class="comment-input-container form-group">
                                        <textarea id="add-comment" placeholder="Your Message here " class="form-control"></textarea>
                                    </div><!-- form-group  -->



                                    <div class="attachment-wrapper mx-2">

                                        <i id="open-ticket-asset-file" class="icon icon-attachment"></i>

                                        <input class="d-none" type="file" id="ticket-asset-file" accept="image/png, image/jpeg">

                                        <span class="invalid-feedback "> This Field Is Required </span>

                                    </div><!-- attachment-wrapper -->



                                    <button type="submit" class="send-comment-container reset-btn">
                                        <i id="send-comment" class="icon icon-share-fill"></i>
                                    </button>


                                </form><!-- add-comment-wrapper -->

                            </div><!-- send-message-wrapper -->




                            <div class="drag-and-drop-file-wrapper d-none">
                                <p class="drop-here-text"> Drop Image Here </p>
                                <input id="upload" class="drag-and-drop-input" type="file" accept=".jpg,.jpeg.,.gif,.png,.mov,.mp4" />
                            </div><!-- drag-and-drop-wrapper -->




                        </div><!-- ticket-wrapper -->

                    </div> <!-- container -->

                </div>

            </div> <!-- end -->

        </div> <!-- profile-layout -->

    </div> <!-- container -->

</div> <!-- page -->






<?php include 'footer.php'; ?>