<?php
$videos = isset($videos) ? $videos : array();
$stores = isset($stores) ? $stores : array();
$staff = isset($staff) ? $staff : array();
?>

<div class="container-fluid py-4">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <h4 class="fw-bold mb-1"><i class="fa-solid fa-video text-primary me-2"></i>Video Evidence Walkthroughs</h4>
            <p class="text-muted mb-0">Video recordings demonstrating kitchen cleanliness, toppings prep &amp; store area inspections.</p>
        </div>
        <div>
            <a href="<?php echo base_url('admin/photos'); ?>" class="btn btn-outline-primary">
                <i class="fa-solid fa-camera me-1"></i> Switch to Photo Gallery
            </a>
        </div>
    </div>

    <div class="row g-4">
        <?php if (empty($videos)): ?>
            <div class="col-12 text-center py-5 text-muted card border-0 shadow-sm rounded-4">
                <i class="fa-solid fa-video-slash fs-1 opacity-25 mb-3 d-block"></i>
                No video evidence walkthroughs submitted yet.
            </div>
        <?php else: ?>
            <?php foreach ($videos as $v): ?>
                <?php
                $sName = isset($stores[$v['storeId']]['name']) ? $stores[$v['storeId']]['name'] : (isset($v['storeId']) ? $v['storeId'] : 'Store');
                $staffName = isset($v['staffId']) ? $v['staffId'] : 'Staff';
                ?>
                <div class="col-md-6 col-xl-4">
                    <div class="card border-0 shadow-sm rounded-4 h-100 overflow-hidden">
                        <div class="position-relative bg-dark" style="height: 240px;">
                            <video class="w-100 h-100" controls preload="metadata">
                                <source src="<?php echo htmlspecialchars($v['mediaUrl']); ?>" type="video/mp4">
                                Your browser does not support the video tag.
                            </video>
                        </div>
                        <div class="card-body p-3">
                            <h6 class="fw-bold text-dark text-truncate mb-1"><?php echo htmlspecialchars(isset($v['taskName']) ? $v['taskName'] : 'Video Walkthrough'); ?></h6>
                            <div class="small text-muted mb-2"><i class="fa-solid fa-store me-1"></i><?php echo htmlspecialchars($sName); ?></div>
                            <div class="d-flex justify-content-between align-items-center small border-top pt-2 text-muted">
                                <span><i class="fa-solid fa-user me-1"></i><?php echo htmlspecialchars($staffName); ?></span>
                                <span><?php echo isset($v['submittedAt']) ? date('M d, h:i A', $v['submittedAt'] / 1000) : '-'; ?></span>
                            </div>
                        </div>
                    </div>
                </div>
            <?php endforeach; ?>
        <?php endif; ?>
    </div>
</div>
