<?php
/**
 * Crew Portal — Assigned Weddings List
 * Location: app/views/operation/weddings_list.php
 *
 * Variables:
 *   $workspaces    — array — List of active weddings.
 *   $search        — string — Current search keyword.
 *   $page          — int — Current page index.
 *   $totalPages    — int — Total page count.
 *   $totalItems    — int — Total item count.
 */
?>
<div class="max-w-5xl mx-auto space-y-8 py-4">

    <!-- ── 1. Page Header & Search ── -->
    <div class="flex flex-col md:flex-row md:items-center justify-between gap-4">
        <div>
            <h1 class="text-2xl font-extrabold text-slate-900 tracking-tight">
                Assigned Weddings
            </h1>
            <p class="text-xs text-slate-500 mt-1">
                You have access to <?= (int)$totalItems ?> wedding workspace<?= $totalItems !== 1 ? 's' : '' ?>.
            </p>
        </div>

        <!-- Search Form -->
        <form action="<?= url('/app/crew/weddings') ?>" method="GET" class="flex items-center gap-2 m-0 w-full md:w-auto max-w-sm">
            <div class="relative w-full">
                <div class="pointer-events-none absolute inset-y-0 left-0 flex items-center pl-3">
                    <i class="fa-solid fa-magnifying-glass text-slate-400 text-xs"></i>
                </div>
                <input
                    type="text"
                    name="search"
                    value="<?= escape_html($search) ?>"
                    placeholder="Search by couple name..."
                    class="form-input text-xs pl-9 pr-8 py-2 w-full"
                >
                <?php if (!empty($search)): ?>
                    <a href="<?= url('/app/crew/weddings') ?>" class="absolute inset-y-0 right-0 flex items-center pr-3 text-slate-400 hover:text-slate-600 transition-colors">
                        <i class="fa-solid fa-xmark text-xs"></i>
                    </a>
                <?php endif; ?>
            </div>
            <button type="submit" class="btn btn-primary py-2 px-4 text-xs font-bold text-white shadow-sm flex-shrink-0">
                Search
            </button>
        </form>
    </div>

    <!-- ── 2. Weddings List Grid ── -->
    <?php if (empty($workspaces)): ?>
        <div class="bg-white rounded-2xl border border-slate-100 p-16 shadow-sm text-center space-y-3">
            <span class="text-4xl block">🔍</span>
            <h3 class="text-sm font-bold text-slate-700">No Weddings Found</h3>
            <p class="text-xs text-slate-400 max-w-xs mx-auto">We couldn't find any assigned weddings matching your query.</p>
            <?php if (!empty($search)): ?>
                <div class="pt-2">
                    <a href="<?= url('/app/crew/weddings') ?>" class="btn btn-secondary py-1.5 px-4 text-xs font-bold">
                        Clear Search
                    </a>
                </div>
            <?php endif; ?>
        </div>
    <?php else: ?>
        <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
            <?php foreach ($workspaces as $w): 
                $coupleName = "{$w['groom_name']} & {$w['bride_name']}";
                $statusColor = 'bg-slate-100 text-slate-700';
                if ($w['workspace_status'] === 'live') {
                    $statusColor = 'bg-green-100 text-green-800 border border-green-200';
                } elseif ($w['workspace_status'] === 'active') {
                    $statusColor = 'bg-blue-100 text-blue-800 border border-blue-200';
                }
            ?>
                <div class="bg-white rounded-2xl border border-slate-100 shadow-sm p-6 flex flex-col justify-between hover:shadow-md transition-shadow duration-200">
                    <div class="space-y-4">
                        <div class="flex items-start justify-between gap-4">
                            <h3 class="text-base font-bold text-slate-800 leading-snug">
                                <?= escape_html($coupleName) ?>
                            </h3>
                            <span class="inline-flex items-center px-2 py-0.5 rounded-full text-[9px] font-bold uppercase tracking-wider <?= $statusColor ?>">
                                <?= escape_html($w['workspace_status']) ?>
                            </span>
                        </div>

                        <div class="space-y-2 border-t border-slate-50 pt-3">
                            <div class="flex items-center gap-2 text-xs text-slate-500">
                                <i class="fa-solid fa-calendar text-slate-400 w-4"></i>
                                <span><?= date('F d, Y', strtotime($w['wedding_date'])) ?></span>
                            </div>
                            <div class="flex items-start gap-2 text-xs text-slate-500">
                                <i class="fa-solid fa-location-dot text-slate-400 w-4 mt-0.5"></i>
                                <span class="line-clamp-2"><?= escape_html($w['venue_name'] ?: 'Venue TBD') ?></span>
                            </div>
                        </div>
                    </div>

                    <div class="pt-6 border-t border-slate-50 mt-4 flex items-center justify-between">
                        <span class="text-[10px] font-semibold text-slate-400 uppercase tracking-widest">
                            Slug: <?= escape_html($w['slug']) ?>
                        </span>
                        <form action="<?= url('/app/crew/select-workspace') ?>" method="POST" class="m-0">
                            <?= csrf_field() ?>
                            <input type="hidden" name="workspace_id" value="<?= (int)$w['id'] ?>">
                            <button type="submit" class="btn btn-secondary py-1.5 px-4 text-xs font-bold uppercase tracking-wider inline-flex items-center gap-1.5 hover:bg-slate-100">
                                Open Workspace <i class="fa-solid fa-arrow-right-to-bracket text-[9px]"></i>
                            </button>
                        </form>
                    </div>
                </div>
            <?php endforeach; ?>
        </div>

        <!-- ── 3. Pagination Controls ── -->
        <?php if ($totalPages > 1): ?>
            <div class="flex items-center justify-between border-t border-slate-100 pt-6 mt-4">
                <div class="text-xs text-slate-500">
                    Showing Page <strong><?= (int)$page ?></strong> of <strong><?= (int)$totalPages ?></strong>
                </div>
                <div class="flex gap-2">
                    <?php if ($page > 1): ?>
                        <a href="<?= url('/app/crew/weddings') ?>?page=<?= $page - 1 ?><?= !empty($search) ? '&search=' . urlencode($search) : '' ?>" class="btn btn-secondary py-1.5 px-3 text-xs font-bold inline-flex items-center gap-1">
                            <i class="fa-solid fa-chevron-left"></i> Previous
                        </a>
                    <?php endif; ?>
                    <?php if ($page < $totalPages): ?>
                        <a href="<?= url('/app/crew/weddings') ?>?page=<?= $page + 1 ?><?= !empty($search) ? '&search=' . urlencode($search) : '' ?>" class="btn btn-secondary py-1.5 px-3 text-xs font-bold inline-flex items-center gap-1">
                            Next <i class="fa-solid fa-chevron-right"></i>
                        </a>
                    <?php endif; ?>
                </div>
            </div>
        <?php endif; ?>
    <?php endif; ?>

</div>
