{{--
    One counted figure in the cash-up history table: the amount that was counted
    as the headline, with how far it was out as a small line underneath. Balanced
    cells carry nothing extra so a difference stands out on its own.

    amount   — what was counted (null when this count was never taken, e.g. a
               cash-up recorded before the day's takings were asked for)
    variance — counted minus expected in the account's currency (null = unknown)
    legacy   — the figure is a day's NET movement, from before the count asked
               for money in. Marked so it is not read as money in.
--}}
@props(['amount' => null, 'variance' => null, 'legacy' => false])

@php
    $out = $variance !== null && abs((float) $variance) >= 0.005;
    $short = $out && (float) $variance < 0;
@endphp

@if ($amount === null)
    <span class="text-slate-300">—</span>
@else
    <div class="inline-flex flex-col items-end leading-tight">
        <span class="inline-flex items-baseline gap-1">
            @if ($legacy)
                {{-- Counted on the old basis. A dotted mark rather than a badge:
                     it should be noticed on a second look, not shout down the
                     figure it belongs to. --}}
                <span class="cursor-help text-[10px] font-semibold text-slate-400"
                    title="{{ __('Counted before the day figure meant money in. On this row it is the day\'s net, after what was paid out or moved on.') }}">†</span>
            @endif
            <span @class([
                'tabular-nums',
                'text-slate-600' => ! $out,
                'font-semibold text-slate-800' => $out,
            ])>{{ number_format((float) $amount, 2) }}</span>
        </span>
        @if ($out)
            <span @class([
                'mt-0.5 text-[11px] font-semibold tabular-nums',
                'text-rose-600' => $short,
                'text-amber-600' => ! $short,
            ])>{{ $short ? '−' : '+' }}{{ number_format(abs((float) $variance), 2) }}</span>
        @endif
    </div>
@endif