<?php $__template->layout('Layout.main'); ?>
<?php $__template->section('title'); ?>طلب تنازل — <?= e($member['full_name_ar']) ?><?php $__template->endSection(); ?>
<?php $__template->section('content'); ?>
<div class="card" style="padding:20px;margin-bottom:20px;">
    <div style="padding:15px;background:#FFF7ED;border:1px solid #FED7AA;border-radius:8px;margin-bottom:20px;">
        <strong style="color:#D97706;">⚠ التنازل عن العضوية — ضوابط اللائحة:</strong>
        <ul style="margin:8px 0 0;padding-right:20px;font-size:13px;color:#92400E;line-height:1.8;">
            <li>يتطلب موافقة مجلس الأمناء</li>
            <li>العضو المستفيد يحصل على <strong>نفس رقم العضوية</strong></li>
            <li>عدد التابعين للمتنازل إليه لا يتجاوز عدد التابعين الأصليين (<?= (int) $total_dependents ?>) — أي زيادة تتطلب رسوم إضافية يحددها مجلس الأمناء</li>
            <li>يجب سداد <strong>جميع</strong> الالتزامات المالية (اشتراكات + غرامات + طلبات دفع) قبل التنازل</li>
            <li>يجب تقديم استمارة طلب تنازل + استمارة عضوية جديدة للمتنازل إليه</li>
        </ul>
    </div>

    <?php if (!$debt_check['clear']): ?>
    <div style="padding:15px;background:#FEF2F2;border:2px solid #DC2626;border-radius:8px;margin-bottom:20px;">
        <strong style="color:#DC2626;">🚫 لا يمكن تقديم طلب التنازل — يوجد مديونية مستحقة:</strong>
        <table style="width:100%;margin-top:10px;font-size:13px;">
            <thead><tr style="background:#FEE2E2;"><th style="padding:6px;text-align:right;">نوع المديونية</th><th style="padding:6px;text-align:center;">العدد</th><th style="padding:6px;text-align:left;">المبلغ</th></tr></thead>
            <tbody>
            <?php foreach ($debt_check['debts'] as $debt): ?>
                <tr style="border-bottom:1px solid #FECACA;">
                    <td style="padding:6px;font-weight:600;"><?= e($debt['type']) ?></td>
                    <td style="padding:6px;text-align:center;"><?= (int) $debt['count'] ?></td>
                    <td style="padding:6px;text-align:left;color:#DC2626;font-weight:700;"><?= money($debt['amount']) ?></td>
                </tr>
            <?php endforeach; ?>
            </tbody>
            <tfoot><tr style="border-top:2px solid #DC2626;"><td colspan="2" style="padding:8px;font-weight:700;">إجمالي المديونية</td><td style="padding:8px;font-weight:700;color:#DC2626;"><?= money($debt_check['total']) ?></td></tr></tfoot>
        </table>
        <p style="margin:10px 0 0;font-size:12px;color:#7F1D1D;">يجب سداد جميع المبالغ المستحقة أعلاه قبل تقديم طلب التنازل.</p>
    </div>
    <?php endif; ?>

    <table style="width:100%;max-width:600px;font-size:14px;">
        <tr><td style="padding:6px 0;color:#6B7280;">العضو</td><td style="padding:6px 0;font-weight:600;"><?= e($member['full_name_ar']) ?></td></tr>
        <tr><td style="padding:6px 0;color:#6B7280;">رقم العضوية</td><td style="padding:6px 0;font-weight:700;"><?= e($member['membership_number'] ?? '—') ?></td></tr>
        <tr><td style="padding:6px 0;color:#6B7280;">قيمة العضوية الحالية</td><td style="padding:6px 0;font-weight:600;"><?= money($membership_value) ?></td></tr>
        <tr><td style="padding:6px 0;color:#6B7280;">نسبة رسوم التنازل</td><td style="padding:6px 0;"><?= e($waiver_pct) ?>%</td></tr>
    </table>

    <div style="margin-top:15px;padding:12px;background:#F0F9FF;border:1px solid #BAE6FD;border-radius:8px;">
        <strong style="color:#0369A1;">👥 التابعون الحاليون:</strong>
        <div style="display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:8px;">
            <div style="text-align:center;padding:8px;background:#fff;border-radius:6px;border:1px solid #E0F2FE;">
                <div style="font-size:20px;font-weight:700;color:#0D7377;"><?= (int) $dependents['spouses'] ?></div>
                <div style="font-size:11px;color:#6B7280;">زوجات</div>
            </div>
            <div style="text-align:center;padding:8px;background:#fff;border-radius:6px;border:1px solid #E0F2FE;">
                <div style="font-size:20px;font-weight:700;color:#0D7377;"><?= (int) $dependents['children'] ?></div>
                <div style="font-size:11px;color:#6B7280;">أبناء</div>
            </div>
            <div style="text-align:center;padding:8px;background:#fff;border-radius:6px;border:1px solid #E0F2FE;">
                <div style="font-size:20px;font-weight:700;color:#0D7377;"><?= (int) $dependents['temporary'] ?></div>
                <div style="font-size:11px;color:#6B7280;">مؤقتين</div>
            </div>
            <div style="text-align:center;padding:8px;background:#fff;border-radius:6px;border:1px solid #0D7377;">
                <div style="font-size:20px;font-weight:700;color:#0D7377;"><?= (int) $dependents['total'] ?></div>
                <div style="font-size:11px;color:#6B7280;font-weight:600;">الإجمالي</div>
            </div>
        </div>
        <p style="margin:8px 0 0;font-size:12px;color:#0369A1;">هذا العدد هو الحد الأقصى للمتنازل إليه بدون رسوم إضافية. أي زيادة يحدد مجلس الأمناء نسبتها.</p>
    </div>

    <div style="margin-top:15px;padding:12px;background:#F0FDF4;border:1px solid #BBF7D0;border-radius:8px;">
        <table style="width:100%;font-size:14px;">
            <tr style="border-bottom:1px dashed #86EFAC;"><td style="padding:6px 0;color:#166534;">رسوم التنازل الأساسية</td><td style="padding:6px 0;font-weight:600;"><?= e($waiver_pct) ?>% × <?= money($membership_value) ?></td><td style="padding:6px 0;font-weight:700;text-align:left;"><?= money($waiver_fee) ?></td></tr>
            <tr><td style="padding:8px 0;font-weight:700;font-size:16px;color:#0D7377;" colspan="2">الإجمالي المبدئي</td><td style="padding:8px 0;font-weight:700;font-size:18px;color:#0D7377;text-align:left;"><?= money($waiver_fee) ?></td></tr>
        </table>
        <p style="margin:8px 0 0;font-size:11px;color:#166534;">* قد تُضاف رسوم إضافية عن التابعين الزائدين بعد اعتماد مجلس الأمناء</p>
    </div>
