<?php
$page_title = 'Notification Hub';
require_once __DIR__ . '/../config.php';
if (session_status() === PHP_SESSION_NONE) { session_start(); }
if (!isset($_SESSION['admin_id'])) { redirect(SITE_URL . '/admin/login.php'); }
require_once __DIR__ . '/header.php';
?>

<div style="display:flex; justify-content:space-between; align-items:center; margin-bottom:24px;">
    <div>
        <h2 style="font-family:'Outfit', sans-serif; font-size:1.8rem; color:#0f172a; margin:0;"><i class="fas fa-bell" style="color:#f59e0b; margin-right:10px;"></i>Notification Hub</h2>
        <p style="color:#64748b; font-size:0.95rem; margin-top:5px;">Omni-channel communication: SMS, Email, Push, WhatsApp, Voice & more.</p>
    </div>
    <button style="background:linear-gradient(135deg,#f59e0b,#d97706); color:#fff; border:none; padding:10px 20px; border-radius:8px; font-size:0.9rem; cursor:pointer; font-weight:600;"><i class="fas fa-bullhorn"></i> New Broadcast</button>
</div>

<div class="grid-4" style="margin-bottom:24px;">
    <div style="background:#fff; padding:20px; border-radius:12px; border:1px solid #e2e8f0; border-top:4px solid #3b82f6;">
        <div style="color:#64748b; font-size:0.8rem; font-weight:600; margin-bottom:8px;">EMAILS SENT TODAY</div>
        <div style="font-size:1.6rem; font-weight:700; color:#0f172a;">1,842</div>
        <div style="color:#10b981; font-size:0.8rem; margin-top:5px;"><i class="fas fa-check"></i> 98.4% Delivered</div>
    </div>
    <div style="background:#fff; padding:20px; border-radius:12px; border:1px solid #e2e8f0; border-top:4px solid #25d366;">
        <div style="color:#64748b; font-size:0.8rem; font-weight:600; margin-bottom:8px;">WHATSAPP MESSAGES</div>
        <div style="font-size:1.6rem; font-weight:700; color:#0f172a;">3,240</div>
        <div style="color:#25d366; font-size:0.8rem; margin-top:5px;"><i class="fab fa-whatsapp"></i> 97.1% Read</div>
    </div>
    <div style="background:#fff; padding:20px; border-radius:12px; border:1px solid #e2e8f0; border-top:4px solid #8b5cf6;">
        <div style="color:#64748b; font-size:0.8rem; font-weight:600; margin-bottom:8px;">SMS DELIVERED</div>
        <div style="font-size:1.6rem; font-weight:700; color:#0f172a;">856</div>
        <div style="color:#8b5cf6; font-size:0.8rem; margin-top:5px;"><i class="fas fa-sms"></i> Via Bulk Gateway</div>
    </div>
    <div style="background:#fff; padding:20px; border-radius:12px; border:1px solid #e2e8f0; border-top:4px solid #ec4899;">
        <div style="color:#64748b; font-size:0.8rem; font-weight:600; margin-bottom:8px;">PUSH NOTIFICATIONS</div>
        <div style="font-size:1.6rem; font-weight:700; color:#0f172a;">4,120</div>
        <div style="color:#ec4899; font-size:0.8rem; margin-top:5px;"><i class="fas fa-mobile-alt"></i> App + Web</div>
    </div>
</div>

