chore(version): pre-release bump to 01.43.07-dev [skip ci]

- Preflight now detects existing Joomla installation (configuration.php / Version.php)
  and shows a yellow warning — does not block, but alerts the user
- Standalone mode: backup archive check scans for all ZIPs instead of hardcoded name
- Multi-zip selector integrated into extract step with radio buttons
- Selected backup file passed through to extract action
- Added warn-style CSS class (yellow) for preflight warnings

.mokogitea/workflows/deploy-manual.yml

@@ -1,126 +0,0 @@
-# Copyright (C) 2026 Moko Consulting <hello@mokoconsulting.tech>
-#
-# SPDX-License-Identifier: GPL-3.0-or-later
-#
-# FILE INFORMATION
-# DEFGROUP: Gitea.Workflow
-# INGROUP: MokoStandards.Deploy
-# REPO: https://git.mokoconsulting.tech/MokoConsulting/MokoStandards-API
-# PATH: /templates/workflows/joomla/deploy-manual.yml.template
-# VERSION: 04.07.00
-# BRIEF: Manual SFTP deploy to dev server for Joomla repos
-
-name: "Universal: Deploy to Dev (Manual)"
-
-on:
-  workflow_dispatch:
-    inputs:
-      clear_remote:
-        description: 'Delete all remote files before uploading'
-        required: false
-        default: 'false'
-        type: boolean
-
-env:
-  FORCE_JAVASCRIPT_ACTIONS_TO_NODE24: true
-
-permissions:
-  contents: read
-
-jobs:
-  deploy:
-    name: SFTP Deploy to Dev
-    runs-on: ubuntu-latest
-
-    steps:
-      - name: Checkout repository
-        uses: actions/checkout@de0fac2e4500dabe0009e67214ff5f5447ce83dd # v6
-
-      - name: Setup PHP
-        run: |
-          php -v && composer --version
-
-      - name: Setup MokoStandards tools
-        env:
-          GA_TOKEN: ${{ secrets.GA_TOKEN || secrets.GA_TOKEN || github.token }}
-          MOKO_CLONE_TOKEN: ${{ secrets.GA_TOKEN || secrets.GA_TOKEN || github.token }}
-          MOKO_CLONE_HOST: ${{ secrets.GA_TOKEN && 'git.mokoconsulting.tech/MokoConsulting' || 'github.com/mokoconsulting-tech' }}
-          COMPOSER_AUTH: '{"github-oauth":{"github.com":"${{ secrets.GA_TOKEN || github.token }}"}}'
-        run: |
-          git clone --depth 1 --branch main --quiet \
-            "https://x-access-token:${MOKO_CLONE_TOKEN}@${MOKO_CLONE_HOST}/MokoStandards-API.git" \
-            /tmp/mokostandards-api 2>/dev/null || true
-          if [ -d "/tmp/mokostandards-api" ] && [ -f "/tmp/mokostandards-api/composer.json" ]; then
-            cd /tmp/mokostandards-api && composer install --no-dev --no-interaction --quiet 2>/dev/null || true
-          fi
-
-      - name: Check FTP configuration
-        id: check
-        env:
-          HOST: ${{ vars.DEV_FTP_HOST }}
-          PATH_VAR: ${{ vars.DEV_FTP_PATH }}
-          PORT: ${{ vars.DEV_FTP_PORT }}
-        run: |
-          if [ -z "$HOST" ] || [ -z "$PATH_VAR" ]; then
-            echo "DEV_FTP_HOST or DEV_FTP_PATH not configured -- cannot deploy"
-            echo "skip=true" >> "$GITHUB_OUTPUT"
-            exit 0
-          fi
-          echo "skip=false" >> "$GITHUB_OUTPUT"
-          echo "host=$HOST" >> "$GITHUB_OUTPUT"
-
-          REMOTE="${PATH_VAR%/}"
-          echo "remote=$REMOTE" >> "$GITHUB_OUTPUT"
-
-          [ -z "$PORT" ] && PORT="22"
-          echo "port=$PORT" >> "$GITHUB_OUTPUT"
-
-      - name: Deploy via SFTP
-        if: steps.check.outputs.skip != 'true'
-        env:
-          SFTP_KEY: ${{ secrets.DEV_FTP_KEY }}
-          SFTP_PASS: ${{ secrets.DEV_FTP_PASSWORD }}
-          SFTP_USER: ${{ vars.DEV_FTP_USERNAME }}
-        run: |
-          SOURCE_DIR="src"
-          [ ! -d "$SOURCE_DIR" ] && SOURCE_DIR="htdocs"
-          [ ! -d "$SOURCE_DIR" ] && { echo "No src/ or htdocs/ -- nothing to deploy"; exit 0; }
-
-          printf '{"host":"%s","port":%s,"username":"%s","remotePath":"%s"' \
-            "${{ steps.check.outputs.host }}" "${{ steps.check.outputs.port }}" "$SFTP_USER" "${{ steps.check.outputs.remote }}" \
-            > /tmp/sftp-config.json
-
-          if [ -n "$SFTP_KEY" ]; then
-            echo "$SFTP_KEY" > /tmp/deploy_key
-            chmod 600 /tmp/deploy_key
-            printf ',"privateKeyPath":"/tmp/deploy_key"}' >> /tmp/sftp-config.json
-          else
-            printf ',"password":"%s"}' "$SFTP_PASS" >> /tmp/sftp-config.json
-          fi
-
-          DEPLOY_ARGS=(--path . --src-dir "$SOURCE_DIR" --config /tmp/sftp-config.json)
-          [ "${{ inputs.clear_remote }}" = "true" ] && DEPLOY_ARGS+=(--clear-remote)
-
-          PLATFORM=$(php /tmp/mokostandards-api/cli/platform_detect.php --path . 2>/dev/null || true)
-          if [ "$PLATFORM" = "waas-component" ] && [ -f "/tmp/mokostandards-api/deploy/deploy-joomla.php" ]; then
-            php /tmp/mokostandards-api/deploy/deploy-joomla.php "${DEPLOY_ARGS[@]}"
-          else
-            php /tmp/mokostandards-api/deploy/deploy-sftp.php "${DEPLOY_ARGS[@]}"
-          fi
-
-          rm -f /tmp/deploy_key /tmp/sftp-config.json
-
-      - name: Summary
-        if: always()
-        run: |
-          if [ "${{ steps.check.outputs.skip }}" = "true" ]; then
-            echo "### Deploy Skipped -- FTP not configured" >> $GITHUB_STEP_SUMMARY
-          else
-            echo "### Manual Dev Deploy Complete" >> $GITHUB_STEP_SUMMARY
-            echo "" >> $GITHUB_STEP_SUMMARY
-            echo "| Field | Value |" >> $GITHUB_STEP_SUMMARY
-            echo "|-------|-------|" >> $GITHUB_STEP_SUMMARY
-            echo "| Host | \`${{ steps.check.outputs.host }}\` |" >> $GITHUB_STEP_SUMMARY
-            echo "| Remote | \`${{ steps.check.outputs.remote }}\` |" >> $GITHUB_STEP_SUMMARY
-            echo "| Clear | ${{ inputs.clear_remote }} |" >> $GITHUB_STEP_SUMMARY
-          fi

.mokogitea/workflows/issue-branch.yml

@@ -5,7 +5,7 @@
 # FILE INFORMATION
 # DEFGROUP: Gitea.Workflow
 # INGROUP: mokocli.Automation
-# VERSION: 01.42.00
+# VERSION: 01.43.07
 # BRIEF: Auto-create feature branch when an issue is opened
 
 name: "Universal: Issue Branch"

CHANGELOG.md

@@ -2,6 +2,11 @@
 
 ## [Unreleased]
 
+## [01.43.00] --- 2026-06-24
+
+
+## [01.43.00] --- 2026-06-24
+
 ## [01.42.00] --- 2026-06-23
 
 

source/packages/com_mokosuitebackup/config.xml

@@ -245,7 +245,7 @@
 			type="text"
 			label="COM_MOKOJOOMBACKUP_CONFIG_NTFY_SERVER"
 			description="COM_MOKOJOOMBACKUP_CONFIG_NTFY_SERVER_DESC"
-			default="https://ntfy.sh"
+			default="https://ntfy.mokoconsulting.tech"
 			filter="url"
 		/>
 		<field

source/packages/com_mokosuitebackup/forms/filter_profiles.xml

@@ -27,7 +27,7 @@
 			default="a.ordering ASC"
 			onchange="this.form.submit();"
 		>
-			<option value="a.ordering ASC">JFIELD_ORDERING_LABEL_ASC</option>
+			<option value="a.ordering ASC">JFIELD_ORDERING_ASC</option>
 			<option value="a.title ASC">COM_MOKOJOOMBACKUP_HEADING_TITLE_ASC</option>
 			<option value="a.title DESC">COM_MOKOJOOMBACKUP_HEADING_TITLE_DESC</option>
 			<option value="a.id DESC">JGRID_HEADING_ID_DESC</option>

source/packages/com_mokosuitebackup/language/en-GB/com_mokosuitebackup.ini