</div>

<?php if ($debt_check['clear']): ?>
<form method="POST" action="/waivers/store/<?= (int) $member['id'] ?>" id="waiver-form" enctype="multipart/form-data">
    <?= csrf_field() ?>

    <!-- Documents -->
    <div class="card" style="padding:20px;margin-bottom:15px;">
        <h4 style="margin:0 0 15px;color:#374151;">📄 المستندات المطلوبة</h4>
        <div style="display:grid;grid-template-columns:1fr 1fr;gap:15px;">
            <div class="form-group">
                <label class="form-label">استمارة طلب التنازل <span style="color:#DC2626;">*</span></label>
                <input type="file" name="waiver_request_doc" class="form-input" accept=".pdf,.jpg,.jpeg,.png" style="padding:8px;">
                <small style="color:#6B7280;">PDF أو صورة (حد أقصى 5 ميجا)</small>
            </div>
            <div class="form-group">
                <label class="form-label">استمارة عضوية المتنازل إليه</label>
                <input type="file" name="target_form_doc" class="form-input" accept=".pdf,.jpg,.jpeg,.png" style="padding:8px;">
                <small style="color:#6B7280;">PDF أو صورة (حد أقصى 5 ميجا)</small>
            </div>
        </div>
    </div>

    <!-- Target Member -->
    <div class="card" style="padding:20px;margin-bottom:15px;background:#ECFDF5;border:2px solid #059669;">
        <h4 style="margin:0 0 15px;color:#059669;">👤 المستفيد (المتنازل إليه)</h4>
        <div style="position:relative;margin-bottom:10px;">
            <input type="text" id="target-search" class="form-input" placeholder="اكتب اسم أو رقم قومي المستفيد..." autocomplete="off" style="padding-left:40px;">
            <i data-lucide="search" style="position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:#9CA3AF;"></i>
        </div>
        <div id="target-results" style="display:none;position:absolute;z-index:100;background:#fff;border:1px solid #E5E7EB;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,0.1);max-height:200px;overflow-y:auto;width:calc(100% - 40px);margin-top:-6px;"></div>
        <div id="target-selected" style="display:none;padding:12px 16px;background:#F0FDF4;border:1px solid #BBF7D0;border-radius:8px;">
            <div style="display:flex;align-items:center;justify-content:space-between;">
                <div>
                    <span style="font-weight:700;color:#166534;" id="target-name"></span>
                    <span style="color:#6B7280;font-size:12px;margin-right:10px;" id="target-info"></span>
                </div>
                <button type="button" onclick="clearTarget()" style="background:none;border:none;color:#DC2626;cursor:pointer;font-size:18px;">✕</button>
            </div>
        </div>
        <input type="hidden" name="target_member_id" id="target-member-id" value="">
        <p style="margin:10px 0 0;font-size:12px;color:#6B7280;">💡 إذا لم يكن المستفيد مسجلاً، <a href="/members/create" target="_blank" style="color:#0D7377;">أنشئ عضو جديد</a> أولاً ثم ابحث عنه هنا. يمكنك أيضاً تحديد المستفيد لاحقاً من شاشة الطلب.</p>
    </div>

    <div class="card" style="padding:20px;margin-bottom:15px;">
        <div class="form-group"><label class="form-label">ملاحظات</label><textarea name="notes" class="form-textarea" rows="3"></textarea></div>
    </div>

    <button type="submit" class="btn btn-primary" onclick="return confirm('سيتم تقديم طلب التنازل وإرسال رسوم <?= money($waiver_fee) ?> لطابور الخزينة. متأكد؟')">تقديم الطلب</button>
    <a href="/members/<?= (int) $member['id'] ?>" class="btn btn-outline">إلغاء</a>
