Tutorials Upgrade

app/Modules/Tutorials/Views/membership/add_child.php

@@ -19,6 +19,8 @@
         <div><h1>إضافة أبناء</h1><p>إضافة أبناء مع التصنيف التلقائي</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/members-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">تصنيف الأبناء بالعمر</h3><div class="tut-step-body"><div class="tut-diagram">الفئة العمرية    │ الرسوم              │ الحالة
 ──────────────────┼─────────────────────┼──────────────
 أقل من 5 سنوات  │ مجاناً              │ طفل (لا كارنيه)

app/Modules/Tutorials/Views/membership/add_spouse.php

@@ -19,6 +19,8 @@
         <div><h1>إضافة زوج/زوجة</h1><p>إضافة زوجة للعضوية مع حساب الرسوم</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/members-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">قواعد إضافة الزوج/الزوجة</h3><div class="tut-step-body"><div class="tut-diagram">رسوم إضافة الزوج/الزوجة:
 ─────────────────────────────────────────
 الزوجة الأولى:    مجاناً (0%)

app/Modules/Tutorials/Views/membership/add_temporary_member.php

@@ -19,6 +19,8 @@
         <div><h1>إضافة عضو مؤقت</h1><p>والدين أو أشقاء أو مربية</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/temporary-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">أنواع الأعضاء المؤقتين</h3><div class="tut-step-body"><div class="tut-diagram">النوع         │ الرسوم الشهرية  │ ملاحظات
 ───────────────┼─────────────────┼────────────────────────
 والد/والدة    │ 500 ج.م/شهر    │ يحتاج إثبات قرابة

app/Modules/Tutorials/Views/membership/annual_subscription.php

@@ -19,6 +19,8 @@
         <div><h1>الاشتراك السنوي</h1><p>توليد وتحصيل الاشتراكات السنوية</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/subscriptions-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">الاشتراك السنوي</h3><div class="tut-step-body">كل عضو فعال يُطالب باشتراك سنوي لتجديد العضوية:
 <ul>
 <li>يُستحق في بداية كل سنة ميلادية</li>

app/Modules/Tutorials/Views/membership/athletic_conversion.php

@@ -19,6 +19,8 @@
         <div><h1>تحويل لاعب لعضو</h1><p>تحويل عضوية رياضية لعاملة</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/members-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">ما هو التحويل الرياضي؟</h3><div class="tut-step-body">اللاعب الرياضي (عضوية رياضية) يمكنه التحويل لعضوية عاملة كاملة:
 <ul>
 <li>يدفع <strong>50% فقط</strong> من قيمة العضوية العاملة</li>

app/Modules/Tutorials/Views/membership/carnet_issuance.php

@@ -19,6 +19,8 @@
         <div><h1>إصدار الكارنيه</h1><p>شروط وإجراءات طباعة الكارنيه</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/carnets-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">شروط الإصدار</h3><div class="tut-step-body">لا يُصدر الكارنيه إلا إذا:
 <ul>
 <li>✅ العضوية <span class="field">فعالة (active)</span></li>

app/Modules/Tutorials/Views/membership/change_status.php

@@ -19,6 +19,8 @@
         <div><h1>تغيير حالة العضوية</h1><p>دورة الحالات من محتمل حتى فعال</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/members-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">خريطة الحالات</h3><div class="tut-step-body"><div class="tut-diagram">potential (محتمل)
     │
     ├─→ under_review (تحت المراجعة) ← بعد دفع الاستمارة

app/Modules/Tutorials/Views/membership/children_aging.php

@@ -19,6 +19,8 @@
         <div><h1>تقادم أعمار الأبناء</h1><p>التجميد التلقائي والفصل عند بلوغ 25</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/members-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">المتابعة التلقائية</h3><div class="tut-step-body">النظام يراقب أعمار الأبناء تلقائياً ويقوم بـ:
 <ul>
 <li><strong>تحديث الفئة</strong> — عند الانتقال بين الفئات العمرية (ناشئ → شاب → بالغ)</li>

app/Modules/Tutorials/Views/membership/collective_payment.php

@@ -19,6 +19,8 @@
         <div><h1>الفاتورة المجمعة وتفعيل التابعين</h1><p>دفع العضوية يفعّل العضو وجميع تابعيه دفعة واحدة</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/cashier-queue.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">ما هي الفاتورة المجمعة؟</h3><div class="tut-step-body">
         الفاتورة المجمعة تظهر في ملف العضو بعد ملء الاستمارة وإضافة أفراد الأسرة. تشمل:
         <ul>

app/Modules/Tutorials/Views/membership/death_transfer.php

@@ -19,6 +19,8 @@
         <div><h1>تحويل عند الوفاة</h1><p>نقل العضوية للزوج/الزوجة</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/transfers-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">القواعد</h3><div class="tut-step-body">عند وفاة العضو:
 <ul>
 <li>العضوية تُنقل <strong>تلقائياً</strong> للزوج/الزوجة</li>

app/Modules/Tutorials/Views/membership/divorce_transfer.php

@@ -19,6 +19,8 @@
         <div><h1>تحويل عند الطلاق</h1><p>نقل العضوية بعد الطلاق</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/transfers-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">القواعد</h3><div class="tut-step-body">عند الطلاق:
 <ul>
 <li>العضوية تبقى باسم <strong>صاحب العضوية الأصلي</strong></li>

app/Modules/Tutorials/Views/membership/fill_form.php

@@ -19,6 +19,8 @@
         <div><h1>ملء استمارة العضوية</h1><p>إكمال البيانات الشخصية والمهنية</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/members-create.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح ملء الاستمارة</h3><div class="tut-step-body">من ملف العضو اضغط <span class="field">ملء الاستمارة</span>.</div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">البيانات الشخصية</h3><div class="tut-step-body"><ul>

app/Modules/Tutorials/Views/membership/fines_violations.php

@@ -19,6 +19,8 @@
         <div><h1>المخالفات والغرامات</h1><p>فرض غرامة وتصعيد العقوبات</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/violations-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">أنواع المخالفات</h3><div class="tut-step-body"><div class="tut-diagram">المخالفة           │ الغرامة        │ التصعيد
 ────────────────────┼────────────────┼─────────────────────
 سلوك غير لائق     │ 500 ج.م       │ مرة 2: تحذير رسمي

