<?php $__template->layout('Layout.main'); ?>
<?php $__template->section('title'); ?><?= isset($isReport) ? 'تقرير الكروت' : 'كروت النشاط الرياضي' ?><?php $__template->endSection(); ?>

<?php $__template->section('page_actions'); ?>
<a href="/sa/registration" class="btn btn-outline"><i data-lucide="user-plus" style="width:15px;height:15px;vertical-align:middle;margin-left:4px;"></i> تسجيل جديد</a>
<?php if (!isset($isReport)): ?>
<a href="/sa/cards/report" class="btn btn-outline"><i data-lucide="bar-chart-3" style="width:15px;height:15px;vertical-align:middle;margin-left:4px;"></i> التقرير</a>
<?php endif; ?>
<?php $__template->endSection(); ?>

<?php $__template->section('content'); ?>

<?php if (isset($showDetail) && isset($card)): ?>
<!-- Card Detail View -->
<div class="card" style="margin-bottom:20px;">
    <div style="padding:20px;display:flex;gap:20px;align-items:flex-start;">
        <div style="width:80px;height:80px;border-radius:10px;overflow:hidden;background:#F3F4F6;flex-shrink:0;">
            <?php if ($card['player_photo']): ?>
            <img src="/<?= e($card['player_photo']) ?>" style="width:100%;height:100%;object-fit:cover;">
            <?php else: ?>
            <div style="width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#9CA3AF;font-size:11px;">لا صورة</div>
            <?php endif; ?>
        </div>
        <div style="flex:1;">
            <h3 style="margin:0 0 5px;font-size:18px;"><?= e($card['full_name_ar']) ?></h3>
            <div style="font-size:13px;color:#6B7280;">
                كارت: <strong style="direction:ltr;"><?= e($card['card_number']) ?></strong>
                — <?= $card['player_type'] === 'member' ? 'عضو' : 'غير عضو' ?>
                <?php if ($card['discipline_name']): ?> — <?= e($card['discipline_name']) ?><?php endif; ?>
            </div>
            <div style="margin-top:8px;display:flex;gap:10px;flex-wrap:wrap;">
                <?php
                $statusColors = ['active' => '#059669', 'temporary' => '#F59E0B', 'expired' => '#6B7280', 'suspended' => '#DC2626', 'revoked' => '#7C3AED'];
                $statusLabels = ['active' => 'نشط', 'temporary' => 'مؤقت', 'expired' => 'منتهي', 'suspended' => 'موقوف', 'revoked' => 'ملغى'];
                $sc = $statusColors[$card['status']] ?? '#6B7280';
                ?>
                <span style="padding:4px 12px;border-radius:20px;font-size:12px;font-weight:600;background:<?= $sc ?>15;color:<?= $sc ?>;"><?= $statusLabels[$card['status']] ?? $card['status'] ?></span>
                <span style="font-size:12px;color:#6B7280;">صالح من: <?= e(substr($card['valid_from'], 0, 10)) ?></span>
                <?php if ($card['valid_until']): ?><span style="font-size:12px;color:#6B7280;">حتى: <?= e($card['valid_until']) ?></span><?php endif; ?>
            </div>
        </div>
        <div style="display:flex;gap:8px;flex-wrap:wrap;">
            <a href="/sa/cards/<?= (int) $card['id'] ?>/print" target="_blank" class="btn btn-outline" style="font-size:12px;padding:6px 12px;"><i data-lucide="printer" style="width:13px;height:13px;vertical-align:middle;margin-left:3px;"></i> طباعة</a>
            <?php if ($card['status'] === 'active'): ?>
            <form method="POST" action="/sa/cards/<?= (int) $card['id'] ?>/suspend" style="display:inline;"><?= csrf_field() ?><button class="btn btn-outline" style="font-size:12px;padding:6px 12px;color:#DC2626;border-color:#DC2626;" onclick="return confirm('إيقاف الكارت؟')">إيقاف</button></form>
            <?php endif; ?>
            <?php if ($card['status'] === 'suspended'): ?>
            <form method="POST" action="/sa/cards/<?= (int) $card['id'] ?>/reactivate" style="display:inline;"><?= csrf_field() ?><button class="btn btn-primary" style="font-size:12px;padding:6px 12px;">تفعيل</button></form>
            <?php endif; ?>
            <?php if (in_array($card['status'], ['active', 'suspended', 'temporary'])): ?>
            <form method="POST" action="/sa/cards/<?= (int) $card['id'] ?>/revoke" style="display:inline;"><?= csrf_field() ?><button class="btn btn-outline" style="font-size:12px;padding:6px 12px;color:#7C3AED;border-color:#7C3AED;" onclick="return confirm('إلغاء الكارت نهائياً؟')">إلغاء</button></form>
            <?php endif; ?>
        </div>
    </div>