</form>
<?php else: ?>
<div style="padding:20px;text-align:center;">
    <a href="/members/<?= (int) $member['id'] ?>/financials" class="btn btn-primary">عرض الحساب المالي</a>
    <a href="/members/<?= (int) $member['id'] ?>" class="btn btn-outline">رجوع</a>
</div>
<?php endif; ?>

<script>
(function() {
    var searchInput = document.getElementById('target-search');
    if (!searchInput) return;
    var resultsDiv = document.getElementById('target-results');
    var selectedDiv = document.getElementById('target-selected');
    var hiddenInput = document.getElementById('target-member-id');
    var timer = null;

    searchInput.addEventListener('input', function() {
        clearTimeout(timer);
        var q = this.value.trim();
        if (q.length < 2) { resultsDiv.style.display = 'none'; return; }
        timer = setTimeout(function() {
            fetch('/api/members/search?q=' + encodeURIComponent(q) + '&exclude=<?= (int) $member['id'] ?>&limit=10')
                .then(function(r) { return r.json(); })
                .then(function(data) {
                    if (!data.length) {
                        resultsDiv.innerHTML = '<div style="padding:12px;color:#6B7280;font-size:13px;">لا توجد نتائج</div>';
                    } else {
                        resultsDiv.innerHTML = data.map(function(m) {
                            return '<div class="target-option" data-id="' + m.id + '" data-name="' + (m.full_name_ar || '') + '" data-info="' + (m.national_id || '') + ' — ' + (m.membership_number ? 'عضوية #' + m.membership_number : 'بدون رقم عضوية') + '" style="padding:10px 14px;cursor:pointer;border-bottom:1px solid #F3F4F6;transition:background .1s;">' +
                                '<div style="font-weight:600;font-size:13px;">' + (m.full_name_ar || '') + '</div>' +
                                '<div style="font-size:11px;color:#6B7280;">' + (m.national_id || '—') + ' — ' + (m.phone_mobile || '') + (m.membership_number ? ' — عضوية #' + m.membership_number : '') + '</div></div>';
                        }).join('');
                    }
                    resultsDiv.style.display = 'block';
                });
        }, 300);
    });

    resultsDiv.addEventListener('click', function(e) {
        var opt = e.target.closest('.target-option');
        if (!opt) return;
        hiddenInput.value = opt.dataset.id;
        document.getElementById('target-name').textContent = opt.dataset.name;
        document.getElementById('target-info').textContent = opt.dataset.info;
        selectedDiv.style.display = 'block';
        resultsDiv.style.display = 'none';
        searchInput.value = '';
    });

    document.addEventListener('click', function(e) {
        if (!resultsDiv.contains(e.target) && e.target !== searchInput) resultsDiv.style.display = 'none';
    });

    resultsDiv.addEventListener('mouseover', function(e) {
        var opt = e.target.closest('.target-option');
        if (opt) opt.style.background = '#F0FDF4';
    });
    resultsDiv.addEventListener('mouseout', function(e) {
        var opt = e.target.closest('.target-option');
        if (opt) opt.style.background = '';
    });
})();

function clearTarget() {
    document.getElementById('target-member-id').value = '';
    document.getElementById('target-selected').style.display = 'none';
}
</script>
<?php $__template->endSection(); ?>
