{{-- resources/views/filament/pages/general-treasury-report.blade.php --}}
<x-filament-panels::page>
    {{-- Bootstrap CSS --}}
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.0/font/bootstrap-icons.css" rel="stylesheet">
    
    <style>
        /* تنسيق الفلاتر في سطر واحد */
        form[wire\\:submit\\.prevent="generateReport"] > div {
            display: flex !important;
            flex-wrap: wrap !important;
            gap: 1rem !important;
            align-items: end !important;
        }
        
        form[wire\\:submit\\.prevent="generateReport"] [data-field-wrapper] {
            flex: 1 !important;
            min-width: 180px !important;
            margin-bottom: 0 !important;
        }
        
        @media print {
            .no-print { display: none !important; }
        }
        
        @media (max-width: 768px) {
            form[wire\\:submit\\.prevent="generateReport"] > div {
                flex-direction: column !important;
            }
        }
    </style>
    
    {{-- عرض الفلاتر --}}
    <div class="card shadow-sm mb-4 no-print">
        <div class="card-body">
            <form wire:submit.prevent="generateReport">
                <div style="display: flex; flex-wrap: wrap; gap: 1rem; align-items: end;">
                    {{ $this->form }}
                    
                    <x-filament::button type="submit" color="primary">
                        <i class="bi bi-search me-2"></i>
                        عرض التقرير
                    </x-filament::button>
                </div>
            </form>
        </div>
    </div>

    @if(empty($reportData) || !isset($reportData['date_from']))
        {{-- رسالة عند عدم وجود بيانات --}}
        <div class="card shadow-sm">
            <div class="card-body text-center py-5">
                <i class="bi bi-file-earmark-text text-muted" style="font-size: 4rem;"></i>
                <h4 class="mt-3">لا توجد بيانات لعرضها</h4>
                <p class="text-muted">اختر الخزينة والفترة الزمنية ثم اضغط على زر "عرض التقرير"</p>
            </div>
        </div>
    @else
        {{-- محتوى التقرير --}}
        <div class="container-fluid px-0">
            {{-- رأس التقرير --}}
            <div class="card shadow-sm mb-4">
                <div class="card-header bg-primary text-white">
                    <div class="d-flex justify-content-between align-items-center">
                        <h3 class="mb-0">
                            <i class="bi bi-wallet2 me-2"></i>
                            {{ __('general_treasury_report.page_title') }}
                        </h3>
                        <button class="btn btn-light btn-sm no-print" onclick="window.print()">
                            <i class="bi bi-printer me-1"></i>
                            طباعة
                        </button>
                    </div>
                </div>
                <div class="card-body bg-light">
                    <div class="row">
                        <div class="col-md-4">
                            <strong><i class="bi bi-building me-2"></i>الخزينة:</strong>
                            @if(isset($vault_id) && $vault_id)
                                {{ \App\Models\Vault::find($vault_id)?->name ?? '' }}
                            @else
                                جميع الخزائن
                            @endif
                        </div>
                        <div class="col-md-8 text-end">
                            <strong><i class="bi bi-calendar-range me-2"></i>الفترة:</strong>
                            {{ __('general_treasury_report.from_label') }} {{ isset($reportData['date_from']) ? $reportData['date_from']->format('d/m/Y') : '' }}
                            {{ __('general_treasury_report.to_label') }} {{ isset($reportData['date_to']) ? $reportData['date_to']->format('d/m/Y') : '' }}
                        </div>
                    </div>
                </div>
            </div>

            {{-- ملخص الحركة المالية --}}
            <div class="row g-3 mb-4">
                <div class="col-md-6 col-lg-3">
                    <div class="card shadow-sm border-start border-primary border-4 h-100">
                        <div class="card-body">
                            <div class="d-flex justify-content-between align-items-center">
                                <div>
                                    <h6 class="text-muted mb-1">
                                        <i class="bi bi-arrow-down-circle text-primary me-1"></i>
                                        {{ __('general_treasury_report.opening_balance') }}
                                    </h6>
                                    <h3 class="mb-0 fw-bold text-primary">
                                        {{ number_format($reportData['opening_balance'] ?? 0, 2) }}
                                    </h3>
                                    <small class="text-muted">{{ __('general_treasury_report.currency') }}</small>
                                </div>
                                <i class="bi bi-coin text-primary opacity-25" style="font-size: 3rem;"></i>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-md-6 col-lg-3">
                    <div class="card shadow-sm border-start border-success border-4 h-100">
                        <div class="card-body">
                            <div class="d-flex justify-content-between align-items-center">
                                <div>
                                    <h6 class="text-muted mb-1">
                                        <i class="bi bi-arrow-up-circle text-success me-1"></i>
                                        {{ __('general_treasury_report.total_revenues') }}
                                    </h6>
                                    <h3 class="mb-0 fw-bold text-success">
                                        {{ number_format($reportData['total_revenues'] ?? 0, 2) }}
                                    </h3>
                                    <small class="text-muted">{{ __('general_treasury_report.currency') }}</small>
                                </div>
                                <i class="bi bi-graph-up-arrow text-success opacity-25" style="font-size: 3rem;"></i>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-md-6 col-lg-3">
                    <div class="card shadow-sm border-start border-danger border-4 h-100">
                        <div class="card-body">
                            <div class="d-flex justify-content-between align-items-center">
                                <div>
                                    <h6 class="text-muted mb-1">
                                        <i class="bi bi-arrow-down-circle text-danger me-1"></i>
                                        {{ __('general_treasury_report.total_expenses') }}
                                    </h6>
                                    <h3 class="mb-0 fw-bold text-danger">
                                        {{ number_format($reportData['total_expenses'] ?? 0, 2) }}
                                    </h3>
                                    <small class="text-muted">{{ __('general_treasury_report.currency') }}</small>
                                </div>
                                <i class="bi bi-graph-down-arrow text-danger opacity-25" style="font-size: 3rem;"></i>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="col-md-6 col-lg-3">
                    <div class="card shadow-sm border-start border-warning border-4 h-100">
                        <div class="card-body">
                            <div class="d-flex justify-content-between align-items-center">
                                <div>
                                    <h6 class="text-muted mb-1">
                                        <i class="bi bi-wallet2 text-warning me-1"></i>
                                        {{ __('general_treasury_report.closing_balance') }}
                                    </h6>
                                    <h3 class="mb-0 fw-bold text-warning">
                                        {{ number_format($reportData['closing_balance'] ?? 0, 2) }}
                                    </h3>
                                    <small class="text-muted">{{ __('general_treasury_report.currency') }}</small>
                                </div>
                                <i class="bi bi-cash-coin text-warning opacity-25" style="font-size: 3rem;"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            {{-- تفاصيل الإيرادات --}}
            @if(isset($reportData['revenues']) && count($reportData['revenues']) > 0)
            <div class="card shadow-sm mb-4">
                <div class="card-header bg-success text-white">
                    <h5 class="mb-0">
                        <i class="bi bi-arrow-up-circle me-2"></i>
                        {{ __('general_treasury_report.revenues_details') }}
                    </h5>
                </div>
                <div class="card-body p-0">
                    <div class="table-responsive">
                        <table class="table table-hover table-striped mb-0">
                            <thead class="table-success">
                                <tr>
                                    <th><i class="bi bi-calendar3 me-1"></i>{{ __('general_treasury_report.date') }}</th>
                                    <th><i class="bi bi-tag me-1"></i>{{ __('general_treasury_report.type') }}</th>
                                    <th><i class="bi bi-info-circle me-1"></i>{{ __('general_treasury_report.description') }}</th>
                                    <th><i class="bi bi-hash me-1"></i>{{ __('general_treasury_report.reference') }}</th>
                                    <th class="text-end"><i class="bi bi-cash me-1"></i>{{ __('general_treasury_report.amount') }}</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($reportData['revenues'] as $revenue)
                                <tr>
                                    <td>{{ \Carbon\Carbon::parse($revenue['date'])->format('d/m/Y') }}</td>
                                    <td><span class="badge bg-success">{{ $revenue['type_label'] }}</span></td>
                                    <td>{{ $revenue['description'] }}</td>
                                    <td>{{ $revenue['reference'] }}</td>
                                    <td class="text-end fw-bold text-success">
                                        {{ number_format($revenue['amount'], 2) }}
                                        {{ __('general_treasury_report.currency') }}
                                    </td>
                                </tr>
                                @endforeach
                            </tbody>
                            <tfoot class="table-success">
                                <tr class="fw-bold">
                                    <td colspan="4" class="text-end">
                                        <i class="bi bi-calculator me-2"></i>
                                        {{ __('general_treasury_report.total_revenues_label') }}
                                    </td>
                                    <td class="text-end fs-5">
                                        {{ number_format($reportData['total_revenues'], 2) }}
                                        {{ __('general_treasury_report.currency') }}
                                    </td>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>
            </div>
            @endif

            {{-- تفاصيل المصروفات --}}
            @if(isset($reportData['expenses']) && count($reportData['expenses']) > 0)
            <div class="card shadow-sm mb-4">
                <div class="card-header bg-danger text-white">
                    <h5 class="mb-0">
                        <i class="bi bi-arrow-down-circle me-2"></i>
                        {{ __('general_treasury_report.expenses_details') }}
                    </h5>
                </div>
                <div class="card-body p-0">
                    <div class="table-responsive">
                        <table class="table table-hover table-striped mb-0">
                            <thead class="table-danger">
                                <tr>
                                    <th><i class="bi bi-calendar3 me-1"></i>{{ __('general_treasury_report.date') }}</th>
                                    <th><i class="bi bi-tag me-1"></i>{{ __('general_treasury_report.type') }}</th>
                                    <th><i class="bi bi-info-circle me-1"></i>{{ __('general_treasury_report.description') }}</th>
                                    <th><i class="bi bi-hash me-1"></i>{{ __('general_treasury_report.reference') }}</th>
                                    <th class="text-end"><i class="bi bi-cash me-1"></i>{{ __('general_treasury_report.amount') }}</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($reportData['expenses'] as $expense)
                                <tr>
                                    <td>{{ \Carbon\Carbon::parse($expense['date'])->format('d/m/Y') }}</td>
                                    <td><span class="badge bg-danger">{{ $expense['type_label'] }}</span></td>
                                    <td>{{ $expense['description'] }}</td>
                                    <td>{{ $expense['reference'] }}</td>
                                    <td class="text-end fw-bold text-danger">
                                        {{ number_format($expense['amount'], 2) }}
                                        {{ __('general_treasury_report.currency') }}
                                    </td>
                                </tr>
                                @endforeach
                            </tbody>
                            <tfoot class="table-danger">
                                <tr class="fw-bold">
                                    <td colspan="4" class="text-end">
                                        <i class="bi bi-calculator me-2"></i>
                                        {{ __('general_treasury_report.total_expenses_label') }}
                                    </td>
                                    <td class="text-end fs-5">
                                        {{ number_format($reportData['total_expenses'], 2) }}
                                        {{ __('general_treasury_report.currency') }}
                                    </td>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>
            </div>
            @endif

        </div>
    @endif

    {{-- Bootstrap JS --}}
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</x-filament-panels::page>