<?php
/**
 * سودانا — Presentation Mode (Full HTML)
 * Route: /presentation/start.php
 * Flow: Intro→Problem→Solution→Services→Payment→AI→Ledger→Recon→Security→Closing
 * Text-only · Bilingual · Step-based · No voice
 */
require_once __DIR__ . '/../config.php';

$lang = in_array($_GET['lang'] ?? 'ar', ['ar','en']) ? ($_GET['lang'] ?? 'ar') : 'ar';
$dir  = $lang === 'ar' ? 'rtl' : 'ltr';

// API mode — JSON only
if (!empty($_GET['step']) || !empty($_GET['all'])) {
    header('Content-Type: application/json; charset=utf-8');
    $steps = getSteps($lang);
    $step  = (int)($_GET['step'] ?? 0);
    if ($step > 0 && isset($steps[$step])) {
        echo json_encode([
            'step'     => $step,
            'total'    => count($steps),
            'title'    => $steps[$step]['title'],
            'body'     => $steps[$step]['body'],
            'icon'     => $steps[$step]['icon'],
            'next'     => $step < count($steps) ? $step + 1 : null,
            'is_last'  => $step === count($steps),
        ], JSON_UNESCAPED_UNICODE);
    } else {
        echo json_encode(['steps' => array_values($steps), 'total' => count($steps)],
            JSON_UNESCAPED_UNICODE);
    }
    exit;
}

$steps = getSteps($lang);
$totalSteps = count($steps);

