<?php $__template->layout('Layout.main'); ?>
<?php $__template->section('title'); ?>طلب عمل إضافي جديد<?php $__template->endSection(); ?>

<?php $__template->section('page_actions'); ?>
<a href="/hr/overtime" 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'); ?>

<div class="card" style="max-width:700px;padding:25px;">
    <form method="POST" action="/hr/overtime/store">
        <?= csrf_field() ?>

        <div style="margin-bottom:15px;">
            <label class="form-label">الموظف <span style="color:#DC2626;">*</span></label>
            <select name="employee_profile_id" class="form-select" required>
                <option value="">-- اختر الموظف --</option>
                <?php foreach ($employees as $emp): ?>
                <option value="<?= (int) $emp['id'] ?>" <?= old('employee_profile_id') == $emp['id'] ? 'selected' : '' ?>><?= e($emp['full_name_ar'] ?? '') ?></option>
                <?php endforeach; ?>
            </select>
        </div>

        <div style="margin-bottom:15px;">
            <label class="form-label">نوع العمل الإضافي <span style="color:#DC2626;">*</span></label>
            <select name="overtime_type_id" class="form-select" required>
                <option value="">-- اختر النوع --</option>
                <?php foreach ($types as $type): ?>
                <option value="<?= (int) $type['id'] ?>" <?= old('overtime_type_id') == $type['id'] ? 'selected' : '' ?>><?= e($type['name'] ?? '') ?></option>
                <?php endforeach; ?>
            </select>
        </div>

        <div style="margin-bottom:15px;">
            <label class="form-label">التاريخ <span style="color:#DC2626;">*</span></label>
            <input type="date" name="date" value="<?= e(old('date') ?? '') ?>" class="form-input" required>
        </div>

        <div style="display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-bottom:15px;">
            <div>
                <label class="form-label">وقت البداية <span style="color:#DC2626;">*</span></label>
                <input type="time" name="start_time" value="<?= e(old('start_time') ?? '') ?>" class="form-input" required>
            </div>
            <div>
                <label class="form-label">وقت النهاية <span style="color:#DC2626;">*</span></label>
                <input type="time" name="end_time" value="<?= e(old('end_time') ?? '') ?>" class="form-input" required>
            </div>
        </div>

        <div style="margin-bottom:20px;">
            <label class="form-label">السبب <span style="color:#DC2626;">*</span></label>
            <textarea name="reason" class="form-control" rows="4" placeholder="اذكر سبب العمل الإضافي..." required><?= e(old('reason') ?? '') ?></textarea>
        </div>

        <div style="display:flex;gap:10px;">
            <button type="submit" class="btn btn-primary"><i data-lucide="save" style="width:16px;height:16px;vertical-align:middle;margin-left:4px;"></i> حفظ الطلب</button>
            <a href="/hr/overtime" class="btn btn-outline">إلغاء</a>
        </div>
    </form>
</div>

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