<?php
use App\Modules\Coaches\Models\Coach;
$__template->layout('Layout.main');
?>
<?php $__template->section('title'); ?><?= e($coach->full_name_ar) ?><?php $__template->endSection(); ?>

<?php $__template->section('page_actions'); ?>
<a href="/coaches/<?= (int) $coach->id ?>/edit" class="btn btn-outline"><i data-lucide="edit-3" style="width:15px;height:15px;vertical-align:middle;margin-left:4px;"></i> تعديل</a>
<form method="POST" action="/coaches/<?= (int) $coach->id ?>/toggle" style="display:inline;">
    <?= csrf_field() ?>
    <button type="submit" class="btn btn-outline" style="color:<?= $coach->is_active ? '#DC2626' : '#059669' ?>;">
        <i data-lucide="<?= $coach->is_active ? 'x-circle' : 'check-circle' ?>" style="width:15px;height:15px;vertical-align:middle;margin-left:4px;"></i>
        <?= $coach->is_active ? 'إيقاف' : 'تفعيل' ?>
    </button>
</form>
<a href="/coaches" 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'); ?>

<?php
$empTypes = Coach::getEmploymentTypes();
$payModels = Coach::getPaymentModels();
$empColor = ['staff' => '#059669', 'contract' => '#2563EB', 'freelance' => '#D97706'][$coach->employment_type] ?? '#6B7280';
$certs = $coach->getCertifications();
?>

<!-- Profile Header -->
<div class="card" style="margin-bottom:20px;">
    <div style="padding:25px;display:flex;align-items:center;gap:20px;">
        <div style="width:90px;height:90px;border-radius:50%;background:#F3F4F6;display:flex;align-items:center;justify-content:center;overflow:hidden;border:3px solid <?= $empColor ?>;flex-shrink:0;">
            <?php if (!empty($coach->photo_path)): ?>
            <img src="<?= e($coach->photo_path) ?>" style="width:90px;height:90px;object-fit:cover;border-radius:50%;">
            <?php else: ?>
            <i data-lucide="user" style="width:40px;height:40px;color:#9CA3AF;"></i>
            <?php endif; ?>
        </div>
        <div style="flex:1;">
            <h2 style="margin:0 0 4px;font-size:22px;color:#1A1A2E;"><?= e($coach->full_name_ar) ?></h2>
            <?php if (!empty($coach->full_name_en)): ?>
            <div style="font-size:14px;color:#6B7280;margin-bottom:8px;"><?= e($coach->full_name_en) ?></div>
            <?php endif; ?>
            <div style="display:flex;gap:10px;flex-wrap:wrap;">
                <span style="padding:4px 12px;border-radius:10px;font-size:12px;font-weight:600;background:<?= $empColor ?>15;color:<?= $empColor ?>;"><?= e($empTypes[$coach->employment_type] ?? '') ?></span>
                <span style="padding:4px 12px;border-radius:10px;font-size:12px;background:#F3F4F6;color:#6B7280;"><?= e($payModels[$coach->payment_model] ?? '') ?></span>
                <?php if (!$coach->is_active): ?>
                <span style="padding:4px 12px;border-radius:10px;font-size:12px;background:#FEE2E2;color:#DC2626;">معطّل</span>
                <?php endif; ?>
            </div>
        </div>
        <div style="text-align:left;direction:ltr;">
            <code style="font-size:12px;color:#9CA3AF;background:#F9FAFB;padding:4px 8px;border-radius:4px;"><?= e($coach->code) ?></code>
        </div>
    </div>
</div>

