  <!--start main wrapper-->
    <main class="main-wrapper">
        <div class="main-content">

            <h3 class=" fmon fw-bolder "> <img src="<?php echo base_url(); ?>assets/images/megaIcons/event.svg" alt=""> Event Journal</h3>

            <div class="row">
                <div class="col-md-5">

                    <div class="input-group border-15">
                        <span class="input-group-text  border-15"><img src="<?php echo base_url(); ?>assets/images/serIcon.png" alt=""
                                width="25px"></span>
                        <input type="text" name="" id="" class="form-control form-Search  border-15  py-2"
                            placeholder="search">
                    </div>

                </div>
                <div class="col-md-7 d-flex justify-content-end gap-2">
                    <a href="<?php echo base_url().'site/addeventjournal'; ?>" class="btn addBtn d-flex gap-2 align-items-center"><img
                            src="<?php echo base_url(); ?>assets/images/megaIcons/aplu.png" alt="">Add Event Journal </a>
                    <button class="btn expButn  "><img src="<?php echo base_url(); ?>assets/images/megaIcons/xport.png" alt=""> Export
                        List</button>

                    <div class="btn bg-white d-flex gap-5 align-items-center px-3 border-15" data-bs-toggle="offcanvas"
                        data-bs-target="#offcanvasRight" aria-controls="offcanvasRight">
                        Filter <img src="<?php echo base_url(); ?>assets/images/e.png " alt="" width="20px">


                    </div>
                    <div class="offcanvas offcanvas-end" tabindex="-1" id="offcanvasRight"
                        aria-labelledby="offcanvasRightLabel">
                        <div class="offcanvas-header">
                            <h5 class="offcanvas-title" id="offcanvasRightLabel">Filters</h5>
                            <button type="button" class="btn-close" data-bs-dismiss="offcanvas"
                                aria-label="Close"></button>
                        </div>
                        <div class="offcanvas-body">
                            <!-- User Type Filter -->
                            <div class="mb-3">
                                <label for="userType" class="form-label">Creatd At</label>
                                <input type="date" class="form-control">
                            </div>

                            <!-- Status Filter -->
                            <div class="mb-3">
                                <label for="status" class="form-label">Status</label>
                                <select class="form-select" id="status">
                                    <option value="">Select Status</option>
                                    <option value="read">Read</option>
                                    <option value="unread">Unread</option>
                                </select>
                            </div>

                            <!-- House Number Filter (Searchable) -->


                            <button class="btn addBtn w-100" onclick="applyFilters()">Apply Filters</button>
                        </div>
                    </div>

                </div>
                <div>
                    <div class="table-responsive mt-3 ">
                        <table class="table table-striped table-hover">
                            <thead>
                                <tr>
                                    <th scope="col">Event No.</th>
                                    <th scope="col">Tittle</th>

                                    <th scope="col">Status</th>
                                    <th scope="col">Created at</th>

                                    <th scope="col">View</th>

                                </tr>
                            </thead>
                            <div class="">
                                <tbody class="">
                                    <tr>
                                        <td>
                                            <div class="hNum">
                                                103
                                            </div>
                                        </td>
                                        <td>
                                            <p class="ft7 fmon m-0">Security Breach</p>
                                        </td>
                                        <td>
                                            <div class="d-flex  align-items-center h40">
                                                <div class="b-badge-success px-3 py-1 border-15">
                                                    Read
                                                </div>
                                            </div>

                                        </td>
                                        <td>
                                            <div class="d-flex align-items-center h-100">
                                                <p class="ft7 fmon m-0">11 Nov 2024, 08:00 PM</p>
                                            </div>

                                        </td>





                                        <td>
                                            <a href="<?php echo base_url().'site/viewent'; ?>">
                                                <img src="<?php echo base_url(); ?>assets/images/eye3.png" alt="">
                                            </a>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <div class="hNum">
                                                103
                                            </div>
                                        </td>
                                        <td>
                                            <p class="ft7 fmon m-0">Security Breach</p>
                                        </td>
                                        <td>
                                            <div class="d-flex  align-items-center h40">
                                                <div class="b-badge-warning px-3 py-1 border-15 ">
                                                    Unread
                                                </div>
                                            </div>

                                        </td>
                                        <td>
                                            <div class="d-flex align-items-center h-100">
                                                <p class="ft7 fmon m-0">11 Nov 2024, 08:00 PM</p>
                                            </div>

                                        </td>





                                        <td>
                                            <a href="<?php echo base_url().'site/viewent'; ?>">
                                                <img src="<?php echo base_url(); ?>assets/images/eye3.png" alt="">
                                            </a>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <div class="hNum">
                                                103
                                            </div>
                                        </td>
                                        <td>
                                            <p class="ft7 fmon m-0">Security Breach</p>
                                        </td>
                                        <td>
                                            <div class="d-flex  align-items-center h40">
                                                <div class="b-badge-success px-3 py-1 border-15">
                                                    Read
                                                </div>
                                            </div>

                                        </td>
                                        <td>
                                            <div class="d-flex align-items-center h-100">
                                                <p class="ft7 fmon m-0">11 Nov 2024, 08:00 PM</p>
                                            </div>

                                        </td>





                                        <td>
                                            <a href="<?php echo base_url().'site/viewent'; ?>">
                                                <img src="<?php echo base_url(); ?>assets/images/eye3.png" alt="">
                                            </a>
                                        </td>
                                    </tr>
                                    <tr>
                                        <td>
                                            <div class="hNum">
                                                103
                                            </div>
                                        </td>
                                        <td>
                                            <p class="ft7 fmon m-0">Security Breach</p>
                                        </td>
                                        <td>
                                            <div class="d-flex  align-items-center h40">
                                                <div class="b-badge-warning px-3 py-1 border-15 ">
                                                    Unread
                                                </div>
                                            </div>

                                        </td>
                                        <td>
                                            <div class="d-flex align-items-center h-100">
                                                <p class="ft7 fmon m-0">11 Nov 2024, 08:00 PM</p>
                                            </div>

                                        </td>





                                        <td>
                                            <a href="<?php echo base_url().'site/viewent'; ?>">
                                                <img src="<?php echo base_url(); ?>assets/images/eye3.png" alt="">
                                            </a>
                                        </td>
                                    </tr>



                                    <!-- Add more rows as needed -->
                                </tbody>
                            </div>
                        </table>
                      
                    </div>
                </div>
            </div>
        </div>
        </div>

    </main>
    <!--end main wrapper-->