@@ -5,6 +5,7 @@
 ; @license     GPL-3.0-or-later
 
 COM_MOKOJOOMBACKUP="MokoSuiteBackup"
+COM_MOKOJOOMBACKUP_CONFIGURATION="MokoSuiteBackup Options"
 COM_MOKOJOOMBACKUP_DESCRIPTION="Full-site backup and restore for Joomla"
 
 ; Submenu
@@ -275,9 +276,9 @@ COM_MOKOJOOMBACKUP_FIELD_SFTP_PORT_DESC="SSH port (default: 22)"
 COM_MOKOJOOMBACKUP_FIELD_SFTP_USERNAME="SSH Username"
 COM_MOKOJOOMBACKUP_FIELD_SFTP_USERNAME_DESC="Username for SSH authentication"
 COM_MOKOJOOMBACKUP_FIELD_SFTP_PASSWORD="SSH Password"
-COM_MOKOJOOMBACKUP_FIELD_SFTP_PASSWORD_DESC="Password for SSH authentication. Leave blank if using a key file."
+COM_MOKOJOOMBACKUP_FIELD_SFTP_PASSWORD_DESC="Password for SSH authentication."
 COM_MOKOJOOMBACKUP_FIELD_SFTP_KEY="SSH Private Key"
-COM_MOKOJOOMBACKUP_FIELD_SFTP_KEY_DESC="Upload your SSH private key (id_rsa, id_ed25519). Stored base64-encoded in DB, written to temp file during upload only. Leave blank for password auth."
+COM_MOKOJOOMBACKUP_FIELD_SFTP_KEY_DESC="Upload your SSH private key (id_rsa, id_ed25519). Stored base64-encoded in DB, written to temp file during upload only."
 COM_MOKOJOOMBACKUP_FIELD_SFTP_KEY_UPLOAD="Upload Key File"
 COM_MOKOJOOMBACKUP_FIELD_SFTP_KEY_REPLACE="Replace Key"
 COM_MOKOJOOMBACKUP_FIELD_SFTP_KEY_LOADED="Key loaded"

source/packages/com_mokosuitebackup/mokosuitebackup.xml

@@ -7,7 +7,7 @@
  -->
 <extension type="component" method="upgrade">
 	<name>MokoSuiteBackup</name>
-	<version>01.42.00</version>
+	<version>01.43.07</version>
 	<creationDate>2026-06-02</creationDate>
 	<author>Moko Consulting</author>
 	<authorEmail>hello@mokoconsulting.tech</authorEmail>

source/packages/com_mokosuitebackup/src/Engine/MokoRestore.php

@@ -165,7 +165,38 @@ SCANNER;
 			$php
 		);
 
-		/* Modify the pre-checks to use getSelectedBackupFile() */
+		/* Replace the backup archive check with one that scans for ZIPs
+		   (must run BEFORE the blanket file_exists replacement below) */
+		$php = str_replace(
+			<<<'ORIG'
+    $checks[] = [
+        'label' => 'Backup Archive',
+        'value' => file_exists(BACKUP_FILE) ? number_format(filesize(BACKUP_FILE) / 1048576, 2) . ' MB' : 'Not found',
+        'ok'    => file_exists(BACKUP_FILE),
+        'hint'  => 'site-backup.zip must be in the same directory as restore.php',
+    ];
+ORIG,
+			<<<'REPL'
+    $availableBackups = scanForBackups();
+    $backupCount = count($availableBackups);
+    $selectedFile = getSelectedBackupFile();
+    if ($selectedFile && file_exists($selectedFile)) {
+        $archiveValue = basename($selectedFile) . ' (' . number_format(filesize($selectedFile) / 1048576, 2) . ' MB)';
+    } elseif ($backupCount > 0) {
+        $archiveValue = $backupCount . ' ZIP file(s) found';
+    } else {
+        $archiveValue = 'No ZIP files found';
+    }
+    $checks[] = [
+        'label' => 'Backup Archive',
+        'value' => $archiveValue,
+        'ok'    => $backupCount > 0,
+        'hint'  => 'Place one or more backup ZIP files in the same directory as restore.php',
+    ];
+REPL
+		);
+
+		/* Modify remaining pre-checks to use getSelectedBackupFile() */
 		$php = str_replace(
 			"file_exists(BACKUP_FILE)",
 			"(getSelectedBackupFile() !== '' || file_exists(BACKUP_FILE))",
@@ -174,65 +205,83 @@ SCANNER;
 
 		$html = self::generateFrontend();
 
-		/* Add backup file selector to the frontend before the extract step */
+		/* Inject backup file selector into the extract step (panel2) */
 		$selectorHtml = <<<'SELECTOR'
-<!-- Backup File Selector (standalone mode) -->
-<div id="mr-step-select" class="mr-step" style="display:none;">
-    <h2 class="mr-step-title">Select Backup File</h2>
-    <p class="mr-desc">Choose which backup archive to restore from.</p>
-    <div id="mr-backup-list"></div>
-    <input type="hidden" name="backup_file" id="mr-backup-file" value="">
-</div>
-<script>
-(function() {
-    var backups = <?php echo json_encode(scanForBackups()); ?>;
-    var list = document.getElementById('mr-backup-list');
-    var hiddenInput = document.getElementById('mr-backup-file');
+        <div id="mr-backup-selector" class="mb-3">
+            <label class="mr-field-label" style="font-weight:600;margin-bottom:8px;display:block;">Backup Archive</label>
+            <div id="mr-backup-list"></div>
+            <input type="hidden" name="backup_file" id="mr-backup-file" value="">
+        </div>
+        <script>
+        (function() {
+            var backups = <?php echo json_encode(scanForBackups()); ?>;
+            var list = document.getElementById('mr-backup-list');
+            var hiddenInput = document.getElementById('mr-backup-file');
 
-    if (backups.length === 0) {
-        var alert = document.createElement('div');
-        alert.className = 'mr-alert mr-alert-danger';
-        alert.textContent = 'No ZIP files found in this directory. Upload a backup archive first.';
-        list.appendChild(alert);
-    } else if (backups.length === 1) {
-        hiddenInput.value = backups[0].name;
-        var found = document.createElement('div');
-        found.className = 'mr-alert mr-alert-success';
-        var strong = document.createElement('strong');
-        strong.textContent = backups[0].name;
-        found.appendChild(document.createTextNode('Found: '));
-        found.appendChild(strong);
-        found.appendChild(document.createTextNode(' (' + (backups[0].size / 1048576).toFixed(1) + ' MB)'));
-        list.appendChild(found);
-    } else {
-        var group = document.createElement('div');
-        group.className = 'mr-field-group';
-        backups.forEach(function(b) {
-            var label = document.createElement('label');
-            label.style.cssText = 'display:block; padding:8px; margin:4px 0; border:1px solid #ddd; border-radius:4px; cursor:pointer;';
-            var radio = document.createElement('input');
-            radio.type = 'radio';
-            radio.name = 'backup_choice';
-            radio.value = b.name;
-            radio.style.marginRight = '8px';
-            radio.addEventListener('change', function() { hiddenInput.value = this.value; });
-            label.appendChild(radio);
-            var nameStrong = document.createElement('strong');
-            nameStrong.textContent = b.name;
-            label.appendChild(nameStrong);
-            label.appendChild(document.createTextNode(' \u2014 ' + (b.size / 1048576).toFixed(1) + ' MB \u2014 ' + b.date));
-            group.appendChild(label);
-        });
-        list.appendChild(group);
-    }
-})();
-</script>
+            if (backups.length === 0) {
+                var alert = document.createElement('div');
+                alert.style.cssText = 'padding:12px;background:#fef2f2;border:1px solid #fecaca;border-radius:6px;color:#dc2626;';
+                alert.textContent = 'No ZIP files found in this directory. Upload a backup archive first.';
+                list.appendChild(alert);
+            } else if (backups.length === 1) {
+                hiddenInput.value = backups[0].name;
+                var found = document.createElement('div');
+                found.style.cssText = 'padding:12px;background:#dcfce7;border:1px solid #bbf7d0;border-radius:6px;color:#16a34a;';
+                var strong = document.createElement('strong');
+                strong.textContent = backups[0].name;
+                found.appendChild(document.createTextNode('Found: '));
+                found.appendChild(strong);
+                found.appendChild(document.createTextNode(' (' + (backups[0].size / 1048576).toFixed(1) + ' MB)'));
+                list.appendChild(found);
+            } else {
+                var hint = document.createElement('div');
+                hint.style.cssText = 'padding:8px 12px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:6px;color:#1d4ed8;margin-bottom:8px;font-size:0.9em;';
+                hint.textContent = 'Multiple backup archives found \u2014 select which one to restore:';
+                list.appendChild(hint);
+                backups.forEach(function(b, i) {
+                    var label = document.createElement('label');
+                    label.style.cssText = 'display:flex;align-items:center;padding:10px 12px;margin:4px 0;border:1px solid #e2e8f0;border-radius:6px;cursor:pointer;transition:background 0.15s;';
+                    label.onmouseover = function() { this.style.background = '#f8fafc'; };
+                    label.onmouseout = function() { this.style.background = ''; };
+                    var radio = document.createElement('input');
+                    radio.type = 'radio';
+                    radio.name = 'backup_choice';
+                    radio.value = b.name;
+                    radio.style.marginRight = '10px';
+                    if (i === 0) { radio.checked = true; hiddenInput.value = b.name; }
+                    radio.addEventListener('change', function() { hiddenInput.value = this.value; });
+                    label.appendChild(radio);
+                    var info = document.createElement('div');
+                    var nameStrong = document.createElement('strong');
+                    nameStrong.textContent = b.name;
+                    info.appendChild(nameStrong);
+                    var meta = document.createElement('div');
+                    meta.style.cssText = 'font-size:0.85em;color:#64748b;margin-top:2px;';
+                    meta.textContent = (b.size / 1048576).toFixed(1) + ' MB \u2014 ' + b.date;
+                    info.appendChild(meta);
+                    label.appendChild(info);
+                    list.appendChild(label);
+                });
+            }
+        })();
+        </script>
 SELECTOR;
 
-		/* Insert the selector before the extract step in the HTML */
+		/* Insert the selector into the extract panel */
 		$html = str_replace(
-			'<!-- Step: Extract -->',
-			$selectorHtml . "\n<!-- Step: Extract -->",
+			'<p class="mr-desc">Extract site-backup.zip into the current directory.</p>',
+			'<p class="mr-desc">Select a backup archive and extract it into the current directory.</p>' . "\n" . $selectorHtml,
+			$html
+		);
+
+		/* Pass selected backup file to the extract action */
+		$html = str_replace(
+			"const r = await post('extract', pw ? { archive_password: pw } : {});",
+			"var extraParams = {};\n" .
+			"    if (pw) extraParams.archive_password = pw;\n" .
+			"    var sel = document.getElementById('mr-backup-file');\n" .
+			"    if (sel && sel.value) extraParams.backup_file = sel.value;\n" .
+			"    const r = await post('extract', extraParams);",
 			$html
 		);
 
@@ -462,15 +511,31 @@ function actionPreflight(): array
         'hint'  => 'Informational',
     ];
 
