<?php
$ref = isset($_GET['ref']) ? trim($_GET['ref']) : null;
$cert = null;
$error = null;

if (!$ref) {
    $error = "Certificate reference not provided.";
} else {
    $apiUrl = "https://st.briananikayi.com/api/verifycert/" . urlencode($ref);

    $ch = curl_init($apiUrl);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    curl_setopt($ch, CURLOPT_TIMEOUT, 10);
    $response = curl_exec($ch);

    if (curl_errno($ch)) {
        $error = "Failed to fetch certificate: " . curl_error($ch);
    } else {
        $data = json_decode($response, true);
        if (isset($data['status']) && $data['status'] === 'success' && isset($data['data'])) {
            $cert = $data['data'];
        } else {
            $error = "Certificate not found or invalid reference.";
        }
    }

    curl_close($ch);
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>St John Ambulance Kenya - Certificate Verification</title>
    <link rel="icon" type="image/x-icon" href="logo.png">
    <style>
        :root {
            --primary-color: #006400;
            --secondary-color: #f0f8ff;
            --highlight-color: #006400;
        }

        body {
            font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
            background-color: #f6f9fc;
            margin: 0;
            padding: 0;
        }
        .container {
            max-width: 800px;
            margin: 30px auto;
            background-color: white;
            padding: 40px;
            border-radius: 15px;
            box-shadow: 0 5px 25px rgba(0,0,0,0.08);
        }

        .header {
            text-align: center;
            margin-bottom: 30px;
        }

        .header h1 {
            color: var(--primary-color);
            margin: 15px 0 5px;
        }

        .subtitle {
            color: #666;
            margin-top: 0;
        }

        .verification-badge {
            background-color: var(--secondary-color);
            padding: 20px;
            border-radius: 8px;
            text-align: center;
            margin-bottom: 30px;
            border-left: 5px solid var(--primary-color);
        }

        .verification-badge h2 {
            color: var(--primary-color);
            margin: 0 0 10px;
        }

        .verification-date {
            color: #555;
            font-size: 0.9em;
            margin: 0;
        }

        .certificate-details {
            background-color: #f9f9f9;
            padding: 25px;
            border-radius: 8px;
            margin-bottom: 30px;
        }

        .certificate-details h3 {
            color: var(--primary-color);
            margin-top: 0;
            border-bottom: 1px solid #ddd;
            padding-bottom: 10px;
        }
        .field {
            margin-bottom: 15px;
            padding: 8px 0;
            border-bottom: 1px dotted #eee;
        }

        .field strong {
            display: inline-block;
            width: 180px;
            color: #555;
        }

        .highlight {
            font-weight: bold;
            color: var(--highlight-color);
        }

        .footer {
            text-align: center;
            margin-top: 40px;
            color: #666;
            font-size: 0.9em;
        }

        .footer p {
            margin: 5px 0;
        }
        .error {
            color: red;
            text-align: center;
            margin-top: 60px;
        }
        .logo {
            text-align: center;
            margin-bottom: 20px;
        }
        .logo img {
            height: 80px;
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="header">
            <div class="logo">
                <img src="logo.png" alt="St John Ambulance Logo">
            </div>
            <h1>St John Ambulance Kenya</h1>
            <p class="subtitle">Certificate Verification Portal</p>
        </div>

        <?php if ($error): ?>
            <div class="verification-badge">
                <h2>❌ Verification Failed</h2>
                <p class="verification-date"><?php echo htmlspecialchars($error); ?></p>
            </div>
        <?php elseif ($cert): ?>
            <div class="verification-badge">
                <h2>✅ Certificate Verified</h2>
                <p class="verification-date">Verified on: <span id="current-date"></span></p>
            </div>

            <div class="certificate-details">
                <h3>Certificate Details</h3>
                <div class="field"><strong>Full Name:</strong> <span class="highlight"><?php echo htmlspecialchars($cert['full_names']); ?></span></div>
                <div class="field"><strong>Course:</strong> <?php echo htmlspecialchars($cert['course_name']); ?></div>
                <div class="field"><strong>Training Location:</strong> <?php echo htmlspecialchars($cert['training_location']); ?></div>
                <div class="field"><strong>Trainer ID:</strong> <?php echo htmlspecialchars($cert['trainerid']); ?></div>
               <?php
                $approvalDateFormatted = date('d-m-Y', strtotime($cert['approvaldate']));
                $expiryDateFormatted   = date('d-m-Y', strtotime($cert['experydate']));
                ?>
                
                <div class="field"><strong>Approval Date:</strong> <?php echo $approvalDateFormatted; ?></div>
                <div class="field"><strong>Valid Until:</strong> <?php echo $expiryDateFormatted; ?></div>
                <div class="field"><strong>Reference Code:</strong> <span class="highlight"><?php echo htmlspecialchars($cert['cert_serial']); ?></span></div>
            </div>
        <?php endif; ?>

        <div class="footer">
            <p>For any inquiries, please contact: training@stjohnkenya.org</p>
            <p>© <?php echo date('Y'); ?> St John Ambulance Kenya. All rights reserved.</p>
        </div>
    </div>

    <script>
        // Insert today's date in the page
        document.getElementById('current-date').textContent = new Date().toLocaleDateString();
    </script>
</body>
</html>