app/Modules/Tutorials/Views/membership/foreign_membership.php

@@ -19,6 +19,8 @@
         <div><h1>العضوية الأجنبية</h1><p>عضوية لغير المصريين بـ 10,000$</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/members-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">الشروط</h3><div class="tut-step-body"><ul>
 <li>المتقدم <strong>غير مصري الجنسية</strong></li>
 <li>إقامة سارية في مصر</li>

app/Modules/Tutorials/Views/membership/full_new_member_scenario.php

@@ -19,6 +19,8 @@
         <div><h1>سيناريو كامل: عضو جديد</h1><p>من التسجيل حتى استلام الكارنيه</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/members-create.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">الخطوة 1: التسجيل</h3><div class="tut-step-body">عضو جديد يأتي للنادي:
 <ul>
 <li>موظف شئون العضوية يُنشئ سجل عضو جديد</li>

app/Modules/Tutorials/Views/membership/honorary_membership.php

@@ -19,6 +19,8 @@
         <div><h1>العضوية الشرفية</h1><p>عضوية بدون رسوم بقرار مجلس</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/members-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">ما هي العضوية الشرفية؟</h3><div class="tut-step-body"><ul>
 <li>عضوية مجانية بالكامل (بدون رسوم عضوية أو اشتراك سنوي)</li>
 <li>تُمنح بقرار مجلس الإدارة فقط</li>

app/Modules/Tutorials/Views/membership/interview_process.php

@@ -19,6 +19,8 @@
         <div><h1>المقابلات</h1><p>جدولة وإجراء مقابلة العضوية</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/interviews-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">متى تُجدول المقابلة</h3><div class="tut-step-body">بعد:
 <ul>
 <li>دفع رسوم الاستمارة ✓</li>

app/Modules/Tutorials/Views/membership/membership_freeze_drop.php

@@ -19,6 +19,8 @@
         <div><h1>التجميد والإسقاط</h1><p>تجميد العضوية أو إسقاطها</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/members-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">التجميد (Freeze)</h3><div class="tut-step-body">تعليق مؤقت للعضوية:
 <ul>
 <li><strong>تجميد إداري</strong> — بقرار الإدارة (مخالفة / عدم سداد)</li>

app/Modules/Tutorials/Views/membership/membership_pricing.php

@@ -19,6 +19,8 @@
         <div><h1>تسعير العضوية</h1><p>حساب قيمة العضوية حسب المؤهل</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/pricing-management.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">آلية التسعير</h3><div class="tut-step-body">النظام يحدد قيمة العضوية تلقائياً بناءً على مؤهل العضو:
 <div class="tut-diagram">المؤهل            │ قيمة العضوية
 ──────────────────┼─────────────

app/Modules/Tutorials/Views/membership/new_member_registration.php

@@ -19,6 +19,8 @@
         <div><h1>تسجيل عضو جديد</h1><p>إنشاء استمارة عضوية من الصفر</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/members-create.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح صفحة الأعضاء</h3><div class="tut-step-body">من القائمة الجانبية: <span class="field">شئون العضوية</span> > <span class="field">الأعضاء</span>.</div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">إنشاء عضو جديد</h3><div class="tut-step-body">اضغط زر <span class="field">إضافة عضو جديد</span> في أعلى الصفحة.</div></div>

app/Modules/Tutorials/Views/membership/pay_form_fee.php

@@ -19,6 +19,8 @@
         <div><h1>دفع رسوم الاستمارة</h1><p>إرسال طلب دفع 505 ج.م للخزينة</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/cashier-queue.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح ملف العضو</h3><div class="tut-step-body">من قائمة الأعضاء اضغط على اسم العضو لفتح ملفه.</div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">طلب دفع الاستمارة</h3><div class="tut-step-body">اضغط زر <span class="field">دفع رسوم الاستمارة</span>.<br>النظام يُنشئ طلب دفع بقيمة <strong>505 ج.م</strong> (500 رسوم + 5 دمغة).

app/Modules/Tutorials/Views/membership/pay_membership_cash.php

@@ -19,6 +19,8 @@
         <div><h1>دفع العضوية كاش</h1><p>سداد قيمة العضوية دفعة واحدة</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/cashier-queue.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح شاشة الدفع</h3><div class="tut-step-body">من ملف العضو (بعد القبول) اضغط <span class="field">دفع قيمة العضوية</span>.</div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">مراجعة الفاتورة</h3><div class="tut-step-body">النظام يعرض:

app/Modules/Tutorials/Views/membership/pay_membership_installments.php

@@ -19,6 +19,8 @@
         <div><h1>دفع العضوية بالتقسيط</h1><p>مقدم 25% وتقسيط حتى 30 شهر</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/installments-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">شروط التقسيط</h3><div class="tut-step-body"><div class="tut-diagram">نظام التقسيط:
 ─────────────────────────────────────────
 المقدم:          25% من إجمالي المبلغ

app/Modules/Tutorials/Views/membership/payment_queue_management.php

@@ -19,6 +19,8 @@
         <div><h1>إدارة طابور الدفع</h1><p>إلغاء طلبات الدفع وإعادتها للطابور</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/cashier-queue.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">كيف يعمل طابور الدفع</h3><div class="tut-step-body">
         عند طلب أي دفعة (استمارة، عضوية، إضافة تابع) يتم إنشاء <strong>طلب دفع</strong> يظهر في شاشة الخزينة.
         <div class="tut-diagram">

app/Modules/Tutorials/Views/membership/special_discounts.php

@@ -19,6 +19,8 @@
         <div><h1>الخصومات الخاصة</h1><p>تطبيق خصم خاص أو عرض مجلس الإدارة</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/pricing-management.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">أنواع الخصومات</h3><div class="tut-step-body"><ul>
 <li><strong>خصم مجلس الإدارة</strong> — نسبة أو مبلغ ثابت بقرار</li>
 <li><strong>عرض موسمي</strong> — خصم لفترة محددة</li>

