     <!-- Deposit Action Sheet -->
        <div class="modal fade action-sheet" id="permissionActionSheet" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">Select Action</h5>
                    </div>
                    <div class="modal-body">
                        <div class="action-sheet-content">
                            <form>
                                <div class="form-group basic">
                                    <button type="button" class="btn btn-warning btn-block btn-lg openPermissioncatModal">Add Permission to Category</button>
                                </div>

                                 <div class="form-group basic">
                                    <button type="button" class="btn btn-primary btn-block btn-lg openPermissionModal">Add Permission to Account</button>
                                </div>
                                
                                <div class="form-group basic">
                                    <button type="button" class="btn btn-secondary btn-block btn-lg openPermissionmenuModal">Add Menu Permissions </button>
                                </div>

                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- * Deposit Action Sheet -->
        
        <!-- Permisson Menu Modal  -->
        <div class="modal fade modalbox" id="PermissionMenuModal" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">Add Menu Access</h5>
                        <a href="javascript:;" data-dismiss="modal">Close</a>
                    </div>
                    <div class="modal-body">
                     <div class="card p-3">

            <form id="permissionmenuForm">

                <div id="permissionmenuRows">

                    <!-- First Row -->
                    <div class="permcat-row row mb-2">
                          <div class="form-group   col-md-3">
                            <div class="live-search-wrapper"
                                     data-endpoint="fetch_scripts/get_users.php"
                                     data-hidden-name="user2_id[]"
                                     data-display-fields="firstname,secondname"
                                     data-value-field="id">
                                
                                    <label class="label">User</label>
                                
                                    <!-- ❌ REMOVE name from text input -->
                                    <input type="text"
                                           class="form-control liveSearchInput"
                                           placeholder="Search..."
                                           autocomplete="off">
                                
                                    <!-- ✅ ADD name here instead -->
                                    <input type="hidden"
                                           class="liveHiddenInput"
                                           name="user2_id[]">
                                
                                    <div class="liveResults"></div>
                                </div>
                        </div>
                       <div class="form-group   col-md-3">
                            <div class="input-wrapper">
                            <label class="label" for="name2">Menu item</label>
                              <select name="mnu[]" class="form-control">
                                <option value="customers">Customers</option>
                                <option value="suppliers">Suppliers</option>
                                <option value="products">Products</option>
                                <option value="permissions">Permissions</option>
                                <option value="accounts_lists">Chart of Accounts</option>
                                <option value="cash_adj">Cash Adjustment</option>
                            </select>
                            </div>
                        </div>
                       
                        <div class="form-group   col-md-4">
                            <div class="input-wrapper">
                            <label class="label" for="name2">Access Level</label>
                              <select name="access2_lvl[]" class="form-control">
                                    <option value="0">View Only</option>
                                    <option value="11">View & Create</option>
                                
                                </select>
                            </div>
                        </div>
                        <div class="form-group basic col-md-2 d-flex align-items-center">
                            <button type="button" class="btn btn-danger btn-sm removemenuRow" style="display:none;">Remove</button>
                        </div>
                    </div>

                </div>

                <div class="form-group basic mt-2">
                    <div class="right" style="position: fixed; right: 20px; center: 20px; z-index: 9999;">
                    <div id="liveToastContainer"></div>
                </div>
                    <button type="button" id="permmenuaddRow" class="btn btn-success btn-sm">
                        + Add Row
                    </button>
                </div>

                <div class="mt-3">
                    <button type="submit" class="btn btn-primary btn-block">
                        Add Permission to Menu
                    </button>
                </div>

            </form>

        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- * Permisson MENU Modal  Modal  -->
        
        
         <!-- Permisson Category Modal  -->
        <div class="modal fade modalbox" id="PermissioncatModal" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">Add Permisson to Category</h5>
                        <a href="javascript:;" data-dismiss="modal">Close</a>
                    </div>
                    <div class="modal-body">
                     <div class="card p-3">

            <form id="permissioncatForm">

                <div id="permissioncatRows">

                    <!-- First Row -->
                    <div class="permcat-row row mb-2">
                          <div class="form-group   col-md-3">
                            <div class="live-search-wrapper"
                                     data-endpoint="fetch_scripts/get_users.php"
                                     data-hidden-name="user_id[]"
                                     data-display-fields="firstname,secondname"
                                     data-value-field="id">
                                
                                    <label class="label">User</label>
                                
                                    <!-- ❌ REMOVE name from text input -->
                                    <input type="text"
                                           class="form-control liveSearchInput"
                                           placeholder="Search..."
                                           autocomplete="off">
                                
                                    <!-- ✅ ADD name here instead -->
                                    <input type="hidden"
                                           class="liveHiddenInput"
                                           name="user_id[]">
                                
                                    <div class="liveResults"></div>
                                </div>
                        </div>
                       <div class="form-group   col-md-3">
                            <div class="input-wrapper">
                            <label class="label" for="name2">Category</label>
                              <select name="categ[]" class="form-control">
                                <option value="cash_wallet">Cash Wallet</option>
                                <option value="bank_wallet">Bank Wallet</option>
                                <option value="expense">Expense</option>
                                <option value="customer">Customer</option>
                                <option value="warehouse">Warehouse</option>
                                <option value="sales_person">Sales person</option>
                                <option value="supplier">Supplier</option>
                            </select>
                            </div>
                        </div>
                       
                        <div class="form-group   col-md-4">
                            <div class="input-wrapper">
                            <label class="label" for="name2">Access Level</label>
                              <select name="access_lvl[]" class="form-control">
                                    <option value="0">0.View Only</option>
                                    <option value="1">1.Confirm Transactions</option>
                                    <option value="2">2.View & Confirm Transactions </option>
                                    <option value="3">3.Transfer to Account </option>
                                    <option value="4">4.View & Transfer to Account</option>
                                    <option value="5">5.View, Transfer to & from Account</option>
                                    <option value="6">6.View,confirm,Transfer to & from Account</option>
                                    <option value="7">7.All access</option>
                                </select>
                            </div>
                        </div>
                        <div class="form-group basic col-md-2 d-flex align-items-center">
                            <button type="button" class="btn btn-danger btn-sm removeRow" style="display:none;">Remove</button>
                        </div>
                    </div>

                </div>

                <div class="form-group basic mt-2">
                    <div class="right" style="position: fixed; right: 20px; center: 20px; z-index: 9999;">
                    <div id="liveToastContainer"></div>
                </div>
                    <button type="button" id="permcataddRow" class="btn btn-success btn-sm">
                        + Add Row
                    </button>
                </div>

                <div class="mt-3">
                    <button type="submit" class="btn btn-primary btn-block">
                        Add Permission to Category
                    </button>
                </div>

            </form>

        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- * Permisson Category Modal  Modal  -->
        
         <!--Permisson Modal  -->
        <div class="modal fade modalbox" id="PermissionModal" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">Add permissons to account</h5>
                        <a href="javascript:;" data-dismiss="modal">Close</a>
                    </div>
                    <div class="modal-body">
                <form id="permissionForm">

                <div id="permissionRows">

                    <!-- First Row -->
                    <div class="perm-row row mb-2">
                        <div class="form-group   col-md-3">
                            <div class="live-search-wrapper"
                                     data-endpoint="fetch_scripts/get_users.php"
                                     data-hidden-name="user1_id[]"
                                     data-display-fields="firstname,secondname"
                                     data-value-field="id">
                                
                                    <label class="label">User</label>
                                
                                    <!-- ❌ REMOVE name from text input -->
                                    <input type="text"
                                           class="form-control liveSearchInput"
                                           placeholder="Search..."
                                           autocomplete="off">
                                
                                    <!-- ✅ ADD name here instead -->
                                    <input type="hidden"
                                           class="liveHiddenInput"
                                           name="user1_id[]">
                                
                                    <div class="liveResults"></div>
                                </div>
                        </div>
                          <div class="form-group   col-md-3">
                            <div class="live-search-wrapper"
                                     data-endpoint="fetch_scripts/get_account.php"
                                     data-hidden-name="account1_id[]"
                                     data-display-fields="acc_name"
                                     data-value-field="id">
                                
                                    <label class="label">Account</label>
                                
                                    <!-- ❌ REMOVE name from text input -->
                                    <input type="text"
                                           class="form-control liveSearchInput"
                                           placeholder="Search..."
                                           autocomplete="off">
                                
                                    <!-- ✅ ADD name here instead -->
                                    <input type="hidden"
                                           class="liveHiddenInput"
                                           name="account1_id[]">
                                
                                    <div class="liveResults"></div>
                                </div>
                        </div>
                        <div class="form-group   col-md-4">
                            <div class="input-wrapper">
                            <label class="label" for="name2">Access Level</label>
                              <select name="access1_lvl[]" class="form-control">
                                     <option value="0">0.View Only</option>
                                    <option value="1">1.Confirm Transactions</option>
                                    <option value="2">2.View & Confirm Transactions </option>
                                    <option value="3">3.Transfer to Account </option>
                                    <option value="4">4.View & Transfer to Account</option>
                                    <option value="5">5.View, Transfer to & from Account</option>
                                    <option value="6">6.View,confirm,Transfer to & from Account</option>
                                    <option value="7">7.All access</option>
                                </select>
                            </div>
                        </div>
                     
                        <div class="form-group basic col-md-2 d-flex align-items-center">
                            <button type="button" class="btn btn-danger btn-sm removepermRow" style="display:none;">Remove</button>
                        </div>
                    </div>

                </div>

                <div class="form-group basic mt-2">
                    <div class="right" style="position: fixed; right: 20px; center: 20px; z-index: 9999;">
                    <div id="liveToastContainer"></div>
                </div>
                    <button type="button" id="permaddRow" class="btn btn-success btn-sm">
                        + Add Row
                    </button>
                </div>

                <div class="mt-3">
                    <button type="submit" class="btn btn-primary btn-block">
                        Add Permissions to account
                    </button>
                </div>

            </form>

        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- * Permisson Category Modal -->
        
        
        <!-- Dialog Form -->
        <div class="modal fade dialogbox" id="DeletFormModal" data-backdrop="static" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">Delete Permission</h5>
                    </div>
                    <form id="deletepermissionForm">
                        <div class="modal-body text-left mb-2">
                            <div class="form-group basic">
                                <div class="input-wrapper">
                                    <label class="label" for="email1">User</label>
                                    <input type="hidden" name="del_id" id="del_id">
                                    <input type="text" class="form-control" id="del_user" name="del_user" readonly>
                                    
                                </div>
                            </div>

                            <div class="form-group basic">
                                <div class="input-wrapper">
                                    <label class="label" for="Account">Account</label>
                                    <input type="text" class="form-control" id="del_acc" name="del_acc" readonly>
                                    
                                </div>
                            </div>
                            <div class="form-group basic">
                                <div class="input-wrapper">
                                    <label class="label" for="Account">Category</label>
                                    <input type="text" class="form-control" id="del_categ" name="del_categ" readonly>
                                   
                                </div>
                            </div>
                            <div class="form-group basic">
                                <div class="input-wrapper">
                                    <label class="label" for="Account">Access Level</label>
                                    <input type="text" class="form-control" id="del_acclvl" name="del_acclvl" readonly>
                                   
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <div class="btn-inline">
                                <button type="submit" class="btn btn-text-danger" >Delete</button>
                                <button type="button" class="btn btn-text-primary" data-dismiss="modal">Cancel</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
        <!-- * Dialog Form -->        
        
        <!-- Dialog Loading -->
        <div class="modal fade dialogbox" id="DialogLoading" data-backdrop="static" tabindex="-1"
            role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                  
                    <div class="modal-body">
                        Loading
                    </div>
                    
                </div>
            </div>
        </div>
        <!-- * Dialog Loading -->        