<!-- Stats Cards -->
<div style="display:grid;grid-template-columns:repeat(4, 1fr);gap:15px;margin-bottom:20px;">
    <div class="card" style="padding:15px;text-align:center;">
        <div style="font-size:24px;font-weight:700;color:#0D7377;"><?= $utilization['total_schedules'] ?></div>
        <div style="font-size:12px;color:#6B7280;">جدول أسبوعي</div>
    </div>
    <div class="card" style="padding:15px;text-align:center;">
        <div style="font-size:24px;font-weight:700;color:#2563EB;"><?= $utilization['total_hours'] ?></div>
        <div style="font-size:12px;color:#6B7280;">ساعة/أسبوع</div>
    </div>
    <div class="card" style="padding:15px;text-align:center;">
        <div style="font-size:24px;font-weight:700;color:#D97706;"><?= $utilization['total_assignments'] ?></div>
        <div style="font-size:12px;color:#6B7280;">أكاديمية</div>
    </div>
    <div class="card" style="padding:15px;text-align:center;">
        <div style="font-size:24px;font-weight:700;color:#059669;"><?= (int) ($coach->max_players_default ?? 20) ?></div>
        <div style="font-size:12px;color:#6B7280;">حد اللاعبين</div>
    </div>
</div>

<!-- Info Sections -->
<div style="display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px;">
    <!-- Contact Info -->
    <div class="card">
        <div style="padding:15px 20px;border-bottom:1px solid #E5E7EB;display:flex;align-items:center;gap:8px;">
            <i data-lucide="contact" style="width:16px;height:16px;color:#0D7377;"></i>
            <h3 style="margin:0;font-size:14px;color:#0D7377;">بيانات التواصل</h3>
        </div>
        <div style="padding:15px 20px;">
            <table style="width:100%;font-size:13px;">
                <?php if (!empty($coach->phone)): ?>
                <tr><td style="padding:6px 0;color:#6B7280;width:120px;">الهاتف</td><td style="direction:ltr;text-align:right;"><?= e($coach->phone) ?></td></tr>
                <?php endif; ?>
                <?php if (!empty($coach->email)): ?>
                <tr><td style="padding:6px 0;color:#6B7280;">البريد</td><td style="direction:ltr;text-align:right;"><?= e($coach->email) ?></td></tr>
                <?php endif; ?>
                <?php if (!empty($coach->national_id)): ?>
                <tr><td style="padding:6px 0;color:#6B7280;">الرقم القومي</td><td style="direction:ltr;text-align:right;"><?= e($coach->national_id) ?></td></tr>
                <?php endif; ?>
                <?php if (!empty($coach->date_of_birth)): ?>
                <tr><td style="padding:6px 0;color:#6B7280;">تاريخ الميلاد</td><td><?= e($coach->date_of_birth) ?></td></tr>
                <?php endif; ?>
                <?php if (!empty($coach->gender)): ?>
                <tr><td style="padding:6px 0;color:#6B7280;">النوع</td><td><?= $coach->gender === 'male' ? 'ذكر' : 'أنثى' ?></td></tr>
                <?php endif; ?>
            </table>
        </div>
    </div>

    <!-- Financial Info -->
    <div class="card">
        <div style="padding:15px 20px;border-bottom:1px solid #E5E7EB;display:flex;align-items:center;gap:8px;">
            <i data-lucide="banknote" style="width:16px;height:16px;color:#059669;"></i>
            <h3 style="margin:0;font-size:14px;color:#059669;">البيانات المالية</h3>
        </div>
        <div style="padding:15px 20px;">
            <table style="width:100%;font-size:13px;">
                <tr><td style="padding:6px 0;color:#6B7280;width:120px;">نموذج الدفع</td><td><?= e($payModels[$coach->payment_model] ?? '') ?></td></tr>
                <?php if ($coach->hourly_rate): ?>
                <tr><td style="padding:6px 0;color:#6B7280;">سعر الساعة</td><td><?= number_format((float) $coach->hourly_rate, 2) ?> ج.م</td></tr>
                <?php endif; ?>
                <?php if ($coach->session_rate): ?>
                <tr><td style="padding:6px 0;color:#6B7280;">سعر الحصة</td><td><?= number_format((float) $coach->session_rate, 2) ?> ج.م</td></tr>
                <?php endif; ?>
                <?php if ($coach->monthly_rate): ?>
                <tr><td style="padding:6px 0;color:#6B7280;">الراتب الشهري</td><td><?= number_format((float) $coach->monthly_rate, 2) ?> ج.م</td></tr>
                <?php endif; ?>
            </table>
        </div>
    </div>
