@extends('layouts.app')

@section('title', 'All Sales Invoices & Customers Report')

@section('content')
<style>
    .stat-icon {
        width: 60px;
        height: 60px;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 24px;
        margin-bottom: 10px;
    }
    .stat-icon.primary { background-color: rgba(0, 123, 255, 0.1); }
    .stat-icon.success { background-color: rgba(40, 167, 69, 0.1); }
    .stat-icon.warning { background-color: rgba(255, 193, 7, 0.1); }
    .stat-icon.info { background-color: rgba(23, 162, 184, 0.1); }
    .stat-icon.danger { background-color: rgba(220, 53, 69, 0.1); }
    .stat-number {
        font-size: 28px;
        font-weight: bold;
        margin: 10px 0;
    }
    .stat-label {
        font-size: 14px;
        color: #6c757d;
    }
    
    /* Sticky columns for Customers Details table */
    .customers-details-table {
        position: relative;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    .customers-details-table th.sticky-col-1,
    .customers-details-table td.sticky-col-1 {
        position: sticky;
        left: 0;
        z-index: 10;
        background-color: #ffffff;
        border-right: 2px solid #dee2e6;
        box-shadow: 2px 0 4px rgba(0,0,0,0.1);
    }
    
    .customers-details-table th.sticky-col-1 {
        background-color: #f8f9fa !important;
        z-index: 11;
    }
    
    .customers-details-table th.sticky-col-2,
    .customers-details-table td.sticky-col-2 {
        position: sticky;
        left: 60px; /* Adjust based on SN column width */
        z-index: 10;
        background-color: #ffffff;
        border-right: 2px solid #dee2e6;
        box-shadow: 2px 0 4px rgba(0,0,0,0.1);
    }
    
    .customers-details-table th.sticky-col-2 {
        background-color: #f8f9fa !important;
        z-index: 11;
    }
    
    .customers-details-table tbody tr:hover td.sticky-col-1,
    .customers-details-table tbody tr:hover td.sticky-col-2 {
        background-color: #e9ecef !important;
    }
    
    .customers-details-table thead tr:first-child th.sticky-col-1,
    .customers-details-table thead tr:first-child th.sticky-col-2 {
        z-index: 12;
    }
    
    .customers-details-table thead tr:last-child th.sticky-col-1,
    .customers-details-table thead tr:last-child th.sticky-col-2 {
        z-index: 11;
    }
    
    /* Column colors for different item types */
    .col-internet {
        background-color: #e3f2fd !important; /* Light Blue */
    }
    .col-ggc {
        background-color: #f3e5f5 !important; /* Light Purple */
    }
    .col-facebook {
        background-color: #e8f5e9 !important; /* Light Green */
    }
    .col-fh-nttn {
        background-color: #fff3e0 !important; /* Light Orange */
    }
    .col-summit-nttn {
        background-color: #fce4ec !important; /* Light Pink */
    }
    .col-bhaisan {
        background-color: #e0f2f1 !important; /* Light Teal */
    }
    .col-data-center,
    .col-datacenter {
        background-color: #f1f8e9 !important; /* Light Lime */
    }
    .col-mcdn {
        background-color: #fff9c4 !important; /* Light Yellow */
    }
    .col-pni {
        background-color: #e1bee7 !important; /* Light Purple-Pink */
    }
    
    /* Apply colors to header cells */
    .customers-details-table thead th.col-internet {
        background-color: #e3f2fd !important; /* Light Blue */
    }
    .customers-details-table thead th.col-ggc {
        background-color: #f3e5f5 !important; /* Light Purple */
    }
    .customers-details-table thead th.col-facebook {
        background-color: #e8f5e9 !important; /* Light Green */
    }
    .customers-details-table thead th.col-fh-nttn {
        background-color: #fff3e0 !important; /* Light Orange */
    }
    .customers-details-table thead th.col-summit-nttn {
        background-color: #fce4ec !important; /* Light Pink */
    }
    .customers-details-table thead th.col-bhaisan {
        background-color: #e0f2f1 !important; /* Light Teal */
    }
    .customers-details-table thead th.col-data-center,
    .customers-details-table thead th.col-datacenter {
        background-color: #f1f8e9 !important; /* Light Lime */
    }
    .customers-details-table thead th.col-mcdn {
        background-color: #fff9c4 !important; /* Light Yellow */
    }
    .customers-details-table thead th.col-pni {
        background-color: #e1bee7 !important; /* Light Purple-Pink */
    }
    
    /* Hover effect for colored columns */
    .customers-details-table tbody tr:hover td.col-internet,
    .customers-details-table tbody tr:hover td.col-ggc,
    .customers-details-table tbody tr:hover td.col-facebook,
    .customers-details-table tbody tr:hover td.col-fh-nttn,
    .customers-details-table tbody tr:hover td.col-summit-nttn,
    .customers-details-table tbody tr:hover td.col-bhaisan,
    .customers-details-table tbody tr:hover td.col-data-center,
    .customers-details-table tbody tr:hover td.col-datacenter,
    .customers-details-table tbody tr:hover td.col-mcdn,
    .customers-details-table tbody tr:hover td.col-pni {
        opacity: 0.85;
        filter: brightness(0.95);
    }
    
    /* Item columns styling */
    .customers-details-table th[class*="col-item-"],
    .customers-details-table td[class*="col-item-"] {
        background-color: #f8f9fa;
    }
    
    .customers-details-table thead th[class*="col-item-"] {
        background-color: #e9ecef !important;
        border-bottom: 2px solid #dee2e6;
    }
    
    .customers-details-table tbody tr:hover td[class*="col-item-"] {
        background-color: #e9ecef !important;
    }
</style>

<div class="container-fluid">
    <!-- Page Header -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="card border-0 shadow-sm" style="border-radius: 15px;">
                <div class="card-header bg-white border-0" style="border-radius: 15px 15px 0 0;">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <h3 class="mb-0">
                                <i class="fas fa-file-invoice-dollar text-primary me-2"></i>
                                All Sales Invoices & Customers Report
                            </h3>
                            <p class="mb-0 text-muted">Complete overview of all sales invoices and customers</p>
                        </div>
                        <div>
                            <a href="{{ route('reseller.sales-report.index') }}" class="btn btn-outline-secondary">
                                <i class="fas fa-arrow-left me-2"></i>Back to Sales Report
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Summary Statistics -->
    <div class="row mb-4">
        <div class="col-md-3">
            <div class="card border-0 shadow-sm text-center" style="border-radius: 15px;">
                <div class="card-body">
                    <div class="stat-icon primary mx-auto">
                        <i class="fas fa-file-invoice text-primary"></i>
                    </div>
                    <div class="stat-number text-primary">{{ number_format($stats['total_invoices']) }}</div>
                    <div class="stat-label">Total Invoices</div>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card border-0 shadow-sm text-center" style="border-radius: 15px;">
                <div class="card-body">
                    <div class="stat-icon info mx-auto">
                        <i class="fas fa-users text-info"></i>
                    </div>
                    <div class="stat-number text-info">{{ number_format($stats['total_customers']) }}</div>
                    <div class="stat-label">Total Customers</div>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card border-0 shadow-sm text-center" style="border-radius: 15px;">
                <div class="card-body">
                    <div class="stat-icon success mx-auto">
                        <i class="fas fa-dollar-sign text-success"></i>
                    </div>
                    <div class="stat-number text-success">৳{{ number_format($stats['total_amount'], 2) }}</div>
                    <div class="stat-label">Total Sales Amount</div>
                </div>
            </div>
        </div>
        <div class="col-md-3">
            <div class="card border-0 shadow-sm text-center" style="border-radius: 15px;">
                <div class="card-body">
                    <div class="stat-icon warning mx-auto">
                        <i class="fas fa-exclamation-triangle text-warning"></i>
                    </div>
                    <div class="stat-number text-warning">৳{{ number_format($stats['total_due'], 2) }}</div>
                    <div class="stat-label">Total Due Amount</div>
                </div>
            </div>
        </div>
    </div>

    <!-- Filter Section -->
    <div class="card border-0 shadow-sm mb-4" style="border-radius: 15px;">
        <div class="card-header bg-white border-0" style="border-radius: 15px 15px 0 0;">
            <h5 class="mb-0">
                <i class="fas fa-filter text-primary me-2"></i>
                Filter & Search
            </h5>
        </div>
        <div class="card-body">
            <form method="GET" action="{{ route('reseller.sales-report.all-invoices-customers') }}">
                <div class="row align-items-end">
                    <div class="col-md-2 mb-3">
                        <label for="search" class="form-label">Search</label>
                        <input type="text" class="form-control" id="search" name="search" 
                               value="{{ request('search') }}" placeholder="Invoice No, Customer Name, Email...">
                    </div>
                    <div class="col-md-1 mb-3">
                        <label for="from_date" class="form-label">From Date</label>
                        <input type="date" class="form-control" id="from_date" name="from_date" 
                               value="{{ request('from_date') }}">
                    </div>
                    <div class="col-md-1 mb-3">
                        <label for="to_date" class="form-label">To Date</label>
                        <input type="date" class="form-control" id="to_date" name="to_date" 
                               value="{{ request('to_date') }}">
                    </div>
                    <div class="col-md-2 mb-3">
                        <label for="customer_id" class="form-label">Customer</label>
                        <select class="form-control" id="customer_id" name="customer_id">
                            <option value="">All Customers</option>
                            @foreach($customers as $customer)
                                <option value="{{ $customer->id }}" {{ request('customer_id') == $customer->id ? 'selected' : '' }}>
                                    {{ $customer->name }} ({{ $customer->email }})
                                </option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-1 mb-3">
                        <label for="status" class="form-label">Status</label>
                        <select class="form-control" id="status" name="status">
                            <option value="">All Status</option>
                            <option value="paid" {{ request('status') == 'paid' ? 'selected' : '' }}>Paid</option>
                            <option value="due" {{ request('status') == 'due' ? 'selected' : '' }}>Due</option>
                        </select>
                    </div>
                    <div class="col-md-1 mb-3">
                        <label for="sales_invoice_id" class="form-label">Invoice</label>
                        <select class="form-control" id="sales_invoice_id" name="sales_invoice_id">
                            <option value="">All Invoices</option>
                            @foreach($allInvoices ?? [] as $inv)
                                <option value="{{ $inv->id }}" {{ request('sales_invoice_id') == $inv->id ? 'selected' : '' }}>
                                    {{ $inv->invoice_no }} @if($inv->customer_invoice)({{ $inv->customer_invoice }})@endif
                                </option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-1 mb-3">
                        <label for="invoice_month" class="form-label">Invoice Month</label>
                        <select class="form-control" id="invoice_month" name="invoice_month">
                            <option value="">Current Month</option>
                            @foreach($availableMonths ?? [] as $month)
                                <option value="{{ $month['value'] }}" {{ request('invoice_month') == $month['value'] ? 'selected' : '' }}>
                                    {{ $month['display'] }}
                                </option>
                            @endforeach
                        </select>
                    </div>
                    <div class="col-md-1 mb-3">
                        <label for="invoice_date_from" class="form-label">Inv Date From</label>
                        <input type="date" class="form-control" id="invoice_date_from" name="invoice_date_from" 
                               value="{{ request('invoice_date_from') }}">
                    </div>
                    <div class="col-md-1 mb-3">
                        <label for="invoice_date_to" class="form-label">Inv Date To</label>
                        <input type="date" class="form-control" id="invoice_date_to" name="invoice_date_to" 
                               value="{{ request('invoice_date_to') }}">
                    </div>
                    <div class="col-md-1 mb-3">
                        <label class="form-label">&nbsp;</label>
                        <button type="submit" class="btn btn-primary w-100">
                            <i class="fas fa-search me-1"></i>Filter
                        </button>
                    </div>
                </div>
                @if(request()->hasAny(['search', 'from_date', 'to_date', 'customer_id', 'status', 'sales_invoice_id', 'invoice_month', 'invoice_date_from', 'invoice_date_to']))
                <div class="row">
                    <div class="col-12">
                        <a href="{{ route('reseller.sales-report.all-invoices-customers') }}" class="btn btn-sm btn-outline-secondary">
                            <i class="fas fa-times me-1"></i>Clear Filters
                        </a>
                    </div>
                </div>
                @endif
            </form>
        </div>
    </div>

    <!-- Customers Details Table -->
    <div class="card border-0 shadow-sm mb-4" style="border-radius: 15px;">
        <div class="card-header bg-white border-0" style="border-radius: 15px 15px 0 0;">
            <div class="d-flex justify-content-between align-items-center">
                <h4 class="mb-0 font-weight-bold">
                    Customers Details 
                    <small class="text-muted">(Current Month: {{ \Carbon\Carbon::now()->format('M Y') }})</small>
                </h4>
                @if(request('sales_invoice_id'))
                    @php
                        $selectedInvoice = \App\Models\SalesInvoice::find(request('sales_invoice_id'));
                    @endphp
                    @if($selectedInvoice)
                        <span class="badge badge-info">
                            <i class="fas fa-filter me-1"></i>
                            Filtered by Invoice: {{ $selectedInvoice->invoice_no }}
                            @if($selectedInvoice->customer_invoice)
                                ({{ $selectedInvoice->customer_invoice }})
                            @endif
                        </span>
                    @endif
                @elseif(request('invoice_date_from') || request('invoice_date_to'))
                    <span class="badge badge-info">
                        <i class="fas fa-calendar-alt me-1"></i>
                        Invoice Date: 
                        @if(request('invoice_date_from'))
                            From {{ \Carbon\Carbon::parse(request('invoice_date_from'))->format('d M Y') }}
                        @endif
                        @if(request('invoice_date_to'))
                            @if(request('invoice_date_from')) to @else Until @endif
                            {{ \Carbon\Carbon::parse(request('invoice_date_to'))->format('d M Y') }}
                        @endif
                    </span>
                @elseif(request('invoice_month'))
                    @php
                        $selectedMonthValue = request('invoice_month');
                        $selectedMonthDisplay = \Carbon\Carbon::createFromFormat('Y-m', $selectedMonthValue)->format('M Y');
                    @endphp
                    <span class="badge badge-primary">
                        <i class="fas fa-calendar me-1"></i>
                        Invoice Month: {{ $selectedMonthDisplay }}
                    </span>
                @else
                    @php
                        $currentMonth = \Carbon\Carbon::now()->format('Y-m');
                        $currentMonthDisplay = \Carbon\Carbon::now()->format('M Y');
                    @endphp
                    <span class="badge badge-secondary">
                        <i class="fas fa-calendar me-1"></i>
                        Current Month: {{ $currentMonthDisplay }} ({{ $currentMonth }})
                    </span>
                @endif
            </div>
        </div>
        <div class="card-body">
            @if(empty($customerDetails) || count($customerDetails) == 0)
                <div class="alert alert-warning">
                    <i class="fas fa-exclamation-triangle me-2"></i>
                    <strong>No customer details found</strong> for the selected period.
                    @if(!request('invoice_month') && !request('sales_invoice_id'))
                        @php
                            $currentMonthDisplay = \Carbon\Carbon::now()->format('M Y');
                            $currentMonthValue = \Carbon\Carbon::now()->format('Y-m');
                        @endphp
                        <br><br>
                        <strong>Current Month:</strong> {{ $currentMonthDisplay }} ({{ $currentMonthValue }})
                        <br><small class="text-muted">No invoices found for December 2025 in the database.</small>
                        @if(isset($availableMonths) && count($availableMonths) > 0)
                            <br><br>
                            <strong>Available months with data:</strong>
                            <ul class="mb-0 mt-2">
                                @foreach($availableMonths->take(5) as $month)
                                    <li>
                                        <a href="{{ route('reseller.sales-report.all-invoices-customers', ['invoice_month' => $month['value']]) }}" 
                                           class="text-primary">
                                            {{ $month['display'] }}
                                        </a>
                                    </li>
                                @endforeach
                            </ul>
                            @if(count($availableMonths) > 5)
                                <small class="text-muted">... and {{ count($availableMonths) - 5 }} more months</small>
                            @endif
                        @else
                            <br><small class="text-danger">No invoice data found in the database for any month.</small>
                        @endif
                    @elseif(request('invoice_month'))
                        <br><small>Selected month: <strong>{{ request('invoice_month') }}</strong></small>
                        <br><small>No invoices found for this month.</small>
                    @endif
                </div>
            @endif
            <div class="table-responsive customers-details-table">
                <table class="table table-bordered" style="border-collapse: collapse; width: 100%;">
                    <thead>
                        <tr>
                            <th class="text-center sticky-col-1" style="border: 1px solid #dee2e6; padding: 8px; background-color: #f8f9fa; font-weight: bold; min-width: 60px;">SN</th>
                            <th class="text-center sticky-col-2" style="border: 1px solid #dee2e6; padding: 8px; background-color: #f8f9fa; font-weight: bold; min-width: 200px;">Company</th>
                            @foreach($itemTypesList ?? [] as $columnKey => $columnInfo)
                            @php
                                $itemName = $columnInfo['item_name'] ?? 'Item';
                                $colClass = 'col-item-' . str_replace([' ', '-', '@', '#'], '-', strtolower($itemName));
                            @endphp
                            <th class="text-center {{ $colClass }}" style="border: 1px solid #dee2e6; padding: 8px; background-color: #f8f9fa; font-weight: bold;" colspan="3">
                                <div style="font-size: 0.9em;">
                                    {{ $itemName }}
                                </div>
                            </th>
                            @endforeach
                        </tr>
                        <tr>
                            <th class="text-center sticky-col-1" style="border: 1px solid #dee2e6; padding: 8px; background-color: #f8f9fa; font-weight: bold;"></th>
                            <th class="text-center sticky-col-2" style="border: 1px solid #dee2e6; padding: 8px; background-color: #f8f9fa; font-weight: bold;"></th>
                            @foreach($itemTypesList ?? [] as $columnKey => $columnInfo)
                            @php
                                $itemName = $columnInfo['item_name'] ?? 'Item';
                                $colClass = 'col-item-' . str_replace([' ', '-', '@', '#'], '-', strtolower($itemName));
                            @endphp
                            <th class="text-center {{ $colClass }}" style="border: 1px solid #dee2e6; padding: 8px; background-color: #f8f9fa; font-weight: bold; font-size: 0.85em;">Qty</th>
                            <th class="text-center {{ $colClass }}" style="border: 1px solid #dee2e6; padding: 8px; background-color: #f8f9fa; font-weight: bold; font-size: 0.85em;">Rate</th>
                            <th class="text-center {{ $colClass }}" style="border: 1px solid #dee2e6; padding: 8px; background-color: #f8f9fa; font-weight: bold; font-size: 0.85em;">Price</th>
                            @endforeach
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($customerDetails ?? [] as $detail)
                        <tr>
                            <td class="text-center sticky-col-1" style="border: 1px solid #dee2e6; padding: 8px;">{{ $detail['sn'] }}</td>
                            <td class="sticky-col-2" style="border: 1px solid #dee2e6; padding: 8px;">{{ $detail['company'] }}</td>
                            @foreach($itemTypesList ?? [] as $columnKey => $columnInfo)
                            @php
                                $itemName = $columnInfo['item_name'] ?? 'Item';
                                $colClass = 'col-item-' . str_replace([' ', '-', '@', '#'], '-', strtolower($itemName));
                            @endphp
                            <td class="text-center {{ $colClass }}" style="border: 1px solid #dee2e6; padding: 8px;">
                                {{ $detail[$columnKey]['quantity'] ?? '' }}
                            </td>
                            <td class="text-center {{ $colClass }}" style="border: 1px solid #dee2e6; padding: 8px;">
                                {{ $detail[$columnKey]['rate'] ?? '' }}
                            </td>
                            <td class="text-center {{ $colClass }}" style="border: 1px solid #dee2e6; padding: 8px;">
                                {{ $detail[$columnKey]['price'] ?? '' }}
                            </td>
                            @endforeach
                        </tr>
                        @empty
                        <tr>
                            <td colspan="{{ 2 + (count($itemTypesList ?? []) * 3) }}" class="text-center py-4 sticky-col-1" style="border: 1px solid #dee2e6; padding: 8px;">
                                <i class="fas fa-inbox fa-3x text-muted mb-3"></i>
                                <p class="text-muted">No customer details found for current month</p>
                            </td>
                        </tr>
                        @endforelse
                    </tbody>
                </table>
            </div>
        </div>
    </div>

</div>

@endsection