app/Modules/Tutorials/Views/membership/transfer_separation.php

@@ -19,6 +19,8 @@
         <div><h1>فصل الأبناء</h1><p>فصل ابن/ابنة لعضوية مستقلة</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/transfers-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">حالات الفصل</h3><div class="tut-step-body"><ul>
 <li><strong>فصل تلقائي</strong> — عند بلوغ 25 سنة</li>
 <li><strong>فصل اختياري</strong> — بطلب من العضو أو الابن</li>

app/Modules/Tutorials/Views/membership/waiver_process.php

@@ -19,6 +19,8 @@
         <div><h1>التنازل عن العضوية</h1><p>تنازل لشخص آخر مع رسوم 30%</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/transfers-list.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">ما هو التنازل؟</h3><div class="tut-step-body">التنازل هو نقل العضوية طوعياً لشخص آخر (ليس قريباً بالضرورة):
 <ul>
 <li>رسوم التنازل: <strong>30% من القيمة السوقية الحالية للعضوية</strong></li>

app/Modules/Tutorials/Views/section_show.php

@@ -24,6 +24,11 @@
         <div class="tut-step-num"><?= $num ?></div>
         <h3 class="tut-step-title"><?= e($step['title']) ?></h3>
         <div class="tut-step-body"><?= $step['body'] ?></div>
+        <?php if (!empty($step['screenshot'])): ?>
+        <div style="margin-top:12px;border:1px solid #E5E7EB;border-radius:10px;overflow:hidden;">
+            <img src="/assets/tutorials/screenshots/<?= e($step['screenshot']) ?>" alt="<?= e($step['title']) ?>" style="width:100%;display:block;" loading="lazy">
+        </div>
+        <?php endif; ?>
     </div>
     <?php $num++; endforeach; ?>
 

app/Modules/Tutorials/Views/sports_activity/blackout_dates.php

@@ -19,6 +19,8 @@
         <div><h1>حجب مواعيد (صيانة)</h1><p>إغلاق مرفق لفترة صيانة أو إجازة</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-facilities.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح حجب المواعيد</h3><div class="tut-step-body">من صفحة المرفق > <span class="field">حجب مواعيد</span>.</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">نوع الحجب</h3><div class="tut-step-body"><ul><li><strong>كامل المرفق:</strong> facility_unit_id = NULL (كل الوحدات)</li><li><strong>وحدة محددة:</strong> حارة معينة أو ملعب واحد</li></ul></div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">التاريخ والوقت</h3><div class="tut-step-body"><ul><li><span class="field">blackout_date</span> — التاريخ</li><li><span class="field">start_time / end_time</span> — حجب جزئي (ساعات محددة)</li><li>NULL = حجب يوم كامل</li></ul><span class="field">reason</span> — السبب (مثل: صيانة دورية / إجازة عيد)</div></div>

app/Modules/Tutorials/Views/sports_activity/booking_shared_lane.php

@@ -19,6 +19,8 @@
         <div><h1>حجز حارة سباحة (مشترك)</h1><p>حجز أماكن في حارة مع آخرين</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-pool-grid.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">الفرق عن الحجز العادي</h3><div class="tut-step-body">حارات السباحة بنظام <span class="field">shared</span> — أكثر من حجز ممكن في نفس الوقت طالما في أماكن متاحة.</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">عرض الحالة الحالية</h3><div class="tut-step-body">عند اختيار الحارة والوقت، النظام يعرض: كم مكان متاح (<span class="field">max_capacity - occupied</span>).</div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">تحديد الأماكن</h3><div class="tut-step-body">حدد <span class="field">spots_reserved</span> (عدد الأماكن المطلوبة). الفحص: هل المتبقي يكفي؟<div class="tut-diagram">حارة 3 — السعة القصوى: 8 أشخاص (16:00-17:00)

app/Modules/Tutorials/Views/sports_activity/collect_payment.php

@@ -19,6 +19,8 @@
         <div><h1>تحصيل اشتراك</h1><p>تسجيل دفع اشتراك لاعب</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-subscriptions.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">عرض المتأخرين</h3><div class="tut-step-body">من <span class="field">الاشتراكات</span> > فلتر حسب الحالة (<span class="field">unpaid</span> أو <span class="field">overdue</span>).</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">تحصيل الاشتراك</h3><div class="tut-step-body">اختر الاشتراك > <span class="field">تحصيل</span> > أدخل المبلغ المدفوع.</div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">حالات الدفع</h3><div class="tut-step-body"><div class="tut-diagram">unpaid ──→ تحصيل كامل ──→ paid ✅

app/Modules/Tutorials/Views/sports_activity/conflict_detection.php

@@ -19,6 +19,8 @@
         <div><h1>كشف التعارضات</h1><p>كيف يمنع النظام الحجوزات المتعارضة</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-bookings.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">متى يتم الفحص</h3><div class="tut-step-body">عند: إنشاء حجز / توليد حجوزات تمارين / تعديل جدول مجموعة.</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">أبعاد الفحص</h3><div class="tut-step-body"><ul><li><strong>تعارض الوحدة:</strong> هل الوحدة مشغولة؟</li><li><strong>تعارض المدرب:</strong> هل المدرب عنده حصة أخرى؟</li><li><strong>تعارض اللاعب:</strong> هل اللاعب في مجموعتين بنفس الوقت؟</li><li><strong>أيام الحجب:</strong> هل التاريخ محجوب؟</li></ul></div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">منطق فحص الوقت</h3><div class="tut-step-body"><div class="tut-diagram">Time overlap: start_time < :end AND end_time > :start

app/Modules/Tutorials/Views/sports_activity/create_group.php