</div>

<?php if (!empty($accessHistory)): ?>
<div class="card">
    <div style="padding:15px 20px;border-bottom:1px solid #E5E7EB;"><h3 style="margin:0;font-size:15px;font-weight:600;">سجل الدخول</h3></div>
    <table style="width:100%;border-collapse:collapse;font-size:13px;">
        <thead><tr style="background:#F9FAFB;"><th style="padding:8px 15px;text-align:right;">التاريخ</th><th style="padding:8px 15px;text-align:right;">النوع</th><th style="padding:8px 15px;text-align:right;">النتيجة</th></tr></thead>
        <tbody>
        <?php foreach ($accessHistory as $entry): ?>
        <tr style="border-top:1px solid #F3F4F6;">
            <td style="padding:8px 15px;direction:ltr;text-align:right;"><?= e(substr($entry['recorded_at'], 0, 16)) ?></td>
            <td style="padding:8px 15px;"><?= $entry['access_type'] === 'entry' ? 'دخول' : 'خروج' ?></td>
            <td style="padding:8px 15px;"><?= (int) $entry['granted'] ? '<span style="color:#059669;">✓ مسموح</span>' : '<span style="color:#DC2626;">✗ مرفوض</span>' ?></td>
        </tr>
        <?php endforeach; ?>
        </tbody>
    </table>
</div>
<?php endif; ?>

<?php else: ?>
<!-- Cards List -->

<?php if (isset($summary)): ?>
<div style="display:grid;grid-template-columns:repeat(auto-fit, minmax(140px, 1fr));gap:12px;margin-bottom:20px;">
    <div class="card" style="padding:14px;text-align:center;"><div style="font-size:11px;color:#6B7280;">إجمالي</div><div style="font-size:20px;font-weight:800;"><?= (int) ($summary['total_cards'] ?? 0) ?></div></div>
    <div class="card" style="padding:14px;text-align:center;"><div style="font-size:11px;color:#6B7280;">نشط</div><div style="font-size:20px;font-weight:800;color:#059669;"><?= (int) ($summary['active_cards'] ?? 0) ?></div></div>
    <div class="card" style="padding:14px;text-align:center;"><div style="font-size:11px;color:#6B7280;">مؤقت</div><div style="font-size:20px;font-weight:800;color:#F59E0B;"><?= (int) ($summary['temp_cards'] ?? 0) ?></div></div>
    <div class="card" style="padding:14px;text-align:center;"><div style="font-size:11px;color:#6B7280;">منتهي</div><div style="font-size:20px;font-weight:800;color:#6B7280;"><?= (int) ($summary['expired_cards'] ?? 0) ?></div></div>
    <div class="card" style="padding:14px;text-align:center;"><div style="font-size:11px;color:#6B7280;">موقوف</div><div style="font-size:20px;font-weight:800;color:#DC2626;"><?= (int) ($summary['suspended_cards'] ?? 0) ?></div></div>
</div>
<?php endif; ?>

