@extends('provider.layout')
@section('title', 'Real Estate Dashboard')

@section('content')
<div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin-bottom:2rem">
    @php
    $cards = [
        ['label'=>'Total Listings',  'value'=>$stats['total'],    'icon'=>'building-2',     'color'=>'#1e3a5f'],
        ['label'=>'Active',          'value'=>$stats['active'],   'icon'=>'check-circle',   'color'=>'#16a34a'],
        ['label'=>'Pending Review',  'value'=>$stats['pending'],  'icon'=>'clock',          'color'=>'#d97706'],
        ['label'=>'Total Views',     'value'=>number_format($stats['views']), 'icon'=>'eye','color'=>'#0d9488'],
        ['label'=>'Inquiries',       'value'=>$stats['inquiries'],'icon'=>'message-circle', 'color'=>'#7c3aed'],
    ];
    @endphp
    @foreach($cards as $card)
    <div style="background:white;border-radius:0.875rem;padding:1.25rem;border:1px solid rgba(30,58,95,0.08);box-shadow:0 2px 8px rgba(30,58,95,0.06)">
        <div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:0.875rem">
            <span style="font-size:0.8125rem;font-weight:600;color:#64748b">{{ $card['label'] }}</span>
            <div style="width:36px;height:36px;border-radius:0.625rem;background:{{ $card['color'] }}1a;display:flex;align-items:center;justify-content:center">
                <i data-lucide="{{ $card['icon'] }}" style="width:18px;height:18px;color:{{ $card['color'] }}"></i>
            </div>
        </div>
        <div style="font-size:1.75rem;font-weight:800;color:#0f172a">{{ $card['value'] }}</div>
    </div>
    @endforeach
</div>

<div style="display:grid;grid-template-columns:1fr 1fr;gap:1.5rem">
    {{-- Recent Listings --}}
    <div style="background:white;border-radius:0.875rem;border:1px solid rgba(30,58,95,0.08);overflow:hidden;box-shadow:0 2px 8px rgba(30,58,95,0.06)">
        <div style="padding:1.125rem 1.25rem;border-bottom:1px solid rgba(30,58,95,0.08);display:flex;justify-content:space-between;align-items:center">
            <h3 style="font-size:0.9375rem;font-weight:700;color:#0f172a">Recent Listings</h3>
            <a href="{{ route('provider.re.listings.index') }}" style="font-size:0.8125rem;color:#0d9488;font-weight:600">View all →</a>
        </div>
        @forelse($recent as $p)
        <div style="padding:0.875rem 1.25rem;border-bottom:1px solid rgba(30,58,95,0.05);display:flex;align-items:center;gap:0.875rem">
            <div style="width:40px;height:40px;border-radius:0.5rem;overflow:hidden;flex-shrink:0;background:#f1f5f9">
                <img src="{{ $p->featured_image_url }}" alt="" style="width:100%;height:100%;object-fit:cover">
            </div>
            <div style="flex:1;min-width:0">
                <div style="font-size:0.875rem;font-weight:600;color:#0f172a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis">{{ $p->title }}</div>
                <div style="font-size:0.75rem;color:#64748b">{{ $p->city }} · {{ $p->formatted_price }}</div>
            </div>
            <span style="font-size:0.7rem;padding:0.2rem 0.6rem;border-radius:9999px;font-weight:700;
                background:{{ $p->status === 'active' ? 'rgba(34,197,94,0.12)' : ($p->status === 'pending' ? 'rgba(245,158,11,0.12)' : 'rgba(239,68,68,0.12)') }};
                color:{{ $p->status === 'active' ? '#16a34a' : ($p->status === 'pending' ? '#d97706' : '#dc2626') }}">
                {{ ucfirst($p->status) }}
            </span>
        </div>
        @empty
        <div style="padding:2rem;text-align:center;color:#64748b;font-size:0.875rem">
            No listings yet. <a href="{{ route('provider.re.listings.create') }}" style="color:#0d9488">Add your first property →</a>
        </div>
        @endforelse
    </div>

    {{-- Recent Inquiries --}}
    <div style="background:white;border-radius:0.875rem;border:1px solid rgba(30,58,95,0.08);overflow:hidden;box-shadow:0 2px 8px rgba(30,58,95,0.06)">
        <div style="padding:1.125rem 1.25rem;border-bottom:1px solid rgba(30,58,95,0.08);display:flex;justify-content:space-between;align-items:center">
            <h3 style="font-size:0.9375rem;font-weight:700;color:#0f172a">Recent Inquiries</h3>
            <a href="{{ route('provider.re.inquiries') }}" style="font-size:0.8125rem;color:#0d9488;font-weight:600">View all →</a>
        </div>
        @forelse($recentInquiries as $conv)
        <div style="padding:0.875rem 1.25rem;border-bottom:1px solid rgba(30,58,95,0.05);display:flex;align-items:center;gap:0.75rem">
            <div style="width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#1e3a5f,#0d9488);color:white;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:0.875rem;flex-shrink:0">
                {{ strtoupper(substr($conv->sender->name ?? 'U', 0, 1)) }}
            </div>
            <div style="flex:1;min-width:0">
                <div style="font-size:0.875rem;font-weight:600;color:#0f172a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis">{{ $conv->subject ?? 'Property Inquiry' }}</div>
                <div style="font-size:0.75rem;color:#64748b">{{ $conv->sender->name ?? 'Customer' }}</div>
            </div>
            <a href="{{ route('provider.messages.show', $conv->id) }}" style="font-size:0.75rem;color:#0d9488;font-weight:600">Reply →</a>
        </div>
        @empty
        <div style="padding:2rem;text-align:center;color:#64748b;font-size:0.875rem">No inquiries yet</div>
        @endforelse
    </div>
</div>

<div style="margin-top:1.5rem;text-align:center">
    <a href="{{ route('provider.re.listings.create') }}" style="display:inline-flex;align-items:center;gap:0.5rem;background:linear-gradient(135deg,#1e3a5f,#0d9488);color:white;padding:0.75rem 1.75rem;border-radius:0.875rem;font-weight:700;font-size:0.9375rem;text-decoration:none">
        <i data-lucide="plus" style="width:18px;height:18px"></i> Add New Property
    </a>
</div>
@endsection