</div>

<!-- Disciplines -->
<?php if (!empty($disciplines)): ?>
<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="activity" style="width:16px;height:16px;color:#2563EB;"></i>
        <h3 style="margin:0;font-size:14px;color:#2563EB;">التخصصات الرياضية</h3>
    </div>
    <div style="padding:15px 20px;display:flex;flex-wrap:wrap;gap:10px;">
        <?php foreach ($disciplines as $disc): ?>
        <span style="padding:6px 14px;border-radius:8px;font-size:13px;background:#EFF6FF;color:#2563EB;display:flex;align-items:center;gap:6px;">
            <i data-lucide="<?= e($disc['discipline_icon'] ?? 'activity') ?>" style="width:14px;height:14px;"></i>
            <?= e($disc['discipline_name'] ?? '') ?>
            <?php if ($disc['is_primary']): ?>
            <span style="font-size:10px;background:#2563EB;color:white;padding:1px 6px;border-radius:4px;">رئيسي</span>
            <?php endif; ?>
        </span>
        <?php endforeach; ?>
    </div>
</div>
<?php endif; ?>

<!-- Certifications -->
<?php if (!empty($certs)): ?>
<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="award" style="width:16px;height:16px;color:#D97706;"></i>
        <h3 style="margin:0;font-size:14px;color:#D97706;">الشهادات والتراخيص</h3>
    </div>
    <div style="padding:15px 20px;">
        <ul style="margin:0;padding:0 15px;font-size:13px;color:#374151;">
            <?php foreach ($certs as $cert): ?>
            <li style="padding:4px 0;"><?= e($cert) ?></li>
            <?php endforeach; ?>
        </ul>
    </div>
</div>
<?php endif; ?>

