@extends('layouts.app')

@section('title', 'Dashboard')

@section('topbar-actions')
    <form method="POST" action="{{ route('leads.sync') }}" style="display:inline;">
        @csrf
        <button type="submit" class="btn btn-primary">↻ Sync Now</button>
    </form>
@endsection

@section('content')
<div class="grid grid-4 mb-4">
    <div class="stat-card blue">
        <div class="stat-label">Total Leads</div>
        <div class="stat-value">{{ number_format($stats['total_leads']) }}</div>
    </div>
    <div class="stat-card green">
        <div class="stat-label">Phone Calls</div>
        <div class="stat-value">{{ number_format($stats['total_calls']) }}</div>
    </div>
    <div class="stat-card amber">
        <div class="stat-label">Messages</div>
        <div class="stat-value">{{ number_format($stats['total_messages']) }}</div>
    </div>
    <div class="stat-card violet">
        <div class="stat-label">Bookings</div>
        <div class="stat-value">{{ number_format($stats['total_bookings']) }}</div>
    </div>
</div>

@if(!$stats['connected'])
<div class="alert alert-info" style="margin-bottom: 24px;">
    ⚠️ Google account not connected. <a href="{{ route('auth.google.redirect') }}">Connect Google LSA</a> to start syncing leads.
</div>
@endif

<div class="card">
    <div class="section-header">
        <div class="section-title">Recent Leads</div>
        <a href="{{ route('leads.index') }}" class="btn btn-secondary btn-sm">View All</a>
    </div>
    @if($recentLeads->isEmpty())
        <p class="text-muted">No leads yet. Connect your Google LSA account and sync to see leads here.</p>
    @else
    <div class="table-wrap">
        <table>
            <thead>
                <tr>
                    <th>Consumer</th>
                    <th>Type</th>
                    <th>Status</th>
                    <th>Business</th>
                    <th>Date</th>
                    <th></th>
                </tr>
            </thead>
            <tbody>
                @foreach($recentLeads as $lead)
                <tr>
                    <td>
                        <div class="font-semibold">{{ $lead->consumer_name ?? 'Unknown' }}</div>
                        <div class="text-muted">{{ $lead->consumer_phone_number }}</div>
                    </td>
                    <td>
                        @if($lead->isCall())
                            <span class="badge badge-blue">📞 Call</span>
                        @elseif($lead->isMessage())
                            <span class="badge badge-green">💬 Message</span>
                        @elseif($lead->isBooking())
                            <span class="badge badge-violet">📅 Booking</span>
                        @else
                            <span class="badge badge-gray">{{ $lead->lead_type }}</span>
                        @endif
                    </td>
                    <td>
                        @php
                            $statusColors = ['NEW'=>'blue','ACTIVE'=>'green','BOOKED'=>'violet','DECLINED'=>'red','EXPIRED'=>'gray','DISABLED'=>'gray'];
                            $color = $statusColors[$lead->lead_status] ?? 'gray';
                        @endphp
                        <span class="badge badge-{{ $color }}">{{ $lead->lead_status }}</span>
                    </td>
                    <td>{{ $lead->business_name ?? '—' }}</td>
                    <td class="text-muted">{{ $lead->lead_created_at?->diffForHumans() ?? '—' }}</td>
                    <td><a href="{{ route('leads.show', $lead) }}" class="btn btn-secondary btn-sm">View</a></td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
    @endif
</div>
@endsection