+    $joomlaExists = file_exists(RESTORE_DIR . '/configuration.php')
+                 || file_exists(RESTORE_DIR . '/libraries/src/Version.php');
+    $checks[] = [
+        'label' => 'Existing Installation',
+        'value' => $joomlaExists ? 'Joomla detected' : 'Clean directory',
+        'ok'    => true,
+        'warn'  => $joomlaExists,
+        'hint'  => $joomlaExists
+            ? 'WARNING: A Joomla installation already exists in this directory. Restoring will overwrite it.'
+            : 'No existing installation found — safe to proceed',
+    ];
+
     $allOk = true;
+    $warnings = [];
 
     foreach ($checks as $c) {
         if (!$c['ok']) {
             $allOk = false;
         }
+        if (!empty($c['warn'])) {
+            $warnings[] = $c['hint'];
+        }
     }
 
-    return ['success' => $allOk, 'checks' => $checks];
+    return ['success' => $allOk, 'checks' => $checks, 'warnings' => $warnings];
 }
 
 function actionExtract(array $data): array
@@ -1425,6 +1490,7 @@ body{font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica N
 .mr-checks li:last-child{border-bottom:none}
 .mr-check-icon{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.75rem;font-weight:700;flex-shrink:0}
 .mr-check-ok{background:#dcfce7;color:#16a34a}
+.mr-check-warn{background:#fef9c3;color:#a16207}
 .mr-check-fail{background:#fef2f2;color:#dc2626}
 .mr-check-info{background:#e0f2fe;color:#0284c7}
 .mr-check-label{flex:1;font-weight:500}
@@ -1769,8 +1835,23 @@ async function post(action, extra) {
             form.append(k, v);
         }
     }
-    const res = await fetch('restore.php', { method: 'POST', body: form });
-    return res.json();
+    var res;
+    try {
+        res = await fetch('restore.php', { method: 'POST', body: form });
+    } catch (e) {
+        log('Network error: ' + e.message);
+        return { success: false, message: 'Network error: ' + e.message, checks: [] };
+    }
+    if (!res.ok) {
+        log('Server error: HTTP ' + res.status);
+        return { success: false, message: 'Server error (HTTP ' + res.status + ')', checks: [] };
+    }
+    try {
+        return await res.json();
+    } catch (e) {
+        log('Invalid response from server (not JSON)');
+        return { success: false, message: 'Invalid server response — check PHP error log', checks: [] };
+    }
 }
 
 function goStep(n) {
@@ -1845,42 +1926,66 @@ async function runPreflight() {
     setBtnLoading(btn, true);
     log('Running pre-flight checks...');
 
-    const r = await post('preflight');
-    const list = document.getElementById('checkList');
-    while (list.firstChild) list.removeChild(list.firstChild);
+    try {
+        const r = await post('preflight');
 
-    r.checks.forEach(function(c) {
-        const li = document.createElement('li');
-        const icon = document.createElement('span');
-        icon.className = 'mr-check-icon ' + (c.ok ? 'mr-check-ok' : 'mr-check-fail');
-        icon.textContent = c.ok ? '\u2713' : '\u2717';
+        if (!r.success && !r.checks.length) {
+            log('Pre-flight error: ' + (r.message || 'Unknown error'));
+            setBtnLoading(btn, false);
+            btn.textContent = 'Re-check';
+            setStatus('checkList', r.message || 'Pre-flight check failed', 'error');
+            return;
+        }
 
-        const label = document.createElement('span');
-        label.className = 'mr-check-label';
-        label.textContent = c.label;
+        const list = document.getElementById('checkList');
+        while (list.firstChild) list.removeChild(list.firstChild);
 
-        const val = document.createElement('span');
-        val.className = 'mr-check-value';
-        val.textContent = c.value;
+        r.checks.forEach(function(c) {
+            const li = document.createElement('li');
+            const icon = document.createElement('span');
+            var iconClass = c.ok ? 'mr-check-ok' : 'mr-check-fail';
+            if (c.warn) iconClass = 'mr-check-warn';
+            icon.className = 'mr-check-icon ' + iconClass;
+            icon.textContent = c.warn ? '\u26a0' : (c.ok ? '\u2713' : '\u2717');
 
-        li.appendChild(icon);
-        li.appendChild(label);
-        li.appendChild(val);
-        list.appendChild(li);
+            const label = document.createElement('span');
+            label.className = 'mr-check-label';
+            label.textContent = c.label;
 
-        log('  ' + (c.ok ? 'OK' : 'FAIL') + ': ' + c.label + ' = ' + c.value);
-    });
+            const val = document.createElement('span');
+            val.className = 'mr-check-value';
+            val.textContent = c.value;
 
-    setBtnLoading(btn, false);
+            li.appendChild(icon);
+            li.appendChild(label);
+            li.appendChild(val);
+            if (c.warn && c.hint) {
+                var hint = document.createElement('div');
+                hint.style.cssText = 'font-size:0.85em;color:#a16207;margin-top:4px;padding:4px 8px;background:#fef9c3;border-radius:4px;';
+                hint.textContent = c.hint;
+                li.appendChild(hint);
+            }
+            list.appendChild(li);
 
-    if (r.success) {
-        btn.textContent = 'Next \u2192';
-        btn.onclick = function() { goStep(2); };
-        btn.className = 'mr-btn mr-btn-success';
-        log('All checks passed');
-    } else {
+            var logPrefix = c.warn ? 'WARN' : (c.ok ? 'OK' : 'FAIL');
+            log('  ' + logPrefix + ': ' + c.label + ' = ' + c.value);
+        });
+
+        setBtnLoading(btn, false);
+
+        if (r.success) {
+            btn.textContent = 'Next \u2192';
+            btn.onclick = function() { goStep(2); };
+            btn.className = 'mr-btn mr-btn-success';
+            log('All checks passed');
+        } else {
+            btn.textContent = 'Re-check';
+            log('Some checks failed');
+        }
+    } catch (e) {
+        log('Pre-flight error: ' + e.message);
+        setBtnLoading(btn, false);
         btn.textContent = 'Re-check';
-        log('Some checks failed');
     }
 }
 

source/packages/com_mokosuitebackup/tmpl/backups/default.php

@@ -42,6 +42,7 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 						<select id="mb-profile-select" class="form-select" style="max-width:300px;">
 							<?php foreach ($this->profiles as $profile) : ?>
 								<option value="<?php echo (int) $profile->id; ?>">
+									#<?php echo (int) $profile->id; ?> —
 									<?php echo $this->escape($profile->title); ?>
 									(<?php echo $this->escape($profile->backup_type); ?>)
 								</option>
@@ -188,18 +189,24 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 </form>
 
 <!-- Stepped Backup Modal (for shared hosting) -->
-<div id="mokosuitebackup-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
-	<div style="max-width:500px; margin:10% auto; background:#fff; border-radius:8px; padding:2rem; box-shadow:0 4px 20px rgba(0,0,0,0.3);">
-		<h3 id="mb-modal-title" style="margin:0 0 1rem;">Backup in Progress</h3>
-		<div class="alert alert-warning py-1 px-2 mb-2" style="font-size:0.85rem;">
-			<span class="icon-warning-circle" aria-hidden="true"></span>
-			<strong>Do not navigate away or close this window</strong> while the backup is running.
+<div class="modal fade" id="mokosuitebackup-modal" tabindex="-1" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
+	<div class="modal-dialog">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title" id="mb-modal-title">Backup in Progress</h5>
+			</div>
+			<div class="modal-body">
+				<div class="alert alert-warning py-1 px-2 mb-2" style="font-size:0.85rem;">
+					<span class="icon-warning-circle" aria-hidden="true"></span>
+					<strong>Do not navigate away or close this window</strong> while the backup is running.
+				</div>
+				<div class="progress mb-2" style="height:24px;">
+					<div id="mb-progress-bar" class="progress-bar" role="progressbar" style="width:0%;">0%</div>
+				</div>
+				<p id="mb-status" class="text-muted mb-1" style="font-size:0.9rem;">Initializing...</p>
+				<p id="mb-phase" class="text-muted mb-0" style="font-size:0.8rem;">Phase: init</p>
+			</div>
 		</div>
-		<div style="background:#e9ecef; border-radius:4px; overflow:hidden; height:24px; margin-bottom:0.5rem;">
-			<div id="mb-progress-bar" style="height:100%; background:#0d6efd; transition:width 0.3s; width:0%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:0.8rem; font-weight:bold;">0%</div>
-		</div>
-		<p id="mb-status" style="color:#666; font-size:0.9rem; margin:0.5rem 0;">Initializing...</p>
-		<p id="mb-phase" style="color:#999; font-size:0.8rem; margin:0;">Phase: init</p>
 	</div>
 </div>
 
@@ -235,12 +242,12 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 
 	function showModal() {
 		backupRunning = true;
-		document.getElementById('mokosuitebackup-modal').style.display = 'block';
+		bootstrap.Modal.getOrCreateInstance(document.getElementById('mokosuitebackup-modal')).show();
 	}
 
 	function hideModal() {
 		backupRunning = false;
-		document.getElementById('mokosuitebackup-modal').style.display = 'none';
+		bootstrap.Modal.getInstance(document.getElementById('mokosuitebackup-modal'))?.hide();
 	}
 
 	function updateProgress(progress, message, phase) {
@@ -344,31 +351,26 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 					return false;
 				}
 				document.getElementById('mb-restore-record-id').value = checked[0].value;
-				document.getElementById('mb-restore-modal').style.display = 'block';
+				bootstrap.Modal.getOrCreateInstance(document.getElementById('mb-restore-modal')).show();
 				return false;
 			}, true);
 		}
 	});
 
