<?php $__template->layout('Layout.main'); ?>
<?php $__template->section('title'); ?>تقييم: <?= e($registration['full_name_ar']) ?><?php $__template->endSection(); ?>

<?php $__template->section('page_actions'); ?>
<a href="/sa/coach-assessment" class="btn btn-outline"><i data-lucide="arrow-right" style="width:15px;height:15px;vertical-align:middle;margin-left:4px;"></i> العودة للقائمة</a>
<?php $__template->endSection(); ?>

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

<!-- Player Info Card -->
<div class="card" style="margin-bottom:16px;">
    <div style="padding:16px 20px;display:flex;align-items:center;gap:14px;">
        <div style="width:64px;height:64px;border-radius:10px;overflow:hidden;background:#F3F4F6;flex-shrink:0;">
            <?php if (!empty($registration['photo_path'])): ?>
            <img src="/<?= e($registration['photo_path']) ?>" 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;"><i data-lucide="user" style="width:28px;height:28px;"></i></div>
            <?php endif; ?>
        </div>
        <div style="flex:1;">
            <div style="font-size:18px;font-weight:700;color:#1A1A2E;"><?= e($registration['full_name_ar']) ?></div>
            <div style="font-size:13px;color:#6B7280;margin-top:4px;">
                <span style="padding:2px 8px;border-radius:4px;font-size:11px;font-weight:600;background:<?= ($registration['p_type'] ?? 'non_member') === 'member' ? '#ECFDF5' : '#FEF3C7' ?>;color:<?= ($registration['p_type'] ?? 'non_member') === 'member' ? '#059669' : '#D97706' ?>;">
                    <?= ($registration['p_type'] ?? 'non_member') === 'member' ? 'عضو' : 'غير عضو' ?>
                </span>
                <?php if (!empty($registration['player_nid'])): ?>
                <span style="margin-right:8px;direction:ltr;display:inline-block;"><?= e($registration['player_nid']) ?></span>
                <?php endif; ?>
                <?php if (!empty($registration['date_of_birth'])): ?>
                <?php
                $age = (int) ((time() - strtotime($registration['date_of_birth'])) / (365.25 * 86400));
                ?>
                <span style="margin-right:8px;"><?= $age ?> سنة</span>
                <?php endif; ?>
            </div>
        </div>
        <div style="text-align:left;">
            <div style="font-size:11px;color:#6B7280;">رقم التسجيل</div>
            <div style="font-size:13px;font-weight:600;direction:ltr;"><?= e($registration['registration_number']) ?></div>
        </div>
    </div>
    <?php
    $selectedDisc = [];
    if (!empty($registration['selected_disciplines'])) {
        $decoded = json_decode($registration['selected_disciplines'], true);
        if (is_array($decoded)) $selectedDisc = $decoded;
    }
    if (!empty($selectedDisc)):
    ?>
    <div style="padding:0 20px 16px;display:flex;align-items:center;gap:8px;flex-wrap:wrap;">
        <span style="font-size:12px;color:#6B7280;font-weight:600;">الأنشطة المطلوبة:</span>
        <?php foreach ($selectedDisc as $disc): ?>
        <span style="padding:4px 10px;border-radius:6px;background:#EFF6FF;color:#2563EB;font-size:12px;font-weight:600;"><?= e($disc['name'] ?? $disc) ?></span>
        <?php endforeach; ?>
    </div>
    <?php endif; ?>
</div>

