<?php $__template->layout('Layout.main'); ?>
<?php $__template->section('title'); ?>المرايا - حالة المرافق<?php $__template->endSection(); ?>

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

<?php if (!empty($disciplines)): ?>
<div class="card" style="margin-bottom:20px;padding:15px;">
    <div style="font-weight:700;margin-bottom:10px;font-size:14px;">تصفية بالرياضة</div>
    <div style="display:flex;gap:10px;flex-wrap:wrap;">
        <?php foreach ($disciplines as $d): ?>
        <a href="/sa/mirror/discipline/<?= (int) $d['id'] ?>" class="btn btn-outline" style="font-size:13px;">
            <?= e($d['name_ar']) ?> <span style="background:#DBEAFE;color:#2563EB;padding:1px 6px;border-radius:8px;font-size:11px;margin-right:4px;"><?= (int) $d['facility_count'] ?></span>
        </a>
        <?php endforeach; ?>
    </div>
</div>
<?php endif; ?>

<?php if (!empty($grouped)): ?>
<?php foreach ($grouped as $disciplineName => $disciplineFacilities): ?>
<div style="margin-bottom:20px;">
    <h3 style="font-size:15px;font-weight:700;margin-bottom:10px;color:#374151;"><?= e($disciplineName) ?></h3>
    <div style="display:grid;grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));gap:15px;">
        <?php foreach ($disciplineFacilities as $f): ?>
        <a href="/sa/mirror/<?= (int) $f['id'] ?>" class="card" style="padding:20px;text-decoration:none;color:inherit;transition:box-shadow 0.2s;border-right:4px solid #3B82F6;">
            <div style="display:flex;align-items:center;gap:12px;">
                <div style="width:44px;height:44px;background:#DBEAFE;border-radius:10px;display:flex;align-items:center;justify-content:center;">
                    <i data-lucide="monitor" style="width:22px;height:22px;color:#3B82F6;"></i>
                </div>
                <div>
                    <div style="font-weight:700;font-size:15px;"><?= e($f['name_ar'] ?? '') ?></div>
                    <?php
                    $typeLabels = ['pool' => 'حمام سباحة', 'court' => 'ملعب', 'pitch' => 'ملعب كبير', 'gym' => 'صالة رياضية', 'track' => 'مضمار', 'multipurpose' => 'متعدد'];
                    ?>
                    <div style="font-size:12px;color:#6B7280;"><?= e($typeLabels[$f['facility_type'] ?? ''] ?? '') ?></div>
                </div>
            </div>
        </a>
        <?php endforeach; ?>
    </div>
</div>
<?php endforeach; ?>
<?php else: ?>
<div class="card" style="padding:40px;text-align:center;color:#6B7280;">
    <i data-lucide="monitor" style="width:36px;height:36px;color:#D1D5DB;display:block;margin:0 auto 10px;"></i>
    لا توجد مرافق نشطة
</div>
<?php endif; ?>

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