-	// Close restore modal
-	document.addEventListener('click', function(e) {
-		if (e.target.classList.contains('mb-restore-close') || e.target.id === 'mb-restore-modal') {
-			document.getElementById('mb-restore-modal').style.display = 'none';
-		}
-	});
+	// Close restore modal handled by Bootstrap data-bs-dismiss
 
 	// AJAX stepped restore
 	var restoreRunning = false;
 
 	function showRestoreProgress() {
 		restoreRunning = true;
-		document.getElementById('mb-restore-modal').style.display = 'none';
-		document.getElementById('mb-restore-progress-modal').style.display = 'block';
+		bootstrap.Modal.getInstance(document.getElementById('mb-restore-modal'))?.hide();
+		bootstrap.Modal.getOrCreateInstance(document.getElementById('mb-restore-progress-modal')).show();
 	}
 
 	function hideRestoreProgress() {
 		restoreRunning = false;
-		document.getElementById('mb-restore-progress-modal').style.display = 'none';
+		bootstrap.Modal.getInstance(document.getElementById('mb-restore-progress-modal'))?.hide();
 	}
 
 	function updateRestoreProgress(progress, message, phase) {
@@ -466,7 +468,7 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 		var modal = document.getElementById('mb-log-modal');
 		var body = document.getElementById('mb-log-body');
 		body.textContent = 'Loading...';
-		modal.style.display = 'block';
+		bootstrap.Modal.getOrCreateInstance(modal).show();
 
 		var form = new URLSearchParams();
 		form.append('task', 'ajax.viewLog');
@@ -491,11 +493,7 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 		});
 	});
 
-	document.addEventListener('click', function(e) {
-		if (e.target.id === 'mb-log-modal' || e.target.classList.contains('mb-log-close')) {
-			document.getElementById('mb-log-modal').style.display = 'none';
-		}
-	});
+	// Log modal close handled by Bootstrap data-bs-dismiss
 
 	// Browse Archive modal handler
 	function formatFileSize(bytes) {
@@ -551,7 +549,7 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 		var summary = document.getElementById('mb-browse-summary');
 		browseSetMessage(tbody, 'Loading...');
 		summary.textContent = '';
-		modal.style.display = 'block';
+		bootstrap.Modal.getOrCreateInstance(modal).show();
 
 		postAjax({ task: 'ajax.browseArchive', id: recordId })
 		.then(function(data) {
@@ -578,119 +576,127 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 		});
 	});
 
-	document.addEventListener('click', function(e) {
-		if (e.target.id === 'mb-browse-modal' || e.target.classList.contains('mb-browse-close')) {
-			document.getElementById('mb-browse-modal').style.display = 'none';
-		}
-	});
+	// Browse modal close handled by Bootstrap data-bs-dismiss
 })();
 </script>
 
 <!-- Restore Confirmation Modal -->
-<div id="mb-restore-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
-	<div style="max-width:500px; margin:8% auto; background:#fff; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.3);">
-		<div style="display:flex; justify-content:space-between; align-items:center; padding:1rem 1.5rem; border-bottom:1px solid #dee2e6;">
-			<h4 style="margin:0;"><?php echo Text::_('COM_MOKOJOOMBACKUP_TOOLBAR_RESTORE'); ?></h4>
-			<button type="button" class="btn-close mb-restore-close" aria-label="Close"></button>
+<div class="modal fade" id="mb-restore-modal" tabindex="-1" aria-hidden="true">
+	<div class="modal-dialog">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title"><?php echo Text::_('COM_MOKOJOOMBACKUP_TOOLBAR_RESTORE'); ?></h5>
+				<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+			</div>
+			<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=backups.restore'); ?>" method="post" id="mb-restore-form">
+				<input type="hidden" name="id" id="mb-restore-record-id" value="">
+				<div class="modal-body">
+					<div class="alert alert-danger">
+						<span class="icon-warning-circle" aria-hidden="true"></span>
+						<strong><?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_CONFIRM'); ?></strong>
+					</div>
+
+					<div class="mb-3">
+						<div class="form-check">
+							<input class="form-check-input" type="checkbox" name="restore_files" value="1" id="mb-restore-files" checked>
+							<label class="form-check-label" for="mb-restore-files">
+								<?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_FILES'); ?>
+							</label>
+						</div>
+						<div class="form-check">
+							<input class="form-check-input" type="checkbox" name="restore_db" value="1" id="mb-restore-db" checked>
+							<label class="form-check-label" for="mb-restore-db">
+								<?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_DATABASE'); ?>
+							</label>
+						</div>
+						<div class="form-check">
+							<input class="form-check-input" type="checkbox" name="preserve_config" value="1" id="mb-restore-config" checked>
+							<label class="form-check-label" for="mb-restore-config">
+								<?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_PRESERVE_CONFIG'); ?>
+								<small class="text-muted d-block"><?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_PRESERVE_CONFIG_DESC'); ?></small>
+							</label>
+						</div>
+					</div>
+
+					<div class="mb-3">
+						<label for="mb-restore-password" class="form-label"><?php echo Text::_('COM_MOKOJOOMBACKUP_FIELD_ENCRYPTION_PASSWORD'); ?></label>
+						<input type="password" class="form-control" id="mb-restore-password" name="encryption_password"
+							   placeholder="<?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_PASSWORD_PLACEHOLDER'); ?>" autocomplete="off">
+					</div>
+				</div>
+				<div class="modal-footer">
+					<button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><?php echo Text::_('JCANCEL'); ?></button>
+					<button type="submit" class="btn btn-danger">
+						<span class="icon-upload" aria-hidden="true"></span>
+						<?php echo Text::_('COM_MOKOJOOMBACKUP_TOOLBAR_RESTORE'); ?>
+					</button>
+				</div>
+				<?php echo HTMLHelper::_('form.token'); ?>
+			</form>
 		</div>