<!-- Academy Assignments -->
<div class="card" style="margin-bottom:20px;">
    <div style="padding:15px 20px;border-bottom:1px solid #E5E7EB;display:flex;align-items:center;justify-content:space-between;">
        <div style="display:flex;align-items:center;gap:8px;">
            <i data-lucide="graduation-cap" style="width:16px;height:16px;color:#7C3AED;"></i>
            <h3 style="margin:0;font-size:14px;color:#7C3AED;">الأكاديميات المعيّن بها</h3>
        </div>
    </div>
    <div style="padding:15px 20px;">
        <?php if (!empty($assignments)): ?>
        <table style="width:100%;font-size:13px;border-collapse:collapse;">
            <thead>
                <tr style="background:#F9FAFB;color:#6B7280;font-size:12px;">
                    <th style="padding:8px;text-align:right;border-bottom:1px solid #E5E7EB;">الأكاديمية</th>
                    <th style="padding:8px;text-align:right;border-bottom:1px solid #E5E7EB;">المستوى</th>
                    <th style="padding:8px;text-align:right;border-bottom:1px solid #E5E7EB;">الدور</th>
                    <th style="padding:8px;text-align:right;border-bottom:1px solid #E5E7EB;">من</th>
                    <th style="padding:8px;text-align:center;border-bottom:1px solid #E5E7EB;">إجراء</th>
                </tr>
            </thead>
            <tbody>
                <?php foreach ($assignments as $asgn): ?>
                <tr>
                    <td style="padding:8px;border-bottom:1px solid #F3F4F6;"><?= e($asgn['academy_name'] ?? '—') ?></td>
                    <td style="padding:8px;border-bottom:1px solid #F3F4F6;"><?= e($asgn['level_name'] ?? 'الكل') ?></td>
                    <td style="padding:8px;border-bottom:1px solid #F3F4F6;"><?= e($roles[$asgn['role']] ?? $asgn['role']) ?></td>
                    <td style="padding:8px;border-bottom:1px solid #F3F4F6;"><?= e($asgn['assigned_from'] ?? '') ?></td>
                    <td style="padding:8px;border-bottom:1px solid #F3F4F6;text-align:center;">
                        <form method="POST" action="/coaches/<?= (int) $coach->id ?>/unassign" style="display:inline;">
                            <?= csrf_field() ?>
                            <input type="hidden" name="assignment_id" value="<?= (int) $asgn['id'] ?>">
                            <button type="submit" class="btn btn-sm btn-outline" style="color:#DC2626;font-size:11px;padding:3px 8px;">إلغاء</button>
                        </form>
                    </td>
                </tr>
                <?php endforeach; ?>
            </tbody>
        </table>
        <?php else: ?>
        <p style="color:#9CA3AF;font-size:13px;margin:0;">لم يتم تعيين المدرب في أي أكاديمية بعد.</p>
        <?php endif; ?>

        <!-- Add Assignment Form -->
        <div style="margin-top:15px;padding-top:15px;border-top:1px solid #E5E7EB;">
            <form method="POST" action="/coaches/<?= (int) $coach->id ?>/assign" style="display:flex;gap:10px;align-items:end;flex-wrap:wrap;">
                <?= csrf_field() ?>
                <div style="min-width:150px;">
                    <label class="form-label" style="font-size:11px;">الأكاديمية</label>
                    <select name="academy_id" class="form-input" style="font-size:12px;" required>
                        <option value="">-- اختر --</option>
                        <?php foreach ($academies as $acad): ?>
                        <option value="<?= (int) $acad['id'] ?>"><?= e($acad['name_ar']) ?></option>
                        <?php endforeach; ?>
                    </select>
                </div>
                <div style="min-width:130px;">
                    <label class="form-label" style="font-size:11px;">المستوى</label>
                    <select name="level_id" class="form-input" style="font-size:12px;">
                        <option value="">الكل</option>
                        <?php foreach ($levels as $lvl): ?>
                        <option value="<?= (int) $lvl['id'] ?>"><?= e($lvl['name_ar']) ?></option>
                        <?php endforeach; ?>
                    </select>
                </div>
                <div style="min-width:110px;">
                    <label class="form-label" style="font-size:11px;">الدور</label>
                    <select name="role" class="form-input" style="font-size:12px;">
                        <?php foreach ($roles as $rKey => $rLabel): ?>
                        <option value="<?= e($rKey) ?>"><?= e($rLabel) ?></option>
                        <?php endforeach; ?>
                    </select>
                </div>
                <div style="min-width:120px;">
                    <label class="form-label" style="font-size:11px;">من تاريخ</label>
                    <input type="date" name="assigned_from" value="<?= date('Y-m-d') ?>" class="form-input" style="font-size:12px;direction:ltr;">
                </div>
                <button type="submit" class="btn btn-primary" style="font-size:12px;padding:8px 14px;">
                    <i data-lucide="plus" style="width:13px;height:13px;vertical-align:middle;"></i> تعيين
                </button>
            </form>
        </div>
    </div>
</div>

