<?php
/**
 * upgrade_pro.php - Halaman Penawaran & Upgrade Akun PRO
 * Developer: Sikawarsito, S.Kom
 */
session_start();
include 'config/database.php';

// Proteksi: Hanya user yang login yang bisa mengakses
if (!isset($_SESSION['user_id'])) {
    header("Location: auth/login_page.php");
    exit;
}

$user_id = $_SESSION['user_id'];
$pesan_notif = "";

// Ambil data user
$stmt = $conn->prepare("SELECT nama, status_akun FROM users WHERE id = ?");
$stmt->bind_param("i", $user_id);
$stmt->execute();
$user_data = $stmt->get_result()->fetch_assoc();
$stmt->close();

$status_akun = $user_data['status_akun'] ?? 'free';

?>
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Upgrade to PRO - XIEQA AI</title>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
    <style>
        body { font-family: 'Inter', sans-serif; background-color: #f8fafc; color: #1e293b; }
        .pricing-card { border: 2px solid transparent; border-radius: 20px; transition: all 0.3s ease; background: white; }
        .pricing-card:hover { transform: translateY(-5px); box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); }
        .pricing-pro { border-color: #8b5cf6; position: relative; box-shadow: 0 10px 15px -3px rgba(139, 92, 246, 0.3); }
        .badge-popular { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); background: linear-gradient(90deg, #8b5cf6, #3b82f6); color: white; padding: 4px 15px; border-radius: 20px; font-size: 12px; font-weight: bold; letter-spacing: 1px; }
        .feature-list { list-style: none; padding: 0; margin: 0; }
        .feature-list li { margin-bottom: 12px; display: flex; align-items: center; font-size: 15px; color: #475569; }
        .feature-list li i { color: #10b981; font-size: 18px; margin-right: 10px; }
        .feature-list li.disabled { color: #94a3b8; }
        .feature-list li.disabled i { color: #cbd5e1; }
        .gradient-text { background: linear-gradient(90deg, #8b5cf6, #3b82f6); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }
    </style>
</head>
<body>

<div class="container py-5">
    <div class="text-center mb-5">
        <a href="index.php" class="text-decoration-none text-muted mb-3 d-inline-block"><i class="bi bi-arrow-left"></i> Kembali ke Dashboard</a>
        <h1 class="fw-bolder mb-2">Tingkatkan Performa Mengajar Anda</h1>
        <p class="text-muted fs-5">Pilih paket yang sesuai dengan kebutuhan kelas Anda. <br>Lebih efisien, lebih interaktif, tanpa batasan.</p>
    </div>

    <?= $pesan_notif ?>

    <div class="row justify-content-center g-4 max-w-5xl mx-auto">
        <!-- PAKET FREE -->
        <div class="col-md-5 col-lg-4">
            <div class="pricing-card p-4 h-100 <?= ($status_akun == 'free') ? 'border-secondary border-opacity-25' : '' ?>">
                <h4 class="fw-bold text-secondary mb-1">Paket Basic</h4>
                <p class="text-muted small">Untuk mencoba fitur AI</p>
                <div class="my-4">
                    <span class="fs-1 fw-bolder">Rp 0</span><span class="text-muted">/selamanya</span>
                </div>
                
                <?php if ($status_akun == 'free'): ?>
                    <button class="btn btn-light w-100 py-3 rounded-pill fw-bold mb-4" disabled>Paket Anda Saat Ini</button>
                <?php else: ?>
                    <button class="btn btn-outline-secondary w-100 py-3 rounded-pill fw-bold mb-4" disabled>Gratis</button>
                <?php endif; ?>

                <ul class="feature-list">
                    <li><i class="bi bi-check-circle-fill"></i> Chat AI Cepat</li>
                    <li><i class="bi bi-check-circle-fill"></i> Maksimal 3 Broadcast Tugas</li>
                    <li><i class="bi bi-check-circle-fill"></i> Tugas Aktif selama 3 Hari</li>
                    <li><i class="bi bi-check-circle-fill"></i> Kontrol Smart Home (Dasar)</li>
                    <li class="disabled"><i class="bi bi-x-circle-fill text-danger"></i> Penalaran Logika AI (Pro)</li>
                    <li class="disabled"><i class="bi bi-x-circle-fill text-danger"></i> Upload Dokumen & Gambar</li>
                    <li class="disabled"><i class="bi bi-x-circle-fill text-danger"></i> Prioritas Antrean Server</li>
                </ul>
            </div>
        </div>

        <!-- PAKET PRO -->
        <div class="col-md-5 col-lg-4">
            <div class="pricing-card pricing-pro p-4 h-100">
                <div class="badge-popular">PALING DIMINATI</div>
                <h4 class="fw-bold gradient-text mb-1">Paket PRO Expert</h4>
                <p class="text-muted small">Solusi lengkap untuk Guru Cerdas</p>
                <div class="my-4">
                    <span class="fs-1 fw-bolder">Rp 25.000</span><span class="text-muted">/bulan</span>
                </div>
                
                <?php if ($status_akun == 'pro'): ?>
                    <button class="btn btn-success w-100 py-3 rounded-pill fw-bold mb-4" disabled><i class="bi bi-check-circle-fill"></i> Akun Anda PRO</button>
                <?php else: ?>
                    <button class="btn btn-primary w-100 py-3 rounded-pill fw-bold mb-4 shadow-sm" style="background: linear-gradient(90deg, #8b5cf6, #3b82f6); border: none;" data-bs-toggle="modal" data-bs-target="#modalBayar">
                        Tingkatkan ke PRO <i class="bi bi-rocket-takeoff ms-2"></i>
                    </button>
                <?php endif; ?>

                <ul class="feature-list">
                    <li><i class="bi bi-check-circle-fill text-primary"></i> <b>Semua fitur Basic, ditambah:</b></li>
                    <li><i class="bi bi-check-circle-fill"></i> <b>10 Broadcast Tugas / Minggu</b></li>
                    <li><i class="bi bi-check-circle-fill"></i> <b>Tugas Aktif selama 7 Hari</b></li>
                    <li><i class="bi bi-check-circle-fill"></i> Akses Model AI Penalaran Logika</li>
                    <li><i class="bi bi-check-circle-fill"></i> Upload File (PDF, DOCX, ZIP, Gambar)</li>
                    <li><i class="bi bi-check-circle-fill"></i> Kontrol Unlimited Perangkat IoT</li>
                    <li><i class="bi bi-check-circle-fill"></i> Tanpa Iklan & Tanpa Antre</li>
                </ul>
            </div>
        </div>
    </div>
</div>

<!-- Modal Pembayaran (VERSI PRODUKSI) -->
<div class="modal fade" id="modalBayar" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content border-0 shadow-lg rounded-4 overflow-hidden">
            <div class="modal-header bg-light border-bottom-0 p-4 pb-2">
                <h5 class="modal-title fw-bold text-dark">
                    <i class="bi bi-wallet2 text-primary me-2"></i> Pembayaran Paket PRO
                </h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body p-4 pt-3 text-center">
                <div class="p-3 bg-primary bg-opacity-10 text-primary rounded-3 fw-bold mb-4 fs-5">
                    Total Tagihan: Rp 25.000
                </div>
                
                <p class="text-muted small mb-4">Silakan lakukan transfer ke salah satu rekening di bawah ini, lalu konfirmasikan pembayaran Anda kepada Admin.</p>

                <!-- Informasi Rekening Admin -->
                <div class="card bg-light border-0 mb-4 text-start">
                    <div class="card-body">
                        <div class="mb-3">
                            <span class="badge bg-primary mb-1">BCA</span><br>
                            <span class="fw-bold fs-6">1234 5678 90</span><br>
                            <small class="text-muted">a.n Sikawarsito</small>
                        </div>
                        <div>
                            <span class="badge bg-success mb-1">DANA / GoPay</span><br>
                            <span class="fw-bold fs-6">0812-3456-7890</span><br>
                            <small class="text-muted">a.n Sikawarsito</small>
                        </div>
                    </div>
                </div>

                <!-- Tombol Real (Arahkan ke WA Admin) -->
                <a href="https://wa.me/6281252342211?text=Halo%20Admin%20XIEQA%20AI,%20saya%20<?= urlencode($user_data['nama']) ?>.%20Saya%20sudah%20melakukan%20pembayaran%20sebesar%20Rp%2025.000%20untuk%20Upgrade%20ke%20Paket%20PRO.%20Berikut%20bukti%20transfernya:" target="_blank" class="btn btn-success w-100 py-3 rounded-pill fw-bold shadow-sm">
                    <i class="bi bi-whatsapp fs-5 me-2"></i> Kirim Bukti Transfer via WA
                </a>
                <p class="text-muted mt-3 mb-0" style="font-size: 11px;">Admin akan memverifikasi dan mengaktifkan akun PRO Anda maksimal 1x24 Jam.</p>
            </div>
        </div>
    </div>
</div>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>