@@ -19,6 +19,8 @@
         <div><h1>إنشاء مجموعة تدريبية</h1><p>مجموعة مع مدرب وجدول أسبوعي</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-groups.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">إضافة مجموعة</h3><div class="tut-step-body">من القائمة: <span class="field">الأنشطة الرياضية</span> > <span class="field">المجموعات</span> > إضافة مجموعة.</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">البيانات والربط</h3><div class="tut-step-body"><ul><li><span class="field">code / name_ar</span></li><li><span class="field">program_id</span> — البرنامج (يحدد اللعبة والمستوى تلقائياً)</li><li><span class="field">coach_id</span> — المدرب (يظهر فقط المتخصصين في نفس اللعبة)</li><li><span class="field">min_capacity / max_capacity</span> — الحد الأدنى والأقصى</li><li><span class="field">monthly_fee_member / monthly_fee_nonmember</span> — الرسوم الشهرية</li><li><span class="field">season_start / season_end</span> — مدة الموسم</li></ul></div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">إعداد الجدول الأسبوعي</h3><div class="tut-step-body">من صفحة المجموعة > الجدول > إضافة حصة:<ul><li><span class="field">day_of_week</span> — اليوم</li><li><span class="field">facility_unit_id</span> — الوحدة/الحارة/الملعب</li><li><span class="field">start_time / end_time</span> — الوقت</li></ul>مثال: أحد + ثلاثاء + خميس — حارة 3 — من 16:00 إلى 17:00<span class="warn">الجدول الأسبوعي يتحقق من التعارض — لو الوحدة محجوزة في نفس الوقت، النظام يرفض ويوضح التعارض.</span><span class="success">بعد إنشاء الجدول، يمكنك استخدام "توليد الحجوزات" لإنشاء حجوزات تلقائية لكل حصة.</span></div></div>

app/Modules/Tutorials/Views/sports_activity/create_hourly_booking.php

@@ -19,6 +19,8 @@
         <div><h1>حجز ساعة ملعب</h1><p>حجز وحدة لوقت محدد (حجز بالساعة)</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-booking-wizard.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">إنشاء حجز جديد</h3><div class="tut-step-body">من القائمة: <span class="field">الحجوزات</span> > <span class="field">حجز جديد</span>.</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">اختيار الوحدة والوقت</h3><div class="tut-step-body"><ul><li><span class="field">facility_unit_id</span> — الوحدة (ملعب تنس، كورت...)</li><li><span class="field">booking_date</span> — التاريخ</li><li><span class="field">start_time / end_time</span> — الوقت</li></ul></div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">الفحص التلقائي</h3><div class="tut-step-body">النظام يتحقق: هل الوحدة فاضية؟ هل في blackout؟ هل الوقت ضمن ساعات التشغيل؟<span class="warn">للوحدات exclusive: حجز واحد فقط يأخذ الوحدة بالكامل. لو في تمرين مجدول — الحجز مرفوض.</span></div></div>

app/Modules/Tutorials/Views/sports_activity/create_program.php

@@ -19,6 +19,8 @@
         <div><h1>إنشاء برنامج تدريبي</h1><p>تعريف برنامج بمواصفات العمر والمستوى</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-programs.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">إضافة برنامج</h3><div class="tut-step-body">من القائمة: <span class="field">الأنشطة الرياضية</span> > <span class="field">البرامج</span> > إضافة برنامج.</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">البيانات الأساسية</h3><div class="tut-step-body"><ul><li><span class="field">code / name_ar</span> — الكود والاسم</li><li><span class="field">discipline_id</span> — اللعبة</li><li><span class="field">academy_id</span> — الأكاديمية (NULL = يديره النادي مباشرة)</li><li><span class="field">program_type</span> — training / recreational / competitive / rehabilitation</li></ul></div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">الفئة المستهدفة</h3><div class="tut-step-body"><ul><li><span class="field">age_from / age_to</span> — الفئة العمرية (مثلاً 6-10)</li><li><span class="field">gender_restriction</span> — male / female / NULL (مختلط)</li><li><span class="field">skill_level</span> — beginner / intermediate / advanced / elite</li></ul></div></div>

app/Modules/Tutorials/Views/sports_activity/enroll_player.php

@@ -19,6 +19,8 @@
         <div><h1>تسجيل لاعب في مجموعة</h1><p>التحاق لاعب بمجموعة تدريبية</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-players.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح تسجيل اللاعبين</h3><div class="tut-step-body">من صفحة المجموعة > <span class="field">تسجيل لاعب</span>.</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">البحث عن اللاعب</h3><div class="tut-step-body">ابحث بالاسم أو الرقم التسلسلي أو الرقم القومي.</div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">التحقق التلقائي</h3><div class="tut-step-body">النظام يتحقق من:<ul><li>الحالة الطبية: لازم تكون <span class="field">fit</span> أو <span class="field">conditional</span></li><li>السعة: المجموعة لسه فيها مكان</li><li>العمر: ضمن الفئة العمرية للبرنامج</li><li>عدم التكرار: مش مسجل بالفعل</li></ul><span class="warn">إذا اللاعب حالته الطبية "pending" أو "unfit" أو "expired"، التسجيل مرفوض تلقائياً.</span></div></div>

app/Modules/Tutorials/Views/sports_activity/enrollment_payment.php

@@ -19,6 +19,8 @@
         <div><h1>الدفع الإجباري عند التسجيل</h1><p>لا يتم تفعيل التسجيل بدون دفع أول اشتراك من خزنة الأنشطة</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-subscriptions.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">كيف يعمل النظام؟</h3><div class="tut-step-body">عند تسجيل لاعب في مجموعة، لا يُفعّل التسجيل مباشرة. بدلاً من ذلك:<ul><li>يُسجل اللاعب بحالة <span class="field">pending_payment</span> (في انتظار الدفع)</li><li>يُنشئ النظام <strong>طلب دفع</strong> تلقائياً في طابور خزنة الأنشطة</li><li>المبلغ = رسم الاشتراك الشهري للمجموعة (حسب نوع اللاعب: عضو أو غير عضو)</li></ul><span class="info">هذا يضمن عدم تفعيل أي تسجيل بدون سداد — لا استثناءات إلا عبر الإعفاء الرسمي.</span></div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">حالة اللاعب بعد التسجيل</h3><div class="tut-step-body">في صفحة المجموعة، اللاعب يظهر بخلفية صفراء وبادج <span class="field">في انتظار الدفع</span>.<ul><li>لا يُحسب ضمن العدد الفعلي للمجموعة (السعة)</li><li>لا يظهر في كشوف الحضور</li><li>لا يُولد له اشتراك شهري</li></ul><span class="warn">إذا أُلغي طلب الدفع بدون تحصيل — التسجيل يبقى معلقاً ولا يُحذف تلقائياً.</span></div></div>

