@extends('layouts.app')

@section('title', 'Gestão de Imóveis - Admin NT Imobi AI')

@section('content')
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">

    <div class="flex flex-col sm:flex-row justify-between items-start sm:items-center gap-4 mb-6">
        <div>
            <h1 class="text-2xl font-bold text-slate-900">Painel de Gestão de Imóveis</h1>
            <p class="text-sm text-slate-500">Controle de imóveis disponíveis, reservados, vendidos, alugados e visitas marcadas.</p>
        </div>
        <div class="flex gap-3">
            <a href="{{ route('admin.visits.index') }}" class="bg-slate-900 hover:bg-slate-800 text-white font-semibold px-4 py-2.5 rounded-md text-sm transition">
                📅 Ver Agenda de Visitas
            </a>
            <a href="{{ route('admin.properties.create') }}" class="bg-amber-500 hover:bg-amber-600 text-slate-950 font-bold px-5 py-2.5 rounded-md text-sm transition">
                + Cadastrar Novo Imóvel
            </a>
        </div>
    </div>

    <!-- Filtro Rápido do Admin -->
    <form action="{{ route('admin.properties.index') }}" method="GET" class="bg-white p-4 rounded-xl border border-slate-200 mb-6 flex flex-wrap gap-4 items-end">
        <div>
            <label class="block text-xs font-semibold text-slate-600 uppercase mb-1">Código</label>
            <input type="text" name="code" value="{{ request('code') }}" placeholder="Ex: AP101" class="rounded-md border border-slate-300 px-3 py-1.5 text-sm">
        </div>
        <div>
            <label class="block text-xs font-semibold text-slate-600 uppercase mb-1">Status</label>
            <select name="status" class="rounded-md border border-slate-300 px-3 py-1.5 text-sm">
                <option value="">Todos</option>
                <option value="disponivel" @selected(request('status') === 'disponivel')>Disponível</option>
                <option value="reservado" @selected(request('status') === 'reservado')>Reservado</option>
                <option value="vendido" @selected(request('status') === 'vendido')>Vendido</option>
                <option value="alugado" @selected(request('status') === 'alugado')>Alugado</option>
            </select>
        </div>
        <div>
            <label class="block text-xs font-semibold text-slate-600 uppercase mb-1">Tipo</label>
            <select name="property_type" class="rounded-md border border-slate-300 px-3 py-1.5 text-sm">
                <option value="">Todos</option>
                <option value="casa" @selected(request('property_type') === 'casa')>Casa</option>
                <option value="apartamento" @selected(request('property_type') === 'apartamento')>Apartamento</option>
                <option value="terreno" @selected(request('property_type') === 'terreno')>Terreno</option>
                <option value="fazenda" @selected(request('property_type') === 'fazenda')>Fazenda</option>
            </select>
        </div>
        <label class="flex items-center space-x-2 pb-1.5 cursor-pointer">
            <input type="checkbox" name="has_visit" value="1" @checked(request()->boolean('has_visit')) class="rounded text-amber-500">
            <span class="text-xs font-bold text-slate-700">Com visita marcada</span>
        </label>
        <button type="submit" class="bg-slate-900 text-white px-4 py-1.5 rounded-md text-sm font-semibold">Filtrar</button>
    </form>

    <!-- Tabela de Imóveis -->
    <div class="bg-white rounded-xl border border-slate-200 shadow-sm overflow-x-auto">
        <table class="w-full text-left border-collapse text-sm">
            <thead>
                <tr class="bg-slate-100 text-slate-600 uppercase text-xs border-b border-slate-200">
                    <th class="py-3 px-4">Foto / Pasta</th>
                    <th class="py-3 px-4">Código / Título</th>
                    <th class="py-3 px-4">Tipo / Negócio</th>
                    <th class="py-3 px-4">Preço</th>
                    <th class="py-3 px-4">Visitas / Leads</th>
                    <th class="py-3 px-4">Status Atual</th>
                    <th class="py-3 px-4 text-right">Ações</th>
                </tr>
            </thead>
            <tbody class="divide-y divide-slate-200">
                @forelse($properties as $property)
                    <tr class="hover:bg-slate-50">
                        <td class="py-3 px-4">
                            <div class="flex items-center gap-3">
                                @if($property->featured_image)
                                    <img src="{{ asset('storage/' . $property->featured_image) }}" class="w-14 h-10 object-cover rounded border" alt="Capa">
                                @else
                                    <div class="w-14 h-10 bg-slate-200 rounded flex items-center justify-center text-[10px] text-slate-500">Sem Capa</div>
                                @endif
                                <span class="text-[11px] font-mono bg-slate-100 px-2 py-0.5 rounded text-slate-600" title="Pasta de armazenamento">
                                    /{{ strtoupper($property->folder) }}
                                </span>
                            </div>
                        </td>
                        <td class="py-3 px-4">
                            <span class="font-bold text-slate-900">#{{ $property->code }}</span>
                            <div class="text-slate-700 font-medium line-clamp-1">{{ $property->title }}</div>
                            <div class="text-xs text-slate-500">{{ $property->neighborhood }} - {{ $property->city }}</div>
                        </td>
                        <td class="py-3 px-4 capitalize">
                            <span class="font-semibold">{{ $property->property_type }}</span>
                            <div class="text-xs text-slate-500">{{ $property->business_type }}</div>
                        </td>
                        <td class="py-3 px-4 font-bold text-slate-900">
                            R$ {{ number_format($property->price, 2, ',', '.') }}
                        </td>
                        <td class="py-3 px-4 space-y-1">
                            @if($property->scheduled_visits_count > 0)
                                @php $nextVisit = $property->upcomingVisits->first(); @endphp
                                <a href="{{ route('admin.visits.index', ['code' => $property->code]) }}" class="block bg-amber-100 border border-amber-300 text-amber-900 text-xs font-bold px-2.5 py-1 rounded">
                                    📅 {{ $property->scheduled_visits_count }} visita(s)
                                    @if($nextVisit)
                                        <span class="block text-[10px] font-normal">Próx: {{ $nextVisit->scheduled_at->format('d/m H:i') }}</span>
                                    @endif
                                </a>
                            @else
                                <span class="inline-block text-xs text-slate-400">Sem visita marcada</span>
                            @endif

                            <div>
                                <span class="inline-flex items-center px-2 py-0.5 rounded text-[11px] font-semibold {{ $property->leads_count > 0 ? 'bg-slate-200 text-slate-800' : 'text-slate-400' }}">
                                    ✉️ {{ $property->leads_count }} lead(s)
                                </span>
                            </div>
                        </td>
                        <td class="py-3 px-4">
                            <form action="{{ route('admin.properties.status', $property->id) }}" method="POST">
                                @csrf
                                @method('PATCH')
                                <select 
                                    name="status" 
                                    onchange="this.form.submit()" 
                                    class="text-xs font-bold rounded px-2.5 py-1 border
                                    {{ $property->status === 'disponivel' ? 'bg-emerald-50 text-emerald-700 border-emerald-300' : '' }}
                                    {{ $property->status === 'reservado' ? 'bg-amber-50 text-amber-700 border-amber-300' : '' }}
                                    {{ $property->status === 'vendido' ? 'bg-red-50 text-red-700 border-red-300' : '' }}
                                    {{ $property->status === 'alugado' ? 'bg-blue-50 text-blue-700 border-blue-300' : '' }}"
                                >
                                    <option value="disponivel" @selected($property->status === 'disponivel')>Disponível</option>
                                    <option value="reservado" @selected($property->status === 'reservado')>Reservado</option>
                                    <option value="vendido" @selected($property->status === 'vendido')>Vendido</option>
                                    <option value="alugado" @selected($property->status === 'alugado')>Alugado</option>
                                </select>
                            </form>
                        </td>
                        <td class="py-3 px-4 text-right space-x-2">
                            <a href="{{ route('site.properties.show', $property->slug) }}" target="_blank" class="text-xs text-slate-600 hover:text-slate-900 underline">Ver</a>
                            <a href="{{ route('admin.properties.edit', $property->id) }}" class="text-xs bg-slate-200 hover:bg-slate-300 text-slate-800 px-3 py-1 rounded font-semibold">Editar</a>
                            <form action="{{ route('admin.properties.destroy', $property->id) }}" method="POST" class="inline" onsubmit="return confirm('Tem certeza que deseja excluir o imóvel #{{ $property->code }} e toda a pasta de fotos?')">
                                @csrf
                                @method('DELETE')
                                <button type="submit" class="text-xs bg-red-100 hover:bg-red-200 text-red-700 px-2.5 py-1 rounded font-semibold">Excluir</button>
                            </form>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="7" class="py-8 text-center text-slate-500">Nenhum imóvel cadastrado.</td>
                    </tr>
                @endforelse
            </tbody>
        </table>
    </div>

    <div class="mt-6">
        {{ $properties->links() }}
    </div>
</div>
@endsection