<div class="grid-2" style="margin-bottom:24px;">
    <div style="background:#fff; padding:20px; border-radius:12px; border:1px solid #e2e8f0;">
        <h3 style="margin:0 0 15px; font-size:1.15rem; color:#0f172a;"><i class="fas fa-satellite-dish" style="color:#3b82f6; margin-right:8px;"></i>Channel Status</h3>
        <?php
        $channels = [
            ['SMS Gateway', 'fas fa-sms', '#8b5cf6', 'Operational', 'Msg91 API', true],
            ['Email Gateway', 'fas fa-envelope', '#3b82f6', 'Operational', 'SendGrid SMTP', true],
            ['Push Notification', 'fas fa-bell', '#ec4899', 'Operational', 'Firebase FCM', true],
            ['In-App Alerts', 'fas fa-desktop', '#10b981', 'Operational', 'WebSocket Live', true],
            ['Voice Call Bot', 'fas fa-phone-alt', '#f59e0b', 'Degraded', 'Exotel IVR', false],
            ['WhatsApp Business', 'fab fa-whatsapp', '#25d366', 'Operational', 'Meta Cloud API', true],
        ];
        foreach ($channels as $ch): ?>
        <div style="border:1px solid #e2e8f0; border-radius:8px; padding:12px 15px; margin-bottom:10px; display:flex; justify-content:space-between; align-items:center;">
            <div style="display:flex; align-items:center; gap:12px;">
                <i class="<?= $ch[1] ?>" style="color:<?= $ch[2] ?>; font-size:1.2rem; width:22px; text-align:center;"></i>
                <div>
                    <div style="font-weight:600; font-size:0.9rem; color:#0f172a;"><?= $ch[0] ?></div>
                    <div style="font-size:0.75rem; color:#94a3b8;"><?= $ch[4] ?></div>
                </div>
            </div>
            <span style="background:<?= $ch[5] ? '#dcfce7' : '#fef3c7' ?>; color:<?= $ch[5] ? '#166534' : '#b45309' ?>; padding:3px 10px; border-radius:10px; font-size:0.7rem; font-weight:bold;"><?= $ch[3] ?></span>
        </div>
        <?php endforeach; ?>
    </div>

    <div style="display:flex; flex-direction:column; gap:24px;">
        <div style="background:#fff; padding:20px; border-radius:12px; border:1px solid #e2e8f0;">
            <h3 style="margin:0 0 15px; font-size:1.15rem; color:#0f172a;"><i class="fas fa-clock" style="color:#f59e0b; margin-right:8px;"></i>Scheduled Reminders</h3>
            <div style="border-left:3px solid #3b82f6; padding-left:12px; margin-bottom:15px;">
                <div style="font-weight:600; font-size:0.9rem;">Payment Reminder Batch</div>
                <div style="font-size:0.8rem; color:#64748b;">240 dealers · Scheduled 6:00 PM</div>
            </div>
            <div style="border-left:3px solid #10b981; padding-left:12px; margin-bottom:15px;">
                <div style="font-weight:600; font-size:0.9rem;">Order Dispatch Alerts</div>
                <div style="font-size:0.8rem; color:#64748b;">Auto-trigger on status change</div>
            </div>
            <div style="border-left:3px solid #f59e0b; padding-left:12px;">
                <div style="font-weight:600; font-size:0.9rem;">Monthly Newsletter</div>
                <div style="font-size:0.8rem; color:#64748b;">3,400 subscribers · May 1st 10 AM</div>
            </div>
        </div>

        <div style="background:linear-gradient(135deg,#0f172a,#1e293b); color:#fff; padding:20px; border-radius:12px;">
            <h3 style="margin:0 0 8px; font-size:1.1rem; color:#fbbf24;"><i class="fas fa-broadcast-tower"></i> Broadcast Center</h3>
            <p style="margin:0 0 15px; font-size:0.85rem; color:#94a3b8;">Send announcements across all channels simultaneously.</p>
            <textarea placeholder="Type your broadcast message..." style="width:100%; padding:10px; border:1px solid rgba(255,255,255,0.1); border-radius:8px; background:rgba(255,255,255,0.05); color:#fff; font-size:0.85rem; resize:none; height:60px; box-sizing:border-box;"></textarea>
            <button style="background:#f59e0b; color:#0f172a; border:none; padding:8px 16px; border-radius:6px; font-size:0.85rem; cursor:pointer; width:100%; font-weight:bold; margin-top:10px;">Send to All Channels</button>
        </div>
    </div>
</div>

<?php require_once __DIR__ . '/footer.php'; ?>