app/Modules/Tutorials/Views/sports_activity/exempt_subscription.php

@@ -19,6 +19,8 @@
         <div><h1>إعفاء من اشتراك</h1><p>إعفاء لاعب من رسوم شهرية</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-subscriptions.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">اختيار الاشتراك</h3><div class="tut-step-body">من <span class="field">الاشتراكات</span> > ابحث عن اشتراك اللاعب.</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">إعفاء</h3><div class="tut-step-body">اضغط <span class="field">إعفاء</span> > أدخل السبب (مثل: "إعفاء بقرار إداري" أو "منحة رياضية").</div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">النتيجة</h3><div class="tut-step-body"><div class="tut-diagram">unpaid ──→ إعفاء ──→ exempt (لا يُطالَب بالدفع)

app/Modules/Tutorials/Views/sports_activity/full_football_workflow.php

@@ -19,6 +19,8 @@
         <div><h1>سيناريو كامل: كرة قدم</h1><p>أكاديمية كرة قدم من الصفر للتشغيل</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-mirror.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">إنشاء اللعبة والمرفق</h3><div class="tut-step-body"><ul><li>لعبة: <span class="field">FOOTBALL</span>, category = <span class="field">team</span></li><li>مرفق: <span class="field">ملاعب كرة القدم</span>, type = <span class="field">pitch</span></li><li>وحدات: ملعب 1 (كبير)، ملعب 2 (صغير) — كلها <span class="field">exclusive</span></li></ul></div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">إعداد التسعير</h3><div class="tut-step-body">شرائح + تسعير. مثال: ملعب كبير ذروة = 800 ج/ساعة (مقسومة على عدد اللاعبين).</div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">إنشاء الأكاديمية</h3><div class="tut-step-body">أكاديمية خارجية: "أكاديمية الأهلي الناشئين" + عقد revenue_share (70/30) + PDF.<span class="warn">العقد إجباري! بدون PDF لا يمكن تفعيل الأكاديمية.</span></div></div>

app/Modules/Tutorials/Views/sports_activity/full_swimming_workflow.php

@@ -19,6 +19,8 @@
         <div><h1>سيناريو كامل: حمام سباحة</h1><p>من الإعداد حتى التشغيل اليومي</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-pool-grid.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">إنشاء اللعبة</h3><div class="tut-step-body">أنشئ لعبة: <span class="field">code = SWIMMING</span>, category = <span class="field">aquatic</span>.</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">إنشاء المرفق</h3><div class="tut-step-body">أنشئ مرفق: <span class="field">حمام السباحة الرئيسي</span>, facility_type = <span class="field">pool</span>, ساعات 06:00-22:00, فترة 60 دقيقة.</div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">إضافة الحارات</h3><div class="tut-step-body">أضف 6 حارات:<ul><li>كل حارة: booking_mode = <span class="field">shared</span></li><li>max_capacity = <span class="field">8</span> (أشخاص لكل حارة لكل ساعة)</li></ul><span class="info">السباحة حالة خاصة — الحارات shared تسمح لعدة حجوزات بنفس الوقت.</span></div></div>

app/Modules/Tutorials/Views/sports_activity/full_tennis_workflow.php

@@ -19,6 +19,8 @@
         <div><h1>سيناريو كامل: تنس</h1><p>ملاعب تنس بحجز بالساعة وتمارين</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-mirror.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">إنشاء اللعبة والمرفق</h3><div class="tut-step-body"><ul><li>لعبة: <span class="field">TENNIS</span>, category = <span class="field">racket</span></li><li>مرفق: <span class="field">ملاعب التنس</span>, type = <span class="field">court</span></li><li>4 كورتات — كلها <span class="field">exclusive</span>, max_capacity = 4</li></ul></div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">تسعير مرن</h3><div class="tut-step-body"><div class="tut-diagram">Court × Peak × 1-2 players = 200 ج/فرد
 Court × Peak × 3-4 players = 150 ج/فرد

app/Modules/Tutorials/Views/sports_activity/generate_subscriptions.php

@@ -19,6 +19,8 @@
         <div><h1>توليد الاشتراكات الشهرية</h1><p>إنشاء فواتير شهرية للاعبين المسجلين</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-subscriptions.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح التوليد</h3><div class="tut-step-body">من القائمة: <span class="field">الاشتراكات</span> > <span class="field">توليد اشتراكات شهرية</span>.</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">اختيار الشهر</h3><div class="tut-step-body">اختر الشهر والسنة (مثلاً: يونيو 2026).</div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">المعالجة</h3><div class="tut-step-body">لكل لاعب active في كل مجموعة نشطة:<ul><li>يتحقق: هل سبق توليد اشتراك لنفس الفترة؟</li><li>يحدد المبلغ حسب <span class="field">player_type</span></li><li>ينشئ سجل بحالة <span class="field">unpaid</span></li></ul><div class="tut-diagram">المجموعة "سباحة صباحي":

app/Modules/Tutorials/Views/sports_activity/generate_training_bookings.php

@@ -19,6 +19,8 @@
         <div><h1>توليد حجوزات التمارين</h1><p>إنشاء حجوزات تلقائية من جدول المجموعة</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-bookings.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح التوليد</h3><div class="tut-step-body">من صفحة المجموعة > الجدول > <span class="field">توليد حجوزات</span>.</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">اختيار الفترة</h3><div class="tut-step-body">حدد <span class="field">from_date</span> إلى <span class="field">to_date</span> (مثلاً شهر كامل).</div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">المعالجة</h3><div class="tut-step-body">النظام يقرأ الجدول الأسبوعي ولكل حصة مجدولة ينشئ حجز في <span class="field">sa_bookings</span> بنوع <span class="field">training</span>.<div class="tut-diagram">جدول المجموعة:                    الحجوزات المولدة:

