{{--
    The conversation about one difference, as a conversation.

    It reads as a chat because that is what it is: she says what she thinks
    happened, a director asks something back, she answers, somebody rules on it.
    Written out as "You said / They asked" it stopped being clear whose words
    were whose the moment a third person opened the page — a director reading
    "you said" was reading the cashier's words in the second person. Faces and
    names carry that without a single label.

    Everyone has a picture: the fallback is initials drawn locally as a data URI,
    so nothing here depends on an upload or an outside service.

    Expects: $line (with reconciliation.performer, querier, reviewer).
    Optional: $compact, for tight spaces like a table cell.
--}}
@php
    $me = auth()->id();
    $tz = config('app.display_timezone');
    $performer = $line->reconciliation?->performer;
    $decided = in_array($line->reason_status, ['approved', 'rejected'], true);

    // Oldest first, the way a thread reads. The explanation is the opening
    // message even after a correction rewrote it: it is still her account of
    // the day, and the reply below it is what she said when she changed it.
    $messages = [];

    if (filled($line->reason)) {
        $messages[] = [
            'user' => $performer,
            'at' => $line->reconciliation?->submitted_at,
            'text' => $line->reason,
            'label' => null,
            'tone' => 'plain',
        ];
    }

    if (filled($line->query_note)) {
        $messages[] = [
            'user' => $line->querier,
            'at' => $line->queried_at,
            'text' => $line->query_note,
            'label' => __('Sent it back'),
            'tone' => 'query',
        ];
    }

    if (filled($line->reply_note)) {
        $messages[] = [
            'user' => $performer,
            'at' => $line->replied_at,
            'text' => $line->reply_note,
            'label' => null,
            'tone' => 'plain',
        ];
    }

    if ($decided) {
        $messages[] = [
            'user' => $line->reviewer,
            'at' => $line->reviewed_at,
            'text' => $line->review_note,
            'label' => $line->reason_status === 'approved' ? __('Approved') : __('Rejected'),
            'tone' => $line->reason_status === 'approved' ? 'approved' : 'rejected',
        ];
    }
@endphp

@if ($messages !== [])
    <div @class(['space-y-2.5' => ! ($compact ?? false), 'space-y-1.5' => $compact ?? false])>
        @foreach ($messages as $m)
            @php
                $user = $m['user'];
                $mine = $user && $user->id === $me;
                $size = ($compact ?? false) ? 'h-6 w-6' : 'h-8 w-8';
            @endphp

            <div @class([
                'flex items-start gap-2.5',
                'flex-row-reverse' => $mine && ! ($compact ?? false),
            ])>
                @if ($user)
                    <img src="{{ $user->profile_photo_url }}" alt="{{ $user->name }}"
                        class="{{ $size }} shrink-0 rounded-full object-cover ring-1 ring-slate-200" />
                @else
                    <span class="{{ $size }} flex shrink-0 items-center justify-center rounded-full bg-slate-100 text-[10px] font-semibold text-slate-500">?</span>
                @endif

                <div @class(['min-w-0 flex-1', 'text-right' => $mine && ! ($compact ?? false)])>
                    <p class="flex flex-wrap items-baseline gap-x-1.5 text-[11px] {{ $mine && ! ($compact ?? false) ? 'justify-end' : '' }}">
                        <span class="font-semibold text-slate-600">{{ $user?->name ?? __('Someone') }}</span>
                        @if ($m['label'])
                            <span @class([
                                'rounded-full px-1.5 py-px text-[10px] font-semibold',
                                'bg-sky-100 text-sky-700' => $m['tone'] === 'query',
                                'bg-emerald-100 text-emerald-700' => $m['tone'] === 'approved',
                                'bg-rose-100 text-rose-700' => $m['tone'] === 'rejected',
                            ])>{{ $m['label'] }}</span>
                        @endif
                        @if ($m['at'])
                            <span class="text-slate-400">{{ $m['at']->timezone($tz)->format('d M H:i') }}</span>
                        @endif
                    </p>

                    @if (filled($m['text']))
                        <div @class([
                            'mt-1 inline-block max-w-full rounded-2xl px-3 py-2 text-sm',
                            'rounded-tr-sm bg-indigo-50 text-indigo-900' => $mine,
                            'rounded-tl-sm bg-slate-100 text-slate-700' => ! $mine,
                            'px-2.5 py-1.5 text-xs' => $compact ?? false,
                        ])>{{ $m['text'] }}</div>
                    @endif
                </div>
            </div>
        @endforeach
    </div>
@endif