-		<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=backups.restore'); ?>" method="post" id="mb-restore-form">
-			<input type="hidden" name="id" id="mb-restore-record-id" value="">
-			<div style="padding:1.5rem;">
-				<div class="alert alert-danger">
-					<span class="icon-warning-circle" aria-hidden="true"></span>
-					<strong><?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_CONFIRM'); ?></strong>
-				</div>
-
-				<div class="mb-3">
-					<div class="form-check">
-						<input class="form-check-input" type="checkbox" name="restore_files" value="1" id="mb-restore-files" checked>
-						<label class="form-check-label" for="mb-restore-files">
-							<?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_FILES'); ?>
-						</label>
-					</div>
-					<div class="form-check">
-						<input class="form-check-input" type="checkbox" name="restore_db" value="1" id="mb-restore-db" checked>
-						<label class="form-check-label" for="mb-restore-db">
-							<?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_DATABASE'); ?>
-						</label>
-					</div>
-					<div class="form-check">
-						<input class="form-check-input" type="checkbox" name="preserve_config" value="1" id="mb-restore-config" checked>
-						<label class="form-check-label" for="mb-restore-config">
-							<?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_PRESERVE_CONFIG'); ?>
-							<small class="text-muted d-block"><?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_PRESERVE_CONFIG_DESC'); ?></small>
-						</label>
-					</div>
-				</div>
-
-				<div class="mb-3">
-					<label for="mb-restore-password" class="form-label"><?php echo Text::_('COM_MOKOJOOMBACKUP_FIELD_ENCRYPTION_PASSWORD'); ?></label>
-					<input type="password" class="form-control" id="mb-restore-password" name="encryption_password"
-						   placeholder="<?php echo Text::_('COM_MOKOJOOMBACKUP_RESTORE_PASSWORD_PLACEHOLDER'); ?>" autocomplete="off">
-				</div>
-			</div>
-			<div style="padding:0 1.5rem 1.5rem; text-align:right;">
-				<button type="button" class="btn btn-secondary mb-restore-close"><?php echo Text::_('JCANCEL'); ?></button>
-				<button type="submit" class="btn btn-danger">
-					<span class="icon-upload" aria-hidden="true"></span>
-					<?php echo Text::_('COM_MOKOJOOMBACKUP_TOOLBAR_RESTORE'); ?>
-				</button>
-			</div>
-			<?php echo HTMLHelper::_('form.token'); ?>
-		</form>
-	</div>
 </div>
 
 <!-- Restore Progress Modal -->
-<div id="mb-restore-progress-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
-	<div style="max-width:500px; margin:10% auto; background:#fff; border-radius:8px; padding:2rem; box-shadow:0 4px 20px rgba(0,0,0,0.3);">
-		<h3 id="mb-restore-title" style="margin:0 0 1rem;">Restore in Progress</h3>
-		<div style="background:#e9ecef; border-radius:4px; overflow:hidden; height:24px; margin-bottom:0.5rem;">
-			<div id="mb-restore-progress-bar" style="height:100%; background:#dc3545; transition:width 0.3s; width:0%; display:flex; align-items:center; justify-content:center; color:#fff; font-size:0.8rem; font-weight:bold;">0%</div>
+<div class="modal fade" id="mb-restore-progress-modal" tabindex="-1" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
+	<div class="modal-dialog">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title" id="mb-restore-title">Restore in Progress</h5>
+			</div>
+			<div class="modal-body">
+				<div class="progress mb-2" style="height:24px;">
+					<div id="mb-restore-progress-bar" class="progress-bar bg-danger" role="progressbar" style="width:0%;">0%</div>
+				</div>
+				<p id="mb-restore-status" class="text-muted mb-1" style="font-size:0.9rem;">Initializing...</p>
+				<p id="mb-restore-phase" class="text-muted mb-0" style="font-size:0.8rem;">Phase: init</p>
+			</div>
 		</div>
-		<p id="mb-restore-status" style="color:#666; font-size:0.9rem; margin:0.5rem 0;">Initializing...</p>
-		<p id="mb-restore-phase" style="color:#999; font-size:0.8rem; margin:0;">Phase: init</p>
 	</div>
 </div>
 
 <!-- Log Viewer Modal -->
-<div id="mb-log-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
-	<div style="max-width:700px; margin:5% auto; background:#fff; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.3); display:flex; flex-direction:column; max-height:80vh;">
-		<div style="display:flex; justify-content:space-between; align-items:center; padding:1rem 1.5rem; border-bottom:1px solid #dee2e6;">
-			<h4 style="margin:0;"><?php echo Text::_('COM_MOKOJOOMBACKUP_VIEW_LOG'); ?></h4>
-			<button type="button" class="btn-close mb-log-close" aria-label="Close"></button>
+<div class="modal fade" id="mb-log-modal" tabindex="-1" aria-hidden="true">
+	<div class="modal-dialog modal-lg">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title"><?php echo Text::_('COM_MOKOJOOMBACKUP_VIEW_LOG'); ?></h5>
+				<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+			</div>
+			<div class="modal-body" style="max-height:60vh; overflow-y:auto;">
+				<pre id="mb-log-body" style="white-space:pre-wrap; word-break:break-word; font-size:0.85rem; margin:0; background:#f8f9fa; padding:1rem; border-radius:4px;"></pre>
+			</div>
 		</div>
-		<div style="padding:1rem 1.5rem; overflow-y:auto; flex:1;">
-			<pre id="mb-log-body" style="white-space:pre-wrap; word-break:break-word; font-size:0.85rem; margin:0; background:#f8f9fa; padding:1rem; border-radius:4px;"></pre>
-		</div>
-	</div>
 </div>
 
 <!-- Archive Browser Modal -->
-<div id="mb-browse-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
-	<div style="max-width:800px; margin:5% auto; background:#fff; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.3); display:flex; flex-direction:column; max-height:80vh;">
-		<div style="display:flex; justify-content:space-between; align-items:center; padding:1rem 1.5rem; border-bottom:1px solid #dee2e6;">
-			<h4 style="margin:0;">
-				<span class="icon-folder-open" aria-hidden="true"></span>
-				<?php echo Text::_('COM_MOKOJOOMBACKUP_BROWSE_ARCHIVE'); ?>
-			</h4>
-			<button type="button" class="btn-close mb-browse-close" aria-label="Close"></button>
-		</div>
-		<div style="padding:0.75rem 1.5rem; border-bottom:1px solid #dee2e6; background:#f8f9fa;">
-			<small id="mb-browse-summary" class="text-muted"></small>
-		</div>
-		<div style="padding:0; overflow-y:auto; flex:1;">
-			<table class="table table-sm table-striped mb-0">
-				<thead>
-					<tr>
-						<th><?php echo Text::_('COM_MOKOJOOMBACKUP_BROWSE_COL_NAME'); ?></th>
-						<th class="text-end" style="width:100px;"><?php echo Text::_('COM_MOKOJOOMBACKUP_BROWSE_COL_SIZE'); ?></th>
-						<th class="text-end" style="width:120px;"><?php echo Text::_('COM_MOKOJOOMBACKUP_BROWSE_COL_COMPRESSED'); ?></th>
-					</tr>
-				</thead>
-				<tbody id="mb-browse-tbody">
-				</tbody>
-			</table>
+<div class="modal fade" id="mb-browse-modal" tabindex="-1" aria-hidden="true">
+	<div class="modal-dialog modal-lg">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title">
+					<span class="icon-folder-open" aria-hidden="true"></span>
+					<?php echo Text::_('COM_MOKOJOOMBACKUP_BROWSE_ARCHIVE'); ?>
+				</h5>
+				<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+			</div>
+			<div class="modal-body p-0">
+				<div class="px-3 py-2 bg-light border-bottom">
+					<small id="mb-browse-summary" class="text-muted"></small>
+				</div>
+				<div style="max-height:60vh; overflow-y:auto;">
+					<table class="table table-sm table-striped mb-0">
+						<thead>
+							<tr>
+								<th><?php echo Text::_('COM_MOKOJOOMBACKUP_BROWSE_COL_NAME'); ?></th>
+								<th class="text-end" style="width:100px;"><?php echo Text::_('COM_MOKOJOOMBACKUP_BROWSE_COL_SIZE'); ?></th>
+								<th class="text-end" style="width:120px;"><?php echo Text::_('COM_MOKOJOOMBACKUP_BROWSE_COL_COMPRESSED'); ?></th>
+							</tr>
+						</thead>
+						<tbody id="mb-browse-tbody">
+						</tbody>
+					</table>
+				</div>
+			</div>
 		</div>
 	</div>
 </div>
@@ -698,69 +704,73 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 <!-- Purge Backups Modal -->
 <?php $canDelete = $user->authorise('core.delete', 'com_mokosuitebackup'); ?>
 <?php if ($canDelete) : ?>
-<div id="mb-purge-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
-	<div style="max-width:500px; margin:8% auto; background:#fff; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.3);">
-		<div style="display:flex; justify-content:space-between; align-items:center; padding:1rem 1.5rem; border-bottom:1px solid #dee2e6;">
-			<h4 style="margin:0;">
-				<span class="icon-trash" aria-hidden="true"></span>
-				<?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_TITLE'); ?>
-			</h4>
-			<button type="button" class="btn-close mb-purge-close" aria-label="Close"></button>
-		</div>
-		<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=backups.purge'); ?>" method="post" id="mb-purge-form">
-			<div style="padding:1.5rem;">
-				<p><?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_DESC'); ?></p>
-				<div class="mb-3">
-					<label for="mb-purge-date" class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_DATE_LABEL'); ?></label>
-					<input type="date" class="form-control" id="mb-purge-date" name="purge_date" required>
-				</div>
-				<div id="mb-purge-count-wrapper" style="display:none;">
-					<div class="alert alert-danger mb-0" id="mb-purge-count-msg"></div>
-				</div>
-				<div id="mb-purge-none-wrapper" style="display:none;">
-					<div class="alert alert-info mb-0"><?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_NONE_FOUND'); ?></div>
-				</div>
-			</div>
-			<div style="padding:0 1.5rem 1.5rem; text-align:right;">
-				<button type="button" class="btn btn-secondary mb-purge-close"><?php echo Text::_('JCANCEL'); ?></button>
-				<button type="submit" class="btn btn-danger" id="mb-purge-submit" disabled>
+<div class="modal fade" id="mb-purge-modal" tabindex="-1" aria-hidden="true">
+	<div class="modal-dialog">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title">
 					<span class="icon-trash" aria-hidden="true"></span>
