@extends('admin.layouts.index', ['without_card' => true])

@section('content')
    @php
        $hint = fn ($text) => '<span class="admin-home-hint" data-title="'.e($text).'"></span>';
        $empty = __('operational_statistics.empty');
    @endphp

    <script>
        window.adminHomeCharts = @json($statistics['charts']);

        document.addEventListener('DOMContentLoaded', function () {
            var tooltip = document.createElement('div');
            tooltip.className = 'admin-home-tooltip';
            document.body.appendChild(tooltip);

            function positionTooltip(event) {
                var offset = 14;
                var left = event.clientX + offset;
                var top = event.clientY + offset;

                tooltip.style.left = left + 'px';
                tooltip.style.top = top + 'px';

                var bounds = tooltip.getBoundingClientRect();

                if (bounds.right > window.innerWidth - 12) {
                    tooltip.style.left = Math.max(12, event.clientX - bounds.width - offset) + 'px';
                }

                if (bounds.bottom > window.innerHeight - 12) {
                    tooltip.style.top = Math.max(12, event.clientY - bounds.height - offset) + 'px';
                }
            }

            document.querySelectorAll('.admin-home-hint').forEach(function (hint) {
                var title = hint.parentElement;

                if (! title) {
                    return;
                }

                title.dataset.title = hint.dataset.title || '';
                title.setAttribute('aria-label', title.dataset.title);
                title.classList.add('admin-home-has-tooltip');

                title.addEventListener('mouseenter', function (event) {
                    tooltip.textContent = title.dataset.title;
                    tooltip.classList.add('is-visible');
                    positionTooltip(event);
                });

                title.addEventListener('mousemove', positionTooltip);
                title.addEventListener('mouseleave', function () {
                    tooltip.classList.remove('is-visible');
                });
            });

            document.querySelectorAll('.admin-home-table').forEach(function (table) {
                var wrapper = table.closest('.table-responsive');
                var card = table.closest('.card');

                if (wrapper) {
                    wrapper.classList.add('admin-home-table-scroll');
                }

                if (card) {
                    card.classList.add('admin-home-table-card');
                }
            });
        });
    </script>

    <style>
        .admin-home-chart {
            position: relative;
            height: 300px;
            width: 100%;
        }

        .admin-home-table th,
        .admin-home-table td {
            vertical-align: middle;
            white-space: nowrap;
        }

        .admin-home-table td:first-child,
        .admin-home-table th:first-child {
            white-space: normal;
            min-width: 180px;
        }

        .admin-home-hint {
            display: none;
        }

        .admin-home-has-tooltip {
            cursor: help;
        }

        .admin-home-tooltip {
            background: #1f2937;
            border-radius: 6px;
            box-shadow: 0 10px 30px rgba(15, 23, 42, .22);
            color: #fff;
            direction: rtl;
            font-size: 13px;
            line-height: 1.7;
            max-width: 340px;
            opacity: 0;
            padding: 8px 11px;
            pointer-events: none;
            position: fixed;
            text-align: right;
            transform: translateY(4px);
            transition: opacity .12s ease, transform .12s ease;
            white-space: normal;
            z-index: 9999;
        }

        .admin-home-tooltip.is-visible {
            opacity: 1;
            transform: translateY(0);
        }

        .admin-home-filter-actions {
            margin-top: 18px;
        }

        .admin-home-table-card {
            min-height: 470px;
        }

        .admin-home-table-card .card-body {
            display: flex;
            flex-direction: column;
        }

        .admin-home-table-scroll {
            flex: 1;
            max-height: 370px;
            overflow: auto;
        }
    </style>

    <div class="card mb-4">
        <div class="card-body">
            <form class="row align-items-end" method="GET" action="{{ route('admin.operational-statistics.index') }}">
                <div class="col-lg-3 col-md-6 col-12 form-group mb-lg-0">
                    <label>@lang('operational_statistics.filters.start_date') {!! $hint(__('operational_statistics.filters.start_date_hint')) !!}</label>
                    <input type="text" name="start_date" class="form-control flatpickr ltr" value="{{ request('start_date') ? $filters['start_date']->format('Y-m-d') : '' }}">
                </div>
                <div class="col-lg-3 col-md-6 col-12 form-group mb-lg-0">
                    <label>@lang('operational_statistics.filters.end_date') {!! $hint(__('operational_statistics.filters.end_date_hint')) !!}</label>
                    <input type="text" name="end_date" class="form-control flatpickr ltr" value="{{ request('end_date') ? $filters['end_date']->format('Y-m-d') : '' }}">
                </div>
                <x-dashboard.form.select class="ajaxSelectMalls" id="adminHomeMallFilter" name="mall" :title="__('global.mall')" :required="false" container-classes="col-lg-3 col-md-6 col-12" :with-all="true" :value="$filters['mall']" />
                <x-dashboard.form.select class="ajaxSelectBranches" id="adminHomeBranchFilter" name="branch" :title="__('global.mall_branch')" :required="false" container-classes="col-lg-3 col-md-6 col-12" :with-all="true" :value="$filters['branch']" />
                <div class="col-12 form-group mb-0 admin-home-filter-actions">
                    <button class="btn btn-primary">
                        <i class="i-Filter-2"></i>
                        @lang('operational_statistics.filters.show_results')
                    </button>
                    <a href="{{ route('admin.operational-statistics.index') }}" class="btn btn-outline-secondary">
                        <i class="i-Restore-Window"></i>
                        @lang('operational_statistics.filters.reset')
                    </a>
                </div>
            </form>
        </div>
    </div>

    <h4 class="mb-3">@lang('operational_statistics.headings.operation_indicators') {!! $hint(__('operational_statistics.headings.operation_indicators_hint')) !!}</h4>
    <div class="row mb-4 justify-content-center">
        @foreach ($statistics['cards'] as $card)
            <div class="col-xl-3 col-lg-4 col-md-6 col-12 mb-3">
                <div class="card card-icon-bg card-icon-bg-dark o-hidden h-100 text-center">
                    <div class="card-body">
                        <i class="{{ $card['icon'] }}"></i>
                        <div class="content">
                            <p class="text-muted mt-2 mb-0">{{ $card['title'] }} {!! $hint($card['hint']) !!}</p>
                            <p class="text-primary text-24 line-height-1 mb-2">{{ $card['value'] }}</p>
                        </div>
                    </div>
                </div>
            </div>
        @endforeach
    </div>

    <div class="row mb-4">
        <div class="col-xl-4 col-lg-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h5 class="mb-3">@lang('operational_statistics.headings.order_status_distribution') {!! $hint(__('operational_statistics.headings.order_status_distribution_hint')) !!}</h5>
                    <div class="admin-home-chart"><canvas id="admin-orders-status-chart"></canvas></div>
                </div>
            </div>
        </div>
        <div class="col-xl-4 col-lg-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h5 class="mb-3">@lang('operational_statistics.headings.orders_by_platform') {!! $hint(__('operational_statistics.headings.orders_by_platform_hint')) !!}</h5>
                    <div class="admin-home-chart"><canvas id="admin-platforms-chart"></canvas></div>
                </div>
            </div>
        </div>
        <div class="col-xl-4 col-lg-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h5 class="mb-3">@lang('operational_statistics.headings.completed_by_payment_method') {!! $hint(__('operational_statistics.headings.completed_by_payment_method_hint')) !!}</h5>
                    <div class="admin-home-chart"><canvas id="admin-payment-methods-chart"></canvas></div>
                </div>
            </div>
        </div>
        <div class="col-xl-6 col-lg-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h5 class="mb-3">@lang('operational_statistics.headings.orders_by_sections') {!! $hint(__('operational_statistics.headings.orders_by_sections_hint')) !!}</h5>
                    <div class="admin-home-chart"><canvas id="admin-sections-chart"></canvas></div>
                </div>
            </div>
        </div>
        <div class="col-xl-6 col-lg-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h5 class="mb-3">@lang('operational_statistics.headings.peak_hours') {!! $hint(__('operational_statistics.headings.peak_hours_chart_hint')) !!}</h5>
                    <div class="admin-home-chart"><canvas id="admin-peak-hours-chart"></canvas></div>
                </div>
            </div>
        </div>
    </div>

    {{-- Temporarily disabled until advertisement statistics are approved for the dashboard.
    <div class="row mb-4">
        <div class="col-12 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h4 class="mb-3">@lang('operational_statistics.headings.advertisements_performance') {!! $hint(__('operational_statistics.headings.advertisements_performance_hint')) !!}</h4>
                    <div class="table-responsive">
                        <table class="table table-striped table-hover admin-home-table mb-0">
                            <thead>
                                <tr>
                                    <th>@lang('operational_statistics.columns.advertisement')</th>
                                    <th>@lang('operational_statistics.columns.branch')</th>
                                    <th>@lang('operational_statistics.columns.locations_count')</th>
                                    <th>@lang('operational_statistics.columns.impressions_count')</th>
                                    <th>@lang('operational_statistics.columns.clicks_count')</th>
                                    <th>@lang('operational_statistics.columns.click_rate')</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($statistics['advertisements'] as $advertisement)
                                    <tr>
                                        <td>{{ $advertisement['advertisement'] }}</td>
                                        <td>{{ $advertisement['branch'] }}</td>
                                        <td>{{ number_format($advertisement['locations_count']) }}</td>
                                        <td>{{ number_format($advertisement['impressions_count']) }}</td>
                                        <td>{{ number_format($advertisement['clicks_count']) }}</td>
                                        <td>{{ $advertisement['click_rate'] }}%</td>
                                    </tr>
                                @empty
                                    <tr><td colspan="6" class="text-center text-muted">{{ $empty }}</td></tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
    --}}

    <div class="row mb-4">
        <div class="col-xl-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h4 class="mb-3">@lang('operational_statistics.headings.top_meals') {!! $hint(__('operational_statistics.headings.top_meals_hint')) !!}</h4>
                    <div class="table-responsive">
                        <table class="table table-striped table-hover admin-home-table mb-0">
                            <thead>
                                <tr>
                                    <th>@lang('operational_statistics.columns.meal')</th>
                                    <th>@lang('operational_statistics.columns.total_quantity')</th>
                                    <th>@lang('operational_statistics.columns.orders_count')</th>
                                    <th>@lang('operational_statistics.columns.restaurant')</th>
                                    <th>@lang('operational_statistics.columns.branch')</th>
                                    <th>@lang('operational_statistics.columns.estimated_value')</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($statistics['top_meals'] as $meal)
                                    <tr>
                                        <td>{{ $meal['meal_title'] }}</td>
                                        <td>{{ number_format($meal['total_quantity']) }}</td>
                                        <td>{{ number_format($meal['orders_count']) }}</td>
                                        <td>{{ $meal['restaurant_title'] }}</td>
                                        <td>{{ $meal['branch_title'] }}</td>
                                        <td>{{ number_format($meal['total_value'], 2) }}</td>
                                    </tr>
                                @empty
                                    <tr><td colspan="6" class="text-center text-muted">{{ $empty }}</td></tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-xl-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h4 class="mb-3">@lang('operational_statistics.headings.captains_performance') {!! $hint(__('operational_statistics.headings.captains_performance_hint')) !!}</h4>
                    <div class="table-responsive">
                        <table class="table table-striped table-hover admin-home-table mb-0">
                            <thead>
                                <tr>
                                    <th>@lang('operational_statistics.columns.captain')</th>
                                    <th>@lang('operational_statistics.columns.completed_deliveries')</th>
                                    <th>@lang('operational_statistics.columns.problem_orders')</th>
                                    <th>@lang('operational_statistics.columns.average_delivery_duration')</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($statistics['captains'] as $captain)
                                    <tr>
                                        <td>{{ $captain['name'] }}</td>
                                        <td>{{ number_format($captain['completed_deliveries']) }}</td>
                                        <td>{{ number_format($captain['problem_orders']) }}</td>
                                        <td>{{ $captain['avg_delivery_duration'] }}</td>
                                    </tr>
                                @empty
                                    <tr><td colspan="4" class="text-center text-muted">{{ $empty }}</td></tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row mb-4">
        <div class="col-xl-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h4 class="mb-3">@lang('operational_statistics.headings.repeated_customers') {!! $hint(__('operational_statistics.headings.repeated_customers_hint')) !!}</h4>
                    <div class="table-responsive">
                        <table class="table table-striped table-hover admin-home-table mb-0">
                            <thead>
                                <tr>
                                    <th>@lang('operational_statistics.columns.customer')</th>
                                    <th>@lang('operational_statistics.columns.phone')</th>
                                    <th>@lang('operational_statistics.columns.orders_count')</th>
                                    <th>@lang('operational_statistics.columns.top_restaurant')</th>
                                    <th>@lang('operational_statistics.columns.top_meal')</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($statistics['repeated_customers'] as $customer)
                                    <tr>
                                        <td>{{ $customer['name'] }}</td>
                                        <td class="ltr">{{ $customer['phone'] }}</td>
                                        <td>{{ number_format($customer['orders_count']) }}</td>
                                        <td>{{ $customer['top_restaurant'] }}</td>
                                        <td>{{ $customer['top_meal'] }}</td>
                                    </tr>
                                @empty
                                    <tr><td colspan="5" class="text-center text-muted">{{ $empty }}</td></tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-xl-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h4 class="mb-3">@lang('operational_statistics.headings.peak_hours') {!! $hint(__('operational_statistics.headings.peak_hours_table_hint')) !!}</h4>
                    <div class="table-responsive">
                        <table class="table table-striped table-hover admin-home-table mb-0">
                            <thead>
                                <tr>
                                    <th>@lang('operational_statistics.columns.period')</th>
                                    <th>@lang('operational_statistics.columns.total_orders')</th>
                                    <th>@lang('operational_statistics.columns.completed')</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($statistics['peak_hours'] as $hour)
                                    <tr>
                                        <td class="ltr">{{ $hour['block'] }}</td>
                                        <td>{{ number_format($hour['total_orders']) }}</td>
                                        <td>{{ number_format($hour['completed_orders']) }}</td>
                                    </tr>
                                @empty
                                    <tr><td colspan="3" class="text-center text-muted">{{ $empty }}</td></tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row mb-4">
        <div class="col-xl-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h4 class="mb-3">@lang('operational_statistics.headings.stores_performance') {!! $hint(__('operational_statistics.headings.stores_performance_hint')) !!}</h4>
                    <div class="table-responsive">
                        <table class="table table-striped table-hover admin-home-table mb-0">
                            <thead>
                                <tr>
                                    <th>@lang('operational_statistics.columns.entity')</th>
                                    <th>@lang('operational_statistics.columns.section')</th>
                                    <th>@lang('operational_statistics.columns.total')</th>
                                    <th>@lang('operational_statistics.columns.completed')</th>
                                    <th>@lang('operational_statistics.columns.rejected')</th>
                                    <th>@lang('operational_statistics.columns.cancelled')</th>
                                    <th>@lang('operational_statistics.columns.incomplete')</th>
                                    <th>@lang('operational_statistics.columns.conversion')</th>
                                    <th>@lang('operational_statistics.columns.pos')</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($statistics['stores'] as $store)
                                    <tr>
                                        <td>{{ $store['title'] }}</td>
                                        <td>{{ $store['section'] }}</td>
                                        <td>{{ number_format($store['total_orders']) }}</td>
                                        <td>{{ number_format($store['completed_orders']) }}</td>
                                        <td>{{ number_format($store['rejected_orders']) }}</td>
                                        <td>{{ number_format($store['cancelled_orders']) }}</td>
                                        <td>{{ number_format($store['incomplete_orders']) }}</td>
                                        <td>{{ $store['conversion_rate'] }}%</td>
                                        <td>{{ number_format($store['pos_orders']) }}</td>
                                    </tr>
                                @empty
                                    <tr><td colspan="9" class="text-center text-muted">{{ $empty }}</td></tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-xl-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h4 class="mb-3">@lang('operational_statistics.headings.subscribed_unsubscribed') {!! $hint(__('operational_statistics.headings.subscribed_unsubscribed_hint')) !!}</h4>
                    <div class="table-responsive">
                        <table class="table table-striped table-hover admin-home-table mb-0">
                            <thead>
                                <tr>
                                    <th>@lang('operational_statistics.columns.subscription_status')</th>
                                    <th>@lang('operational_statistics.columns.total_orders')</th>
                                    <th>@lang('operational_statistics.columns.completed')</th>
                                    <th>@lang('operational_statistics.columns.completion_rate')</th>
                                    <th>@lang('operational_statistics.columns.average_order_value')</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($statistics['subscription_summary'] as $summary)
                                    <tr>
                                        <td>{{ $summary['label'] }}</td>
                                        <td>{{ number_format($summary['total_orders']) }}</td>
                                        <td>{{ number_format($summary['completed_orders']) }}</td>
                                        <td>{{ $summary['completion_rate'] }}%</td>
                                        <td>{{ number_format($summary['average_order_value'], 2) }}</td>
                                    </tr>
                                @empty
                                    <tr><td colspan="5" class="text-center text-muted">{{ $empty }}</td></tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row mb-4">
        <div class="col-xl-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h4 class="mb-3">@lang('operational_statistics.headings.orders_by_platform') {!! $hint(__('operational_statistics.headings.orders_by_platform_table_hint')) !!}</h4>
                    <div class="table-responsive">
                        <table class="table table-striped table-hover admin-home-table mb-0">
                            <thead><tr><th>@lang('operational_statistics.columns.platform')</th><th>@lang('operational_statistics.columns.total_orders')</th><th>@lang('operational_statistics.columns.completed_orders_count')</th></tr></thead>
                            <tbody>
                                @forelse ($statistics['platforms'] as $platform)
                                    <tr><td>{{ $platform['label'] }}</td><td>{{ number_format($platform['total_orders']) }}</td><td>{{ number_format($platform['completed_orders']) }}</td></tr>
                                @empty
                                    <tr><td colspan="3" class="text-center text-muted">{{ $empty }}</td></tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-xl-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h4 class="mb-3">@lang('operational_statistics.headings.orders_by_sections') {!! $hint(__('operational_statistics.headings.orders_by_sections_table_hint')) !!}</h4>
                    <div class="table-responsive">
                        <table class="table table-striped table-hover admin-home-table mb-0">
                            <thead><tr><th>@lang('operational_statistics.columns.section')</th><th>@lang('operational_statistics.columns.total_orders')</th><th>@lang('operational_statistics.columns.completed_orders_count')</th></tr></thead>
                            <tbody>
                                @forelse ($statistics['sections'] as $section)
                                    <tr><td>{{ $section['label'] }}</td><td>{{ number_format($section['total_orders']) }}</td><td>{{ number_format($section['completed_orders']) }}</td></tr>
                                @empty
                                    <tr><td colspan="3" class="text-center text-muted">{{ $empty }}</td></tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row mb-4">
        <div class="col-xl-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h4 class="mb-3">@lang('operational_statistics.headings.orders_by_destinations') {!! $hint(__('operational_statistics.headings.orders_by_destinations_hint')) !!}</h4>
                    <div class="table-responsive">
                        <table class="table table-striped table-hover admin-home-table mb-0">
                            <thead>
                                <tr><th>@lang('operational_statistics.columns.destination')</th><th>@lang('operational_statistics.columns.total')</th><th>@lang('operational_statistics.columns.completed')</th><th>@lang('operational_statistics.columns.rejected')</th><th>@lang('operational_statistics.columns.cancelled')</th><th>@lang('operational_statistics.columns.incomplete')</th></tr>
                            </thead>
                            <tbody>
                                @forelse ($statistics['destinations'] as $destination)
                                    <tr>
                                        <td>{{ $destination['destination'] }}</td>
                                        <td>{{ number_format($destination['total_orders']) }}</td>
                                        <td>{{ number_format($destination['completed_orders']) }}</td>
                                        <td>{{ number_format($destination['rejected_orders']) }}</td>
                                        <td>{{ number_format($destination['cancelled_orders']) }}</td>
                                        <td>{{ number_format($destination['incomplete_orders']) }}</td>
                                    </tr>
                                @empty
                                    <tr><td colspan="6" class="text-center text-muted">{{ $empty }}</td></tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-xl-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h4 class="mb-3">@lang('operational_statistics.headings.orders_by_groups') {!! $hint(__('operational_statistics.headings.orders_by_groups_hint')) !!}</h4>
                    <div class="table-responsive">
                        <table class="table table-striped table-hover admin-home-table mb-0">
                            <thead>
                                <tr><th>@lang('operational_statistics.columns.group_destination')</th><th>@lang('operational_statistics.columns.total')</th><th>@lang('operational_statistics.columns.completed')</th><th>@lang('operational_statistics.columns.rejected')</th><th>@lang('operational_statistics.columns.cancelled')</th><th>@lang('operational_statistics.columns.incomplete')</th></tr>
                            </thead>
                            <tbody>
                                @forelse ($statistics['groups'] as $group)
                                    <tr>
                                        <td>{{ $group['destination'] }}</td>
                                        <td>{{ number_format($group['total_orders']) }}</td>
                                        <td>{{ number_format($group['completed_orders']) }}</td>
                                        <td>{{ number_format($group['rejected_orders']) }}</td>
                                        <td>{{ number_format($group['cancelled_orders']) }}</td>
                                        <td>{{ number_format($group['incomplete_orders']) }}</td>
                                    </tr>
                                @empty
                                    <tr><td colspan="6" class="text-center text-muted">{{ $empty }}</td></tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="row mb-4">
        <div class="col-xl-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h4 class="mb-3">@lang('operational_statistics.headings.completed_payment_methods') {!! $hint(__('operational_statistics.headings.completed_payment_methods_hint')) !!}</h4>
                    <div class="table-responsive">
                        <table class="table table-striped table-hover admin-home-table mb-0">
                            <thead><tr><th>@lang('operational_statistics.columns.payment_method')</th><th>@lang('operational_statistics.columns.completed_orders_count')</th></tr></thead>
                            <tbody>
                                @forelse ($statistics['payment_methods'] as $method)
                                    <tr><td>{{ $method['label'] }}</td><td>{{ number_format($method['completed_orders']) }}</td></tr>
                                @empty
                                    <tr><td colspan="2" class="text-center text-muted">{{ $empty }}</td></tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>

        <div class="col-xl-6 mb-4">
            <div class="card h-100">
                <div class="card-body">
                    <h4 class="mb-3">@lang('operational_statistics.headings.top_marketers') {!! $hint(__('operational_statistics.headings.top_marketers_hint')) !!}</h4>
                    <div class="table-responsive">
                        <table class="table table-striped table-hover admin-home-table mb-0">
                            <thead><tr><th>@lang('operational_statistics.columns.marketer')</th><th>@lang('operational_statistics.columns.orders_count')</th></tr></thead>
                            <tbody>
                                @forelse ($statistics['marketers'] as $marketer)
                                    <tr><td>{{ $marketer['marketer'] }}</td><td>{{ number_format($marketer['orders_count']) }}</td></tr>
                                @empty
                                    <tr><td colspan="2" class="text-center text-muted">{{ $empty }}</td></tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection