<?php
$current_page = (isset($payment_method) && $payment_method === 'pesapal') ? 'pesapal' : 'relworx-transactions';
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Relworx Transactions - Admin App</title>
    <link rel="icon" href="/favicon.svg" type="image/svg+xml">
    <link rel="icon" href="/favicon.ico" sizes="any">
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css" rel="stylesheet">
    <?= view('admin/partials/admin_styles') ?>
    <style>
        .page-header { margin-bottom: 1.5rem; }
        .page-title { font-size: 1.5rem; color: #1e293b; font-weight: 700; }
        .breadcrumb { display: flex; align-items: center; gap: 0.5rem; color: #64748b; margin-top: 0.35rem; font-size: 0.9rem; }
        .breadcrumb a { color: #6366f1; text-decoration: none; font-weight: 500; }
        .breadcrumb a:hover { color: #4f46e5; }
        .report-section { margin-bottom: 1.5rem; }
        .report-heading { font-size: 1rem; font-weight: 700; color: #1e293b; margin-bottom: 0.75rem; display: flex; align-items: center; gap: 0.5rem; }
        .report-heading i { color: #6366f1; }
        .stats-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 1rem; margin-bottom: 1rem; }
        .stat-item { background: #fff; padding: 1rem; border-radius: 12px; box-shadow: 0 1px 3px rgba(0,0,0,0.06); border: 1px solid #e2e8f0; text-align: center; }
        .stat-item .stat-number { font-size: 1.35rem; font-weight: 700; color: #1e293b; }
        .stat-item .stat-label { color: #64748b; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.5px; margin-top: 0.25rem; }
        .stat-item .stat-amount { font-size: 0.85rem; font-weight: 600; margin-top: 0.35rem; }
        .stat-item.success .stat-amount { color: #059669; }
        .stat-item.failed .stat-amount { color: #dc2626; }
        .stat-item.pending .stat-amount { color: #d97706; }
        .method-breakdown { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.75rem; }
        .method-chip { background: #f1f5f9; padding: 0.35rem 0.75rem; border-radius: 8px; font-size: 0.8rem; color: #475569; }
        .method-chip strong { color: #1e293b; }

        .filters {
            background: white;
            padding: 2rem;
            border-radius: 16px;
            box-shadow: 0 4px 20px rgba(0,0,0,0.05);
            margin-bottom: 2rem;
            border: 1px solid rgba(0,0,0,0.04);
        }

        .filters h3 {
            margin-bottom: 1.5rem;
            color: #1a202c;
            font-weight: 700;
            font-size: 1.2rem;
        }

        .filter-grid {
            display: grid;
            grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
            gap: 1rem;
            margin-bottom: 1rem;
        }

        .filter-group {
            display: flex;
            flex-direction: column;
        }

        .filter-group label {
            margin-bottom: 0.5rem;
            font-weight: 600;
            color: #2d3748;
            font-size: 0.9rem;
        }

        .filter-group select,
        .filter-group input {
            padding: 0.85rem;
            border: 2px solid #e2e8f0;
            border-radius: 10px;
            font-size: 0.9rem;
            transition: all 0.3s ease;
        }

        .filter-group select:focus,
        .filter-group input:focus {
            outline: none;
            border-color: #667eea;
            box-shadow: 0 0 0 4px rgba(102, 126, 234, 0.1);
        }

        .filter-actions {
            display: flex;
            gap: 1rem;
            align-items: center;
        }

        .btn {
            padding: 0.85rem 1.5rem;
            border: none;
            border-radius: 10px;
            cursor: pointer;
            font-size: 0.9rem;
            font-weight: 600;
            text-decoration: none;
            display: inline-flex;
            align-items: center;
            gap: 0.5rem;
            transition: all 0.3s ease;
        }

        .btn-primary {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            color: white;
            box-shadow: 0 2px 10px rgba(102, 126, 234, 0.2);
        }

        .btn-primary:hover {
            transform: translateY(-2px);
            box-shadow: 0 4px 15px rgba(102, 126, 234, 0.3);
        }

        .btn-success {
            background: linear-gradient(135deg, #10b981, #059669);
            color: white;
            box-shadow: 0 2px 10px rgba(16, 185, 129, 0.2);
        }

        .btn-success:hover {
            transform: translateY(-2px);
            box-shadow: 0 4px 15px rgba(16, 185, 129, 0.3);
        }

        .btn-warning {
            background: linear-gradient(135deg, #f59e0b, #d97706);
            color: white;
            box-shadow: 0 2px 10px rgba(245, 158, 11, 0.2);
        }

        .btn-warning:hover {
            transform: translateY(-2px);
            box-shadow: 0 4px 15px rgba(245, 158, 11, 0.3);
        }

        .transactions-table {
            background: white;
            border-radius: 16px;
            box-shadow: 0 4px 20px rgba(0,0,0,0.05);
            overflow: hidden;
            border: 1px solid rgba(0,0,0,0.04);
        }

        .table-header {
            background: #f8f9fc;
            padding: 1.5rem 2rem;
            border-bottom: 1px solid #e2e8f0;
            display: flex;
            justify-content: space-between;
            align-items: center;
        }

        .table-title {
            font-size: 1.3rem;
            font-weight: 700;
            color: #1a202c;
        }

        .table-count {
            color: #718096;
            font-size: 0.95rem;
            font-weight: 500;
        }

        .pagination-wrapper {
            padding: 1rem 2rem;
            border-top: 1px solid #e2e8f0;
            background: #f8f9fc;
        }
        .pagination-wrapper .pagination {
            display: flex;
            flex-wrap: wrap;
            gap: 0.35rem;
            list-style: none;
            margin: 0;
            padding: 0;
            justify-content: center;
        }
        .pagination-wrapper .pagination li a {
            display: inline-block;
            padding: 0.5rem 0.85rem;
            border-radius: 8px;
            background: #fff;
            border: 1px solid #e2e8f0;
            color: #4f46e5;
            text-decoration: none;
            font-weight: 600;
            font-size: 0.9rem;
        }
        .pagination-wrapper .pagination li a:hover {
            background: #eef2ff;
            border-color: #c7d2fe;
        }
        .pagination-wrapper .pagination li.active a {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
            border-color: transparent;
            color: #fff;
        }

        .table {
            width: 100%;
            border-collapse: collapse;
        }

        .table th,
        .table td {
            padding: 1rem;
            text-align: left;
            border-bottom: 1px solid #dee2e6;
        }

        .transaction-details {
            display: flex;
            flex-direction: column;
            gap: 0.5rem;
        }

        .transaction-id-main {
            font-weight: 600;
            color: #1a202c;
        }

        .transaction-meta {
            font-size: 0.85rem;
            color: #718096;
            display: flex;
            flex-direction: column;
            gap: 0.25rem;
            margin-top: 0.5rem;
        }

        .transaction-meta-item {
            display: flex;
            align-items: center;
            gap: 0.5rem;
        }

        .transaction-meta-label {
            font-weight: 600;
            color: #4a5568;
            min-width: 70px;
        }

        .amount-with-status {
            display: flex;
            flex-direction: column;
            gap: 0.5rem;
        }

        .table th {
            background: #f8f9fc;
            font-weight: 700;
            color: #4a5568;
            font-size: 0.85rem;
            text-transform: uppercase;
            letter-spacing: 0.5px;
        }

        .table td {
            font-size: 0.9rem;
        }

        .status-badge {
            padding: 0.25rem 0.75rem;
            border-radius: 20px;
            font-size: 0.8rem;
            font-weight: 500;
            text-transform: uppercase;
        }

        .status-success {
            background: #d1fae5;
            color: #065f46;
        }

        .status-failed {
            background: #fee2e2;
            color: #991b1b;
        }

        .status-pending {
            background: #fef3c7;
            color: #92400e;
        }

        .payment-method-badge {
            padding: 0.35rem 0.75rem;
            border-radius: 15px;
            font-size: 0.75rem;
            font-weight: 600;
            background: #e2e8f0;
            color: #4a5568;
        }

        .payment-mobile {
            background: #cffafe;
            color: #0e7490;
        }

        .payment-send {
            background: #d1fae5;
            color: #065f46;
        }

        .payment-product {
            background: #e9d5ff;
            color: #6b21a8;
        }

        .payment-visa {
            background: #fed7aa;
            color: #92400e;
        }

        .amount {
            font-weight: 700;
            color: #10b981;
        }

        .amount.failed {
            color: #ef4444;
        }

        .amount.pending {
            color: #f59e0b;
        }

        .no-data {
            text-align: center;
            padding: 4rem;
            color: #718096;
        }

        .no-data i {
            font-size: 3.5rem;
            margin-bottom: 1.5rem;
            color: #cbd5e0;
        }

        .no-data h3 {
            color: #2d3748;
            margin-bottom: 0.5rem;
            font-weight: 700;
        }

        .no-data p {
            color: #718096;
        }

        .bulk-actions {
            display: flex;
            gap: 1rem;
            margin-top: 1rem;
            padding-top: 1rem;
            border-top: 1px solid #e9ecef;
        }

        .btn-danger {
            background: linear-gradient(135deg, #ef4444, #dc2626);
            color: white;
            box-shadow: 0 2px 10px rgba(239, 68, 68, 0.2);
        }

        .btn-danger:hover {
            transform: translateY(-2px);
            box-shadow: 0 4px 15px rgba(239, 68, 68, 0.3);
        }

        .actions-cell {
            text-align: center;
        }

        .action-buttons {
            display: flex;
            gap: 0.5rem;
            justify-content: center;
        }

        .btn-success, .btn-failed {
            padding: 0.5rem 1rem;
            border: none;
            border-radius: 8px;
            cursor: pointer;
            font-size: 0.8rem;
            font-weight: 600;
            transition: all 0.3s ease;
            display: flex;
            align-items: center;
            gap: 0.25rem;
        }

        .btn-success {
            background: linear-gradient(135deg, #10b981, #059669);
            color: white;
            box-shadow: 0 2px 8px rgba(16, 185, 129, 0.2);
        }

        .btn-success:hover {
            transform: translateY(-1px);
            box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
        }

        .btn-failed {
            background: linear-gradient(135deg, #ef4444, #dc2626);
            color: white;
            box-shadow: 0 2px 8px rgba(239, 68, 68, 0.2);
        }

        .btn-failed:hover {
            transform: translateY(-1px);
            box-shadow: 0 4px 12px rgba(239, 68, 68, 0.3);
        }

        .no-actions {
            color: #999;
            font-size: 0.8rem;
            font-style: italic;
        }

        .loading {
            opacity: 0.6;
            pointer-events: none;
        }

        @media (max-width: 768px) {
            .navbar-content {
                flex-direction: column;
                gap: 1rem;
            }

            .page-header {
                flex-direction: column;
                gap: 1rem;
                align-items: flex-start;
            }

            .filter-grid {
                grid-template-columns: 1fr;
            }

            .filter-actions {
                flex-direction: column;
                align-items: stretch;
            }

            .table {
                font-size: 0.8rem;
            }

            .table th,
            .table td {
                padding: 0.5rem;
            }

        }
    </style>
</head>
<body>
<?= view('admin/partials/header_sidebar', ['current_page' => $current_page]) ?>

    <div class="page-header">
        <h1 class="page-title"><i class="fas fa-mobile-alt"></i> Relworx / Mobile Money</h1>
        <div class="breadcrumb">
            <a href="<?= site_url('admin/dashboard') ?>">Dashboard</a>
            <i class="fas fa-chevron-right"></i>
            <span>Relworx Transactions</span>
        </div>
    </div>

    <div class="report-section">
        <h3 class="report-heading"><i class="fas fa-chart-pie"></i> Financial Report</h3>
        <div class="stats-summary">
            <div class="stat-item">
                <div class="stat-number"><?= number_format($stat_total ?? 0) ?></div>
                <div class="stat-label">Total</div>
            </div>
            <div class="stat-item success">
                <div class="stat-number"><?= number_format($stat_success_count ?? 0) ?></div>
                <div class="stat-label">Successful</div>
                <div class="stat-amount"><?= number_format($stat_success_amount ?? 0, 0) ?> UGX</div>
            </div>
            <div class="stat-item failed">
                <div class="stat-number"><?= number_format($stat_failed_count ?? 0) ?></div>
                <div class="stat-label">Failed</div>
                <div class="stat-amount"><?= number_format($stat_failed_amount ?? 0, 0) ?> UGX</div>
            </div>
            <div class="stat-item pending">
                <div class="stat-number"><?= number_format($stat_pending_count ?? 0) ?></div>
                <div class="stat-label">Pending</div>
                <div class="stat-amount"><?= number_format($stat_pending_amount ?? 0, 0) ?> UGX</div>
            </div>
            <div class="stat-item">
                <div class="stat-number"><?= number_format(($stat_success_amount ?? 0) + ($stat_failed_amount ?? 0) + ($stat_pending_amount ?? 0), 0) ?></div>
                <div class="stat-label">Total UGX</div>
            </div>
        </div>
        <?php if (!empty($stat_by_method)): ?>
        <div class="method-breakdown">
            <?php foreach ($stat_by_method as $method => $m): ?>
            <span class="method-chip"><?= esc(ucwords(str_replace('_', ' ', $method))) ?>: <strong><?= number_format($m['count']) ?></strong> / <?= number_format($m['amount'], 0) ?> UGX</span>
            <?php endforeach; ?>
        </div>
        <?php endif; ?>
    </div>

    <div class="filters">
            <h3><i class="fas fa-filter"></i> Filter Transactions</h3>
            <p class="filter-hint" style="margin: 0 0 12px 0; font-size: 0.9em; color: var(--text-muted, #666);">
                Product flows create two rows: <strong>Product Validation</strong> (pre-purchase) and <strong>Product Purchase</strong> (settlement). Relworx webhooks update the purchase row; use filters to review each stage.
            </p>
            <form method="GET" action="<?= site_url('admin/relworx-transactions') ?>">
                <div class="filter-grid">
                    <div class="filter-group">
                        <label for="status">Status</label>
                        <select name="status" id="status">
                            <option value="all" <?= ($status ?? '') === 'all' ? 'selected' : '' ?>>All Statuses</option>
                            <option value="SUCCESS" <?= ($status ?? '') === 'SUCCESS' ? 'selected' : '' ?>>Success</option>
                            <option value="FAILED" <?= ($status ?? '') === 'FAILED' ? 'selected' : '' ?>>Failed</option>
                            <option value="PENDING" <?= ($status ?? '') === 'PENDING' ? 'selected' : '' ?>>Pending</option>
                            <option value="VALIDATED" <?= ($status ?? '') === 'VALIDATED' ? 'selected' : '' ?>>Validated (product check)</option>
                        </select>
                    </div>
                    <div class="filter-group">
                        <label for="payment_method">Payment Method</label>
                        <select name="payment_method" id="payment_method">
                            <option value="all" <?= ($payment_method ?? '') === 'all' ? 'selected' : '' ?>>All Methods</option>
                            <option value="mobile_money" <?= ($payment_method ?? '') === 'mobile_money' ? 'selected' : '' ?>>Mobile Money (Collection)</option>
                            <option value="mobile_money_send" <?= ($payment_method ?? '') === 'mobile_money_send' ? 'selected' : '' ?>>Mobile Money (Send)</option>
                            <option value="product_purchase" <?= ($payment_method ?? '') === 'product_purchase' ? 'selected' : '' ?>>Product Purchase (settlement)</option>
                            <option value="product_validation" <?= ($payment_method ?? '') === 'product_validation' ? 'selected' : '' ?>>Product Validation (pre-purchase)</option>
                            <option value="visa_mastercard" <?= ($payment_method ?? '') === 'visa_mastercard' ? 'selected' : '' ?>>VISA/Mastercard</option>
                            <option value="pesapal" <?= ($payment_method ?? '') === 'pesapal' ? 'selected' : '' ?>>PesaPal</option>
                        </select>
                    </div>
                    <div class="filter-group">
                        <label for="search">Search</label>
                        <input type="text" name="search" id="search" placeholder="Phone, Transaction ID, or Reference" value="<?= htmlspecialchars($search ?? '') ?>">
                    </div>
                    <div class="filter-group">
                        <label for="start_date">Start Date</label>
                        <input type="date" name="start_date" id="start_date" value="<?= $start_date ?? '' ?>">
                    </div>
                    <div class="filter-group">
                        <label for="end_date">End Date</label>
                        <input type="date" name="end_date" id="end_date" value="<?= $end_date ?? '' ?>">
                    </div>
                </div>
                <div class="filter-actions">
                    <button type="submit" class="btn btn-primary">
                        <i class="fas fa-search"></i> Filter
                    </button>
                    <a href="<?= site_url('admin/relworx-transactions') ?>" class="btn btn-warning">
                        <i class="fas fa-times"></i> Clear
                    </a>
                    <a href="<?= site_url('admin/relworx-transactions/export') . '?' . http_build_query($_GET) ?>" class="btn btn-success">
                        <i class="fas fa-download"></i> Export CSV
                    </a>
                </div>
                <div class="bulk-actions">
                    <button id="deleteFailedBtn" class="btn btn-danger">
                        <i class="fas fa-trash"></i> Delete All Failed
                    </button>
                    <button id="markPendingFailedBtn" class="btn btn-warning">
                        <i class="fas fa-exclamation-triangle"></i> Mark All Pending as Failed
                    </button>
                </div>
            </form>
        </div>

        <div class="transactions-table">
            <div class="table-header">
                <div class="table-title">Relworx Transaction Records</div>
                <div class="table-count">
                    <?php
                    $pager = $pager ?? null;
                    if ($pager && $pager->getTotal() > 0) {
                        $start = ($pager->getCurrentPage() - 1) * $pager->getPerPage() + 1;
                        $end = min($pager->getCurrentPage() * $pager->getPerPage(), $pager->getTotal());
                        echo "Showing {$start}–{$end} of " . number_format($pager->getTotal()) . " transactions";
                    } else {
                        echo count($transactions) . " transactions found";
                    }
                    ?>
                </div>
            </div>
            
            <?php if (empty($transactions)): ?>
                <div class="no-data">
                    <i class="fas fa-inbox"></i>
                    <h3>No transactions found</h3>
                    <p>No Relworx transactions match your current filters.</p>
                </div>
            <?php else: ?>
                <table class="table">
                    <thead>
                        <tr>
                            <th>ID</th>
                            <th>Transaction ID</th>
                            <th>MSISDN</th>
                            <th>Amount</th>
                            <th>Payment Method</th>
                            <th>Created At</th>
                            <th>Actions</th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php foreach ($transactions as $transaction): ?>
                            <tr>
                                <td><?= $transaction['id'] ?></td>
                                <td>
                                    <div class="transaction-details">
                                        <div class="transaction-id-main">
                                            <code><?= htmlspecialchars($transaction['transaction_id']) ?></code>
                                        </div>
                                        <div class="transaction-meta">
                                            <div class="transaction-meta-item">
                                                <span class="transaction-meta-label">Reference:</span>
                                                <code><?= htmlspecialchars($transaction['reference']) ?></code>
                                            </div>
                                            <div class="transaction-meta-item">
                                                <span class="transaction-meta-label">Description:</span>
                                                <span><?= htmlspecialchars($transaction['description'] ?? 'N/A') ?></span>
                                            </div>
                                        </div>
                                    </div>
                                </td>
                                <td><?= htmlspecialchars($transaction['msisdn'] ?? 'N/A') ?></td>
                                <td>
                                    <div class="amount-with-status">
                                        <div class="amount <?= strtolower($transaction['status']) ?>">
                                            <?= number_format($transaction['amount'], 0) ?> <?= $transaction['currency'] ?>
                                        </div>
                                        <div>
                                            <span class="status-badge status-<?= strtolower($transaction['status']) ?>">
                                                <?= $transaction['status'] ?>
                                            </span>
                                        </div>
                                    </div>
                                </td>
                                <td>
                                    <span class="payment-method-badge payment-<?= str_replace('_', '-', $transaction['payment_method']) ?>">
                                        <?= ucwords(str_replace('_', ' ', $transaction['payment_method'])) ?>
                                    </span>
                                </td>
                                <td><?= date('M j, Y H:i', strtotime($transaction['created_at'])) ?></td>
                                <td class="actions-cell">
                                    <?php 
                                    $currentStatus = strtoupper(trim($transaction['status'] ?? ''));
                                    if($currentStatus !== 'SUCCESS' && $currentStatus !== 'FAILED'): 
                                    ?>
                                        <div class="action-buttons">
                                            <button class="btn-success" onclick="updateStatus('<?= htmlspecialchars($transaction['transaction_id'], ENT_QUOTES) ?>', 'SUCCESS')">
                                                <i class="fas fa-check"></i> Success
                                            </button>
                                            <button class="btn-failed" onclick="updateStatus('<?= htmlspecialchars($transaction['transaction_id'], ENT_QUOTES) ?>', 'FAILED')">
                                                <i class="fas fa-times"></i> Failed
                                            </button>
                                        </div>
                                    <?php else: ?>
                                        <span class="no-actions">No actions available</span>
                                    <?php endif; ?>
                                </td>
                            </tr>
                        <?php endforeach; ?>
                    </tbody>
                </table>
                <?php if (!empty($pager) && $pager->getPageCount() > 1): ?>
                <div class="pagination-wrapper">
                    <?= $pager->links('default', 'default_full') ?>
                </div>
                <?php endif; ?>
            <?php endif; ?>
        </div>

    <script>
        // Event listeners
        document.addEventListener('DOMContentLoaded', function() {
            // Bulk action buttons
            document.getElementById('deleteFailedBtn').addEventListener('click', deleteFailedTransactions);
            document.getElementById('markPendingFailedBtn').addEventListener('click', markPendingAsFailed);
        });

        function updateStatus(transactionId, status) {
            if (!confirm(`Are you sure you want to mark this transaction as ${status}?`)) {
                return;
            }

            // Add loading state
            const button = event.target.closest('button');
            const originalText = button.innerHTML;
            button.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Updating...';
            button.classList.add('loading');

            // Make AJAX request
            fetch('<?= site_url('admin/relworx-transactions/update-status/') ?>' + transactionId, {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded',
                },
                body: 'status=' + status
            })
            .then(response => {
                if (!response.ok) {
                    throw new Error('Network response was not ok');
                }
                return response.json();
            })
            .then(data => {
                if (data.success) {
                    // Reload the page immediately to reflect changes
                    location.reload();
                } else {
                    alert('Error: ' + data.message);
                    // Restore button state
                    button.innerHTML = originalText;
                    button.classList.remove('loading');
                }
            })
            .catch(error => {
                console.error('Error:', error);
                alert('Error updating transaction status: ' + error.message);
                // Restore button state
                button.innerHTML = originalText;
                button.classList.remove('loading');
            });
        }

        // Delete all failed transactions
        function deleteFailedTransactions() {
            if (!confirm('Are you sure you want to delete ALL failed Relworx transactions? This action cannot be undone.')) {
                return;
            }

            const button = document.getElementById('deleteFailedBtn');
            const originalText = button.innerHTML;
            button.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Deleting...';
            button.disabled = true;

            fetch('<?= site_url('admin/relworx-transactions/delete-failed') ?>', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded',
                }
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    alert(data.message);
                    location.reload();
                } else {
                    alert('Error: ' + data.message);
                }
            })
            .catch(error => {
                console.error('Error:', error);
                alert('Error deleting failed transactions: ' + error.message);
            })
            .finally(() => {
                button.innerHTML = originalText;
                button.disabled = false;
            });
        }

        // Mark all pending transactions as failed
        function markPendingAsFailed() {
            if (!confirm('Are you sure you want to mark ALL pending Relworx transactions as failed? This action cannot be undone.')) {
                return;
            }

            const button = document.getElementById('markPendingFailedBtn');
            const originalText = button.innerHTML;
            button.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Updating...';
            button.disabled = true;

            fetch('<?= site_url('admin/relworx-transactions/mark-pending-failed') ?>', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/x-www-form-urlencoded',
                }
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    alert(data.message);
                    location.reload();
                } else {
                    alert('Error: ' + data.message);
                }
            })
            .catch(error => {
                console.error('Error:', error);
                alert('Error updating pending transactions: ' + error.message);
            })
            .finally(() => {
                button.innerHTML = originalText;
                button.disabled = false;
            });
        }
    </script>
<?= view('admin/partials/footer') ?>
</body>
</html>
