@extends('layouts.app')
@section('title', 'Deal rooms')

@section('content')
<h1 class="text-xl font-bold">Deal rooms</h1>
<div class="mt-4 space-y-3">
    @forelse ($deals as $deal)
        <a href="{{ route('deals.show', $deal) }}" class="flex flex-wrap items-center justify-between gap-3 rounded-lg border border-slate-200 bg-white p-4 text-sm hover:border-crimson">
            <div>
                <p class="font-semibold">{{ $deal->reference }} · {{ number_format($deal->volume_mt) }} MT {{ $deal->productLabel() }}</p>
                <p class="text-xs text-slate-500">{{ $deal->seller->company_name }} → {{ $deal->buyer->company_name }} · USD {{ number_format($deal->total_value_usd, 2) }}</p>
            </div>
            <span class="rounded-full bg-slate-100 px-2 py-0.5 text-xs font-semibold uppercase">{{ str_replace('_', ' ', $deal->stage) }}</span>
        </a>
    @empty
        <p class="rounded-lg border border-dashed border-slate-300 bg-white p-8 text-center text-sm text-slate-500">No deals yet.</p>
    @endforelse
</div>
<div class="mt-6">{{ $deals->links() }}</div>
@endsection