-					<?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_SUBMIT'); ?>
-				</button>
+					<?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_TITLE'); ?>
+				</h5>
+				<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
 			</div>
-			<?php echo HTMLHelper::_('form.token'); ?>
-		</form>
+			<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=backups.purge'); ?>" method="post" id="mb-purge-form">
+				<div class="modal-body">
+					<p><?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_DESC'); ?></p>
+					<div class="mb-3">
+						<label for="mb-purge-date" class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_DATE_LABEL'); ?></label>
+						<input type="date" class="form-control" id="mb-purge-date" name="purge_date" required>
+					</div>
+					<div id="mb-purge-count-wrapper" style="display:none;">
+						<div class="alert alert-danger mb-0" id="mb-purge-count-msg"></div>
+					</div>
+					<div id="mb-purge-none-wrapper" style="display:none;">
+						<div class="alert alert-info mb-0"><?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_NONE_FOUND'); ?></div>
+					</div>
+				</div>
+				<div class="modal-footer">
+					<button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><?php echo Text::_('JCANCEL'); ?></button>
+					<button type="submit" class="btn btn-danger" id="mb-purge-submit" disabled>
+						<span class="icon-trash" aria-hidden="true"></span>
+						<?php echo Text::_('COM_MOKOJOOMBACKUP_PURGE_SUBMIT'); ?>
+					</button>
+				</div>
+				<?php echo HTMLHelper::_('form.token'); ?>
+			</form>
+		</div>
 	</div>
 </div>
 <?php endif; ?>
 
 <!-- Backup Comparison Modal -->
-<div id="mb-compare-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
-	<div style="max-width:800px; margin:5% auto; background:#fff; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.3); display:flex; flex-direction:column; max-height:85vh;">
-		<div style="display:flex; justify-content:space-between; align-items:center; padding:1rem 1.5rem; border-bottom:1px solid #dee2e6;">
-			<h4 style="margin:0;">
-				<span class="icon-copy" aria-hidden="true"></span>
-				<?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_TITLE'); ?>
-			</h4>
-			<button type="button" class="btn-close mb-compare-close" aria-label="Close"></button>
-		</div>
-		<div style="padding:1rem 1.5rem; overflow-y:auto; flex:1;">
-			<div id="mb-compare-loading" style="text-align:center; padding:2rem;">
-				<span class="icon-spinner icon-spin" aria-hidden="true"></span>
-				<?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_LOADING'); ?>
+<div class="modal fade" id="mb-compare-modal" tabindex="-1" aria-hidden="true">
+	<div class="modal-dialog modal-lg">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title">
+					<span class="icon-copy" aria-hidden="true"></span>
+					<?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_TITLE'); ?>
+				</h5>
+				<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+			</div>
+			<div class="modal-body" style="max-height:65vh; overflow-y:auto;">
+				<div id="mb-compare-loading" class="text-center py-4">
+					<span class="icon-spinner icon-spin" aria-hidden="true"></span>
+					<?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_LOADING'); ?>
+				</div>
+				<div id="mb-compare-error" style="display:none;" class="alert alert-danger"></div>
+				<table id="mb-compare-table" class="table table-striped" style="display:none;">
+					<thead>
+						<tr>
+							<th><?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_FIELD'); ?></th>
+							<th><?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_BACKUP'); ?> 1</th>
+							<th><?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_BACKUP'); ?> 2</th>
+							<th><?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_DELTA'); ?></th>
+						</tr>
+					</thead>
+					<tbody id="mb-compare-body"></tbody>
+				</table>
 			</div>
-			<div id="mb-compare-error" style="display:none;" class="alert alert-danger"></div>
-			<table id="mb-compare-table" class="table table-striped" style="display:none;">
-				<thead>
-					<tr>
-						<th><?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_FIELD'); ?></th>
-						<th><?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_BACKUP'); ?> 1</th>
-						<th><?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_BACKUP'); ?> 2</th>
-						<th><?php echo Text::_('COM_MOKOJOOMBACKUP_COMPARE_DELTA'); ?></th>
-					</tr>
-				</thead>
-				<tbody id="mb-compare-body"></tbody>
-			</table>
 		</div>
 	</div>
 </div>
@@ -807,7 +817,7 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 		var table = document.getElementById('mb-compare-table');
 		var body = document.getElementById('mb-compare-body');
 
-		modal.style.display = 'block';
+		bootstrap.Modal.getOrCreateInstance(modal).show();
 		loading.style.display = 'block';
 		errorEl.style.display = 'none';
 		table.style.display = 'none';
@@ -874,12 +884,7 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 		});
 	}
 
-	// Close compare modal
-	document.addEventListener('click', function(e) {
-		if (e.target.id === 'mb-compare-modal' || e.target.classList.contains('mb-compare-close')) {
-			document.getElementById('mb-compare-modal').style.display = 'none';
-		}
-	});
+	// Compare modal close handled by Bootstrap data-bs-dismiss
 
 	// Intercept Compare toolbar button
 	document.addEventListener('DOMContentLoaded', function() {
@@ -922,7 +927,7 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 				document.getElementById('mb-purge-count-wrapper').style.display = 'none';
 				document.getElementById('mb-purge-none-wrapper').style.display = 'none';
 				document.getElementById('mb-purge-submit').disabled = true;
-				document.getElementById('mb-purge-modal').style.display = 'block';
+				bootstrap.Modal.getOrCreateInstance(document.getElementById('mb-purge-modal')).show();
 				return false;
 			}, true);
 		}
@@ -936,12 +941,7 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 			});
 		}
 
-		// Close modal
-		document.addEventListener('click', function(e) {
-			if (e.target.id === 'mb-purge-modal' || e.target.classList.contains('mb-purge-close')) {
-				document.getElementById('mb-purge-modal').style.display = 'none';
-			}
-		});
+		// Purge modal close handled by Bootstrap data-bs-dismiss
 
 		// Confirm on submit
 		var purgeForm = document.getElementById('mb-purge-form');

source/packages/com_mokosuitebackup/tmpl/dashboard/default.php

