@extends('layouts.app')

@section('title', 'Kanban — ImóvelZapAi')
@section('page-title', 'Funil de oportunidades')

@section('content')
    @include('partials.flash')

    <div class="mb-4 flex items-center justify-between">
        <p class="text-slate-600">Arraste mentalmente: avance o estágio no detalhe da oportunidade.</p>
        <a href="{{ route('sales.index') }}" class="text-sm text-emerald-700 hover:underline">Lista</a>
    </div>

    <div class="flex gap-3 overflow-x-auto pb-4">
        @foreach ($board['columns'] as $column)
            <div class="w-72 shrink-0 rounded-xl border border-slate-200 bg-slate-50">
                <div class="border-b border-slate-200 px-3 py-2">
                    <p class="text-sm font-semibold text-slate-800">{{ $column['name'] }}</p>
                    <p class="text-xs text-slate-500">{{ count($column['cards']) }}</p>
                </div>
                <div class="space-y-2 p-2">
                    @forelse ($column['cards'] as $card)
                        <a href="{{ route('sales.show', $card['id']) }}" class="block rounded-lg border border-slate-200 bg-white p-3 shadow-sm hover:border-emerald-300">
                            <p class="text-sm font-semibold text-slate-900">{{ $card['contact'] ?? $card['title'] }}</p>
                            <p class="mt-1 text-xs text-slate-500">{{ $card['property'] ?? 'Sem imóvel' }}</p>
                            <p class="mt-1 text-xs text-slate-600">
                                {{ $card['amount'] !== null ? 'R$ '.number_format((float) $card['amount'], 0, ',', '.') : '—' }}
                                · {{ $card['responsible'] ?? '—' }}
                            </p>
                            <p class="mt-2 text-xs text-amber-700">
                                @if ($card['next_action_at'])
                                    Próxima: {{ \Illuminate\Support\Carbon::parse($card['next_action_at'])->format('d/m H:i') }}
                                @else
                                    Sem próxima ação
                                @endif
                            </p>
                            @if ($card['stalled_hours'] !== null && $card['stalled_hours'] >= 24)
                                <p class="mt-1 text-xs text-red-600">Parado {{ $card['stalled_hours'] }}h</p>
                            @endif
                        </a>
                    @empty
                        <p class="px-2 py-6 text-center text-xs text-slate-400">Vazio</p>
                    @endforelse
                </div>
            </div>
        @endforeach
    </div>
@endsection
