<?php
session_start();
require_once 'db.php'; // PDO connection

$client_id = "gxulTg1AQByUbeQH-nf77w-4yPaRusQUI_iQLizgvw";
$client_secret = "0UEhzxACAkQlB6r1YgSbDeVpP_mmwcWC46Q3jQEKBE4";

$url = "https://sandbox.kopokopo.com/oauth/token";
$data = ["grant_type" => "client_credentials"];
$credentials = base64_encode($client_id . ":" . $client_secret);

$ch = curl_init($url);
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_HTTPHEADER, [
    "Content-Type: application/json",
    "Authorization: Basic " . $credentials
]);
curl_setopt($ch, CURLOPT_POST, true);
curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($data));

$response = curl_exec($ch);
if (curl_errno($ch)) {
    echo "cURL error: " . curl_error($ch);
    exit;
}
curl_close($ch);

$result = json_decode($response, true);
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>KopoKopo Token - Bella</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" href="images/taji-yetu.png" type="image/png">
<style>
body {
    margin:0; font-family:'Poppins',sans-serif;
    background:#000; color:#fff; overflow-x:hidden;
}
canvas#bg {
    position:fixed; top:0; left:0;
    width:100%; height:100%; z-index:-1; background:#000;
}
.container {
    max-width:600px; margin:80px auto;
    background: rgba(255,255,255,0.05); padding:25px;
    border-radius:12px; text-align:center;
    box-shadow:0 4px 20px rgba(255,255,255,0.3);
}
h1 { margin-bottom:20px; }
p { margin:10px 0; font-size:16px; color:#ccc; }
</style>
</head>
<body>
<canvas id="bg"></canvas>

<div class="container">
<h1>KopoKopo OAuth Token</h1>
<?php if(isset($result["access_token"])): ?>
    <p>✅ Access Token:</p>
    <p style="word-break:break-all; color:#fff;"><?= htmlspecialchars($result["access_token"]) ?></p>
    <p>⏳ Expires in: <?= htmlspecialchars($result["expires_in"]) ?> seconds</p>
<?php else: ?>
    <p>❌ Error:</p>
    <p style="word-break:break-all; color:#ff8080;"><?= htmlspecialchars($response) ?></p>
<?php endif; ?>
</div>

<script>
const canvas = document.getElementById('bg');
const ctx = canvas.getContext('2d');
function resize(){ canvas.width = window.innerWidth; canvas.height = window.innerHeight; }
window.addEventListener('resize', resize);
resize();

let particles=[];
for(let i=0;i<80;i++){
    particles.push({x:Math.random()*canvas.width, y:Math.random()*canvas.height, r:Math.random()*2+1});
}
function animate(){
    ctx.fillStyle="#000"; ctx.fillRect(0,0,canvas.width,canvas.height);
    ctx.fillStyle="white";
    particles.forEach(p=>{
        ctx.beginPath(); ctx.arc(p.x,p.y,p.r,0,Math.PI*2); ctx.fill();
        p.y -=0.3; if(p.y<0)p.y=canvas.height;
    });
    requestAnimationFrame(animate);
}
animate();
</script>
</body>
</html>

<?php
// ================== db.php ==================
try {
    $host = "localhost";
    $db   = "kkfxoaad_bella";
    $user = "kkfxoaad";
    $pass = "Bitok@2025";
    $conn = new PDO("mysql:host=$host;dbname=$db;charset=utf8mb4", $user, $pass);
    $conn->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);
} catch(PDOException $e){
    http_response_code(500);
    echo "DB Connection failed: " . $e->getMessage();
    exit;
}
?>
