<?php
// Included from every payment*/pay_now.php file when $isTestOrder is true.
// Expects $order_id to already be defined by the including file.
?>
<div style="position:fixed;top:0;left:0;right:0;z-index:9998;background:#F39C12;color:#111;
     text-align:center;padding:6px 10px;font-family:Arial,sans-serif;font-size:13px;font-weight:700;
     letter-spacing:.3px;">
    🧪 TEST MODE — No real money will be charged
</div>

<div id="testActionFab" onclick="document.getElementById('testActionModal').style.display='flex'"
     style="position:fixed;bottom:22px;right:18px;z-index:9999;background:#F39C12;color:#fff;
            padding:12px 18px;border-radius:50px;font-weight:700;font-family:Arial,sans-serif;
            font-size:14px;box-shadow:0 6px 20px rgba(0,0,0,.25);cursor:pointer;display:flex;
            align-items:center;gap:8px;">
    🧪 Test Action
</div>

<div id="testActionModal" style="display:none;position:fixed;inset:0;background:rgba(0,0,0,.55);
     z-index:10000;align-items:flex-end;justify-content:center;font-family:Arial,sans-serif;">
    <div style="background:#fff;border-radius:20px 20px 0 0;padding:26px 22px 30px;width:100%;max-width:480px;">
        <div style="width:40px;height:4px;background:#ddd;border-radius:4px;margin:0 auto 18px;"></div>
        <h3 style="margin:0 0 4px;color:#F39C12;text-align:center;">Test Payment Mode</h3>
        <p style="text-align:center;color:#888;font-size:13px;margin:0 0 18px;">
            Simulate an outcome for order<br><b><?php echo htmlspecialchars($order_id); ?></b>
        </p>

        <button onclick="submitTestAction('success')" style="width:100%;text-align:left;background:#EAFAF1;
                border:1px solid #b7ebc9;color:#1FAA59;padding:14px 16px;border-radius:12px;font-weight:700;
                font-size:15px;margin-bottom:10px;">✅ Success Payment</button>

        <button onclick="submitTestAction('failed')" style="width:100%;text-align:left;background:#FDECEA;
                border:1px solid #f3b8b3;color:#D35400;padding:14px 16px;border-radius:12px;font-weight:700;
                font-size:15px;margin-bottom:10px;">❌ Failed Payment</button>

        <button onclick="submitTestAction('timeout')" style="width:100%;text-align:left;background:#FFF6E5;
                border:1px solid #f5dba3;color:#B7791F;padding:14px 16px;border-radius:12px;font-weight:700;
                font-size:15px;margin-bottom:16px;">⏱️ Timeout Payment</button>

        <button onclick="document.getElementById('testActionModal').style.display='none'"
                style="width:100%;background:#f1f1f1;color:#555;border:none;padding:12px;border-radius:12px;font-weight:600;">
            Cancel
        </button>
    </div>
</div>

<script>
function submitTestAction(action) {
    var fd = new FormData();
    fd.append('order_id', <?php echo json_encode($order_id); ?>);
    fd.append('action', action);

    fetch('https://<?php echo $_SERVER["SERVER_NAME"]; ?>/includes/test_action_submit.php', {
        method: 'POST',
        body: fd
    }).then(r => r.json()).then(function(res){
        document.getElementById('testActionModal').style.display = 'none';
        document.getElementById('testActionFab').style.display = 'none';
        if (res.status) {
            document.open();
            document.write(
                '<html><head><meta name="viewport" content="width=device-width, initial-scale=1.0">' +
                '<style>body{font-family:Arial,sans-serif;background:#f9f9f9;display:flex;align-items:center;' +
                'justify-content:center;height:100vh;margin:0;text-align:center;}' +
                '.box{background:#fff;padding:36px 28px;border-radius:14px;box-shadow:0 0 20px rgba(0,0,0,.1);max-width:92%;}' +
                'h1{color:' + res.color + ';font-size:22px;}p{color:#555;font-size:14px;}' +
                '.tag{display:inline-block;background:#F39C12;color:#fff;padding:4px 12px;border-radius:20px;' +
                'font-size:12px;font-weight:700;margin-bottom:14px;}</style></head><body>' +
                '<div class="box"><div class="tag">TEST MODE</div><h1>' + res.title + '</h1>' +
                '<p>' + res.message + '</p>' +
                '<p style="font-size:12px;color:#999;">Order: ' + res.order_id + '<br>Webhook notified: ' + (res.webhook_sent ? 'Yes' : 'No callback URL set') + '</p>' +
                '</div></body></html>'
            );
            document.close();
        } else {
            alert(res.message || 'Something went wrong.');
        }
    }).catch(function(){
        alert('Could not reach the test server. Please try again.');
    });
}
</script>
