<?php $__template->layout('Layout.main'); ?>
<?php $__template->section('title'); ?>جدولة حصة تعويضية<?php $__template->endSection(); ?>

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

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

<div class="card" style="padding:15px;margin-bottom:15px;background:#EFF6FF;border-right:4px solid #2563EB;">
    <div style="display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;">
        <div>
            <strong>اللاعب:</strong> <?= e($makeup['player_name'] ?? '') ?>
            <span style="margin-right:15px;"><strong>المجموعة الأصلية:</strong> <?= e($makeup['group_name'] ?? '') ?></span>
        </div>
        <div style="font-size:13px;color:#4B5563;">
            <strong>تاريخ الغياب:</strong> <?= e($makeup['missed_session_date']) ?>
            | <strong>ينتهي في:</strong> <?= e($makeup['expires_at']) ?>
        </div>
    </div>
</div>

<div class="card" style="padding:20px;">
    <form method="POST" action="/sa/makeup-sessions/<?= (int)$makeup['id'] ?>/schedule">
        <?= csrf_field() ?>

        <div style="margin-bottom:15px;">
            <label class="form-label">المجموعة المستهدفة للتعويض</label>
            <select name="makeup_group_id" class="form-select" data-searchable="true" required>
                <option value="">-- اختر مجموعة --</option>
                <?php foreach ($availableGroups as $g): ?>
                <option value="<?= (int)$g['id'] ?>"><?= e($g['name_ar']) ?> (<?= e($g['coach_name'] ?? '') ?>)</option>
                <?php endforeach; ?>
            </select>
            <small style="color:#6B7280;">يجب أن تكون في نفس النشاط الرياضي</small>
        </div>

        <div style="margin-bottom:15px;">
            <label class="form-label">تاريخ التعويض</label>
            <input type="date" name="makeup_date" class="form-control" required
                   min="<?= date('Y-m-d') ?>" max="<?= e($makeup['expires_at']) ?>">
            <small style="color:#6B7280;">يجب أن يكون يوم تدريب المجموعة المختارة وقبل <?= e($makeup['expires_at']) ?></small>
        </div>

        <button type="submit" class="btn btn-primary">تأكيد الجدولة</button>
    </form>
</div>

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