<!-- Availability -->
<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:16px;height:16px;color:#059669;"></i>
        <h3 style="margin:0;font-size:14px;color:#059669;">مواعيد العمل</h3>
    </div>
    <div style="padding:15px 20px;">
        <?php if (!empty($availability)): ?>
        <div style="display:grid;grid-template-columns:repeat(auto-fill, minmax(200px, 1fr));gap:10px;">
            <?php foreach ($availability as $slot): ?>
            <div style="padding:10px;background:#F0FDF4;border-radius:8px;border:1px solid #BBF7D0;font-size:13px;">
                <strong style="color:#059669;"><?= e($dayNames[(int) $slot['day_of_week']] ?? '') ?></strong><br>
                <span style="direction:ltr;display:inline-block;"><?= e($slot['start_time']) ?> — <?= e($slot['end_time']) ?></span>
            </div>
            <?php endforeach; ?>
        </div>
        <?php else: ?>
        <p style="color:#9CA3AF;font-size:13px;margin:0 0 10px;">لم يتم تحديد مواعيد العمل.</p>
        <?php endif; ?>

        <!-- Availability Form -->
        <details style="margin-top:15px;">
            <summary style="cursor:pointer;font-size:13px;color:#0D7377;font-weight:600;">تعديل المواعيد</summary>
            <form method="POST" action="/coaches/<?= (int) $coach->id ?>/availability" style="margin-top:10px;">
                <?= csrf_field() ?>
                <div id="availContainer">
                    <?php if (!empty($availability)): ?>
                        <?php foreach ($availability as $slot): ?>
                        <div style="display:flex;gap:8px;margin-bottom:8px;align-items:center;">
                            <select name="avail_day[]" class="form-input" style="width:120px;font-size:12px;">
                                <?php foreach ($dayNames as $dKey => $dLabel): ?>
                                <option value="<?= $dKey ?>" <?= (int) $slot['day_of_week'] === $dKey ? 'selected' : '' ?>><?= e($dLabel) ?></option>
                                <?php endforeach; ?>
                            </select>
                            <input type="time" name="avail_start[]" value="<?= e($slot['start_time']) ?>" class="form-input" style="width:110px;font-size:12px;direction:ltr;">
                            <input type="time" name="avail_end[]" value="<?= e($slot['end_time']) ?>" class="form-input" style="width:110px;font-size:12px;direction:ltr;">
                            <button type="button" onclick="this.parentElement.remove()" style="border:none;background:none;color:#DC2626;cursor:pointer;font-size:18px;">&times;</button>
                        </div>
                        <?php endforeach; ?>
                    <?php else: ?>
                    <div style="display:flex;gap:8px;margin-bottom:8px;align-items:center;">
                        <select name="avail_day[]" class="form-input" style="width:120px;font-size:12px;">
                            <?php foreach ($dayNames as $dKey => $dLabel): ?>
                            <option value="<?= $dKey ?>"><?= e($dLabel) ?></option>
                            <?php endforeach; ?>
                        </select>
                        <input type="time" name="avail_start[]" value="08:00" class="form-input" style="width:110px;font-size:12px;direction:ltr;">
                        <input type="time" name="avail_end[]" value="16:00" class="form-input" style="width:110px;font-size:12px;direction:ltr;">
                        <button type="button" onclick="this.parentElement.remove()" style="border:none;background:none;color:#DC2626;cursor:pointer;font-size:18px;">&times;</button>
                    </div>
                    <?php endif; ?>
                </div>
                <div style="display:flex;gap:8px;margin-top:8px;">
                    <button type="button" onclick="addAvailRow()" class="btn btn-outline" style="font-size:12px;padding:6px 12px;">+ إضافة يوم</button>
                    <button type="submit" class="btn btn-primary" style="font-size:12px;padding:6px 14px;">حفظ المواعيد</button>
                </div>
            </form>
        </details>
    </div>
</div>

<!-- Bio -->
<?php if (!empty($coach->bio_ar)): ?>
<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="file-text" style="width:16px;height:16px;color:#6B7280;"></i>
        <h3 style="margin:0;font-size:14px;color:#6B7280;">نبذة</h3>
    </div>
    <div style="padding:15px 20px;font-size:14px;color:#374151;line-height:1.8;">
        <?= nl2br(e($coach->bio_ar)) ?>
    </div>
</div>
<?php endif; ?>

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

function addAvailRow() {
    var container = document.getElementById('availContainer');
    var dayOptions = <?= json_encode($dayNames) ?>;
    var opts = '';
    for (var k in dayOptions) {
        opts += '<option value="' + k + '">' + dayOptions[k] + '</option>';
    }
    var div = document.createElement('div');
    div.style.cssText = 'display:flex;gap:8px;margin-bottom:8px;align-items:center;';
    div.innerHTML = '<select name="avail_day[]" class="form-input" style="width:120px;font-size:12px;">' + opts + '</select>' +
        '<input type="time" name="avail_start[]" value="08:00" class="form-input" style="width:110px;font-size:12px;direction:ltr;">' +
        '<input type="time" name="avail_end[]" value="16:00" class="form-input" style="width:110px;font-size:12px;direction:ltr;">' +
        '<button type="button" onclick="this.parentElement.remove()" style="border:none;background:none;color:#DC2626;cursor:pointer;font-size:18px;">&times;</button>';
    container.appendChild(div);
}
</script>

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