feat(sports): add confirmation overlay before sending assessment to cashier

Shows player name, group, discipline, program, level, and monthly fee
amount in a modal before the coach confirms the submission.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

app/Modules/SportsActivity/Views/assessment/assess.php

@@ -146,9 +146,38 @@
         </div>
     </div>
 
-    <button type="submit" class="btn btn-primary" style="width:100%;padding:16px;font-size:16px;font-weight:700;border-radius:12px;">
+    <button type="button" id="btnShowConfirm" 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>
+
+    <!-- Confirmation Overlay -->
+    <div id="confirmOverlay" style="display:none;position:fixed;inset:0;background:rgba(0,0,0,0.5);z-index:9999;align-items:center;justify-content:center;">
+        <div style="background:#fff;border-radius:16px;padding:24px;width:90%;max-width:420px;box-shadow:0 20px 60px rgba(0,0,0,0.3);">
+            <h3 style="margin:0 0 16px;font-size:17px;font-weight:700;color:#1A1A2E;text-align:center;">
+                <i data-lucide="send" style="width:20px;height:20px;vertical-align:middle;margin-left:6px;color:#0D7377;"></i> تأكيد الإرسال للخزنة
+            </h3>
+            <div style="background:#F9FAFB;border-radius:10px;padding:16px;margin-bottom:16px;">
+                <div style="display:grid;gap:10px;font-size:14px;">
+                    <div style="display:flex;justify-content:space-between;"><span style="color:#6B7280;">اللاعب:</span><strong id="confPlayer"><?= e($registration['full_name_ar']) ?></strong></div>
+                    <div style="display:flex;justify-content:space-between;"><span style="color:#6B7280;">المجموعة:</span><strong id="confGroup">—</strong></div>
+                    <div style="display:flex;justify-content:space-between;"><span style="color:#6B7280;">النشاط:</span><strong id="confDisc">—</strong></div>
+                    <div style="display:flex;justify-content:space-between;"><span style="color:#6B7280;">البرنامج:</span><strong id="confProg">—</strong></div>
+                    <div style="display:flex;justify-content:space-between;"><span style="color:#6B7280;">المستوى:</span><strong id="confLevel">—</strong></div>
+                    <div style="display:flex;justify-content:space-between;border-top:1px dashed #E5E7EB;padding-top:10px;margin-top:4px;">
+                        <span style="color:#6B7280;font-weight:600;">مبلغ الاشتراك الشهري:</span>
+                        <strong id="confAmount" style="color:#059669;font-size:16px;">—</strong>
+                    </div>
+                </div>
+            </div>
+            <p style="font-size:12px;color:#6B7280;text-align:center;margin:0 0 16px;">سيتم إرسال طلب دفع الاشتراك للخزنة — اللاعب يتوجه للكاشير لإتمام الدفع</p>
+            <div style="display:grid;grid-template-columns:1fr 1fr;gap:10px;">
+                <button type="button" id="btnCancelConfirm" class="btn btn-outline" style="padding:12px;font-size:14px;border-radius:10px;">رجوع</button>
+                <button type="submit" class="btn btn-primary" style="padding:12px;font-size:14px;border-radius:10px;">
+                    <i data-lucide="check" style="width:16px;height:16px;vertical-align:middle;margin-left:4px;"></i> تأكيد وإرسال
+                </button>
+            </div>
+        </div>
+    </div>
 </form>
 
 <script>
@@ -207,6 +236,52 @@ document.addEventListener('DOMContentLoaded', function() {
             this.closest('label').style.background = '#EFF6FF';
         });
     });
+
+    // Confirmation overlay logic
+    var overlay = document.getElementById('confirmOverlay');
+    var btnShow = document.getElementById('btnShowConfirm');
+    var btnCancel = document.getElementById('btnCancelConfirm');
+    var levelLabels = {beginner: 'مبتدئ', intermediate: 'متوسط', advanced: 'متقدم'};
+
+    btnShow.addEventListener('click', function() {
+        var selectedGroup = document.querySelector('input[name="group_id"]:checked');
+        var selectedLevel = document.querySelector('input[name="skill_level"]:checked');
+
+        if (!selectedGroup) {
+            alert('اختر مجموعة أولاً');
+            return;
+        }
+        if (!selectedLevel) {
+            alert('اختر المستوى أولاً');
+            return;
+        }
+
+        var label = selectedGroup.closest('.group-radio-option');
+        var groupName = label.querySelector('div[style*="font-weight:600"]').textContent.trim();
+        var infoLine = label.querySelector('div[style*="color:#6B7280"]');
+        var parts = infoLine ? infoLine.textContent.trim().split('—') : ['', ''];
+        var discName = (parts[0] || '').trim();
+        var progName = (parts[1] || '').split('|')[0].trim();
+        var amountEl = label.querySelector('div[style*="color:#059669"]');
+        var amount = amountEl ? amountEl.textContent.trim() : '—';
+
+        document.getElementById('confGroup').textContent = groupName;
+        document.getElementById('confDisc').textContent = discName;
+        document.getElementById('confProg').textContent = progName;
+        document.getElementById('confLevel').textContent = levelLabels[selectedLevel.value] || selectedLevel.value;
+        document.getElementById('confAmount').textContent = amount;
+
+        overlay.style.display = 'flex';
+        if (typeof lucide !== 'undefined') lucide.createIcons();
+    });
+
+    btnCancel.addEventListener('click', function() {
+        overlay.style.display = 'none';
+    });
+
+    overlay.addEventListener('click', function(e) {
+        if (e.target === overlay) overlay.style.display = 'none';
+    });
 });
 </script>
 <?php $__template->endSection(); ?>