<?php
$__template->layout('Layout.main');
?>
<?php $__template->section('title'); ?>فاتورة إيجار جديدة<?php $__template->endSection(); ?>

<?php $__template->section('page_actions'); ?>
<a href="/rentals/contracts/<?= (int) $contract->id ?>" 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'); ?>

<!-- Summary Banner -->
<div class="card" style="margin-bottom:20px;padding:15px 20px;background:#F0FDF4;border:1px solid #BBF7D0;">
    <div style="display:flex;align-items:center;gap:20px;flex-wrap:wrap;">
        <code style="background:#fff;color:#0D7377;padding:4px 10px;border-radius:4px;font-weight:600;"><?= e($contract->contract_number) ?></code>
        <div style="display:flex;gap:30px;font-size:14px;color:#374151;">
            <span>إيجار شهري: <strong><?= money($monthly_base) ?></strong></span>
            <?php if ($monthly_utils > 0): ?>
            <span>مرافق: <strong style="color:#7C3AED;"><?= money($monthly_utils) ?></strong></span>
            <?php endif; ?>
            <span>VAT (<?= (float) ($contract->vat_percentage ?? 1) ?>%): <strong style="color:#D97706;"><?= money($monthly_vat) ?></strong></span>
            <span>الإجمالي: <strong style="color:#059669;font-size:16px;"><?= money($monthly_total) ?></strong></span>
        </div>
    </div>
</div>

<form method="POST" action="/rentals/contracts/<?= (int) $contract->id ?>/invoices">
    <?= \App\Core\CSRF::field() ?>

    <div class="card" style="margin-bottom:20px;">
        <div style="padding:15px 20px;border-bottom:1px solid #E5E7EB;">
            <h3 style="margin:0;color:#0D7377;">بيانات الفاتورة</h3>
        </div>
        <div style="padding:20px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:15px;">

            <div>
                <label class="form-label">بداية الفترة <span style="color:#DC2626;">*</span></label>
                <input type="date" name="period_start" value="<?= e(old('period_start')) ?>" class="form-input" required>
            </div>

            <div>
                <label class="form-label">نهاية الفترة <span style="color:#DC2626;">*</span></label>
                <input type="date" name="period_end" value="<?= e(old('period_end')) ?>" class="form-input" required>
            </div>

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

            <div style="grid-column:1/-1;">
                <label class="form-label">ملاحظات</label>
                <textarea name="notes" class="form-input" rows="2" style="resize:vertical;"><?= e(old('notes')) ?></textarea>
            </div>

        </div>
    </div>

    <!-- Preview -->
    <div class="card" style="margin-bottom:20px;padding:20px;background:#F9FAFB;">
        <h4 style="margin:0 0 12px;color:#374151;">تفصيل الفاتورة</h4>
        <table style="width:100%;font-size:14px;border-collapse:collapse;">
            <tr style="border-bottom:1px solid #E5E7EB;">
                <td style="padding:8px 0;color:#6B7280;">الإيجار الشهري</td>
                <td style="padding:8px 0;text-align:left;font-weight:600;"><?= money($monthly_base) ?></td>
            </tr>
            <?php if ($monthly_utils > 0): ?>
            <tr style="border-bottom:1px solid #E5E7EB;">
                <td style="padding:8px 0;color:#6B7280;">مرافق (<?= (float) ($contract->utilities_percentage ?? 0) ?>%)</td>
                <td style="padding:8px 0;text-align:left;font-weight:600;color:#7C3AED;"><?= money($monthly_utils) ?></td>
            </tr>
            <?php endif; ?>
            <tr style="border-bottom:1px solid #E5E7EB;">
                <td style="padding:8px 0;color:#6B7280;">القيمة المضافة (<?= (float) ($contract->vat_percentage ?? 1) ?>%)</td>
                <td style="padding:8px 0;text-align:left;font-weight:600;color:#D97706;"><?= money($monthly_vat) ?></td>
            </tr>
            <?php if (($contract->late_fee_type ?? 'none') !== 'none'): ?>
            <tr style="border-bottom:1px solid #E5E7EB;">
                <td style="padding:8px 0;color:#6B7280;">غرامة التأخير</td>
                <td style="padding:8px 0;text-align:left;color:#DC2626;font-size:12px;">تُحسب عند الدفع إن تأخر</td>
            </tr>
            <?php endif; ?>
            <tr>
                <td style="padding:10px 0;font-weight:700;font-size:15px;">الإجمالي</td>
                <td style="padding:10px 0;text-align:left;font-weight:700;font-size:18px;color:#059669;"><?= money($monthly_total) ?></td>
            </tr>
        </table>
    </div>

    <div style="display:flex;gap:10px;">
        <button type="submit" class="btn btn-primary">إنشاء الفاتورة</button>
        <a href="/rentals/contracts/<?= (int) $contract->id ?>" class="btn btn-outline">إلغاء</a>
    </div>
</form>

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