@extends('layouts.app')

@section('title', 'Food Cost')

@section('content')
    @php
        $money = fn ($v) => \App\Support\Fmt::money($v);
        $num = fn ($v) => \App\Support\Fmt::plain($v, 2);
        $signedMoney = fn ($v) => \App\Support\Fmt::signedMoney($v);
        $bandMeaning = [
            'Healthy' => 'Variance within 2%',
            'Watch' => 'Variance between 2% and 5%',
            'Flagged' => 'Variance above 5%',
        ];
        $sortLink = function (string $key) use ($period, $band, $sort, $dir) {
            return route('kitchen.food-cost', [
                'period' => $period,
                'band' => $band,
                'sort' => $key,
                'dir' => ($sort === $key && $dir === 'desc') ? 'asc' : 'desc',
            ]);
        };
        $sortHead = function (string $key, string $label, bool $right = true) use ($sort, $dir, $sortLink) {
            return '<th class="px-4 py-2 '.($right ? 'text-right' : 'text-left').' font-medium">'
                .'<a href="'.$sortLink($key).'" class="hover:text-primary">'.$label.' '
                .($sort === $key ? ($dir === 'asc' ? '&uarr;' : '&darr;') : '').'</a></th>';
        };
    @endphp
    <div class="flex flex-col gap-6">
        <div class="flex flex-wrap items-end justify-between gap-3">
            <div>
                <p class="text-xs font-medium text-muted-foreground">Theoretical against actual usage, banded by variance</p>
                <h1 class="text-lg font-semibold">Food Cost</h1>
            </div>
            <div class="flex flex-wrap items-end gap-2">
                <form method="get" action="{{ route('kitchen.food-cost') }}" class="flex flex-wrap items-end gap-2">
                    <div>
                        <label class="mb-1 block text-xs">Period</label>
                        <select name="period" onchange="this.form.submit()"
                                class="h-9 w-52 rounded-lg border border-input bg-transparent px-3 text-sm outline-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50">
                            @foreach ($periods as $key => $meta)
                                <option value="{{ $key }}" @selected($period === $key)>{{ $meta['label'] }} &mdash; {{ $meta['days'] }} days</option>
                            @endforeach
                        </select>
                    </div>
                    <input type="hidden" name="band" value="{{ $band }}">
                    <input type="hidden" name="sort" value="{{ $sort }}">
                    <input type="hidden" name="dir" value="{{ $dir }}">
                </form>
                <a href="{{ route('kitchen.food-cost.csv') }}"
                   class="flex h-9 items-center rounded-lg border border-border px-3 text-sm hover:bg-accent">CSV</a>
            </div>
        </div>

        @include('partials.flashes')

        <div class="flex flex-wrap items-center gap-4 rounded-xl border border-border bg-card px-4 py-3">
            <div class="flex flex-col">
                <span class="text-xs text-muted-foreground">Period</span>
                <span class="text-sm font-semibold">{{ $periods[$period]['label'] }}</span>
                <span class="text-xs text-muted-foreground">{{ $periods[$period]['days'] }} service days</span>
            </div>
            <div class="flex flex-col">
                <span class="text-xs text-muted-foreground">Should have cost</span>
                <span class="text-sm font-semibold tabular-nums">{{ $money($totals['should']) }}</span>
            </div>
            <div class="flex flex-col">
                <span class="text-xs text-muted-foreground">Did cost</span>
                <span class="text-sm font-semibold tabular-nums">{{ $money($totals['did']) }}</span>
            </div>
            <div class="flex flex-col">
                <span class="text-xs text-muted-foreground">Difference</span>
                <span class="text-sm font-semibold tabular-nums {{ $totals['diff'] > 0 ? 'text-rose-600' : 'text-emerald-600' }}">
                    {{ $signedMoney($totals['diff']) }}
                </span>
            </div>
            <div class="flex flex-col">
                <span class="text-xs text-muted-foreground">Cost per child per day</span>
                <span class="text-sm font-semibold tabular-nums">{{ $money($totals['perChild']) }}</span>
            </div>
            <div class="ml-auto flex flex-wrap gap-1 rounded-lg border border-border p-1">
                @foreach (['all' => 'All', 'Healthy' => 'Healthy', 'Watch' => 'Watch', 'Flagged' => 'Flagged'] as $key => $label)
                    <a href="{{ route('kitchen.food-cost', ['period' => $period, 'band' => $key, 'sort' => $sort, 'dir' => $dir]) }}"
                       class="rounded-md px-2.5 py-1 text-xs transition-colors {{ $band === $key ? 'bg-accent font-medium text-accent-foreground' : 'text-muted-foreground hover:bg-accent' }}">
                        {{ $label }} <span class="tabular-nums">({{ $bandCounts[$key] }})</span>
                    </a>
                @endforeach
            </div>
        </div>

        <div class="rounded-xl border border-border bg-card">
            <div class="flex flex-wrap items-center justify-between gap-2 border-b border-border px-4 py-3">
                <h2 class="text-sm font-medium">Theoretical vs actual by item</h2>
                <div class="flex flex-wrap gap-3 text-[11px] text-muted-foreground">
                    @foreach ($bands as $b)
                        <span class="inline-flex items-center gap-1">
                            @include('kitchen.partials.band', ['band' => $b])
                            <span>{{ $bandMeaning[$b] }}</span>
                        </span>
                    @endforeach
                </div>
            </div>
            <div class="overflow-x-auto">
                <table class="w-full text-sm">
                    <thead>
                        <tr class="border-b border-border text-left text-xs text-muted-foreground">
                            {!! $sortHead('item', 'Item', false) !!}
                            {!! $sortHead('theoretical', 'Theoretical') !!}
                            {!! $sortHead('actual', 'Actual') !!}
                            {!! $sortHead('variance', 'Variance') !!}
                            {!! $sortHead('variancePct', 'Variance %') !!}
                            {!! $sortHead('should_cost', 'Should have cost') !!}
                            {!! $sortHead('did_cost', 'Did cost') !!}
                            {!! $sortHead('diff', 'Difference') !!}
                            {!! $sortHead('band', 'Band', false) !!}
                        </tr>
                    </thead>
                    <tbody>
                        @forelse ($rows as $row)
                            <tr class="border-b border-border/60 last:border-0">
                                <td class="px-4 py-2 font-medium">{{ $row['item'] }}</td>
                                <td class="px-4 py-2 text-right tabular-nums">{{ $num($row['theoretical']) }}</td>
                                <td class="px-4 py-2 text-right tabular-nums">{{ $num($row['actual']) }}</td>
                                <td class="px-4 py-2 text-right font-medium tabular-nums {{ $row['variance'] > 0 ? 'text-rose-600' : 'text-emerald-600' }}">
                                    {{ $row['variance'] > 0 ? '+' : '' }}{{ $num($row['variance']) }}
                                </td>
                                <td class="px-4 py-2 text-right tabular-nums">{{ $num($row['variancePct'], 1) }}%</td>
                                <td class="px-4 py-2 text-right tabular-nums">{{ $money($row['should_cost']) }}</td>
                                <td class="px-4 py-2 text-right tabular-nums">{{ $money($row['did_cost']) }}</td>
                                <td class="px-4 py-2 text-right font-medium tabular-nums {{ $row['diff'] > 0 ? 'text-rose-600' : 'text-emerald-600' }}">
                                    {{ $signedMoney($row['diff']) }}
                                </td>
                                <td class="px-4 py-2">@include('kitchen.partials.band', ['band' => $row['band']])</td>
                            </tr>
                        @empty
                            <tr><td colspan="9" class="px-4 py-8 text-center text-muted-foreground">No items in this band.</td></tr>
                        @endforelse
                    </tbody>
                    @if ($rows->isNotEmpty())
                        <tfoot>
                            <tr class="border-t border-border bg-muted/30 text-sm font-semibold">
                                <td class="px-4 py-2">Totals ({{ $band === 'all' ? 'all bands' : $band }})</td>
                                <td class="px-4 py-2 text-right tabular-nums">{{ $num($rows->sum('theoretical')) }}</td>
                                <td class="px-4 py-2 text-right tabular-nums">{{ $num($rows->sum('actual')) }}</td>
                                <td class="px-4 py-2 text-right tabular-nums">{{ $num($rows->sum('variance')) }}</td>
                                <td class="px-4 py-2"></td>
                                <td class="px-4 py-2 text-right tabular-nums">{{ $money($rows->sum('should_cost')) }}</td>
                                <td class="px-4 py-2 text-right tabular-nums">{{ $money($rows->sum('did_cost')) }}</td>
                                <td class="px-4 py-2 text-right tabular-nums">{{ $signedMoney($rows->sum('diff')) }}</td>
                                <td class="px-4 py-2"></td>
                            </tr>
                        </tfoot>
                    @endif
                </table>
            </div>
        </div>
    </div>
@endsection