<!-- Filters -->
<?php if (!isset($isReport)): ?>
<div class="card" style="margin-bottom:20px;">
    <div style="padding:15px 20px;">
        <form method="GET" style="display:flex;align-items:end;gap:15px;flex-wrap:wrap;">
            <div class="form-group" style="margin:0;min-width:200px;">
                <label class="form-label" style="font-size:12px;">بحث</label>
                <input type="text" name="q" value="<?= e($filters['q'] ?? '') ?>" class="form-input" placeholder="اسم أو رقم كارت...">
            </div>
            <div class="form-group" style="margin:0;min-width:140px;">
                <label class="form-label" style="font-size:12px;">الحالة</label>
                <select name="status" class="form-select">
                    <option value="">— الكل —</option>
                    <option value="active" <?= ($filters['status'] ?? '') === 'active' ? 'selected' : '' ?>>نشط</option>
                    <option value="temporary" <?= ($filters['status'] ?? '') === 'temporary' ? 'selected' : '' ?>>مؤقت</option>
                    <option value="expired" <?= ($filters['status'] ?? '') === 'expired' ? 'selected' : '' ?>>منتهي</option>
                    <option value="suspended" <?= ($filters['status'] ?? '') === 'suspended' ? 'selected' : '' ?>>موقوف</option>
                    <option value="revoked" <?= ($filters['status'] ?? '') === 'revoked' ? 'selected' : '' ?>>ملغى</option>
                </select>
            </div>
            <button type="submit" class="btn btn-primary" style="padding:9px 20px;"><i data-lucide="search" style="width:14px;height:14px;vertical-align:middle;margin-left:4px;"></i> بحث</button>
        </form>
    </div>
</div>
<?php endif; ?>

<!-- Table -->
<div class="card">
    <table style="width:100%;border-collapse:collapse;font-size:13px;">
        <thead>
            <tr style="background:#F9FAFB;">
                <th style="padding:10px 15px;text-align:right;font-weight:600;color:#6B7280;">رقم الكارت</th>
                <th style="padding:10px 15px;text-align:right;font-weight:600;color:#6B7280;">اللاعب</th>
                <th style="padding:10px 15px;text-align:right;font-weight:600;color:#6B7280;">النوع</th>
                <th style="padding:10px 15px;text-align:right;font-weight:600;color:#6B7280;">الحالة</th>
                <th style="padding:10px 15px;text-align:right;font-weight:600;color:#6B7280;">صالح حتى</th>
                <th style="padding:10px 15px;text-align:right;font-weight:600;color:#6B7280;">إجراءات</th>
            </tr>
        </thead>
        <tbody>
            <?php if (empty($cards)): ?>
            <tr><td colspan="6" style="padding:30px;text-align:center;color:#9CA3AF;">لا توجد كروت</td></tr>
            <?php else: ?>
            <?php foreach ($cards as $c): ?>
            <?php
            $sc = $statusColors[$c['status']] ?? '#6B7280';
            $sl = $statusLabels[$c['status']] ?? $c['status'];
            ?>
            <tr style="border-top:1px solid #F3F4F6;">
                <td style="padding:10px 15px;direction:ltr;text-align:right;font-weight:600;"><?= e($c['card_number']) ?></td>
                <td style="padding:10px 15px;"><?= e($c['full_name_ar']) ?></td>
                <td style="padding:10px 15px;"><?= $c['player_type'] === 'member' ? 'عضو' : 'غير عضو' ?></td>
                <td style="padding:10px 15px;"><span style="padding:3px 8px;border-radius:4px;font-size:11px;font-weight:600;background:<?= $sc ?>15;color:<?= $sc ?>;"><?= $sl ?></span></td>
                <td style="padding:10px 15px;direction:ltr;text-align:right;"><?= e($c['valid_until'] ?? '—') ?></td>
                <td style="padding:10px 15px;">
                    <a href="/sa/cards/<?= (int) $c['id'] ?>" style="color:#2563EB;font-size:12px;">عرض</a>
                    <a href="/sa/cards/<?= (int) $c['id'] ?>/print" target="_blank" style="color:#6B7280;font-size:12px;margin-right:8px;">طباعة</a>
                </td>
            </tr>
            <?php endforeach; ?>
            <?php endif; ?>
        </tbody>
    </table>
</div>

<?php if (isset($pagination) && $pagination && ($pagination['last_page'] ?? 1) > 1): ?>
<div style="margin-top:15px;display:flex;justify-content:center;gap:5px;">
    <?php for ($p = 1; $p <= $pagination['last_page']; $p++): ?>
    <a href="?<?= http_build_query(array_merge($filters, ['page' => $p])) ?>" class="btn <?= $p === $pagination['current_page'] ? 'btn-primary' : 'btn-outline' ?>" style="padding:6px 12px;font-size:12px;"><?= $p ?></a>
    <?php endfor; ?>
</div>
<?php endif; ?>

<?php endif; ?>

<script>document.addEventListener('DOMContentLoaded', function() { if (typeof lucide !== 'undefined') lucide.createIcons(); });</script>
<?php $__template->endSection(); ?>