app/Modules/Tutorials/Views/sports_activity/medical_workflow.php

@@ -19,6 +19,8 @@
         <div><h1>دورة الموافقة الطبية</h1><p>من الرفع حتى الاعتماد من اللجنة الطبية</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-players.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">رفع شهادة طبية</h3><div class="tut-step-body">من صفحة اللاعب > المستندات > <span class="field">رفع شهادة طبية</span>.</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">بيانات الشهادة</h3><div class="tut-step-body"><ul><li>نوع المستند: <span class="field">medical_cert</span></li><li>الملف (PDF أو صورة)</li><li>تاريخ الفحص وتاريخ الانتهاء</li><li>اسم الطبيب واسم العيادة/المستشفى</li></ul></div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">انتظار اللجنة الطبية</h3><div class="tut-step-body">الشهادة تذهب للحالة <span class="field">pending</span> — بانتظار اللجنة الطبية.</div></div>

app/Modules/Tutorials/Views/sports_activity/mirror_view.php

@@ -19,6 +19,8 @@
         <div><h1>شاشة المراية (المرافق)</h1><p>عرض حالة المرافق والحجوزات لحظياً</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-mirror.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح المراية</h3><div class="tut-step-body">من القائمة: <span class="field">الأنشطة الرياضية</span> > <span class="field">المراية</span> > اختر المرفق.</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">العرض الشبكي</h3><div class="tut-step-body">شبكة = الوحدات (أعمدة) × الفترات الزمنية (صفوف):<div class="tut-diagram">المراية — حمام السباحة — 2026-05-18
 

app/Modules/Tutorials/Views/sports_activity/record_attendance.php

@@ -19,6 +19,8 @@
         <div><h1>تسجيل الحضور</h1><p>تسجيل حضور لاعبين في تمرين</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-attendance.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح الحضور</h3><div class="tut-step-body">من القائمة: <span class="field">الأنشطة الرياضية</span> > <span class="field">الحضور</span>.</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">اختيار التمرين</h3><div class="tut-step-body">اختر التاريخ والمجموعة. النظام يعرض كل اللاعبين المسجلين.</div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">تسجيل الحالة</h3><div class="tut-step-body">لكل لاعب:<ul><li><span class="field">present</span> — حاضر (مع check_in_time)</li><li><span class="field">absent</span> — غائب</li><li><span class="field">late</span> — متأخر (مع الوقت الفعلي)</li><li><span class="field">excused</span> — معتذر</li></ul><span class="info">الحضور يرتبط بحجز التمرين — لازم يكون في حجز training لهذا اليوم والمجموعة.</span></div></div>

app/Modules/Tutorials/Views/sports_activity/register_coach.php

@@ -19,6 +19,8 @@
         <div><h1>تسجيل مدرب جديد</h1><p>إضافة مدرب مع تخصصاته ونظام الدفع</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-coaches.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح صفحة المدربين</h3><div class="tut-step-body">من القائمة الجانبية: <span class="field">الأنشطة الرياضية</span> > <span class="field">المدربين</span>.</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">إضافة مدرب جديد</h3><div class="tut-step-body">اضغط <span class="field">إضافة مدرب جديد</span>.</div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">البيانات الأساسية</h3><div class="tut-step-body"><ul><li><span class="field">code</span> — كود فريد</li><li><span class="field">full_name_ar</span> — الاسم بالعربي</li><li><span class="field">national_id</span> — الرقم القومي</li><li><span class="field">phone</span> — الهاتف</li><li><span class="field">date_of_birth</span> — تاريخ الميلاد</li><li><span class="field">gender</span> — النوع</li><li><span class="field">photo_path</span> — صورة شخصية</li></ul></div></div>

app/Modules/Tutorials/Views/sports_activity/register_player.php

@@ -19,6 +19,8 @@
         <div><h1>تسجيل لاعب جديد</h1><p>تسجيل لاعب ورفع الشهادة الطبية</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-players.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح صفحة اللاعبين</h3><div class="tut-step-body">من القائمة: <span class="field">الأنشطة الرياضية</span> > <span class="field">اللاعبين</span>.</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">تسجيل لاعب جديد</h3><div class="tut-step-body">اضغط <span class="field">تسجيل لاعب جديد</span>.</div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">نوع اللاعب</h3><div class="tut-step-body"><span class="field">player_type</span>: عضو (member) — يتم ربطه بعضوية موجودة، أو غير عضو (non_member).<span class="info">لو اللاعب عضو، بيتم سحب بياناته الأساسية من سجل العضوية تلقائياً.</span></div></div>

app/Modules/Tutorials/Views/sports_activity/setup_academy.php

@@ -19,6 +19,8 @@
         <div><h1>إنشاء أكاديمية وعقدها</h1><p>تسجيل أكاديمية خارجية مع عقد PDF</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-academies.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">إضافة أكاديمية</h3><div class="tut-step-body">من القائمة: <span class="field">الأنشطة الرياضية</span> > <span class="field">الأكاديميات</span> > إضافة أكاديمية.<ul><li><span class="field">code</span> — كود فريد</li><li><span class="field">name_ar</span> — الاسم</li><li><span class="field">discipline_id</span> — ربط بلعبة</li><li><span class="field">academy_type</span> — internal (داخلي) / external (خارجي)</li><li>بيانات الاتصال والوصف</li></ul><span class="info">الأكاديميات الداخلية (internal) هي برامج يديرها النادي بنفسه. الخارجية (external) هي أكاديميات مستقلة تستأجر مرافق النادي.</span></div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">إنشاء عقد</h3><div class="tut-step-body">من صفحة الأكاديمية > العقود > إضافة عقد:<ul><li><span class="field">contract_number</span> — رقم العقد</li><li><span class="field">contract_type</span> — revenue_share / fixed_rent / hybrid</li><li><span class="field">start_date / end_date</span> — مدة العقد</li></ul></div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">الشروط المالية</h3><div class="tut-step-body"><div class="tut-diagram">revenue_share: النادي 30% ── الأكاديمية 70%

app/Modules/Tutorials/Views/sports_activity/setup_discipline.php

