    <!-- Global Dialogs -->
    <?php $this->load->view('partials/dialogs'); ?>

    <!-- ========= JS Files =========  -->
    <script src="<?php echo base_url('assets/js/lib/bootstrap.bundle.min.js'); ?>"></script>
    <script type="module" src="https://cdn.jsdelivr.net/npm/ionicons@latest/dist/ionicons/ionicons.esm.js"></script>
    <script src="<?php echo base_url('assets/js/plugins/splide/splide.min.js'); ?>"></script>
    <script src="<?php echo base_url('assets/js/base.js'); ?>"></script>
    
    <?php if (isset($extra_js)) echo $extra_js; ?>
    
    <script>
        // CSRF Token for AJAX requests
        var csrf_token = '<?php echo $this->security->get_csrf_hash(); ?>';
        var base_url = '<?php echo base_url(); ?>';
        
        /**
         * Global Dialog Functions
         */
        var MeridianDialog = {
            /**
             * Show success dialog
             * @param {string} message - The message to display
             * @param {string|function} titleOrCallback - Optional title or callback function
             * @param {function} callback - Optional callback function (if title is provided)
             */
            success: function(message, titleOrCallback, callback) {
                var modal = document.getElementById('DialogSuccess');
                var title = null;
                var cb = null;
                
                // Handle overloaded parameters
                if (typeof titleOrCallback === 'function') {
                    cb = titleOrCallback;
                } else if (typeof titleOrCallback === 'string') {
                    title = titleOrCallback;
                    cb = callback;
                }
                
                if (title) {
                    modal.querySelector('.modal-title').textContent = title;
                } else {
                    modal.querySelector('.modal-title').textContent = 'Success';
                }
                
                document.getElementById('dialogSuccessMessage').innerHTML = message;
                var bsModal = new bootstrap.Modal(modal);
                bsModal.show();
                
                if (cb && typeof cb === 'function') {
                    modal.addEventListener('hidden.bs.modal', function handler() {
                        cb();
                        modal.removeEventListener('hidden.bs.modal', handler);
                    });
                }
            },
            
            /**
             * Show error dialog
             * @param {string} message - The message to display
             * @param {string|function} titleOrCallback - Optional title or callback function
             * @param {function} callback - Optional callback function (if title is provided)
             */
            error: function(message, titleOrCallback, callback) {
                var modal = document.getElementById('DialogError');
                var title = null;
                var cb = null;
                
                // Handle overloaded parameters
                if (typeof titleOrCallback === 'function') {
                    cb = titleOrCallback;
                } else if (typeof titleOrCallback === 'string') {
                    title = titleOrCallback;
                    cb = callback;
                }
                
                if (title) {
                    modal.querySelector('.modal-title').textContent = title;
                } else {
                    modal.querySelector('.modal-title').textContent = 'Error';
                }
                
                document.getElementById('dialogErrorMessage').innerHTML = message;
                var bsModal = new bootstrap.Modal(modal);
                bsModal.show();
                
                if (cb && typeof cb === 'function') {
                    modal.addEventListener('hidden.bs.modal', function handler() {
                        cb();
                        modal.removeEventListener('hidden.bs.modal', handler);
                    });
                }
            },
            
            /**
             * Show warning dialog
             * @param {string} message - The message to display
             * @param {string|function} titleOrCallback - Optional title or callback function
             * @param {function} callback - Optional callback function (if title is provided)
             */
            warning: function(message, titleOrCallback, callback) {
                var modal = document.getElementById('DialogWarning');
                var title = null;
                var cb = null;
                
                // Handle overloaded parameters
                if (typeof titleOrCallback === 'function') {
                    cb = titleOrCallback;
                } else if (typeof titleOrCallback === 'string') {
                    title = titleOrCallback;
                    cb = callback;
                }
                
                if (title) {
                    modal.querySelector('.modal-title').textContent = title;
                } else {
                    modal.querySelector('.modal-title').textContent = 'Warning';
                }
                
                document.getElementById('dialogWarningMessage').innerHTML = message;
                var bsModal = new bootstrap.Modal(modal);
                bsModal.show();
                
                if (cb && typeof cb === 'function') {
                    modal.addEventListener('hidden.bs.modal', function handler() {
                        cb();
                        modal.removeEventListener('hidden.bs.modal', handler);
                    });
                }
            },
            
            /**
             * Show info dialog
             * @param {string} message - The message to display
             * @param {string|function} titleOrCallback - Optional title or callback function
             * @param {function} callback - Optional callback function (if title is provided)
             */
            info: function(message, titleOrCallback, callback) {
                var modal = document.getElementById('DialogInfo');
                var title = null;
                var cb = null;
                
                // Handle overloaded parameters
                if (typeof titleOrCallback === 'function') {
                    cb = titleOrCallback;
                } else if (typeof titleOrCallback === 'string') {
                    title = titleOrCallback;
                    cb = callback;
                }
                
                if (title) {
                    modal.querySelector('.modal-title').textContent = title;
                } else {
                    modal.querySelector('.modal-title').textContent = 'Information';
                }
                
                document.getElementById('dialogInfoMessage').innerHTML = message;
                var bsModal = new bootstrap.Modal(modal);
                bsModal.show();
                
                if (cb && typeof cb === 'function') {
                    modal.addEventListener('hidden.bs.modal', function handler() {
                        cb();
                        modal.removeEventListener('hidden.bs.modal', handler);
                    });
                }
            },
            
            /**
             * Show confirm dialog
             * Usage: confirm(message, onConfirm) or confirm(message, title, onConfirm, onCancel)
             */
            confirm: function(message, titleOrCallback, onConfirm, onCancel) {
                var modal = document.getElementById('DialogConfirm');
                var title = null;
                var confirmCallback = null;
                var cancelCallback = null;
                
                // Handle different argument patterns
                if (typeof titleOrCallback === 'function') {
                    // confirm(message, onConfirm) or confirm(message, onConfirm, onCancel)
                    confirmCallback = titleOrCallback;
                    cancelCallback = onConfirm; // This would be onCancel in this pattern
                } else {
                    // confirm(message, title, onConfirm, onCancel)
                    title = titleOrCallback;
                    confirmCallback = onConfirm;
                    cancelCallback = onCancel;
                }
                
                // Set title if provided
                var titleEl = document.getElementById('dialogConfirmTitle');
                if (title && titleEl) {
                    titleEl.textContent = title;
                } else if (titleEl) {
                    titleEl.textContent = 'Confirm';
                }
                
                document.getElementById('dialogConfirmMessage').innerHTML = message;
                
                var confirmBtn = document.getElementById('dialogConfirmOk');
                var cancelBtn = document.getElementById('dialogConfirmCancel');
                
                // Clone to remove existing listeners
                var newConfirmBtn = confirmBtn.cloneNode(true);
                var newCancelBtn = cancelBtn.cloneNode(true);
                confirmBtn.parentNode.replaceChild(newConfirmBtn, confirmBtn);
                cancelBtn.parentNode.replaceChild(newCancelBtn, cancelBtn);
                
                newConfirmBtn.addEventListener('click', function() {
                    var bsModal = bootstrap.Modal.getInstance(modal);
                    if (bsModal) bsModal.hide();
                    if (confirmCallback) confirmCallback();
                });
                
                newCancelBtn.addEventListener('click', function() {
                    var bsModal = bootstrap.Modal.getInstance(modal);
                    if (bsModal) bsModal.hide();
                    if (cancelCallback) cancelCallback();
                });
                
                var bsModal = new bootstrap.Modal(modal);
                bsModal.show();
            },
            
            /**
             * Show loading dialog
             */
            loading: function(message) {
                message = message || 'Processing...';
                document.getElementById('dialogLoadingMessage').textContent = message;
                var modal = document.getElementById('DialogLoading');
                var bsModal = new bootstrap.Modal(modal);
                bsModal.show();
                return bsModal;
            },
            
            /**
             * Hide loading dialog
             */
            hideLoading: function() {
                var modal = document.getElementById('DialogLoading');
                var bsModal = bootstrap.Modal.getInstance(modal);
                if (bsModal) {
                    bsModal.hide();
                }
            }
        };
        
        // Make MeridianDialog globally available
        window.MeridianDialog = MeridianDialog;
        
        // Auto-show dialogs for session flashdata
        document.addEventListener('DOMContentLoaded', function() {
            <?php if ($this->session->flashdata('success')): ?>
            MeridianDialog.success('<?php echo addslashes($this->session->flashdata('success')); ?>');
            <?php endif; ?>
            
            <?php if ($this->session->flashdata('error')): ?>
            MeridianDialog.error('<?php echo addslashes($this->session->flashdata('error')); ?>');
            <?php endif; ?>
            
            <?php if ($this->session->flashdata('warning')): ?>
            MeridianDialog.warning('<?php echo addslashes($this->session->flashdata('warning')); ?>');
            <?php endif; ?>
            
            <?php if ($this->session->flashdata('info')): ?>
            MeridianDialog.info('<?php echo addslashes($this->session->flashdata('info')); ?>');
            <?php endif; ?>
        });
    </script>
</body>
</html>