@@ -238,6 +238,7 @@ document.querySelectorAll('.mb-tile').forEach(function(tile) {
 					<select id="mb-profile-select" class="form-select mb-2">
 						<?php foreach ($this->profiles as $profile) : ?>
 							<option value="<?php echo (int) $profile->id; ?>">
+								#<?php echo (int) $profile->id; ?> —
 								<?php echo $this->escape($profile->title); ?>
 								(<?php echo $this->escape($profile->backup_type); ?>)
 							</option>

source/packages/com_mokosuitebackup/tmpl/snapshots/default.php

@@ -132,117 +132,121 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 </form>
 
 <!-- Create Snapshot Modal -->
-<div id="mb-snapshot-create-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
-	<div style="max-width:500px; margin:8% auto; background:#fff; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.3);">
-		<div style="display:flex; justify-content:space-between; align-items:center; padding:1rem 1.5rem; border-bottom:1px solid #dee2e6;">
-			<h4 style="margin:0;"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_CREATE'); ?></h4>
-			<button type="button" class="btn-close mb-modal-close" aria-label="Close"></button>
+<div class="modal fade" id="mb-snapshot-create-modal" tabindex="-1" aria-hidden="true">
+	<div class="modal-dialog">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_CREATE'); ?></h5>
+				<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+			</div>
+			<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=snapshots.create'); ?>" method="post" id="mb-snapshot-create-form">
+				<div class="modal-body">
+					<div class="mb-3">
+						<label for="mb-snap-desc" class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_HEADING_DESCRIPTION'); ?></label>
+						<input type="text" class="form-control" id="mb-snap-desc" name="description" placeholder="<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_DESC_PLACEHOLDER'); ?>">
+					</div>
+					<div class="mb-3">
+						<label class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_SELECT_TYPES'); ?></label>
+						<div class="form-check">
+							<input class="form-check-input" type="checkbox" name="content_types[]" value="articles" id="mb-snap-articles" checked>
+							<label class="form-check-label" for="mb-snap-articles">
+								<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_ARTICLES'); ?>
+								<small class="text-muted">(<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_ARTICLES_DESC'); ?>)</small>
+							</label>
+						</div>
+						<div class="form-check">
+							<input class="form-check-input" type="checkbox" name="content_types[]" value="categories" id="mb-snap-categories" checked>
+							<label class="form-check-label" for="mb-snap-categories">
+								<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_CATEGORIES'); ?>
+								<small class="text-muted">(<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_CATEGORIES_DESC'); ?>)</small>
+							</label>
+						</div>
+						<div class="form-check">
+							<input class="form-check-input" type="checkbox" name="content_types[]" value="modules" id="mb-snap-modules" checked>
+							<label class="form-check-label" for="mb-snap-modules">
+								<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODULES'); ?>
+								<small class="text-muted">(<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODULES_DESC'); ?>)</small>
+							</label>
+						</div>
+					</div>
+				</div>
+				<div class="modal-footer">
+					<button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><?php echo Text::_('JCANCEL'); ?></button>
+					<button type="submit" class="btn btn-primary">
+						<span class="icon-camera" aria-hidden="true"></span>
+						<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_CREATE'); ?>
+					</button>
+				</div>
+				<?php echo HTMLHelper::_('form.token'); ?>
+			</form>
 		</div>
-		<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=snapshots.create'); ?>" method="post" id="mb-snapshot-create-form">
-			<div style="padding:1.5rem;">
-				<div class="mb-3">
-					<label for="mb-snap-desc" class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_HEADING_DESCRIPTION'); ?></label>
-					<input type="text" class="form-control" id="mb-snap-desc" name="description" placeholder="<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_DESC_PLACEHOLDER'); ?>">
-				</div>
-				<div class="mb-3">
-					<label class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_SELECT_TYPES'); ?></label>
-					<div class="form-check">
-						<input class="form-check-input" type="checkbox" name="content_types[]" value="articles" id="mb-snap-articles" checked>
-						<label class="form-check-label" for="mb-snap-articles">
-							<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_ARTICLES'); ?>
-							<small class="text-muted">(<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_ARTICLES_DESC'); ?>)</small>
-						</label>
-					</div>
-					<div class="form-check">
-						<input class="form-check-input" type="checkbox" name="content_types[]" value="categories" id="mb-snap-categories" checked>
-						<label class="form-check-label" for="mb-snap-categories">
-							<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_CATEGORIES'); ?>
-							<small class="text-muted">(<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_CATEGORIES_DESC'); ?>)</small>
-						</label>
-					</div>
-					<div class="form-check">
-						<input class="form-check-input" type="checkbox" name="content_types[]" value="modules" id="mb-snap-modules" checked>
-						<label class="form-check-label" for="mb-snap-modules">
-							<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODULES'); ?>
-							<small class="text-muted">(<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODULES_DESC'); ?>)</small>
-						</label>
-					</div>
-				</div>
-			</div>
-			<div style="padding:0 1.5rem 1.5rem; text-align:right;">
-				<button type="button" class="btn btn-secondary mb-modal-close"><?php echo Text::_('JCANCEL'); ?></button>
-				<button type="submit" class="btn btn-primary">
-					<span class="icon-camera" aria-hidden="true"></span>
-					<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_CREATE'); ?>
-				</button>
-			</div>
-			<?php echo HTMLHelper::_('form.token'); ?>
-		</form>
 	</div>
 </div>
 
 <!-- Restore Snapshot Modal -->
-<div id="mb-snapshot-restore-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
-	<div style="max-width:500px; margin:8% auto; background:#fff; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.3);">
-		<div style="display:flex; justify-content:space-between; align-items:center; padding:1rem 1.5rem; border-bottom:1px solid #dee2e6;">
-			<h4 style="margin:0;"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE'); ?></h4>
-			<button type="button" class="btn-close mb-modal-close" aria-label="Close"></button>
+<div class="modal fade" id="mb-snapshot-restore-modal" tabindex="-1" aria-hidden="true">
+	<div class="modal-dialog">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE'); ?></h5>
+				<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+			</div>
+			<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=snapshots.restore'); ?>" method="post" id="mb-snapshot-restore-form">
+				<input type="hidden" name="id" id="mb-restore-id" value="">
+				<div class="modal-body">
+					<p id="mb-restore-desc" class="fw-bold"></p>
+
+					<div class="mb-3">
+						<label class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE_MODE'); ?></label>
+						<div class="form-check">
+							<input class="form-check-input" type="radio" name="restore_mode" value="replace" id="mb-mode-replace" checked>
+							<label class="form-check-label" for="mb-mode-replace">
+								<strong><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODE_REPLACE'); ?></strong>
+								<br><small class="text-muted"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODE_REPLACE_DESC'); ?></small>
+							</label>
+						</div>
+						<div class="form-check mt-2">
+							<input class="form-check-input" type="radio" name="restore_mode" value="merge" id="mb-mode-merge">
+							<label class="form-check-label" for="mb-mode-merge">
+								<strong><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODE_MERGE'); ?></strong>
+								<br><small class="text-muted"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODE_MERGE_DESC'); ?></small>
+							</label>
+						</div>
+					</div>
+
+					<div class="mb-3" id="mb-restore-types-container">
+						<label class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE_TYPES'); ?></label>
+					</div>
+
+					<div class="alert alert-warning mb-0" id="mb-replace-warning">
+						<span class="icon-warning-circle" aria-hidden="true"></span>
+						<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_REPLACE_WARNING'); ?>
+					</div>
+				</div>
+				<div class="modal-footer">
+					<button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><?php echo Text::_('JCANCEL'); ?></button>
+					<button type="submit" class="btn btn-danger">
+						<span class="icon-upload" aria-hidden="true"></span>
+						<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE'); ?>
+					</button>
+				</div>
+				<?php echo HTMLHelper::_('form.token'); ?>
+			</form>
 		</div>
-		<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=snapshots.restore'); ?>" method="post" id="mb-snapshot-restore-form">
-			<input type="hidden" name="id" id="mb-restore-id" value="">
-			<div style="padding:1.5rem;">
-				<p id="mb-restore-desc" class="fw-bold"></p>
-
-				<div class="mb-3">
-					<label class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE_MODE'); ?></label>
-					<div class="form-check">
-						<input class="form-check-input" type="radio" name="restore_mode" value="replace" id="mb-mode-replace" checked>
-						<label class="form-check-label" for="mb-mode-replace">
-							<strong><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODE_REPLACE'); ?></strong>
-							<br><small class="text-muted"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODE_REPLACE_DESC'); ?></small>
-						</label>
-					</div>
-					<div class="form-check mt-2">
-						<input class="form-check-input" type="radio" name="restore_mode" value="merge" id="mb-mode-merge">
-						<label class="form-check-label" for="mb-mode-merge">
-							<strong><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODE_MERGE'); ?></strong>
-							<br><small class="text-muted"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_MODE_MERGE_DESC'); ?></small>
-						</label>
-					</div>
-				</div>
-
-				<div class="mb-3" id="mb-restore-types-container">
-					<label class="form-label fw-bold"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE_TYPES'); ?></label>
-					<!-- Populated by JS from data-types -->
-				</div>
-
-				<div class="alert alert-warning mb-0" id="mb-replace-warning">
-					<span class="icon-warning-circle" aria-hidden="true"></span>
-					<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_REPLACE_WARNING'); ?>
-				</div>
-			</div>
-			<div style="padding:0 1.5rem 1.5rem; text-align:right;">
-				<button type="button" class="btn btn-secondary mb-modal-close"><?php echo Text::_('JCANCEL'); ?></button>
-				<button type="submit" class="btn btn-danger">
-					<span class="icon-upload" aria-hidden="true"></span>
-					<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE'); ?>
-				</button>
-			</div>
-			<?php echo HTMLHelper::_('form.token'); ?>
-		</form>
 	</div>
 </div>
 
 <!-- Browse Snapshot Detail Modal -->
-<div id="mb-snapshot-browse-modal" style="display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.6); z-index:10000;">
-	<div style="max-width:800px; margin:5% auto; background:#fff; border-radius:8px; box-shadow:0 4px 20px rgba(0,0,0,0.3); max-height:80vh; display:flex; flex-direction:column;">
-		<div style="display:flex; justify-content:space-between; align-items:center; padding:1rem 1.5rem; border-bottom:1px solid #dee2e6;">
-			<h4 style="margin:0;" id="mb-browse-title"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_BROWSE'); ?></h4>
-			<button type="button" class="btn-close mb-modal-close" aria-label="Close"></button>
-		</div>
-		<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=snapshots.restoreSelected'); ?>" method="post" id="mb-snapshot-browse-form">
-			<input type="hidden" name="id" id="mb-browse-id" value="">
-			<div style="padding:1rem 1.5rem; overflow-y:auto; flex:1;">
+<div class="modal fade" id="mb-snapshot-browse-modal" tabindex="-1" aria-hidden="true">
+	<div class="modal-dialog modal-xl">
+		<div class="modal-content">
+			<div class="modal-header">
+				<h5 class="modal-title" id="mb-browse-title"><?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_BROWSE'); ?></h5>
+				<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
+			</div>
+			<form action="<?php echo Route::_('index.php?option=com_mokosuitebackup&task=snapshots.restoreSelected'); ?>" method="post" id="mb-snapshot-browse-form">
+				<input type="hidden" name="id" id="mb-browse-id" value="">
+				<div class="modal-body" style="max-height:60vh; overflow-y:auto;">
 				<div id="mb-browse-loading" class="text-center py-4">
 					<span class="spinner-border spinner-border-sm" role="status"></span>
 					<?php echo Text::_('COM_MOKOJOOMBACKUP_LOADING'); ?>
@@ -331,8 +335,8 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 					</div>
 				</div>
 			</div>
-			<div style="padding:0.75rem 1.5rem; border-top:1px solid #dee2e6; text-align:right;">
-				<button type="button" class="btn btn-secondary mb-modal-close"><?php echo Text::_('JCANCEL'); ?></button>
+			<div class="modal-footer">
+				<button type="button" class="btn btn-secondary" data-bs-dismiss="modal"><?php echo Text::_('JCANCEL'); ?></button>
 				<button type="submit" class="btn btn-success" id="mb-browse-restore-btn" disabled>
 					<span class="icon-upload" aria-hidden="true"></span>
 					<?php echo Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE_SELECTED'); ?>
@@ -340,6 +344,7 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 			</div>
 			<?php echo HTMLHelper::_('form.token'); ?>
 		</form>
+		</div>
 	</div>
 </div>
 
@@ -352,7 +357,7 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 			createBtn.addEventListener('click', function(e) {
 				e.preventDefault();
 				e.stopPropagation();
-				document.getElementById('mb-snapshot-create-modal').style.display = 'block';
+				bootstrap.Modal.getOrCreateInstance(document.getElementById('mb-snapshot-create-modal')).show();
 				return false;
 			}, true);
 		}
@@ -413,7 +418,7 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 		// Show/hide replace warning based on mode
 		toggleReplaceWarning();
 
-		document.getElementById('mb-snapshot-restore-modal').style.display = 'block';
+		bootstrap.Modal.getOrCreateInstance(document.getElementById('mb-snapshot-restore-modal')).show();
 	});
 
 	// Toggle warning when mode changes
@@ -454,7 +459,7 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 			tab.show();
 		}
 
-		document.getElementById('mb-snapshot-browse-modal').style.display = 'block';
+		bootstrap.Modal.getOrCreateInstance(document.getElementById('mb-snapshot-browse-modal')).show();
 
 		// Fetch snapshot content via AJAX
 		var token = <?php echo json_encode(Session::getFormToken()); ?>;
@@ -617,16 +622,6 @@ $listDirn  = $this->escape($this->state->get('list.direction'));
 			: <?php echo json_encode(Text::_('COM_MOKOJOOMBACKUP_SNAPSHOT_RESTORE_SELECTED')); ?>;
 	}
 
-	// Close modals
-	document.addEventListener('click', function(e) {
-		if (e.target.classList.contains('mb-modal-close') ||
-			e.target.id === 'mb-snapshot-create-modal' ||
-			e.target.id === 'mb-snapshot-restore-modal' ||
-			e.target.id === 'mb-snapshot-browse-modal') {
-			document.getElementById('mb-snapshot-create-modal').style.display = 'none';
-			document.getElementById('mb-snapshot-restore-modal').style.display = 'none';
-			document.getElementById('mb-snapshot-browse-modal').style.display = 'none';
-		}
-	});
+	// Modal close handled by Bootstrap data-bs-dismiss
 })();
 </script>

source/packages/mod_mokosuitebackup_cpanel/mod_mokosuitebackup_cpanel.php

@@ -0,0 +1,11 @@
+<?php
+
+/**
+ * @package     MokoSuiteBackup
+ * @subpackage  mod_mokosuitebackup_cpanel
+ * @author      Moko Consulting <hello@mokoconsulting.tech>
+ * @copyright   Copyright (C) 2026 Moko Consulting. All rights reserved.
+ * @license     GNU General Public License version 3 or later; see LICENSE
+ */
+
+defined('_JEXEC') or die;

source/packages/mod_mokosuitebackup_cpanel/mod_mokosuitebackup_cpanel.xml

@@ -8,7 +8,7 @@
  -->
 <extension type="module" client="administrator" method="upgrade">
 	<name>mod_mokosuitebackup_cpanel</name>
-	<version>01.42.00</version>
+	<version>01.43.07</version>
 	<creationDate>2026-06-23</creationDate>
 	<author>Moko Consulting</author>
 	<authorEmail>hello@mokoconsulting.tech</authorEmail>
@@ -20,6 +20,7 @@
 	<namespace path="src">Joomla\Module\MokoSuiteBackupCpanel</namespace>
 
 	<files>
+		<filename module="mod_mokosuitebackup_cpanel">mod_mokosuitebackup_cpanel.php</filename>
 		<folder>language</folder>
 		<folder>services</folder>
 		<folder>src</folder>

source/packages/mod_mokosuitebackup_cpanel/tmpl/default.php

@@ -120,7 +120,7 @@ $moduleId = 'mod-msb-cpanel-' . $displayData['module']->id;
 				class="btn btn-sm btn-outline-primary msb-cpanel-backup-btn"
 				data-profile-id="<?php echo (int) $profile->id; ?>"
 				data-module-id="<?php echo $moduleId; ?>">
-				<?php echo htmlspecialchars($profile->title); ?>
+				#<?php echo (int) $profile->id; ?> <?php echo htmlspecialchars($profile->title); ?>
 				<span class="badge bg-secondary ms-1"><?php echo htmlspecialchars($profile->backup_type); ?></span>
 			</button>
 			<?php endforeach; ?>

source/packages/plg_actionlog_mokosuitebackup/mokosuitebackup.xml

@@ -7,7 +7,7 @@
  -->
 <extension type="plugin" group="actionlog" method="upgrade">
 	<name>Action Log - MokoSuiteBackup</name>
-	<version>01.42.00</version>
+	<version>01.43.07</version>
 	<creationDate>2026-06-04</creationDate>
 	<author>Moko Consulting</author>
 	<authorEmail>hello@mokoconsulting.tech</authorEmail>

source/packages/plg_console_mokosuitebackup/mokosuitebackup.xml

@@ -7,7 +7,7 @@
  -->
 <extension type="plugin" group="console" method="upgrade">
 	<name>Console - MokoSuiteBackup</name>
-	<version>01.42.00</version>
+	<version>01.43.07</version>
 	<creationDate>2026-06-04</creationDate>
 	<author>Moko Consulting</author>
 	<authorEmail>hello@mokoconsulting.tech</authorEmail>

source/packages/plg_content_mokosuitebackup/mokosuitebackup.xml

@@ -7,7 +7,7 @@
  -->
 <extension type="plugin" group="content" method="upgrade">
 	<name>Content - MokoSuiteBackup</name>
-	<version>01.42.00</version>
+	<version>01.43.07</version>
 	<creationDate>2026-06-04</creationDate>
 	<author>Moko Consulting</author>
 	<authorEmail>hello@mokoconsulting.tech</authorEmail>

source/packages/plg_quickicon_mokosuitebackup/mokosuitebackup.xml

@@ -1,7 +1,7 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <extension type="plugin" group="quickicon" method="upgrade">
 	<name>Quick Icon - MokoSuiteBackup</name>
-	<version>01.42.00</version>
+	<version>01.43.07</version>
 	<creationDate>2026-06-02</creationDate>
 	<author>Moko Consulting</author>
 	<authorEmail>hello@mokoconsulting.tech</authorEmail>

source/packages/plg_system_mokosuitebackup/mokosuitebackup.xml

@@ -7,7 +7,7 @@
  -->
 <extension type="plugin" group="system" method="upgrade">
 	<name>System - MokoSuiteBackup</name>
-	<version>01.42.00</version>
+	<version>01.43.07</version>
 	<creationDate>2026-06-02</creationDate>
 	<author>Moko Consulting</author>
 	<authorEmail>hello@mokoconsulting.tech</authorEmail>

source/packages/plg_task_mokosuitebackup/mokosuitebackup.xml

@@ -7,7 +7,7 @@
  -->
 <extension type="plugin" group="task" method="upgrade">
 	<name>Task - MokoSuiteBackup</name>
-	<version>01.42.00</version>
+	<version>01.43.07</version>
 	<creationDate>2026-06-02</creationDate>
 	<author>Moko Consulting</author>
 	<authorEmail>hello@mokoconsulting.tech</authorEmail>

source/packages/plg_webservices_mokosuitebackup/mokosuitebackup.xml

@@ -7,7 +7,7 @@
  -->
 <extension type="plugin" group="webservices" method="upgrade">
 	<name>Web Services - MokoSuiteBackup</name>
-	<version>01.42.00</version>
+	<version>01.43.07</version>
 	<creationDate>2026-06-02</creationDate>
 	<author>Moko Consulting</author>
 	<authorEmail>hello@mokoconsulting.tech</authorEmail>

source/pkg_mokosuitebackup.xml

@@ -8,7 +8,7 @@
 <extension type="package" method="upgrade">
 	<name>Package - MokoSuiteBackup</name>
 	<packagename>mokosuitebackup</packagename>
-	<version>01.42.00</version>
+	<version>01.43.07</version>
 	<creationDate>2026-06-02</creationDate>
 	<author>Moko Consulting</author>
 	<authorEmail>hello@mokoconsulting.tech</authorEmail>