function getSteps(string $lang): array {
    $ar = $lang === 'ar';
    return [
        1  => ['icon'=>'🇸🇩','title'=>$ar?'مرحباً بكم في سودانا':'Welcome to Sudanna',
               'body'=>$ar?"أول منصة خدمات ذكية في السودان\n\nتربط المواطنين بـ:\n• الأطباء والمستشفيات 🏥\n• المحامين والمستشارين ⚖️\n• خبراء الأعمال والاستثمار 💼\n• خدمات التعليم والمجتمع 🎓\n\n45 مليون مواطن. مشكلة واحدة. حل واحد."
                         :"Sudan's first AI-powered services platform\n\nConnecting citizens to:\n• Doctors & Hospitals 🏥\n• Lawyers & Legal Advisors ⚖️\n• Business & Investment Experts 💼\n• Education & Community 🎓\n\n45M citizens. One problem. One solution."],
        2  => ['icon'=>'❌','title'=>$ar?'المشكلة':'The Problem',
               'body'=>$ar?"الواقع الصعب في السودان:\n\n• 70% من المواطنين لا يصلون للخدمات المتخصصة\n• لا يوجد نظام موثوق للدفع والحجز\n• معلومات غير دقيقة ومتناثرة\n• لا توثيق للمعاملات المالية\n• فجوة رقمية بين المدن والأرياف"
                         :"Sudan's real challenges:\n\n• 70% lack access to specialized services\n• No reliable payment & booking system\n• Inaccurate, scattered information\n• No financial transaction documentation\n• Digital divide between urban & rural"],
        3  => ['icon'=>'✅','title'=>$ar?'الحل: سودانا':'The Solution: Sudanna',
               'body'=>$ar?"سودانا تحل المشكلة بـ:\n\n🤖 ذكاء اصطناعي يفهم العربية واللهجة السودانية\n💳 نظام دفع ثنائي (أوفلاين + Gateway)\n📋 محاسبة مزدوجة شفافة وقابلة للتدقيق\n🔒 أمان بمعايير بنكية\n⚖️ تسوية يومية تلقائية\n📱 يعمل على كل الأجهزة"
                         :"Sudanna solves it with:\n\n🤖 AI understanding Arabic & Sudanese dialect\n💳 Dual payment system (offline + gateway)\n📋 Transparent, auditable double-entry accounting\n🔒 Bank-grade security\n⚖️ Automatic daily reconciliation\n📱 Works on all devices"],
        4  => ['icon'=>'🛠️','title'=>$ar?'الخدمات الخمس':'Five Core Services',
               'body'=>$ar?"1️⃣ الصحة — استشارات طبية + حجز أطباء + صيدليات\n2️⃣ القانون — محامون + عقود + استشارات قانونية\n3️⃣ الأعمال — خطط أعمال + CRM + استثمار\n4️⃣ التعليم — دروس + مناهج + شهادات\n5️⃣ المجتمع — أحداث + سوق + أسرة + حي\n\nكل خدمة = مزود حقيقي موثّق + ذكاء اصطناعي يدير التجربة"
                         :"1️⃣ Health — Medical consultations + booking + pharmacies\n2️⃣ Law — Lawyers + contracts + legal consultations\n3️⃣ Business — Plans + CRM + investment\n4️⃣ Education — Lessons + curricula + certificates\n5️⃣ Community — Events + marketplace + family + neighborhood\n\nEvery service = verified real provider + AI managing the experience"],
        5  => ['icon'=>'💳','title'=>$ar?'نظام الدفع الثنائي':'Dual Payment System',
               'body'=>$ar?"المسار الأول — أوفلاين:\n  فاتورة → تحويل بنكي → رفع إيصال\n  → Admin يوافق → تأكيد\n\nالمسار الثاني — Gateway:\n  فاتورة → بوابة دفع → Webhook\n  → التحقق HMAC → تأكيد\n\nكلاهما ينتهيان بـ:\n  EventBus('payment.confirmed')\n  → محاسبة مزدوجة → إيصال → بريد\n\nضمانات:\n  ✅ reference_code UNIQUE\n  ✅ txn_id UNIQUE\n  ✅ file_hash UNIQUE (SHA256)"
                         :"Path 1 — Offline:\n  Invoice → Bank transfer → Upload proof\n  → Admin approval → Confirm\n\nPath 2 — Gateway:\n  Invoice → Payment gateway → Webhook\n  → HMAC verification → Confirm\n\nBoth end with:\n  EventBus('payment.confirmed')\n  → Accounting → Receipt → Email\n\nGuarantees:\n  ✅ reference_code UNIQUE\n  ✅ txn_id UNIQUE\n  ✅ file_hash UNIQUE (SHA256)"],
        6  => ['icon'=>'🤖','title'=>$ar?'طبقة الذكاء الاصطناعي':'AI Layer',
               'body'=>$ar?"ثلاثة مستويات:\n\n1️⃣ InferenceEngine\n   610 قاعدة · 19 قطاع · اختبار 19/19\n   \"محتاج محامي\" → legal (0.88)\n   \"طفلي مريض\" → medical (0.91)\n\n2️⃣ Decision Gate\n   CashFlow → Risk → Fraud → Limits\n   يحمي كل معاملة · trace_id\n\n3️⃣ AIOrchestrator\n   Decision → Policy → Control → Task → Growth\n   ينفذ: قرارات · مهام · إشعارات · KPI"
                         :"Three levels:\n\n1️⃣ InferenceEngine\n   610 rules · 19 sectors · 19/19 live test\n   \"need a lawyer\" → legal (0.88)\n   \"my child is sick\" → medical (0.91)\n\n2️⃣ Decision Gate\n   CashFlow → Risk → Fraud → Limits\n   Protects every transaction · trace_id\n\n3️⃣ AIOrchestrator\n   Decision → Policy → Control → Task → Growth\n   Executes: decisions · tasks · notifications · KPI"],
        7  => ['icon'=>'📊','title'=>$ar?'المحاسبة المزدوجة':'Double-Entry Accounting',
               'body'=>$ar?"لكل دفعة (1000 SDG):\n\n  مدين  Cash(1001)           1000\n  دائن  UserLiability(2001)  1000\n  مدين  UserLiability(2001)  1000\n  دائن  UserWallet(1002)     1000\n  ─────────────────────────────\n  SUM(مدين) = 2000 = SUM(دائن) ✅\n\nالفرق = 0 دائماً\n\nمبدأ NO_CUSTODY:\n  سودانا لا تحتجز الأموال\n  البنك هو مصدر الحقيقة"
                         :"For each payment (1000 SDG):\n\n  DEBIT  Cash(1001)           1000\n  CREDIT UserLiability(2001)  1000\n  DEBIT  UserLiability(2001)  1000\n  CREDIT UserWallet(1002)     1000\n  ─────────────────────────────\n  SUM(debit) = 2000 = SUM(credit) ✅\n\nDifference = 0 always\n\nNO_CUSTODY principle:\n  Sudanna never holds money\n  Bank is source of truth"],
        8  => ['icon'=>'⚖️','title'=>$ar?'التسوية والصرف':'Reconciliation & Settlement',
               'body'=>$ar?"يومياً في 2:30 صباحاً:\n  ReconciliationEngine::run(date)\n  النظام ↔ السجل المحاسبي ↔ البنك\n\nإذا نجحت التسوية:\n  3:00 صباحاً → SettlementEngine::processDate()\n  صرف المزودين (90% من الإيرادات)\n\nإذا اكتُشف خلل:\n  → حجب الصرف فوراً\n  → تنبيه Admin\n  → تسجيل في audit_logs (لا يُمحى)"
                         :"Daily at 2:30 AM:\n  ReconciliationEngine::run(date)\n  System ↔ Ledger ↔ Bank\n\nIf reconciliation passes:\n  3:00 AM → SettlementEngine::processDate()\n  Provider payouts (90% of revenue)\n\nIf mismatch detected:\n  → Block payout immediately\n  → Alert Admin\n  → Log in audit_logs (immutable)"],
        9  => ['icon'=>'🧠','title'=>$ar?'محركات الذكاء المتخصصة':'Specialist AI Engines',
               'body'=>$ar?"14 مساعد متخصص يعمل معاً:\n\n🏥 الطبي: لا تشخيص — HARD GATE حقيقي\n⚖️ القانوني: لا رأي ملزم\n🧠 النفسي: استجابة تعاطفية\n🎓 التعليمي: بالعربية السودانية\n🌾 الزراعي: يعرف التقويم السوداني\n💼 الأعمال: BDE + CRM\n+ 8 متخصصين آخرين\n\nكل مساعد له: guard + safety_rules + specialist_prompt":
               "14 specialist assistants working together:\n\n🏥 Medical: No diagnosis — real HARD GATE\n⚖️ Legal: No binding advice\n🧠 Mental: Empathetic response\n🎓 Education: Sudanese Arabic dialect\n🌾 Agriculture: Knows Sudan's farming calendar\n💼 Business: BDE + CRM\n+ 8 more specialists\n\nEach has: guard + safety_rules + specialist_prompt"],
        10 => ['icon'=>'🔒','title'=>$ar?'الأمان':'Security',
               'body'=>$ar?"معايير بنكية:\n\n✅ HTTPS إلزامي على كل الطلبات\n✅ WEBHOOK_SECRET: HMAC-SHA256 فقط\n   (لا test bypass في الإنتاج)\n✅ لا مفاتيح مضمّنة في الكود\n✅ PDO Prepared Statements\n✅ CSRF في لوحة الإدارة (103 حماية)\n✅ rate_limits: حماية من الإساءة\n✅ audit_logs غير قابلة للحذف\n✅ Worker: flock + dead-letter\n✅ .env: permissions 600"
                         :"Bank-grade standards:\n\n✅ HTTPS mandatory on all requests\n✅ WEBHOOK_SECRET: HMAC-SHA256 only\n   (no test bypass in production)\n✅ No hardcoded secrets in code\n✅ PDO Prepared Statements\n✅ CSRF on admin panel (103 protections)\n✅ rate_limits: abuse protection\n✅ audit_logs immutable\n✅ Worker: flock + dead-letter\n✅ .env: permissions 600"],
        10 => ['icon'=>'🚀','title'=>$ar?'جاهز للبنوك والمستثمرين':'Bank & Investor Ready',
               'body'=>$ar?"النظام الآن:\n\n✅ 156 ملف PHP · 0 أخطاء\n✅ 610 قاعدة ذكاء اصطناعي · 19 قطاع\n✅ 14 مساعد متخصص (AssistantEngine)\n✅ 97 جدول في قاعدة البيانات\n✅ 80 API endpoint · 37 محرك\n✅ دفع ثنائي + محاسبة مزدوجة\n✅ تسوية + صرف آلي يومي\n✅ BankAdapter: sandbox → live\n\nللتفعيل البنكي:\n  BANK_INTEGRATION_ENABLED=true\n  BANK_API_KEY=real_credentials\n\nالمنصة تعمل LIVE الآن."
                         :"System today:\n\n✅ 156 PHP files · 0 errors\n✅ 610 AI rules\n✅ 83 database tables\n✅ Dual payment + double-entry accounting\n✅ Automated daily reconciliation + settlement\n✅ BankAdapter: sandbox → live\n\nTo activate bank:\n  BANK_INTEGRATION_ENABLED=true\n  BANK_API_KEY=real_credentials\n\nPlatform is LIVE now."],
    ];
}
?>
<!DOCTYPE html>
<html lang="<?= $lang ?>" dir="<?= $dir ?>">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Sudanna AI OS — <?= $lang==='ar'?'عرض تقديمي':'Presentation' ?></title>
<link href="https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;900&display=swap" rel="stylesheet">
<style>
:root{--g1:#073328;--g2:#0B4D3B;--g3:#1a7255;--gold:#D4AF37;--sand:#FAF6EF;--border:#E2D8CC;--text:#1C1A16;--text2:#5A5550}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Cairo',sans-serif;background:var(--g1);color:#fff;min-height:100vh;display:flex;flex-direction:column;overflow:hidden}

/* ── Top bar ── */
.pbar{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background:rgba(0,0,0,.2);border-bottom:1px solid rgba(255,255,255,.08)}
.pbar .logo{font-weight:900;font-size:1.1rem;color:var(--gold)}
.lang-btn{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.8);padding:5px 14px;border-radius:20px;font-size:.82rem;cursor:pointer;font-family:inherit;transition:all .2s}
.lang-btn:hover{background:rgba(255,255,255,.2)}