@@ -19,6 +19,8 @@
         <div><h1>إنشاء لعبة رياضية جديدة</h1><p>تعريف نشاط رياضي في النظام</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-disciplines.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح صفحة الألعاب الرياضية</h3><div class="tut-step-body">من القائمة الجانبية افتح <span class="field">الأنشطة الرياضية</span> ثم اضغط <span class="field">الألعاب</span>.</div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">إضافة لعبة جديدة</h3><div class="tut-step-body">اضغط زر <span class="field">إضافة لعبة جديدة</span> في أعلى الصفحة.</div></div>

app/Modules/Tutorials/Views/sports_activity/setup_facility.php

@@ -19,6 +19,8 @@
         <div><h1>إنشاء مرفق ووحداته</h1><p>تعريف ملعب أو حمام سباحة مع الوحدات</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-facilities.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح صفحة المرافق</h3><div class="tut-step-body">من القائمة الجانبية: <span class="field">الأنشطة الرياضية</span> > <span class="field">المرافق</span>.</div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">إضافة مرفق جديد</h3><div class="tut-step-body">اضغط <span class="field">إضافة مرفق جديد</span>.</div></div>

app/Modules/Tutorials/Views/sports_activity/setup_pricing.php

@@ -19,6 +19,8 @@
         <div><h1>إعداد قواعد التسعير</h1><p>ربط المرفق × الشريحة × عدد الأفراد بالسعر</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-pricing.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح التسعير</h3><div class="tut-step-body">من القائمة: <span class="field">الأنشطة الرياضية</span> > <span class="field">التسعير</span>.</div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">إضافة قاعدة تسعير</h3><div class="tut-step-body">

app/Modules/Tutorials/Views/sports_activity/setup_time_brackets.php

@@ -19,6 +19,8 @@
         <div><h1>إعداد شرائح الوقت</h1><p>تعريف أوقات الذروة والعادية</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-schedule.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح شرائح الوقت</h3><div class="tut-step-body">من صفحة المرفق اضغط <span class="field">شرائح الوقت</span> أو افتح <span class="field">المرافق</span> > اختر المرفق > تبويب الشرائح.</div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">إضافة شريحة</h3><div class="tut-step-body">اضغط <span class="field">إضافة شريحة</span> واملأ:

app/Modules/Tutorials/Views/sports_activity/sports_payment_queue.php

@@ -19,6 +19,8 @@
         <div><h1>طابور دفع الأنشطة الرياضية</h1><p>عرض ومعالجة طلبات الدفع في خزنة الأنشطة الفرعية</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-subscriptions.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح الطابور</h3><div class="tut-step-body">من القائمة الجانبية: <span class="field">خزنة الأنشطة</span> > <span class="field">طابور الدفع</span>. يظهر جميع طلبات الدفع المعلقة والجارية المرتبطة بالأنشطة الرياضية.<span class="info">الطابور يتحدث تلقائياً كل 30 ثانية. أنواع الطلبات: تسجيل رياضي، اشتراك نشاط، حجز ساعة، إيجار لوكر.</span></div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">التأكد من وجود وردية مفتوحة</h3><div class="tut-step-body">قبل التحصيل — يجب أن تكون هناك وردية مفتوحة. إذا لم تكن موجودة:<ul><li>يظهر شريط أصفر: «لا توجد وردية مفتوحة»</li><li>اضغط <span class="field">فتح وردية</span> لبدء العمل</li></ul><span class="warn">لا يمكن تحصيل أي دفعة بدون وردية مفتوحة — الزر «تحصيل» لن يعمل.</span></div></div>

app/Modules/Tutorials/Views/sports_activity/waitlist_management.php

@@ -19,6 +19,8 @@
         <div><h1>إدارة قائمة الانتظار</h1><p>إضافة لاعب لقائمة انتظار مجموعة ممتلئة</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/sa-waitlist.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">متى تظهر قائمة الانتظار</h3><div class="tut-step-body">عند محاولة تسجيل لاعب في مجموعة ممتلئة (<span class="field">is_full = 1</span>).</div></div>
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">الإضافة للقائمة</h3><div class="tut-step-body">النظام يعرض خيار "إضافة لقائمة الانتظار". يتم تسجيل اللاعب بـ <span class="field">status = waiting</span> وترتيب تلقائي.</div></div>
     <div class="tut-step"><div class="tut-step-num">3</div><h3 class="tut-step-title">عند انسحاب لاعب</h3><div class="tut-step-body"><div class="tut-diagram">المجموعة ممتلئة (12/12)

app/Modules/Tutorials/Views/treasury/bank_deposit.php

@@ -19,6 +19,8 @@
         <div><h1>إيداع بنكي</h1><p>تسجيل إيداع المبالغ في الحساب البنكي</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/cashier-deposits.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">متى يتم الإيداع؟</h3><div class="tut-step-body">أمين الخزنة الرئيسية ملزم بإيداع كل المبالغ النقدية المستلمة في البنك <strong>في اليوم التالي قبل الساعة 11 صباحاً</strong>. لا يجوز بقاء مبالغ في العهدة أكثر من يوم عمل.<span class="warn">التأخير في الإيداع يظهر كتنبيه تلقائي للإدارة ويُسجل في تقرير المتابعة.</span></div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">الذهاب إلى إيداعات البنك</h3><div class="tut-step-body">من القائمة الجانبية اذهب إلى <span class="field">الخزنة</span> > <span class="field">إيداعات البنك</span>. ستظهر قائمة الإيداعات السابقة.</div></div>

app/Modules/Tutorials/Views/treasury/close_session.php

@@ -19,6 +19,8 @@
         <div><h1>إغلاق وردية</h1><p>إنهاء الوردية الحالية ومراجعة إجمالي التحصيلات</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/treasury-sessions.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">الذهاب إلى لوحة التحكم</h3><div class="tut-step-body">من لوحة الخزنة الفرعية، ستجد ملخص الوردية الحالية يعرض عدد الإيصالات وإجمالي المبالغ المحصّلة.</div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">الضغط على إغلاق الوردية</h3><div class="tut-step-body">اضغط زر <span class="field">إغلاق الوردية</span>. سيطلب النظام تأكيداً قبل الإغلاق.<span class="warn">بعد الإغلاق لا يمكن إضافة تحصيلات جديدة على هذه الوردية. تأكد من إتمام كل العمليات المعلّقة.</span></div></div>

