@if (@isset($data) && !@empty($data) && count($data) > 0)
@php
    $i = 1;
@endphp

<style>
    /* ==========================================================
       تنسيقات جدول الفواتير العصرية
       ========================================================== */
    .custom-inv-card {
        background: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 10px;
        box-shadow: 0 2px 8px rgba(0,0,0,0.04);
        overflow: hidden;
        margin-bottom: 15px;
    }
    .btn-cut { background-color: #64748b; color: #fff; }
    .btn-cut:hover { background-color: #475569; color: #fff; }
    .btn-cut-done { background-color: #059669; color: #fff; }
    .btn-cut-done:hover { background-color: #047857; color: #fff; }

    #SearchProductTable {
        border-collapse: separate;
        border-spacing: 0;
        margin-bottom: 0;
    }

    #SearchProductTable thead th {
        background: #1e293b !important;
        color: #f8fafc !important;
        font-size: 12px !important;
        font-weight: 700 !important;
        padding: 10px 8px !important;
        border: none !important;
        white-space: nowrap;
        vertical-align: middle;
    }

    #SearchProductTable tbody td {
        vertical-align: middle !important;
        padding: 8px 6px !important;
        font-size: 13px;
        color: #334155;
        border-bottom: 1px solid #f1f5f9;
        transition: background 0.15s ease;
    }

    #SearchProductTable tbody tr:hover td {
        background-color: #f8fafc;
    }

    /* شارات الحالة */
    .status-badge {
        display: inline-flex;
        align-items: center;
        gap: 4px;
        padding: 4px 10px;
        border-radius: 20px;
        font-size: 11px;
        font-weight: 700;
        min-width: 85px;
        justify-content: center;
    }

    .badge-not-started {
        background-color: #f1f5f9;
        color: #64748b;
        border: 1px solid #cbd5e1;
    }

    .badge-in-progress {
        background-color: #fef3c7;
        color: #b45309;
        border: 1px solid #fde68a;
    }

    .badge-completed {
        background-color: #d1fae5;
        color: #047857;
        border: 1px solid #a7f3d0;
    }

    /* شارات حالة القص (الإضافة الجديدة) */
    .badge-not-cut {
        background-color: #f1f5f9;
        color: #64748b;
        border: 1px solid #cbd5e1;
    }

    .badge-cut-done {
        background-color: #d1fae5;
        color: #047857;
        border: 1px solid #a7f3d0;
    }

    /* أزرار الإجراءات */
    .action-btn {
        width: 32px;
        height: 32px;
        border-radius: 8px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        border: none;
        transition: all 0.2s ease;
        box-shadow: 0 1px 3px rgba(0,0,0,0.08);
    }

    .action-btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 4px 6px rgba(0,0,0,0.12);
        color: #ffffff;
    }

    .btn-thermal { background-color: #f97316; color: #fff; }
    .btn-thermal:hover { background-color: #ea580c; color: #fff; }

    .btn-print { background-color: #1e3a8a; color: #fff; }
    .btn-print:hover { background-color: #172554; color: #fff; }

    .btn-whatsapp { background-color: #16a34a; color: #fff; }
    .btn-whatsapp:hover { background-color: #15803d; color: #fff; }

    .btn-date { background-color: #0891b2; color: #fff; }
    .btn-date:hover { background-color: #0e7490; color: #fff; }

    .btn-tailor { background-color: #7c3aed; color: #fff; }
    .btn-tailor:hover { background-color: #6d28d9; color: #fff; }

    .btn-status-drop { background-color: #6366f1; color: #fff; }
    .btn-status-drop:hover { background-color: #4f46e5; color: #fff; }

    /* تخصيص قائمة تغيير الحالة */
    .dropdown-menu {
        border-radius: 8px;
        box-shadow: 0 10px 15px -3px rgba(0,0,0,0.1);
        border: 1px solid #e2e8f0;
        font-size: 12px;
        font-weight: bold;
    }

    .dropdown-item {
        padding: 7px 14px;
        transition: background 0.15s;
    }

    .dropdown-item:hover {
        background-color: #f1f5f9;
        color: var(--pos-primary);
    }
</style>

<div class="custom-inv-card">
    <div class="table-responsive">
        <table class="table text-md-nowrap text-center our-table" id="SearchProductTable" width="100%">
            <thead>
                <tr>
                    <th style="width: 5%;">{{ __('home.Invoice_no') }}</th>
                    <th style="width: 9%;">{{ __('home.sallerName') }}</th>
                    <th style="width: 12%;">{{ __('home.clietName') }}</th>
                    <th style="width: 11%;">{{ __('home.date') }}</th>
                    <th style="width: 9%;">تاريخ الإنتاج</th>
                    <th style="width: 9%;">الخياط</th>
                    <th style="width: 8%;">الحالة</th>
                    <th style="width: 8%;">حالة القص</th>
                    <th style="width: 7%;">{{ __('home.branch') }}</th>
                    <th style="width: 7%;">{{ __('home.total') }}</th>
                    <th style="width: 7%;">{{ __('home.Pay') }}</th>
                    <th style="width: 8%;">{{ __('home.paymentmethod') }}</th>
                    <th style="width: 8%;">{{ __('home.operations') }}</th>
                </tr>
            </thead>
            <tbody>
                                @foreach ($data as $product)
                                <tr id="<br />
<b>Warning</b>:  Undefined variable $product in <b>/home/ebdea/public_html/sewing.ebdea.online/resources/views/ajax_Recent_Invoices.blade.php</b> on line <b>179</b><br />
<br />
<b>Warning</b>:  Trying to access array offset on value of type null in <b>/home/ebdea/public_html/sewing.ebdea.online/resources/views/ajax_Recent_Invoices.blade.php</b> on line <b>179</b><br />
">
                    <!-- رقم الفاتورة -->
                    <td data-target="id" style="font-weight: 800; color: #1e40af;">
                        #{{ $product->id }}
                    </td>

                    <!-- اسم البائع -->
                    <td data-target="id" style="font-weight: 600;">
                        {{ $product->user->name ?? '---' }}
                    </td>

                    <!-- اسم العميل -->
                    <td data-target="id" style="font-weight: 700; color: #0f172a;">
                        {{ $product->customer->name ?? '---' }}
                    </td>

                    <!-- تاريخ الفاتورة -->
                    <td data-target="numberofpice" style="font-size: 12px; color: #475569;">
                        {{ $product->created_at }}
                    </td>

                    <!-- تاريخ الإنتاج -->
                    <td data-target="production_date" style="font-weight: 700; font-size: 12px; color: #0369a1;">
                        {{ $product->production_date ?? '---' }}
                    </td>

                    <!-- اسم الخياط -->
                    <td data-target="numberofpice">
                        <span class="badge badge-light px-2 py-1" style="font-size: 11px; font-weight: 700; border: 1px solid #e2e8f0;">
                            {{ $product->employee->name_ar ?? 'لا يوجد' }}
                        </span>
                    </td>

                    <!-- حالة الفاتورة -->
                    <td data-target="numberofpice" class="text-center">
                        @switch($product->status_invoice)
                            @case('NOT_STARTED')
                                <span class="status-badge badge-not-started">
                                    <i class="fa fa-clock-o"></i> لم يبدأ
                                </span>
                                @break

                            @case('IN_PROGRESS')
                                <span class="status-badge badge-in-progress">
                                    <i class="fa fa-refresh fa-spin"></i> قيد التنفيذ
                                </span>
                                @break

                            @case('COMPLETED')
                                <span class="status-badge badge-completed">
                                    <i class="fa fa-check-circle"></i> مكتمل
                                </span>
                                @break

                            @default
                                <span class="status-badge badge-not-started">غير محدد</span>
                        @endswitch
                    </td>

                    <!-- حالة القص (الإضافة الجديدة) -->
                    <td data-target="numberofpice" class="text-center" id="cut-status-{{ $product->id }}">
                        @if($product->type == 'fabric')
                            @if($product->is_cut)
                                <span class="status-badge badge-cut-done">
                                    <i class="fa fa-check-circle"></i> تم القص
                                </span>
                            @else
                                <span class="status-badge badge-not-cut">
                                    <i class="fa fa-cut"></i> لم يقص
                                </span>
                            @endif
                        @else
                            <span class="text-muted">---</span>
                        @endif
                    </td>

                    <!-- الفرع -->
                    <td data-target="numberofpice" style="font-size: 12px; font-weight: 600;">
                        {{ $product->branch->name ?? '---' }}
                    </td>

                    <!-- الإجمالي -->
                    <td data-target="numberofpice" style="font-weight: 800; color: #0f172a;">
                        @php
                            $totalPaid =
                                ($product->cashamount ?? 0) +
                                ($product->creaditamount ?? 0) +
                                ($product->bankamount ?? 0) +
                                ($product->Bank_transfer ?? 0);
                        @endphp
                        {{ number_format($totalPaid, 2) }}
                    </td>

                    <!-- المدفوع -->
                    <td data-target="numberofpice" style="font-weight: 800; color: #047857;">
                        {{ number_format($product->Pay ?? 0, 2) }}
                    </td>

                    <!-- طريقة الدفع -->
                    <td>
                        @php
                            $methods = [];
                            $currentMethod = strtolower($product->payment_methods_text ?? '');

                            if ($currentMethod == 'cash') {
                                $methods[] = __('report.cash');
                            } elseif ($currentMethod == 'span' || $currentMethod == 'network (mada)') {
                                $methods[] = __('report.shabka');
                            } elseif ($currentMethod == 'credit') {
                                $methods[] = 'آجل (Credit)';
                            } elseif ($currentMethod == 'bank_transfer') {
                                $methods[] = __('home.Bank_transfer');
                            } elseif ($currentMethod == 'tabby') {
                                $methods[] = 'تابي (Tabby)';
                            } elseif ($currentMethod == 'tamara') {
                                $methods[] = 'تمارا (Tamara)';
                            } else {
                                if (($product->cashamount ?? 0) > 0) $methods[] = __('report.cash');
                                if (($product->bankamount ?? 0) > 0) $methods[] = __('report.shabka');
                                if (($product->Bank_transfer ?? 0) > 0) $methods[] = __('home.Bank_transfer');
                            }

                            $methods = array_unique($methods);
                        @endphp

                        <span class="badge badge-light p-1" style="font-size: 11px; font-weight: 700; border: 1px solid #cbd5e1;">
                            @if(count($methods) > 1)
                                {{ __('sales.Partition of the amount') }}
                            @elseif(count($methods) == 1)
                                {{ $methods[0] }}
                            @else
                                ---
                            @endif
                        </span>
                    </td>

                    <!-- أزرار العمليات -->
                  <td style="white-space: nowrap; padding: 6px 10px;">
    <div class="d-flex align-items-center justify-content-center" style="gap: 5px;">

        <!-- 1. زر تعديل تاريخ إنشاء الفاتورة (أزرق) -->
        <a class="modal-effect action-btn btn-created-date"
           style="background: linear-gradient(135deg, #0284c7, #0369a1) !important;"
           data-effect="effect-scale"
           data-id="{{ $product->id }}"
           data-date="{{ \Carbon\Carbon::parse($product->created_at)->format('Y-m-d') }}"
           data-toggle="modal"
           href="#updateCreatedAtModal"
           title="تعديل تاريخ إنشاء الفاتورة">
            <i class="las la-calendar-check" style="font-size: 17px;"></i>
        </a>

        <!-- 2. زر تعديل تاريخ الإنتاج (برتقالي) -->
        <a class="modal-effect action-btn btn-production-date"
           style="background: linear-gradient(135deg, #f59e0b, #d97706) !important;"
           data-effect="effect-scale"
           data-id="{{ $product->id }}"
           data-date="{{ $product->production_date ? \Carbon\Carbon::parse($product->production_date)->format('Y-m-d') : '' }}"
           data-toggle="modal"
           href="#updateProductionDateModal"
           title="تعديل تاريخ الإنتاج">
            <i class="las la-industry" style="font-size: 17px;"></i>
        </a>

        @if($product->type == 'ready')
            <a href="showInvoiceReady/{{ $product->id }}" class="action-btn btn-print" title="{{ __('home.show') }}">
                <i class="fas fa-print"></i>
            </a>
        @else
            <a href="showInvoiceRecent/{{ $product->id }}" class="action-btn btn-print" title="{{ __('home.show') }}">
                <i class="fas fa-print"></i>
            </a>
        @endif

        @php
            $customerPhone = $product->customer->phone ?? '';
            $phone = "966" . substr($customerPhone, 1);
            $link = "https://demoo.ebdeaclients.online/ar/generate_pdf/" . $product->id;
            $message = "يسرنا خدمتك مرفق لكم فاتورتكم " . "فضلا لتحميل فاتورتك رقم : {$product->id}: {$link}\n" . "For download your invoice number :{$product->id } press here : {$link}";
            $waLink = "https://web.whatsapp.com/send?phone={$phone}&text=" . urlencode($message);
        @endphp

        <a href="{{ $waLink }}" target="_blank" class="action-btn btn-whatsapp" title="WhatsApp">
            <i class="bx bxl-whatsapp" style="font-size: 18px;"></i>
        </a>

        @if($product->type == 'fabric')
            <button type="button"
                    class="action-btn btn-cut-toggle {{ $product->is_cut ? 'btn-cut-done' : 'btn-cut' }}"
                    data-id="{{ $product->id }}"
                    title="{{ $product->is_cut ? 'تم القص - اضغط للإلغاء' : 'وضع علامة تم القص' }}">
                <i class="fa {{ $product->is_cut ? 'fa-check-square' : 'fa-cut' }}"></i>
            </button>

            <button type="button"
                    data-id="{{ $product->id }}"
                    class="action-btn btn-tailor"
                    data-toggle="modal"
                    data-target="#employeeModal"
                    title="اختيار الخياط">
                <i class="fa fa-user-tie"></i>
            </button>

            <div class="dropdown d-inline-block">
                <button class="action-btn btn-status-drop dropdown-toggle"
                        type="button"
                        data-toggle="dropdown"
                        aria-haspopup="true"
                        aria-expanded="false"
                        data-id="{{ $product->id }}"
                        title="تغيير الحالة">
                    <i class="fa fa-tasks"></i>
                </button>
                <div class="dropdown-menu dropdown-menu-right text-right shadow-sm">
                    <a class="dropdown-item status-change-btn text-secondary" href="javascript:void(0)" data-status="NOT_STARTED" data-invoice-id="{{ $product->id }}">
                        <i class="fa fa-clock-o mr-1"></i> لم يبدأ بعد
                    </a>
                    <a class="dropdown-item status-change-btn text-warning" href="javascript:void(0)" data-status="IN_PROGRESS" data-invoice-id="{{ $product->id }}">
                        <i class="fa fa-refresh mr-1"></i> قيد التنفيذ
                    </a>
                    <a class="dropdown-item status-change-btn text-success" href="javascript:void(0)" data-status="COMPLETED" data-invoice-id="{{ $product->id }}">
                        <i class="fa fa-check-circle mr-1"></i> تم الانتهاء
                    </a>
                </div>
            </div>
        @endif
    </div>
</td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</div>

<!-- الترقيم والباجينيشن -->
<div class="d-flex justify-content-center mt-3" id="ajax_pagination_in_search">
    {{ $data->links() }}
</div>

@else
<div class="alert alert-danger text-center p-3 rounded shadow-sm font-weight-bold" style="border: 1px solid #fecaca; background-color: #fef2f2; color: #991b1b;">
    <i class="fa fa-exclamation-triangle mr-1"></i> {{ __('home.notfounddata') }}
</div>
@endif