<!-- Assessment Form -->
<form method="POST" action="/sa/coach-assessment/<?= (int) $registration['id'] ?>/submit">
    <?= csrf_field() ?>

    <div class="card" style="margin-bottom:16px;">
        <div style="padding:16px 20px;border-bottom:1px solid #E5E7EB;display:flex;align-items:center;gap:8px;">
            <i data-lucide="target" style="width:18px;height:18px;color:#0D7377;"></i>
            <h3 style="margin:0;color:#0D7377;font-size:15px;">التقييم الفني</h3>
        </div>
        <div style="padding:20px;">
            <!-- Skill Level -->
            <div class="form-group" style="margin-bottom:20px;">
                <label class="form-label">المستوى <span style="color:#DC2626;">*</span></label>
                <div style="display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;">
                    <label style="display:flex;align-items:center;justify-content:center;gap:8px;padding:14px;border:2px solid #E5E7EB;border-radius:10px;cursor:pointer;transition:all 0.2s;">
                        <input type="radio" name="skill_level" value="beginner" required style="accent-color:#2563EB;width:18px;height:18px;">
                        <span style="font-weight:600;font-size:14px;">مبتدئ</span>
                    </label>
                    <label style="display:flex;align-items:center;justify-content:center;gap:8px;padding:14px;border:2px solid #E5E7EB;border-radius:10px;cursor:pointer;transition:all 0.2s;">
                        <input type="radio" name="skill_level" value="intermediate" style="accent-color:#059669;width:18px;height:18px;">
                        <span style="font-weight:600;font-size:14px;">متوسط</span>
                    </label>
                    <label style="display:flex;align-items:center;justify-content:center;gap:8px;padding:14px;border:2px solid #E5E7EB;border-radius:10px;cursor:pointer;transition:all 0.2s;">
                        <input type="radio" name="skill_level" value="advanced" style="accent-color:#7C3AED;width:18px;height:18px;">
                        <span style="font-weight:600;font-size:14px;">متقدم</span>
                    </label>
                </div>
            </div>

            <!-- Assessment Notes -->
            <div class="form-group" style="margin-bottom:20px;">
                <label class="form-label">ملاحظات التقييم</label>
                <textarea name="assessment_notes" class="form-input" rows="3" placeholder="ملاحظات المدرب عن مستوى اللاعب..."></textarea>
            </div>
        </div>
    </div>

    <!-- Group Selection -->
    <div class="card" style="margin-bottom:16px;">
        <div style="padding:16px 20px;border-bottom:1px solid #E5E7EB;display:flex;align-items:center;gap:8px;">
            <i data-lucide="users" style="width:18px;height:18px;color:#0D7377;"></i>
            <h3 style="margin:0;color:#0D7377;font-size:15px;">تعيين في مجموعة <span style="color:#DC2626;">*</span></h3>
        </div>
        <div style="padding:16px;">
            <input type="text" id="groupSearch" class="form-input" placeholder="ابحث عن مجموعة..." style="margin-bottom:12px;padding:12px;font-size:14px;border-radius:10px;">
            <div style="max-height:400px;overflow-y:auto;display:grid;gap:8px;">
                <?php foreach ($groups as $g): ?>
                <label class="group-radio-option" data-name="<?= e($g['name_ar'] . ' ' . ($g['discipline_name'] ?? '') . ' ' . ($g['program_name'] ?? '')) ?>"
                       style="display:flex;align-items:center;gap:12px;padding:14px;border:2px solid #E5E7EB;border-radius:10px;cursor:pointer;transition:all 0.2s;">
                    <input type="radio" name="group_id" value="<?= (int) $g['id'] ?>" required style="accent-color:#2563EB;width:20px;height:20px;flex-shrink:0;">
                    <div style="flex:1;min-width:0;">
                        <div style="font-weight:600;font-size:14px;"><?= e($g['name_ar']) ?></div>
                        <div style="font-size:12px;color:#6B7280;margin-top:2px;">
                            <?= e($g['discipline_name'] ?? '') ?> — <?= e($g['program_name'] ?? '') ?>
                            <?php if (!empty($g['coach_name'])): ?> | مدرب: <?= e($g['coach_name']) ?><?php endif; ?>
                        </div>
                    </div>
                    <div style="text-align:left;flex-shrink:0;">
                        <div style="font-size:14px;font-weight:700;color:#059669;">
                            <?= number_format(($registration['p_type'] ?? 'non_member') === 'member' ? (float) $g['monthly_fee_member'] : (float) $g['monthly_fee_nonmember'], 0) ?> ج.م
                        </div>
                        <div style="font-size:11px;color:#6B7280;"><?= (int) $g['current_count'] ?>/<?= (int) $g['max_capacity'] ?></div>
                    </div>
                </label>
                <?php endforeach; ?>
            </div>
        </div>
    </div>

    <button type="submit" class="btn btn-primary" style="width:100%;padding:16px;font-size:16px;font-weight:700;border-radius:12px;">
        <i data-lucide="check-circle" style="width:18px;height:18px;vertical-align:middle;margin-left:6px;"></i> تأكيد التقييم والتعيين
    </button>
</form>

<script>
document.addEventListener('DOMContentLoaded', function() {
    if (typeof lucide !== 'undefined') lucide.createIcons();

    var search = document.getElementById('groupSearch');
    if (search) {
        search.addEventListener('input', function() {
            var q = this.value.toLowerCase();
            document.querySelectorAll('.group-radio-option').forEach(function(el) {
                el.style.display = (!q || el.dataset.name.toLowerCase().indexOf(q) >= 0) ? '' : 'none';
            });
        });
    }

    document.querySelectorAll('input[name="group_id"]').forEach(function(radio) {
        radio.addEventListener('change', function() {
            document.querySelectorAll('.group-radio-option').forEach(function(el) {
                el.style.borderColor = '#E5E7EB';
                el.style.background = '';
            });
            if (this.checked) {
                this.closest('.group-radio-option').style.borderColor = '#2563EB';
                this.closest('.group-radio-option').style.background = '#F0F7FF';
            }
        });
    });

    document.querySelectorAll('input[name="skill_level"]').forEach(function(radio) {
        radio.addEventListener('change', function() {
            document.querySelectorAll('input[name="skill_level"]').forEach(function(r) {
                r.closest('label').style.borderColor = '#E5E7EB';
                r.closest('label').style.background = '';
            });
            this.closest('label').style.borderColor = '#2563EB';
            this.closest('label').style.background = '#EFF6FF';
        });
    });
});
</script>
<?php $__template->endSection(); ?>