app/Modules/Tutorials/Views/treasury/collect_payment.php

@@ -19,6 +19,8 @@
         <div><h1>تحصيل مبلغ</h1><p>استلام دفعة من عضو أو لاعب وإصدار إيصال</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/treasury-queue.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح قائمة الانتظار</h3><div class="tut-step-body">من لوحة الخزنة الفرعية، اضغط على <span class="field">طلبات التحصيل</span> أو <span class="field">قائمة الانتظار</span>. ستظهر جميع الطلبات المعلّقة التي تنتظر الدفع.</div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">اختيار الطلب المعلّق</h3><div class="tut-step-body">اختر الطلب المطلوب تحصيله. ستظهر تفاصيل المبلغ المستحق واسم العضو ونوع الخدمة (اشتراك، تجديد، نشاط رياضي، إلخ).<span class="info">يمكنك البحث بالاسم أو رقم العضوية للوصول السريع للطلب.</span></div></div>

app/Modules/Tutorials/Views/treasury/confirm_deposit.php

@@ -19,6 +19,8 @@
         <div><h1>تأكيد إيداع</h1><p>مراجعة واعتماد الإيداع البنكي من مدير المحاسبة</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/cashier-deposits.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح شاشة الإيداعات</h3><div class="tut-step-body">مدير المحاسبة يذهب إلى <span class="field">المحاسبة</span> > <span class="field">إيداعات البنك</span> أو من الإشعارات الواردة بوجود إيداع معلّق.</div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">عرض الإيداعات المعلّقة</h3><div class="tut-step-body">ستظهر قائمة الإيداعات بحالة <span class="field">في انتظار التأكيد</span>. اختر الإيداع المراد مراجعته.</div></div>

app/Modules/Tutorials/Views/treasury/custody_tracking.php

@@ -19,6 +19,8 @@
         <div><h1>متابعة العهدة</h1><p>فهم رصيد العهدة وكيفية مراقبته وتصفيره</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/treasury-dashboard.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">ما هي العهدة؟</h3><div class="tut-step-body">العهدة هي المبلغ المالي الموجود في حوزة الموظف والذي لم يُسلَّم بعد. كل موظف خزنة له رصيد عهدة يتغير مع العمليات اليومية.<span class="info">العهدة ليست ملكاً للموظف — هي أموال النادي المؤتمن عليها مؤقتاً حتى تسليمها.</span></div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">أين ترى رصيد العهدة؟</h3><div class="tut-step-body">رصيد العهدة يظهر في:

app/Modules/Tutorials/Views/treasury/full_cycle.php

@@ -19,6 +19,8 @@
         <div><h1>الدورة الكاملة</h1><p>من لحظة دفع اللاعب حتى القيد المحاسبي النهائي</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/treasury-dashboard.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">الصورة الكاملة</h3><div class="tut-step-body"><div class="tut-diagram">Player pays 500 EGP
         │
         ▼

app/Modules/Tutorials/Views/treasury/initiate_settlement.php

@@ -19,6 +19,8 @@
         <div><h1>إنشاء تسوية</h1><p>تحويل المبالغ المحصّلة من الخزنة الفرعية إلى الخزنة الرئيسية</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/treasury-settlements.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">الذهاب إلى التسويات</h3><div class="tut-step-body">من القائمة الجانبية اذهب إلى <span class="field">الخزنة</span> > <span class="field">التسويات</span>. ستظهر قائمة التسويات السابقة وزر إنشاء تسوية جديدة.</div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">إنشاء تسوية جديدة</h3><div class="tut-step-body">اضغط <span class="field">تسوية جديدة</span>. النظام يعرض الورديات المغلقة التي لم تُسوَّ بعد.</div></div>

app/Modules/Tutorials/Views/treasury/open_session.php

@@ -19,6 +19,8 @@
         <div><h1>فتح وردية</h1><p>بدء يوم العمل في الخزنة الفرعية وتفعيل استقبال المدفوعات</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/treasury-sessions.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">الدخول إلى الخزنة الفرعية</h3><div class="tut-step-body">من القائمة الجانبية اذهب إلى <span class="field">الخزنة</span> > <span class="field">الخزنة الفرعية</span>. ستظهر لك لوحة التحكم الخاصة بالخزنة.</div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">الضغط على فتح وردية</h3><div class="tut-step-body">اضغط على زر <span class="field">فتح وردية</span> الموجود أعلى الصفحة. لن يظهر الزر إذا كانت هناك وردية مفتوحة بالفعل.<span class="warn">لا يمكن فتح أكثر من وردية واحدة في نفس الوقت لنفس الموظف.</span></div></div>

app/Modules/Tutorials/Views/treasury/receive_settlement.php

@@ -19,6 +19,8 @@
         <div><h1>استلام تسوية</h1><p>تأكيد استلام المبالغ في الخزنة الرئيسية من الخزنات الفرعية</p></div>
     </div>
 
+    <div style="margin-bottom:20px;border:1px solid #E5E7EB;border-radius:12px;overflow:hidden;"><img src="/assets/tutorials/screenshots/treasury-settlements.png" alt="لقطة شاشة" style="width:100%;display:block;" loading="lazy"></div>
+
     <div class="tut-step"><div class="tut-step-num">1</div><h3 class="tut-step-title">فتح شاشة الخزنة الرئيسية</h3><div class="tut-step-body">من القائمة الجانبية اذهب إلى <span class="field">الخزنة</span> > <span class="field">الخزنة الرئيسية</span>. ستظهر التسويات الواردة التي تنتظر الاستلام.</div></div>
 
     <div class="tut-step"><div class="tut-step-num">2</div><h3 class="tut-step-title">مراجعة التسويات الواردة</h3><div class="tut-step-body">اختر التسوية المطلوب استلامها. تحقق من: