<?php $__template->layout('Layout.main'); ?>
<?php $__template->section('title'); ?>تعديل المجموعة: <?= e($group->name_ar) ?><?php $__template->endSection(); ?>

<?php $__template->section('page_actions'); ?>
<a href="/training-groups/<?= (int) $group->id ?>" class="btn btn-outline"><i data-lucide="eye" style="width:15px;height:15px;vertical-align:middle;margin-left:4px;"></i> عرض</a>
<a href="/training-groups" 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'); ?>

<form method="POST" action="/training-groups/<?= (int) $group->id ?>" id="groupForm">
    <?= csrf_field() ?>

    <!-- Basic Information -->
    <div class="card" style="margin-bottom:20px;">
        <div style="padding:15px 20px;border-bottom:1px solid #E5E7EB;display:flex;align-items:center;gap:8px;">
            <i data-lucide="users" style="width:18px;height:18px;color:#1e3a5f;"></i>
            <h3 style="margin:0;color:#1e3a5f;font-size:15px;">البيانات الأساسية</h3>
        </div>
        <div style="padding:20px;">
            <div style="display:grid;grid-template-columns:1fr 1fr;gap:20px;">
                <div class="form-group">
                    <label class="form-label">اسم المجموعة بالعربي <span style="color:#DC2626;">*</span></label>
                    <input type="text" name="name_ar" value="<?= e(old('name_ar') ?? $group->name_ar) ?>" class="form-input" required>
                </div>
                <div class="form-group">
                    <label class="form-label">اسم المجموعة بالإنجليزي</label>
                    <input type="text" name="name_en" value="<?= e(old('name_en') ?? $group->name_en ?? '') ?>" class="form-input" style="direction:ltr;text-align:left;">
                </div>
            </div>
            <div style="display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:15px;">
                <div class="form-group">
                    <label class="form-label">الأكاديمية <span style="color:#DC2626;">*</span></label>
                    <select name="academy_id" class="form-select" required id="academySelect">
                        <option value="">-- اختر الأكاديمية --</option>
                        <?php foreach ($academies as $acad): ?>
                        <option value="<?= (int) $acad['id'] ?>" <?= ((int)(old('academy_id') ?? $group->academy_id)) === (int) $acad['id'] ? 'selected' : '' ?>><?= e($acad['name_ar']) ?></option>
                        <?php endforeach; ?>
                    </select>
                </div>
                <div class="form-group">
                    <label class="form-label">المستوى <span style="color:#DC2626;">*</span></label>
                    <select name="level_id" class="form-select" required id="levelSelect">
                        <option value="">-- اختر المستوى --</option>
                        <?php foreach ($levels as $lvl): ?>
                        <option value="<?= (int) $lvl['id'] ?>" data-academy="<?= (int) $lvl['academy_id'] ?>" <?= ((int)(old('level_id') ?? $group->level_id)) === (int) $lvl['id'] ? 'selected' : '' ?>><?= e($lvl['name_ar']) ?></option>
                        <?php endforeach; ?>
                    </select>
                </div>
            </div>
            <div style="display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:15px;">
                <div class="form-group">
                    <label class="form-label">المدرب</label>
                    <select name="coach_id" class="form-select">
                        <option value="">-- بدون مدرب --</option>
                        <?php foreach ($coaches as $coach): ?>
                        <option value="<?= (int) $coach['id'] ?>" <?= ((int)(old('coach_id') ?? $group->coach_id ?? 0)) === (int) $coach['id'] ? 'selected' : '' ?>><?= e($coach['full_name_ar']) ?></option>
                        <?php endforeach; ?>
                    </select>
                </div>
                <div class="form-group">
                    <label class="form-label">المنشأة</label>
                    <select name="facility_id" class="form-select">
                        <option value="">-- بدون تحديد --</option>
                        <?php foreach ($facilities as $fac): ?>
                        <option value="<?= (int) $fac['id'] ?>" <?= ((int)(old('facility_id') ?? $group->facility_id ?? 0)) === (int) $fac['id'] ? 'selected' : '' ?>><?= e($fac['name_ar']) ?></option>
                        <?php endforeach; ?>
                    </select>
                </div>
            </div>
        </div>
    </div>

    <!-- Group Settings -->
    <div class="card" style="margin-bottom:20px;">
        <div style="padding:15px 20px;border-bottom:1px solid #E5E7EB;display:flex;align-items:center;gap:8px;">
            <i data-lucide="settings" style="width:18px;height:18px;color:#7C3AED;"></i>
            <h3 style="margin:0;color:#7C3AED;font-size:15px;">إعدادات المجموعة</h3>
        </div>
        <div style="padding:20px;">
            <div style="display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;">
                <div class="form-group">
                    <label class="form-label">نوع المجموعة <span style="color:#DC2626;">*</span></label>
                    <select name="group_type" class="form-select" required>
                        <?php foreach ($groupTypes as $key => $label): ?>
                        <option value="<?= e($key) ?>" <?= (old('group_type') ?? $group->group_type) === $key ? 'selected' : '' ?>><?= e($label) ?></option>
                        <?php endforeach; ?>
                    </select>
                </div>
                <div class="form-group">
                    <label class="form-label">الحد الأدنى للسعة</label>
                    <input type="number" name="min_capacity" value="<?= e(old('min_capacity') ?? $group->min_capacity) ?>" class="form-input" min="1" style="direction:ltr;text-align:left;">
                </div>
                <div class="form-group">
                    <label class="form-label">الحد الأقصى للسعة</label>
                    <input type="number" name="max_capacity" value="<?= e(old('max_capacity') ?? $group->max_capacity) ?>" class="form-input" min="1" max="100" style="direction:ltr;text-align:left;">
                </div>
            </div>
            <div style="display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px;margin-top:15px;">
                <div class="form-group">
                    <label class="form-label">العمر من</label>
                    <input type="number" name="age_from" value="<?= e(old('age_from') ?? $group->age_from ?? '') ?>" class="form-input" min="3" max="60" style="direction:ltr;text-align:left;" placeholder="سنة">
                </div>
                <div class="form-group">
                    <label class="form-label">العمر إلى</label>
                    <input type="number" name="age_to" value="<?= e(old('age_to') ?? $group->age_to ?? '') ?>" class="form-input" min="3" max="60" style="direction:ltr;text-align:left;" placeholder="سنة">
                </div>
                <div class="form-group">
                    <label class="form-label">قيد النوع</label>
                    <select name="gender_restriction" class="form-select">
                        <option value="" <?= (old('gender_restriction') ?? $group->gender_restriction ?? '') === '' ? 'selected' : '' ?>>مختلط</option>
                        <option value="male" <?= (old('gender_restriction') ?? $group->gender_restriction ?? '') === 'male' ? 'selected' : '' ?>>ذكور فقط</option>
                        <option value="female" <?= (old('gender_restriction') ?? $group->gender_restriction ?? '') === 'female' ? 'selected' : '' ?>>إناث فقط</option>
                    </select>
                </div>
            </div>
        </div>
    </div>

    <!-- Schedule & Pricing -->
    <div class="card" style="margin-bottom:20px;">
        <div style="padding:15px 20px;border-bottom:1px solid #E5E7EB;display:flex;align-items:center;gap:8px;">
            <i data-lucide="clock" style="width:18px;height:18px;color:#059669;"></i>
            <h3 style="margin:0;color:#059669;font-size:15px;">الجدول والتسعير</h3>
        </div>
        <div style="padding:20px;">
            <div style="display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:20px;">
                <div class="form-group">
                    <label class="form-label">اليوم</label>
                    <select name="day_of_week" class="form-select">
                        <option value="">-- غير محدد --</option>
                        <?php
                        $dayNames = [0=>'الأحد',1=>'الإثنين',2=>'الثلاثاء',3=>'الأربعاء',4=>'الخميس',5=>'الجمعة',6=>'السبت'];
                        $currentDay = old('day_of_week') ?? $group->day_of_week ?? '';
                        foreach ($dayNames as $dKey => $dLabel): ?>
                        <option value="<?= $dKey ?>" <?= (string) $currentDay === (string) $dKey ? 'selected' : '' ?>><?= e($dLabel) ?></option>
                        <?php endforeach; ?>
                    </select>
                </div>
                <div class="form-group">
                    <label class="form-label">وقت البداية</label>
                    <input type="time" name="start_time" value="<?= e(old('start_time') ?? $group->start_time ?? '') ?>" class="form-input" style="direction:ltr;text-align:left;">
                </div>
                <div class="form-group">
                    <label class="form-label">وقت النهاية</label>
                    <input type="time" name="end_time" value="<?= e(old('end_time') ?? $group->end_time ?? '') ?>" class="form-input" style="direction:ltr;text-align:left;">
                </div>
                <div class="form-group">
                    <label class="form-label">فئة التسعير</label>
                    <select name="pricing_tier" class="form-select">
                        <?php foreach ($pricingTiers as $key => $label): ?>
                        <option value="<?= e($key) ?>" <?= (old('pricing_tier') ?? $group->pricing_tier) === $key ? 'selected' : '' ?>><?= e($label) ?></option>
                        <?php endforeach; ?>
                    </select>
                </div>
            </div>
        </div>
    </div>

    <!-- Submit -->
    <div style="display:flex;gap:10px;justify-content:flex-start;">
        <button type="submit" class="btn btn-primary" style="padding:12px 30px;font-size:15px;">
            <i data-lucide="check" style="width:16px;height:16px;vertical-align:middle;margin-left:4px;"></i> حفظ التعديلات
        </button>
        <a href="/training-groups/<?= (int) $group->id ?>" class="btn btn-outline" style="padding:12px 30px;font-size:15px;">إلغاء</a>
    </div>
</form>

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

    // Cascading level select based on academy
    var academySelect = document.getElementById('academySelect');
    var levelSelect = document.getElementById('levelSelect');

    if (academySelect && levelSelect) {
        var allOptions = Array.from(levelSelect.querySelectorAll('option[data-academy]'));
        var currentLevelId = '<?= (int) $group->level_id ?>';

        academySelect.addEventListener('change', function() {
            var academyId = this.value;
            levelSelect.innerHTML = '<option value="">-- اختر المستوى --</option>';

            allOptions.forEach(function(opt) {
                if (opt.getAttribute('data-academy') === academyId || academyId === '') {
                    var clone = opt.cloneNode(true);
                    if (clone.value === currentLevelId) {
                        clone.selected = true;
                    }
                    levelSelect.appendChild(clone);
                }
            });
        });

        // Trigger on load
        if (academySelect.value) {
            academySelect.dispatchEvent(new Event('change'));
        }
    }
});
</script>

<?php $__template->endSection(); ?>