/* ── Step indicator ── */
.step-bar{display:flex;align-items:center;justify-content:center;gap:6px;padding:12px 24px;background:rgba(0,0,0,.15)}
.step-dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.2);transition:all .3s;cursor:pointer}
.step-dot.done{background:var(--gold);opacity:.6}
.step-dot.active{background:var(--gold);width:24px;border-radius:4px}
.step-count{position:absolute;right:24px;font-size:.78rem;color:rgba(255,255,255,.5)}

/* ── Main content ── */
.pstage{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px 24px;max-width:680px;margin:0 auto;width:100%;position:relative}
.step-icon{font-size:4rem;margin-bottom:20px;animation:iconIn .4s ease}
@keyframes iconIn{from{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}
.step-title{font-size:clamp(1.5rem,4vw,2.2rem);font-weight:900;color:#fff;margin-bottom:20px;text-align:center;line-height:1.3}
.step-body{font-size:clamp(.9rem,2vw,1.05rem);color:rgba(255,255,255,.85);line-height:1.9;white-space:pre-line;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:24px 28px;width:100%;max-width:580px;animation:bodyIn .3s ease}
@keyframes bodyIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}

/* ── Navigation ── */
.pnav{display:flex;gap:12px;padding:20px 24px;justify-content:center;align-items:center}
.pnav-btn{padding:12px 28px;border-radius:12px;font-weight:700;font-size:.95rem;border:none;cursor:pointer;font-family:inherit;transition:all .2s;display:flex;align-items:center;gap:8px}
.btn-prev{background:rgba(255,255,255,.1);color:rgba(255,255,255,.8);border:1.5px solid rgba(255,255,255,.2)}
.btn-prev:hover{background:rgba(255,255,255,.2)}
.btn-next{background:var(--gold);color:var(--g1)}
.btn-next:hover{background:#c8a82f;transform:scale(1.03)}
.btn-next:disabled{background:rgba(255,255,255,.2);color:rgba(255,255,255,.5);cursor:not-allowed;transform:none}
.btn-restart{background:var(--g3);color:#fff}
.btn-restart:hover{background:var(--g2)}

/* ── Progress text ── */
.progress-text{font-size:.78rem;color:rgba(255,255,255,.5);text-align:center;margin-top:8px}

/* ── Keyboard hint ── */
.kbd-hint{position:fixed;bottom:16px;right:24px;font-size:.72rem;color:rgba(255,255,255,.3)}

/* ── Slide animation ── */
.slide-in-right{animation:slideR .3s ease}
.slide-in-left{animation:slideL .3s ease}
@keyframes slideR{from{opacity:0;transform:translateX(40px)}to{opacity:1;transform:translateX(0)}}
@keyframes slideL{from{opacity:0;transform:translateX(-40px)}to{opacity:1;transform:translateX(0)}}
</style>
</head>
<body>

<!-- Top bar -->
<div class="pbar">
  <span class="logo">🇸🇩 Sudanna AI OS</span>
  <div style="display:flex;align-items:center;gap:12px">
    <button class="lang-btn" id="lang-toggle" onclick="toggleLang()">
      <?= $lang==='ar' ? 'English' : 'العربية' ?>
    </button>
    <a href="<?= SITE_URL ?>/" style="color:rgba(255,255,255,.5);font-size:.82rem;text-decoration:none">✕</a>
  </div>
</div>

<!-- Step dots -->
<div class="step-bar" style="position:relative">
  <?php for($i=1;$i<=$totalSteps;$i++): ?>
  <div class="step-dot" id="dot-<?= $i ?>" onclick="goTo(<?= $i ?>)" title="<?= $i ?>"></div>
  <?php endfor; ?>
  <span class="step-count" id="step-count">1 / <?= $totalSteps ?></span>
</div>

<!-- Stage -->
<div class="pstage">
  <div class="step-icon" id="step-icon"><?= $steps[1]['icon'] ?></div>
  <h1 class="step-title" id="step-title"><?= htmlspecialchars($steps[1]['title']) ?></h1>
  <div class="step-body" id="step-body"><?= htmlspecialchars($steps[1]['body']) ?></div>
</div>

<!-- Navigation -->
<div class="pnav">
  <button class="pnav-btn btn-prev" id="btn-prev" onclick="navigate(-1)" style="visibility:hidden">
    <?= $lang==='ar' ? '→ السابق' : '← Previous' ?>
  </button>
  <div style="text-align:center">
    <button class="pnav-btn btn-next" id="btn-next" onclick="navigate(1)">
      <?= $lang==='ar' ? 'التالي ←' : 'Next →' ?>
    </button>
    <div class="progress-text" id="progress-text">1 / <?= $totalSteps ?></div>
  </div>
  <div style="width:120px"></div>
</div>

<div class="kbd-hint">← → <?= $lang==='ar' ? 'للتنقل' : 'to navigate' ?></div>

<script>
const STEPS = <?= json_encode(array_values($steps), JSON_UNESCAPED_UNICODE) ?>;
const TOTAL = STEPS.length;
let current = 0;
let curLang  = '<?= $lang ?>';
const SITE_URL = '<?= rtrim(SITE_URL,'/') ?>';

function renderStep(idx, dir = 'right') {
  const s = STEPS[idx];
  const icon  = document.getElementById('step-icon');
  const title = document.getElementById('step-title');
  const body  = document.getElementById('step-body');
  const prev  = document.getElementById('btn-prev');
  const next  = document.getElementById('btn-next');
  const count = document.getElementById('step-count');
  const prog  = document.getElementById('progress-text');

  icon.textContent  = s.icon;
  icon.style.animation = 'none'; void icon.offsetWidth; icon.style.animation = '';
  title.textContent = s.title;
  body.textContent  = s.body;
  body.className    = 'step-body ' + (dir==='right'?'slide-in-right':'slide-in-left');

  // Update dots
  document.querySelectorAll('.step-dot').forEach((d,i) => {
    d.classList.toggle('done', i < idx);
    d.classList.toggle('active', i === idx);
  });

  const stepNum = idx + 1;
  count.textContent = stepNum + ' / ' + TOTAL;
  prog.textContent  = stepNum + ' / ' + TOTAL;

  // Buttons
  prev.style.visibility = idx === 0 ? 'hidden' : 'visible';
  if (idx === TOTAL - 1) {
    next.innerHTML = curLang==='ar' ? '🔄 إعادة العرض' : '🔄 Restart';
    next.className = 'pnav-btn btn-restart';
    next.onclick = () => navigate(-999);
  } else {
    next.innerHTML = curLang==='ar' ? 'التالي ←' : 'Next →';
    next.className = 'pnav-btn btn-next';
    next.onclick = () => navigate(1);
  }

  document.title = (stepNum) + '. ' + s.title + ' — Sudanna';
}

function navigate(delta) {
  if (delta === -999) { current = 0; renderStep(current,'left'); return; }
  const next = current + delta;
  if (next < 0 || next >= TOTAL) return;
  renderStep(next, delta > 0 ? 'right' : 'left');
  current = next;
}

function goTo(stepNum) {
  const idx = stepNum - 1;
  renderStep(idx, idx > current ? 'right' : 'left');
  current = idx;
}

// Keyboard navigation
document.addEventListener('keydown', e => {
  if (e.key === 'ArrowLeft')  navigate(curLang==='ar' ? 1 : -1);
  if (e.key === 'ArrowRight') navigate(curLang==='ar' ? -1 : 1);
  if (e.key === 'ArrowDown' || e.key === 'PageDown') navigate(1);
  if (e.key === 'ArrowUp'   || e.key === 'PageUp')   navigate(-1);
});

// Language toggle
function toggleLang() {
  const newLang = curLang === 'ar' ? 'en' : 'ar';
  window.location.href = '?lang=' + newLang + '&step=' + (current+1);
}

// Initialize
renderStep(0, 'right');
</script>
<div style="position:fixed;bottom:20px;right:20px;z-index:100">
  <a href="<?= SITE_URL ?>/demo/run.php" target="_blank"
     style="background:var(--gold);color:var(--g1);padding:10px 18px;border-radius:10px;text-decoration:none;font-weight:700;font-size:.85rem;display:flex;align-items:center;gap:6px;box-shadow:0 4px 12px rgba(0,0,0,.15)">
    ▶ <?= $lang==='ar'?'عرض تجريبي':'Live Demo' ?>
  </a>
</div>
</body>
</html>
