<?php

/**
 * Super Admin — Business Dashboard View
 * Location: app/views/admin/dashboard.php
 */

/** @var string $search */
/** @var array $searchResults */
/** @var int $totalWorkspaces */
/** @var int $activeWorkspaces */
/** @var array $statusCounts */
/** @var int $starterPlans */
/** @var int $proPlans */
/** @var int $customPlans */
/** @var int $weddingEvents */
/** @var int $engagementEvents */
/** @var int $customEvents */
/** @var int $upcomingToday */
/** @var int $upcomingWeek */
/** @var array|null $closestEvent */
/** @var array $recentWorkspaces */
/** @var string|null $success */
/** @var string|null $info */

?>

<div class="max-w-6xl mx-auto space-y-6 fade-in">
    
    <!-- Header Block -->
    <div class="flex flex-col md:flex-row md:items-center md:justify-between gap-4">
        <div>
            <h1 class="page-h1">
                <span class="page-header-icon">
                    <i class="fa-solid fa-chart-line"></i>
                </span>
                Platform Overview
            </h1>
            <p class="page-subtitle">Manage wedding client workspaces, monitor subscription plan statistics, and provision isolated tenants.</p>
        </div>
        <div>
            <a href="<?= url('/app/admin/workspaces/create') ?>" class="btn btn-primary btn-md">
                <i class="fa-solid fa-plus text-[10px]"></i> Create Workspace
            </a>
        </div>
    </div>

    <!-- Success Flash Banners -->
    <?php if ($success): ?>
        <div class="alert alert-success bg-green-50 text-green-800 border border-green-200 rounded-xl p-4 flex items-start gap-3">
            <i class="fa-solid fa-circle-check text-green-500 mt-0.5 text-lg"></i>
            <div>
                <p class="text-xs font-bold"><?= escape_html($success) ?></p>
                <?php if ($info): ?><p class="text-[10px] mt-0.5 font-semibold text-green-700"><?= escape_html($info) ?></p><?php endif; ?>
            </div>
        </div>
    <?php endif; ?>

    <!-- Summary Statistics Grid (Part H) -->
    <div class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-7 gap-4">
        <!-- Card 1: Total -->
        <div class="bg-white border border-slate-150 rounded-2xl p-4 shadow-sm flex flex-col justify-between">
            <span class="text-[9px] uppercase font-black text-slate-400">Total</span>
            <p class="text-2xl font-black text-slate-800 font-mono mt-2"><?= $totalWorkspaces ?></p>
        </div>
        <!-- Card 2: Active -->
        <div class="bg-white border border-slate-150 rounded-2xl p-4 shadow-sm flex flex-col justify-between">
            <span class="text-[9px] uppercase font-black text-emerald-500">Active</span>
            <p class="text-2xl font-black text-emerald-600 font-mono mt-2"><?= $activeWorkspaces ?></p>
        </div>
        <!-- Card 3: Draft -->
        <div class="bg-white border border-slate-150 rounded-2xl p-4 shadow-sm flex flex-col justify-between">
            <span class="text-[9px] uppercase font-black text-slate-500">Draft</span>
            <p class="text-2xl font-black text-slate-700 font-mono mt-2"><?= $statusCounts['draft'] ?? 0 ?></p>
        </div>
        <!-- Card 4: Published -->
        <div class="bg-white border border-slate-150 rounded-2xl p-4 shadow-sm flex flex-col justify-between">
            <span class="text-[9px] uppercase font-black text-sky-500">Published</span>
            <p class="text-2xl font-black text-sky-600 font-mono mt-2"><?= $statusCounts['published'] ?? 0 ?></p>
        </div>
        <!-- Card 5: Completed -->
        <div class="bg-white border border-slate-150 rounded-2xl p-4 shadow-sm flex flex-col justify-between">
            <span class="text-[9px] uppercase font-black text-emerald-500">Completed</span>
            <p class="text-2xl font-black text-emerald-600 font-mono mt-2"><?= $statusCounts['completed'] ?? 0 ?></p>
        </div>
        <!-- Card 6: Archived -->
        <div class="bg-white border border-slate-150 rounded-2xl p-4 shadow-sm flex flex-col justify-between">
            <span class="text-[9px] uppercase font-black text-amber-500">Archived</span>
            <p class="text-2xl font-black text-amber-600 font-mono mt-2"><?= $statusCounts['archived'] ?? 0 ?></p>
        </div>
        <!-- Card 7: Suspended -->
        <div class="bg-white border border-slate-150 rounded-2xl p-4 shadow-sm flex flex-col justify-between">
            <span class="text-[9px] uppercase font-black text-rose-500">Suspended</span>
            <p class="text-2xl font-black text-rose-600 font-mono mt-2"><?= $statusCounts['suspended'] ?? 0 ?></p>
        </div>
    </div>

    <!-- Commercial, Event & Upcoming Summary Lists -->
    <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
        <!-- Commercial summary box -->
        <div class="bg-white border border-slate-150 rounded-2xl p-5 shadow-sm space-y-4">
            <h3 class="text-xs font-black text-slate-800 uppercase tracking-wider"><i class="fa-solid fa-wallet mr-1 text-slate-400"></i> Commercial Summary</h3>
            <div class="divide-y divide-slate-100 text-xs">
                <div class="py-2.5 flex justify-between items-center">
                    <span class="font-bold text-slate-650 flex items-center gap-1.5"><i class="fa-solid fa-award text-slate-400"></i> Starter Plan</span>
                    <span class="font-black font-mono text-slate-850"><?= $starterPlans ?></span>
                </div>
                <div class="py-2.5 flex justify-between items-center">
                    <span class="font-bold text-slate-650 flex items-center gap-1.5"><i class="fa-solid fa-crown text-amber-500"></i> Pro Plan</span>
                    <span class="font-black font-mono text-slate-855"><?= $proPlans ?></span>
                </div>
                <div class="py-2.5 flex justify-between items-center">
                    <span class="font-bold text-slate-650 flex items-center gap-1.5"><i class="fa-solid fa-gem" style="color: var(--brand-rose-gold);"></i> Custom Plan</span>
                    <span class="font-black font-mono text-slate-850"><?= $customPlans ?></span>
                </div>
            </div>
        </div>

        <!-- Event Summary Box -->
        <div class="bg-white border border-slate-150 rounded-2xl p-5 shadow-sm space-y-4">
            <h3 class="text-xs font-black text-slate-800 uppercase tracking-wider"><i class="fa-solid fa-calendar mr-1 text-slate-400"></i> Event Type Summary</h3>
            <div class="divide-y divide-slate-100 text-xs">
                <div class="py-2.5 flex justify-between items-center">
                    <span class="font-bold text-slate-650 flex items-center gap-1.5"><i class="fa-solid fa-heart" style="color: var(--brand-rose-gold);"></i> Wedding</span>
                    <span class="font-black font-mono text-slate-850"><?= $weddingEvents ?></span>
                </div>
                <div class="py-2.5 flex justify-between items-center">
                    <span class="font-bold text-slate-650 flex items-center gap-1.5"><i class="fa-solid fa-ring text-sky-400"></i> Engagement</span>
                    <span class="font-black font-mono text-slate-850"><?= $engagementEvents ?></span>
                </div>
                <div class="py-2.5 flex justify-between items-center">
                    <span class="font-bold text-slate-650 flex items-center gap-1.5"><i class="fa-solid fa-asterisk text-slate-400"></i> Custom Event</span>
                    <span class="font-black font-mono text-slate-850"><?= $customEvents ?></span>
                </div>
            </div>
        </div>

        <!-- Upcoming Schedule Box -->
        <div class="bg-white border border-slate-150 rounded-2xl p-5 shadow-sm space-y-4">
            <h3 class="text-xs font-black text-slate-800 uppercase tracking-wider"><i class="fa-solid fa-clock-rotate-left mr-1 text-slate-400"></i> Upcoming Events</h3>
            <div class="grid grid-cols-2 gap-3 text-center">
                <div class="bg-slate-50 border border-slate-100 rounded-xl p-2.5">
                    <span class="text-[9px] uppercase font-bold text-slate-400 block">Today</span>
                    <span class="text-base font-black font-mono text-slate-800"><?= $upcomingToday ?></span>
                </div>
                <div class="bg-slate-50 border border-slate-100 rounded-xl p-2.5">
                    <span class="text-[9px] uppercase font-bold text-slate-400 block">This Week</span>
                    <span class="text-base font-black font-mono text-slate-800"><?= $upcomingWeek ?></span>
                </div>
            </div>
        </div>
    </div>

    <!-- Closest Event & Quick Actions Grid -->
    <div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
        <!-- Closest Upcoming Event -->
        <div class="bg-white border border-slate-150 rounded-2xl p-5 shadow-sm space-y-4 lg:col-span-2">
            <h3 class="text-xs font-black text-slate-800 uppercase tracking-wider"><i class="fa-solid fa-hourglass-start mr-1 text-slate-400"></i> Closest Upcoming Event</h3>
            <?php if ($closestEvent): ?>
                <div class="bg-slate-50 border border-slate-100 rounded-2xl p-4 flex flex-wrap gap-4 items-center justify-between text-xs">
                    <div class="space-y-1">
                        <span class="text-[9px] uppercase font-bold text-slate-400 block">Couple names</span>
                        <p class="font-bold text-slate-800 text-sm"><?= escape_html("{$closestEvent['groom_name']} & {$closestEvent['bride_name']}") ?></p>
                    </div>
                    <div class="space-y-1">
                        <span class="text-[9px] uppercase font-bold text-slate-400 block">Event Type</span>
                        <span class="inline-flex items-center px-2 py-0.5 rounded text-[10px] font-bold border" style="border-color: var(--brand-rose-gold); background-color: var(--brand-rose-gold-lt); color: var(--brand-charcoal);"><?= escape_html($closestEvent['event_type']) ?></span>
                    </div>
                    <div class="space-y-1">
                        <span class="text-[9px] uppercase font-bold text-slate-400 block">Event Date</span>
                        <p class="font-mono font-bold text-slate-700"><?= escape_html($closestEvent['wedding_date']) ?></p>
                    </div>
                    <div class="space-y-1">
                        <span class="text-[9px] uppercase font-bold text-slate-400 block">Status</span>
                        <span class="px-2 py-0.5 rounded-full text-[9px] font-bold uppercase bg-emerald-50 text-emerald-700 border border-emerald-200"><?= escape_html($closestEvent['workspace_status']) ?></span>
                    </div>
                    <div>
                        <a href="<?= url("/app/admin/workspaces/{$closestEvent['id']}/open") ?>" class="btn btn-secondary text-[10px] font-bold py-1.5 px-3 rounded-lg border border-slate-200 bg-white">
                            <i class="fa-solid fa-folder-open mr-1"></i> Open Workspace
                        </a>
                    </div>
                </div>
            <?php else: ?>
                <div class="text-center py-6 text-slate-400 text-xs font-medium">
                    No scheduled upcoming events found.
                </div>
            <?php endif; ?>
        </div>

        <!-- Quick Actions -->
        <div class="bg-white border border-slate-150 rounded-2xl p-5 shadow-sm space-y-4">
            <h3 class="text-xs font-black text-slate-800 uppercase tracking-wider"><i class="fa-solid fa-bolt mr-1 text-slate-400"></i> Quick Actions</h3>
            <div class="grid grid-cols-1 gap-2 text-xs">
                <a href="<?= url('/app/admin/workspaces/create') ?>" class="w-full flex items-center justify-between bg-slate-50 hover:bg-slate-100 text-slate-700 font-bold p-3 rounded-xl border border-slate-100 transition-colors">
                    <span><i class="fa-solid fa-plus-circle mr-1 text-slate-400"></i> Create Workspace</span>
                    <i class="fa-solid fa-chevron-right text-[9px] text-slate-350"></i>
                </a>
                <a href="<?= url('/app/admin/crews') ?>" class="w-full flex items-center justify-between bg-slate-50 hover:bg-slate-100 text-slate-700 font-bold p-3 rounded-xl border border-slate-100 transition-colors">
                    <span><i class="fa-solid fa-users mr-1 text-slate-400"></i> Manage Crew Accounts</span>
                    <i class="fa-solid fa-chevron-right text-[9px] text-slate-350"></i>
                </a>
                <a href="<?= url('/app/admin/crews/assignments') ?>" class="w-full flex items-center justify-between bg-slate-50 hover:bg-slate-100 text-slate-700 font-bold p-3 rounded-xl border border-slate-100 transition-colors">
                    <span><i class="fa-solid fa-link mr-1 text-slate-400"></i> Workspace Assignments</span>
                    <i class="fa-solid fa-chevron-right text-[9px] text-slate-350"></i>
                </a>
            </div>
        </div>
    </div>

    <!-- Workspace Search Section (Part K) -->
    <div class="bg-white border border-slate-150 rounded-2xl p-5 shadow-sm space-y-6">
        <div class="flex flex-wrap items-center justify-between gap-4 border-b border-slate-100 pb-3">
            <div>
                <h3 class="text-xs font-black text-slate-800 uppercase tracking-wider"><i class="fa-solid fa-magnifying-glass mr-1 text-slate-400"></i> Global Workspace Search</h3>
                <p class="text-[10px] text-slate-400 mt-0.5">Filter by Workspace, Couple, Crew, Slug, Phone, Event Date, Status, or Plan.</p>
            </div>
        </div>

        <form method="GET" action="<?= url('/app/admin/dashboard') ?>" class="flex gap-2 max-w-xl">
            <input 
                type="text" 
                name="search" 
                value="<?= escape_html($search) ?>" 
                placeholder="Search workspaces..." 
                class="form-input text-xs w-full rounded-xl py-2 px-3.5"
                autocomplete="off"
            >
            <button type="submit" class="btn btn-secondary text-xs font-semibold px-4 rounded-xl">
                Search
            </button>
            <?php if ($search !== ''): ?>
                <a href="<?= url('/app/admin/dashboard') ?>" class="btn btn-secondary text-xs font-semibold px-3 rounded-xl flex items-center justify-center">
                    Clear
                </a>
            <?php endif; ?>
        </form>

        <?php if ($search !== ''): ?>
            <div class="overflow-x-auto border border-slate-100 rounded-xl">
                <table class="w-full text-left border-collapse text-xxs">
                    <thead>
                        <tr class="bg-slate-50 border-b border-slate-200 text-slate-400 uppercase font-black tracking-wider">
                            <th class="py-2.5 px-3">Workspace Name</th>
                            <th class="py-2.5 px-3">URL Slug</th>
                            <th class="py-2.5 px-3">Plan</th>
                            <th class="py-2.5 px-3">Guest Limit</th>
                            <th class="py-2.5 px-3">Event Date</th>
                            <th class="py-2.5 px-3">Status</th>
                            <th class="py-2.5 px-3 text-right">Actions</th>
                        </tr>
                    </thead>
                    <tbody class="divide-y divide-slate-100 text-slate-650">
                        <?php if (empty($searchResults)): ?>
                            <tr>
                                <td colspan="7" class="py-6 text-center text-slate-400 font-medium">
                                    No workspaces matched "<?= escape_html($search) ?>"
                                </td>
                            </tr>
                        <?php else: ?>
                            <?php foreach ($searchResults as $ws): 
                                $wsName = "{$ws['groom_name']} & {$ws['bride_name']}";
                                $limitLabel = $ws['custom_guest_limit'] !== null ? "{$ws['custom_guest_limit']} (Custom)" : 'Standard';
                            ?>
                                <tr class="hover:bg-slate-50/50 transition-colors">
                                    <td class="py-3 px-3 font-bold text-slate-800"><?= escape_html($wsName) ?></td>
                                    <td class="py-3 px-3 font-mono text-[9px]">/i/<?= escape_html($ws['slug']) ?></td>
                                    <td class="py-3 px-3">
                                        <span class="px-2 py-0.5 rounded-full text-[9px] font-black uppercase <?= $ws['plan_id'] == 2 ? 'bg-amber-50 text-amber-700 border border-amber-200' : ($ws['plan_id'] == 3 ? 'bg-[#F0E0D6] text-[#232323] border border-[#D4A28C]' : 'bg-slate-50 text-slate-650') ?>">
                                            <?= escape_html($ws['plan_name']) ?>
                                        </span>
                                    </td>
                                    <td class="py-3 px-3 font-mono"><?= $limitLabel ?></td>
                                    <td class="py-3 px-3 font-mono"><?= escape_html($ws['wedding_date']) ?></td>
                                    <td class="py-3 px-3">
                                        <span class="px-2 py-0.5 rounded-full text-[9px] font-bold uppercase <?= $ws['workspace_status'] === 'running' ? 'bg-emerald-50 text-emerald-700' : 'bg-slate-100 text-slate-600' ?>">
                                            <?= escape_html($ws['workspace_status']) ?>
                                        </span>
                                    </td>
                                    <td class="py-3 px-3 text-right">
                                        <a href="<?= url("/app/admin/workspaces/{$ws['id']}/open") ?>" class="btn btn-secondary text-[9px] font-black px-2.5 py-1 text-slate-650 border-slate-200 hover:bg-slate-50">
                                            <i class="fa-solid fa-folder-open mr-1 text-slate-400"></i> Open Workspace
                                        </a>
                                    </td>
                                </tr>
                            <?php endforeach; ?>
                        <?php endif; ?>
                    </tbody>
                </table>
            </div>
        <?php endif; ?>
    </div>

    <!-- Recent Workspaces list -->
    <div class="bg-white border border-slate-150 rounded-2xl p-5 shadow-sm space-y-4">
        <h3 class="text-xs font-black text-slate-800 uppercase tracking-wider"><i class="fa-solid fa-clock mr-1 text-slate-400"></i> Recent Workspaces</h3>
        <div class="overflow-x-auto border border-slate-100 rounded-xl">
            <table class="w-full text-left border-collapse text-xxs">
                <thead>
                    <tr class="bg-slate-50 border-b border-slate-200 text-slate-400 uppercase font-black tracking-wider">
                        <th class="py-2.5 px-3">Workspace Name</th>
                        <th class="py-2.5 px-3">URL Slug</th>
                        <th class="py-2.5 px-3">Plan</th>
                        <th class="py-2.5 px-3">Event Date</th>
                        <th class="py-2.5 px-3">Created At</th>
                        <th class="py-2.5 px-3">Status</th>
                        <th class="py-2.5 px-3 text-right">Actions</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-slate-100 text-slate-605">
                    <?php foreach ($recentWorkspaces as $ws): 
                        $wsName = "{$ws['groom_name']} & {$ws['bride_name']}";
                    ?>
                        <tr class="hover:bg-slate-50/50 transition-colors">
                            <td class="py-3 px-3 font-bold text-slate-800"><?= escape_html($wsName) ?></td>
                            <td class="py-3 px-3 font-mono text-[9px]">/i/<?= escape_html($ws['slug']) ?></td>
                            <td class="py-3 px-3">
                                <span class="px-2 py-0.5 rounded-full text-[9px] font-black uppercase text-slate-650 bg-slate-50 border border-slate-200">
                                    <?= escape_html($ws['plan_name']) ?>
                                </span>
                            </td>
                            <td class="py-3 px-3 font-mono"><?= escape_html($ws['wedding_date']) ?></td>
                            <td class="py-3 px-3 font-mono"><?= escape_html($ws['created_at']) ?></td>
                            <td class="py-3 px-3">
                                <span class="px-2 py-0.5 rounded-full text-[9px] font-bold uppercase bg-slate-100 text-slate-650">
                                    <?= escape_html($ws['workspace_status']) ?>
                                </span>
                            </td>
                            <td class="py-3 px-3 text-right">
                                <a href="<?= url("/app/admin/workspaces/{$ws['id']}/open") ?>" class="btn btn-secondary text-[9px] font-black px-2.5 py-1 text-slate-650 border-slate-200 hover:bg-slate-50">
                                    <i class="fa-solid fa-folder-open mr-1 text-slate-400"></i> Open
                                </a>
                            </td>
                        </tr>
                    <?php endforeach; ?>
                </tbody>
            </table>
        </div>
    </div>
</div>
