@extends('layouts.app')

@section('title', $title)

@section('content')
<div class="container-fluid py-4">
    <div class="row">
        <div class="col-md-12">
            <!-- Filter Section -->
            <div class="card mb-4 no-print border-0 shadow-sm">
                <div class="card-body">
                    <form action="{{ route('zakat-taxes.reports.taxes') }}" method="GET" class="row g-3 align-items-end">
                        <div class="col-md-3">
                            <label for="start_date" class="form-label fw-bold text-muted small uppercase">تاريخ البدء</label>
                            <input type="date" name="start_date" id="start_date" class="form-control form-control-lg border-2" value="{{ $startDate }}">
                        </div>
                        <div class="col-md-3">
                            <label for="end_date" class="form-label fw-bold text-muted small uppercase">تاريخ الانتهاء</label>
                            <input type="date" name="end_date" id="end_date" class="form-control form-control-lg border-2" value="{{ $endDate }}">
                        </div>
                        <div class="col-md-2">
                            <button type="submit" class="btn btn-primary btn-lg w-100 shadow-sm">
                                <i class="fas fa-filter me-2"></i> تصفية
                            </button>
                        </div>
                        <div class="col-md-2">
                            <button type="button" class="btn btn-outline-secondary btn-lg w-100 shadow-sm" onclick="window.print()">
                                <i class="fas fa-print me-2"></i> طباعة
                            </button>
                        </div>
                    </form>
                </div>
            </div>

            <!-- Report Content -->
            <div class="invoice p-5 mb-3 bg-white shadow-lg rounded-3 border">
                <!-- Header -->
                <div class="row mb-5 border-bottom pb-4">
                    <div class="col-md-7">
                        <div class="d-flex align-items-center mb-3">
                            @if(auth()->user()->company->logo)
                                <img src="{{ asset('storage/' . auth()->user()->company->logo) }}" alt="Logo" style="max-height: 80px;" class="me-3">
                            @endif
                            <div>
                                <h2 class="fw-bold mb-1 text-dark">{{ auth()->user()->company->name }}</h2>
                                <p class="text-muted mb-0 small">
                                    <i class="fas fa-map-marker-alt me-1"></i> {{ auth()->user()->company->address }}
                                </p>
                            </div>
                        </div>
                        <div class="row g-2">
                            <div class="col-auto">
                                <span class="badge bg-light text-dark border p-2 fw-normal">
                                    <strong>الرقم الضريبي:</strong> {{ auth()->user()->company->tax_number }}
                                </span>
                            </div>
                            <div class="col-auto">
                                <span class="badge bg-light text-dark border p-2 fw-normal">
                                    <strong>السجل التجاري:</strong> {{ auth()->user()->company->commercial_register }}
                                </span>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-5 text-md-end">
                        <h3 class="text-primary fw-bold mb-2">تقرير ضريبة القيمة المضافة المفصل</h3>
                        <div class="text-muted">
                            <div class="mb-1"><strong>الفترة:</strong> {{ $startDate }} إلى {{ $endDate }}</div>
                            <div><strong>تاريخ الإنشاء:</strong> {{ now()->format('Y-m-d H:i') }}</div>
                            <div><strong>العملة:</strong> ريال سعودي</div>
                        </div>
                    </div>
                </div>

                <!-- Summary Cards -->
                <div class="row mb-5 g-4">
                    <div class="col-md-4">
                        <div class="card border-0 border-start border-4 border-primary shadow-sm h-100 bg-light">
                            <div class="card-body py-4">
                                <div class="d-flex justify-content-between align-items-center">
                                    <div>
                                        <h6 class="text-muted fw-bold small text-uppercase mb-2">ضريبة القيمة المضافة على المبيعات</h6>
                                        <h2 class="mb-0 fw-bold text-primary">{{ number_format($summary['vat_on_sales'], 2) }} <small class="fs-6 fw-normal">ريال سعودي</small></h2>
                                    </div>
                                    <div class="rounded-circle bg-primary bg-opacity-10 p-3">
                                        <i class="fas fa-file-invoice-dollar text-primary fa-2x"></i>
                                    </div>
                                </div>
                                <div class="mt-3 small">
                                    <span class="text-muted">إجمالي المبيعات:</span> 
                                    <span class="fw-bold text-dark">{{ number_format($summary['sales'], 2) }}</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="card border-0 border-start border-4 border-danger shadow-sm h-100 bg-light">
                            <div class="card-body py-4">
                                <div class="d-flex justify-content-between align-items-center">
                                    <div>
                                        <h6 class="text-muted fw-bold small text-uppercase mb-2">ضريبة القيمة المضافة على المشتريات</h6>
                                        <h2 class="mb-0 fw-bold text-danger">{{ number_format($summary['vat_on_purchases'], 2) }} <small class="fs-6 fw-normal">ريال سعودي</small></h2>
                                    </div>
                                    <div class="rounded-circle bg-danger bg-opacity-10 p-3">
                                        <i class="fas fa-shopping-cart text-danger fa-2x"></i>
                                    </div>
                                </div>
                                <div class="mt-3 small">
                                    <span class="text-muted">إجمالي المشتريات:</span> 
                                    <span class="fw-bold text-dark">{{ number_format($summary['purchases'], 2) }}</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="card border-0 border-start border-4 border-success shadow-sm h-100 bg-light">
                            <div class="card-body py-4">
                                <div class="d-flex justify-content-between align-items-center">
                                    <div>
                                        <h6 class="text-muted fw-bold small text-uppercase mb-2">صافي ضريبة القيمة المضافة المستحقة</h6>
                                        <h2 class="mb-0 fw-bold text-success">{{ number_format($summary['net_vat'], 2) }} <small class="fs-6 fw-normal">ريال سعودي</small></h2>
                                    </div>
                                    <div class="rounded-circle bg-success bg-opacity-10 p-3">
                                        <i class="fas fa-balance-scale text-success fa-2x"></i>
                                    </div>
                                </div>
                                <div class="mt-3 small">
                                    <span class="text-muted">نوع الرصيد:</span> 
                                    <span class="fw-bold {{ $summary['net_vat'] >= 0 ? 'text-success' : 'text-danger' }}">
                                        {{ $summary['net_vat'] >= 0 ? 'مستحق الدفع' : 'استرداد/رصيد' }}
                                    </span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Sales Section -->
                <div class="mb-5">
                    <div class="d-flex justify-content-between align-items-center mb-3">
                        <h4 class="fw-bold text-dark m-0"><i class="fas fa-arrow-circle-up text-primary me-2"></i> عمليات المبيعات</h4>
                        <span class="badge bg-primary rounded-pill">{{ $sales->count() }} فواتير</span>
                    </div>
                    <div class="table-responsive border rounded mb-3">
                        <table class="table table-hover align-middle mb-0">
                            <thead class="bg-light">
                                <tr>
                                    <th class="ps-3">#</th>
                                    <th>رقم الفاتورة</th>
                                    <th>التاريخ</th>
                                    <th>العميل</th>
                                    <th>الرقم الضريبي</th>
                                    <th class="text-end">المبلغ</th>
                                    <th class="text-end text-primary">الضريبة (15%)</th>
                                    <th class="text-end pe-3">الإجمالي</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse($sales as $index => $sale)
                                    <tr>
                                        <td class="ps-3 text-muted">{{ $index + 1 }}</td>
                                        <td class="fw-bold">{{ $sale->invoice_number }}</td>
                                        <td>{{ $sale->invoice_date->format('Y-m-d') }}</td>
                                        <td>{{ $sale->customer->name ?? $sale->customer_name }}</td>
                                        <td>{{ $sale->customer->tax_number ?? '---' }}</td>
                                        <td class="text-end">{{ number_format($sale->subtotal, 2) }}</td>
                                        <td class="text-end text-primary fw-bold">{{ number_format($sale->tax_amount, 2) }}</td>
                                        <td class="text-end pe-3 fw-bold">{{ number_format($sale->total_amount, 2) }}</td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="8" class="text-center py-4 text-muted">لا توجد عمليات مبيعات لهذه الفترة</td>
                                    </tr>
                                @endforelse
                            </tbody>
                            <tfoot class="bg-light fw-bold border-top-0">
                                <tr class="border-top border-2">
                                    <td colspan="5" class="text-end py-3">المجموع الفرعي للمبيعات</td>
                                    <td class="text-end py-3">{{ number_format($summary['sales'], 2) }}</td>
                                    <td class="text-end py-3 text-primary">{{ number_format($summary['vat_on_sales'], 2) }}</td>
                                    <td class="text-end pe-3 py-3">{{ number_format($summary['sales'] + $summary['vat_on_sales'], 2) }}</td>
                                </tr>
                                <tr class="border-top text-danger">
                                    <td colspan="5" class="text-end py-3">مردودات المبيعات</td>
                                    <td class="text-end py-3">-{{ number_format($summary['sales_returns'], 2) }}</td>
                                    <td class="text-end py-3">-{{ number_format($summary['vat_on_sales_returns'], 2) }}</td>
                                    <td class="text-end pe-3 py-3">-{{ number_format($summary['sales_returns'] + $summary['vat_on_sales_returns'], 2) }}</td>
                                </tr>
                                <tr class="border-top border-2 table-primary">
                                    <td colspan="5" class="text-end py-3">صافي المبيعات</td>
                                    <td class="text-end py-3">{{ number_format($summary['sales'] - $summary['sales_returns'], 2) }}</td>
                                    <td class="text-end py-3 text-primary">{{ number_format($summary['vat_on_sales'] - $summary['vat_on_sales_returns'], 2) }}</td>
                                    <td class="text-end pe-3 py-3">{{ number_format(($summary['sales'] + $summary['vat_on_sales']) - ($summary['sales_returns'] + $summary['vat_on_sales_returns']), 2) }}</td>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>

                <!-- Purchases Section -->
                <div class="mb-5">
                    <div class="d-flex justify-content-between align-items-center mb-3">
                        <h4 class="fw-bold text-dark m-0"><i class="fas fa-arrow-circle-down text-danger me-2"></i> عمليات المشتريات</h4>
                        <span class="badge bg-danger rounded-pill">{{ $purchases->count() }} فواتير</span>
                    </div>
                    <div class="table-responsive border rounded">
                        <table class="table table-hover align-middle mb-0">
                            <thead class="bg-light">
                                <tr>
                                    <th class="ps-3">#</th>
                                    <th>رقم الفاتورة</th>
                                    <th>التاريخ</th>
                                    <th>المورد</th>
                                    <th>الرقم الضريبي</th>
                                    <th class="text-end">المبلغ</th>
                                    <th class="text-end text-danger">الضريبة (15%)</th>
                                    <th class="text-end pe-3">الإجمالي</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse($purchases as $index => $purchase)
                                    <tr>
                                        <td class="ps-3 text-muted">{{ $index + 1 }}</td>
                                        <td class="fw-bold">{{ $purchase->invoice_number }}</td>
                                        <td>{{ $purchase->invoice_date->format('Y-m-d') }}</td>
                                        <td>{{ $purchase->supplier->name ?? '---' }}</td>
                                        <td>{{ $purchase->supplier->tax_number ?? '---' }}</td>
                                        <td class="text-end">{{ number_format($purchase->subtotal, 2) }}</td>
                                        <td class="text-end text-danger fw-bold">{{ number_format($purchase->tax_amount, 2) }}</td>
                                        <td class="text-end pe-3 fw-bold">{{ number_format($purchase->total_amount, 2) }}</td>
                                    </tr>
                                @empty
                                    <tr>
                                        <td colspan="8" class="text-center py-4 text-muted">لا توجد عمليات مشتريات لهذه الفترة</td>
                                    </tr>
                                @endforelse
                            </tbody>
                            <tfoot class="bg-light fw-bold border-top-0">
                                <tr class="border-top border-2">
                                    <td colspan="5" class="text-end py-3">المجموع الفرعي للمشتريات</td>
                                    <td class="text-end py-3">{{ number_format($summary['purchases'], 2) }}</td>
                                    <td class="text-end py-3 text-danger">{{ number_format($summary['vat_on_purchases'], 2) }}</td>
                                    <td class="text-end pe-3 py-3">{{ number_format($summary['purchases'] + $summary['vat_on_purchases'], 2) }}</td>
                                </tr>
                                <tr class="border-top text-primary">
                                    <td colspan="5" class="text-end py-3">مردودات المشتريات</td>
                                    <td class="text-end py-3">-{{ number_format($summary['purchase_returns'], 2) }}</td>
                                    <td class="text-end py-3">-{{ number_format($summary['vat_on_purchase_returns'], 2) }}</td>
                                    <td class="text-end pe-3 py-3">-{{ number_format($summary['purchase_returns'] + $summary['vat_on_purchase_returns'], 2) }}</td>
                                </tr>
                                <tr class="border-top border-2 table-danger">
                                    <td colspan="5" class="text-end py-3">صافي المشتريات</td>
                                    <td class="text-end py-3">{{ number_format($summary['purchases'] - $summary['purchase_returns'], 2) }}</td>
                                    <td class="text-end py-3 text-danger">{{ number_format($summary['vat_on_purchases'] - $summary['vat_on_purchase_returns'], 2) }}</td>
                                    <td class="text-end pe-3 py-3">{{ number_format(($summary['purchases'] + $summary['vat_on_purchases']) - ($summary['purchase_returns'] + $summary['vat_on_purchase_returns']), 2) }}</td>
                                </tr>
                            </tfoot>
                        </table>
                    </div>
                </div>

                <!-- Grand Total Section -->
                <div class="mt-5 p-4 bg-light border-start border-4 border-dark rounded shadow-sm">
                    <div class="row align-items-center">
                        <div class="col-md-8">
                            <h4 class="fw-bold text-dark mb-0">ملخص الضريبة الكلي (ريال سعودي)</h4>
                        </div>
                        <div class="col-md-4 text-end">
                            <div class="mb-2">
                                <span class="text-muted">صافي ضريبة المبيعات:</span>
                                <span class="fw-bold ms-2">{{ number_format($summary['vat_on_sales'] - $summary['vat_on_sales_returns'], 2) }}</span>
                            </div>
                            <div class="mb-2">
                                <span class="text-muted">صافي ضريبة المشتريات:</span>
                                <span class="fw-bold ms-2">{{ number_format($summary['vat_on_purchases'] - $summary['vat_on_purchase_returns'], 2) }}</span>
                            </div>
                            <hr>
                            <div class="h3 fw-bold text-success">
                                <span class="small text-muted me-2">إجمالي الضريبة المستحقة:</span>
                                {{ number_format($summary['net_vat'], 2) }}
                            </div>
                        </div>
                    </div>
                </div>

                <!-- Footer -->
                <div class="row mt-5 border-top pt-4 no-print">
                    <div class="col-12 text-center text-muted small">
                        <p>تم إنشاء هذا التقرير لأغراض الامتثال الضريبي. يرجى مراجعة كافة البيانات قبل تقديمها للجهات المختصة.</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<style>
    .table thead th {
        font-size: 0.85rem;
        text-transform: uppercase;
        letter-spacing: 0.5px;
        padding-top: 1rem;
        padding-bottom: 1rem;
    }
    .table tbody td {
        padding-top: 0.75rem;
        padding-bottom: 0.75rem;
        font-size: 0.95rem;
    }
    .card {
        transition: all 0.2s ease-in-out;
    }
    @media print {
        .no-print {
            display: none !important;
        }
        .container-fluid {
            width: 100%;
            padding: 0;
            margin: 0;
        }
        .card {
            border: none !important;
            box-shadow: none !important;
        }
        .invoice {
            border: none !important;
            box-shadow: none !important;
            padding: 0 !important;
        }
        body {
            background-color: white !important;
            color: black !important;
        }
        .badge {
            border: 1px solid #ddd !important;
            color: black !important;
        }
        .text-primary, .text-danger, .text-success {
            color: black !important;
        }
        .bg-light {
            background-color: #f8f9fa !important;
        }
    }
</style>
@endsection