@php
    use App\Services\Reports\ReportCatalog;
    use App\Services\Reports\ReportDefinition;
    use App\Services\Reports\ReportFormatter;
    use App\Services\Reports\ReportOperators;
    use App\Services\Reports\ReportRunner;
    $type = $def->effectiveType();
    $typeLabel = ['tabular' => 'Tabular', 'summary' => 'Summary', 'matrix' => 'Matrix'][$def->type];
    $types = collect($def->columns)->mapWithKeys(fn ($c) => [$c => $def->columnType($c)])->all();
    $aggCols = $runner->aggregateColumns();
    $groupType = $def->groupColumn ? $def->columnType($def->groupColumn) : null;
    $groupCounts = collect($groups['rows'] ?? [])->mapWithKeys(fn ($g) => [ReportRunner::bucket($g['__group']) => $g])->all();
    $exportQuery = array_filter(['q' => $search, 'sort' => $sort, 'dir' => $dir]);
@endphp
<x-layouts.app :title="$def->displayName()" :subtitle="$def->description"
               :breadcrumbs="array_filter(['Reports' => route('reports.index'), ($report->folder?->folder_name ?? 'Unfiled') => route('reports.index', ['folder' => $report->folder ? $report->folder_id : 'none']), $def->displayName() => null])">
    <x-slot:actions>
        <a href="{{ route('reports.edit', $report) }}" class="btn btn-secondary"><x-heroicon-m-pencil-square class="h-4 w-4" /> Edit</a>
        <form method="POST" action="{{ route('reports.duplicate', $report) }}">
            @csrf
            <button class="btn btn-secondary"><x-heroicon-m-document-duplicate class="h-4 w-4" /> Duplicate</button>
        </form>
        <a href="{{ route('reports.print', [$report] + $exportQuery) }}" target="_blank" rel="noopener" class="btn btn-secondary"><x-heroicon-m-printer class="h-4 w-4" /> Print</a>
        <div x-data="{ open: false }" class="relative">
            <button type="button" class="btn btn-brand" @click="open = !open" @click.outside="open = false">
                <x-heroicon-m-arrow-down-tray class="h-4 w-4" /> Export <x-heroicon-m-chevron-down class="h-4 w-4" />
            </button>
            <div x-cloak x-show="open" x-transition.origin.top.right class="absolute right-0 z-30 mt-2 w-60 overflow-hidden rounded-2xl border border-ink-200 bg-white p-1.5 shadow-xl dark:border-ink-700 dark:bg-ink-900">
                <a href="{{ route('reports.export', [$report] + $exportQuery) }}" class="flex items-center gap-2 rounded-lg px-3 py-2 text-sm text-ink-700 hover:bg-ink-100 dark:text-ink-200 dark:hover:bg-ink-800">
                    <x-heroicon-o-table-cells class="h-4 w-4" /> All records (CSV)
                </a>
                @if ($type === 'summary')
                    <a href="{{ route('reports.export', [$report, 'what' => 'groups'] + $exportQuery) }}" class="flex items-center gap-2 rounded-lg px-3 py-2 text-sm text-ink-700 hover:bg-ink-100 dark:text-ink-200 dark:hover:bg-ink-800">
                        <x-heroicon-o-chart-pie class="h-4 w-4" /> Group subtotals (CSV)
                    </a>
                @endif
                @if ($type === 'matrix')
                    <a href="{{ route('reports.export', [$report, 'what' => 'matrix'] + $exportQuery) }}" class="flex items-center gap-2 rounded-lg px-3 py-2 text-sm text-ink-700 hover:bg-ink-100 dark:text-ink-200 dark:hover:bg-ink-800">
                        <x-heroicon-o-squares-2x2 class="h-4 w-4" /> Matrix (CSV)
                    </a>
                @endif
            </div>
        </div>
    </x-slot:actions>

    {{-- Meta strip --}}
    <div class="mb-5 flex flex-wrap items-center gap-2 text-xs text-ink-500">
        <span class="badge {{ ['tabular' => 'badge-gray', 'summary' => 'badge-blue', 'matrix' => 'badge-violet'][$def->type] }}">{{ $typeLabel }} report</span>
        <span class="inline-flex items-center gap-1"><x-heroicon-m-circle-stack class="h-3.5 w-3.5" />{{ ReportCatalog::moduleLabel($def->primary) }}@if ($def->related) + {{ collect($def->related)->map(fn ($m) => ReportCatalog::moduleLabel($m))->join(', ') }}@endif</span>
        <span class="text-ink-300">•</span>
        <span>Updated {{ $report->updated_at?->format('d-m-Y H:i') ?? '—' }}</span>
        @if ($def->groupColumn && $type !== 'tabular')
            <span class="text-ink-300">•</span>
            <span>Grouped by <strong class="font-medium text-ink-700 dark:text-ink-200">{{ $def->label($def->groupColumn) }}</strong>@if ($type === 'matrix') × <strong class="font-medium text-ink-700 dark:text-ink-200">{{ $def->label($def->matrixColumn) }}</strong>@endif</span>
        @endif
    </div>

    @if ($def->warnings)
        <div class="mb-5 rounded-2xl border border-amber-200 bg-amber-50 px-4 py-3 text-sm text-amber-900 dark:border-amber-500/30 dark:bg-amber-500/10 dark:text-amber-200">
            <div class="flex items-start gap-3">
                <x-heroicon-o-exclamation-triangle class="mt-0.5 h-5 w-5 shrink-0" />
                <div>
                    <p class="font-medium">This report was imported from the old system and needs attention:</p>
                    <ul class="mt-1 list-disc space-y-0.5 pl-5">
                        @foreach ($def->warnings as $w)<li>{{ $w }}</li>@endforeach
                    </ul>
                    <a href="{{ route('reports.edit', $report) }}" class="mt-2 inline-flex items-center gap-1 font-medium underline">Fix it in the editor <x-heroicon-m-arrow-right class="h-3.5 w-3.5" /></a>
                </div>
            </div>
        </div>
    @endif

    {{-- Filters --}}
    @if ($def->filters)
        <div class="mb-5 flex flex-wrap items-center gap-1.5">
            <span class="mr-1 inline-flex items-center gap-1 text-xs font-medium text-ink-500"><x-heroicon-m-funnel class="h-3.5 w-3.5" /> Filters</span>
            @foreach ($def->filters as $i => $f)
                @if ($i > 0)<span class="rounded-md px-1.5 text-[10px] font-bold {{ $f['join'] === 'OR' ? 'bg-violet-100 text-violet-700 dark:bg-violet-500/15 dark:text-violet-300' : 'bg-ink-100 text-ink-500 dark:bg-ink-800' }}">{{ $f['join'] }}</span>@endif
                <span class="inline-flex items-center gap-1 rounded-full bg-white px-2.5 py-1 text-xs ring-1 ring-ink-200 dark:bg-ink-900 dark:ring-ink-700">
                    <span class="font-medium text-ink-800 dark:text-ink-100">{{ $def->label($f['field']) }}</span>
                    <span class="text-ink-500">{{ ReportOperators::ALL[$f['operator']][0] ?? $f['operator'] }}</span>
                    @if ($f['value'] !== '')<span class="max-w-[240px] truncate font-medium text-brand-700 dark:text-brand-300" title="{{ $f['value'] }}">{{ str_replace(',', ', ', $f['value']) }}</span>@endif
                </span>
            @endforeach
        </div>
    @endif

    @if ($error)
        <div class="card p-6"><x-empty-state title="Report could not be run" :message="$error" icon="heroicon-o-exclamation-circle" /></div>
    @else
        {{-- KPIs --}}
        <div class="mb-6 grid gap-4 sm:grid-cols-2 xl:grid-cols-4">
            <x-stat label="Records" :value="number_format($rows->total())" icon="heroicon-o-queue-list" tone="amber" />
            @if ($type === 'summary')
                <x-stat label="Groups" :value="number_format(count($groups['rows'])).($groups['truncated'] ? '+' : '')" icon="heroicon-o-rectangle-group" tone="blue" :hint="$def->label($def->groupColumn)" />
            @endif
            @if ($totals)
                @foreach (array_slice($aggCols, 0, $type === 'summary' ? 2 : 3, true) as $alias => [$fn, $key])
                    <x-stat :label="ReportDefinition::AGGREGATE_LABELS[$fn].' · '.$def->label($key)" :value="ReportFormatter::number($totals['values'][$alias] ?? null)" icon="heroicon-o-calculator" tone="green" />
                @endforeach
            @endif
        </div>

        {{-- Chart --}}
        @if ($chart || $type !== 'tabular')
            <x-card class="mb-6" :title="$chart ? $chart['y_label'].' by '.$chart['x_label'] : 'Chart'" :subtitle="$chart && $chart['truncated'] ? 'Showing the largest categories only.' : null">
                <x-slot:actions>
                    <button type="button" class="btn btn-secondary btn-sm" @click="$dispatch('open-modal', 'chart-edit')"><x-heroicon-m-adjustments-horizontal class="h-4 w-4" /> {{ $chart ? 'Edit chart' : 'Add chart' }}</button>
                </x-slot:actions>
                @if ($chart && $chart['labels'])
                    <div class="relative {{ in_array($chart['type'], ['pie', 'donut'], true) ? 'h-80' : 'h-96' }}">
                        <canvas id="report-chart" role="img" aria-label="{{ $chart['y_label'] }} by {{ $chart['x_label'] }}"></canvas>
                    </div>
                @elseif ($chart)
                    <x-empty-state title="Nothing to chart" message="No records match this report's filters." icon="heroicon-o-chart-bar" class="!py-8" />
                @else
                    <x-empty-state title="No chart yet" message="Add a chart to visualise this report's groups." icon="heroicon-o-chart-bar" class="!py-8" />
                @endif
            </x-card>
        @endif

        {{-- Matrix --}}
        @if ($matrix)
            @php
                $rType = $def->columnType($def->groupColumn);
                $cType = $def->columnType($def->matrixColumn);
                $max = collect($matrix['cells'])->flatten()->map(fn ($v) => (float) $v)->max() ?: 1;
            @endphp
            <x-card class="mb-6" :padded="false" :title="$matrix['measure']" :subtitle="$def->label($def->groupColumn).' (rows) × '.$def->label($def->matrixColumn).' (columns)'.($matrix['truncated'] ? ' — largest values only' : '')">
                @if (! $matrix['rows'])
                    <x-empty-state title="No data" message="No records match this report's filters." icon="heroicon-o-squares-2x2" />
                @else
                    <div class="table-wrap max-h-[560px]">
                        <table class="table table-compact">
                            <thead>
                            <tr>
                                <th class="sticky left-0 z-[2]">{{ $def->label($def->groupColumn) }}</th>
                                @foreach ($matrix['columns'] as $c => $_)<th class="text-right">{{ ReportFormatter::bucket($c, $cType) }}</th>@endforeach
                                <th class="text-right !text-ink-700 dark:!text-ink-200">Total</th>
                            </tr>
                            </thead>
                            <tbody class="divide-y divide-ink-100 dark:divide-ink-800">
                            @foreach ($matrix['rows'] as $r => $rowTotal)
                                <tr>
                                    <td class="sticky left-0 bg-white font-medium text-ink-800 dark:bg-ink-900 dark:text-ink-100">{{ ReportFormatter::bucket($r, $rType) }}</td>
                                    @foreach ($matrix['columns'] as $c => $_)
                                        @php $v = $matrix['cells'][$r][$c] ?? null; @endphp
                                        <td class="text-right tabular-nums" @if ($v !== null) style="background-color: rgba(245, 158, 11, {{ round(0.06 + 0.32 * ((float) $v / $max), 3) }})" @endif>{{ $v === null ? '·' : ReportFormatter::number($v) }}</td>
                                    @endforeach
                                    <td class="text-right font-semibold tabular-nums">{{ ReportFormatter::number($rowTotal) }}</td>
                                </tr>
                            @endforeach
                            </tbody>
                            <tfoot class="border-t-2 border-ink-200 bg-ink-50 font-semibold dark:border-ink-700 dark:bg-ink-800/60">
                            <tr>
                                <td class="sticky left-0 bg-ink-50 px-4 py-2 dark:bg-ink-800">Total</td>
                                @foreach ($matrix['columns'] as $colTotal)<td class="px-4 py-2 text-right tabular-nums">{{ ReportFormatter::number($colTotal) }}</td>@endforeach
                                <td class="px-4 py-2 text-right tabular-nums text-brand-700 dark:text-brand-300">{{ ReportFormatter::number($matrix['grand']) }}</td>
                            </tr>
                            </tfoot>
                        </table>
                    </div>
                @endif
            </x-card>
        @endif

        {{-- Group subtotals --}}
        @if ($type === 'summary')
            @php $maxCount = max(1, collect($groups['rows'])->max('__count') ?? 1); @endphp
            <x-card class="mb-6" :padded="false" title="Group subtotals" :subtitle="$def->label($def->groupColumn).($groups['truncated'] ? ' — first '.ReportRunner::MAX_GROUPS.' groups' : '')">
                @if (! $groups['rows'])
                    <x-empty-state title="No groups" message="No records match this report's filters." icon="heroicon-o-rectangle-group" />
                @else
                    <div class="table-wrap max-h-[420px]">
                        <table class="table table-compact">
                            <thead>
                            <tr>
                                <th>{{ $def->label($def->groupColumn) }}</th>
                                <th class="w-1/3">Records</th>
                                @foreach ($aggCols as [$fn, $key])<th class="text-right">{{ ReportDefinition::AGGREGATE_LABELS[$fn] }} · {{ $def->label($key) }}</th>@endforeach
                            </tr>
                            </thead>
                            <tbody class="divide-y divide-ink-100 dark:divide-ink-800">
                            @foreach ($groups['rows'] as $g)
                                <tr>
                                    <td class="font-medium text-ink-800 dark:text-ink-100">{{ ReportFormatter::bucket($g['__group'], $groupType) }}</td>
                                    <td>
                                        <div class="flex items-center gap-3">
                                            <div class="h-2 flex-1 overflow-hidden rounded-full bg-ink-100 dark:bg-ink-800">
                                                <div class="h-full rounded-full bg-brand-500" style="width: {{ round(100 * $g['__count'] / $maxCount, 1) }}%"></div>
                                            </div>
                                            <span class="w-16 text-right tabular-nums">{{ number_format($g['__count']) }}</span>
                                        </div>
                                    </td>
                                    @foreach ($aggCols as $alias => $_)<td class="text-right tabular-nums">{{ ReportFormatter::number($g[$alias]) }}</td>@endforeach
                                </tr>
                            @endforeach
                            </tbody>
                        </table>
                    </div>
                @endif
            </x-card>
        @endif

        {{-- Detail records --}}
        <x-card :padded="false" :title="$type === 'tabular' ? 'Records' : 'Detail records'">
            <div class="border-b border-ink-100 p-4 dark:border-ink-800">
                <x-filter-bar placeholder="Quick search in this report's text columns…" />
            </div>
            @if ($rows->isEmpty())
                <x-empty-state title="No matching records" :message="$search !== '' ? 'Nothing matches your search.' : 'No records match this report\'s filters.'" icon="heroicon-o-magnifying-glass" />
            @else
                <div class="table-wrap max-h-[70vh]">
                    <table class="table table-compact">
                        <thead>
                        <tr>
                            <th class="w-12 text-right">#</th>
                            @foreach ($def->columns as $c)
                                <th class="{{ $types[$c] === 'number' ? 'text-right' : '' }}"><x-sort-link :column="$c" :label="$def->label($c)" /></th>
                            @endforeach
                        </tr>
                        </thead>
                        <tbody class="divide-y divide-ink-100 dark:divide-ink-800">
                        @php $prevGroup = null; @endphp
                        @foreach ($rows as $i => $row)
                            @if ($type === 'summary' && ! $sort)
                                @php $g = ReportRunner::bucket($row->__group ?? null); @endphp
                                @if ($g !== $prevGroup)
                                    @php $prevGroup = $g; @endphp
                                    <tr class="!bg-ink-50/80 dark:!bg-ink-800/40">
                                        <td colspan="{{ count($def->columns) + 1 }}" class="!py-2">
                                            <span class="inline-flex items-center gap-2 text-xs">
                                                <x-heroicon-m-chevron-down class="h-3.5 w-3.5 text-brand-600" />
                                                <span class="text-ink-500">{{ $def->label($def->groupColumn) }}:</span>
                                                <span class="font-semibold text-ink-900 dark:text-white">{{ ReportFormatter::bucket($row->__group ?? null, $groupType) }}</span>
                                                @isset($groupCounts[$g])
                                                    <span class="badge badge-amber">{{ number_format($groupCounts[$g]['__count']) }} records</span>
                                                    @foreach ($aggCols as $alias => [$fn, $key])
                                                        <span class="text-ink-500">{{ ReportDefinition::AGGREGATE_LABELS[$fn] }} {{ $def->label($key) }}: <span class="font-medium text-ink-700 dark:text-ink-200">{{ ReportFormatter::number($groupCounts[$g][$alias]) }}</span></span>
                                                    @endforeach
                                                @endisset
                                            </span>
                                        </td>
                                    </tr>
                                @endif
                            @endif
                            <tr>
                                <td class="text-right text-xs tabular-nums text-ink-400">{{ number_format($rows->firstItem() + $loop->index) }}</td>
                                @foreach ($def->columns as $c)
                                    @php $val = ReportFormatter::cell($row->{ReportRunner::alias($c)} ?? null, $types[$c]); @endphp
                                    <td class="{{ $types[$c] === 'number' ? 'text-right tabular-nums' : '' }} max-w-xs truncate" @if (mb_strlen($val) > 40) title="{{ $val }}" @endif>{{ $val === '' ? '—' : $val }}</td>
                                @endforeach
                            </tr>
                        @endforeach
                        </tbody>
                        @if ($totals && $aggCols)
                            <tfoot class="border-t-2 border-ink-200 bg-ink-50 text-xs dark:border-ink-700 dark:bg-ink-800/60">
                            @foreach (ReportDefinition::AGGREGATE_LABELS as $fn => $fnLabel)
                                @continue(! $def->aggregates[$fn])
                                <tr>
                                    <td class="px-4 py-2 text-right font-semibold whitespace-nowrap text-ink-600 dark:text-ink-300">{{ $fnLabel }}</td>
                                    @foreach ($def->columns as $c)
                                        @php $alias = $fn.'__'.ReportRunner::alias($c); @endphp
                                        <td class="px-4 py-2 text-right font-semibold tabular-nums text-ink-800 dark:text-ink-100">{{ array_key_exists($alias, $totals['values']) ? ReportFormatter::number($totals['values'][$alias]) : '' }}</td>
                                    @endforeach
                                </tr>
                            @endforeach
                            </tfoot>
                        @endif
                    </table>
                </div>
                @if ($totals && collect($aggCols)->contains(fn ($a) => ! in_array($a[1], $def->columns, true)))
                    <div class="flex flex-wrap gap-x-6 gap-y-1 border-t border-ink-100 px-5 py-3 text-xs text-ink-500 dark:border-ink-800">
                        <span class="font-semibold text-ink-600 dark:text-ink-300">Totals of columns not displayed:</span>
                        @foreach ($aggCols as $alias => [$fn, $key])
                            @continue(in_array($key, $def->columns, true))
                            <span>{{ ReportDefinition::AGGREGATE_LABELS[$fn] }} {{ $def->label($key) }}: <strong class="text-ink-800 dark:text-ink-100">{{ ReportFormatter::number($totals['values'][$alias] ?? null) }}</strong></span>
                        @endforeach
                    </div>
                @endif
                <x-pagination-bar :paginator="$rows" />
            @endif
        </x-card>
    @endif

    {{-- Edit chart --}}
    @php
        $numeric = collect($def->availableColumns())->where('type', 'number');
        $measureOptions = ['count' => 'Record count'];
        foreach (ReportDefinition::AGGREGATE_LABELS as $fn => $fnLabel) {
            foreach ($numeric as $key => $col) { $measureOptions["$fn:$key"] = $fnLabel.' of '.$def->label($key); }
        }
        $columnOptions = collect($def->availableColumns())->mapWithKeys(fn ($c, $k) => [$k => $def->label($k)])->all();
        $chartCfg = $def->chart ?? ['type' => 'column', 'x_axis' => $def->groupColumn, 'measure' => 'count', 'series' => null];
    @endphp
    <x-modal name="chart-edit" title="Chart settings" maxWidth="lg">
        <form method="POST" action="{{ route('reports.chart.update', $report) }}" class="space-y-4" x-data="{ type: @js($chartCfg['type']) }">
            @csrf @method('PUT')
            <input type="hidden" name="type" :value="type">
            <div>
                <span class="form-label">Chart type</span>
                <div class="grid grid-cols-4 gap-2">
                    @foreach (ReportDefinition::CHART_TYPES as $k => $label)
                        <button type="button" @click="type = @js($k)" class="rounded-xl border px-2 py-2 text-xs font-medium transition"
                                :class="type === @js($k) ? 'border-brand-500 bg-brand-50 text-ink-900 ring-2 ring-brand-500/20 dark:bg-brand-500/10 dark:text-white' : 'border-ink-200 text-ink-600 hover:bg-ink-50 dark:border-ink-700 dark:text-ink-300 dark:hover:bg-ink-800'">{{ $label }}</button>
                    @endforeach
                </div>
            </div>
            <x-select name="x_axis" label="Category (X-axis)" :options="$columnOptions" :value="$chartCfg['x_axis']" :enhance="true" required />
            <x-select name="measure" label="Value (Y-axis)" :options="$measureOptions" :value="$chartCfg['measure']" :enhance="true" required />
            <div x-show="['column','bar','line','area'].includes(type)">
                <x-select name="series" label="Split into series by (optional)" :options="$columnOptions" :value="$chartCfg['series']" placeholder="— none —" :enhance="true" />
            </div>
            <div class="flex items-center justify-between gap-2 pt-2">
                @if ($def->chart)
                    <button name="enabled" value="0" class="btn btn-ghost text-rose-600"><x-heroicon-m-trash class="h-4 w-4" /> Remove chart</button>
                @else <span></span> @endif
                <div class="flex gap-2">
                    <button type="button" class="btn btn-secondary" @click="$dispatch('close-modal', 'chart-edit')">Cancel</button>
                    <button name="enabled" value="1" class="btn btn-brand">Save chart</button>
                </div>
            </div>
        </form>
    </x-modal>

    @if (! $error && $chart && $chart['labels'])
        @include('reports.partials.chart-script', ['chart' => $chart, 'canvas' => 'report-chart'])
    @endif
</x-layouts.app>