@php
    $isEdit = isset($property);
    $currentType = old('property_type', $isEdit ? $property->property_type : 'casa');
    $details = old('details', $isEdit ? ($property->details ?? []) : []);
    $publishPortals = old('publish_portals', $isEdit ? $property->publish_portals : true);
@endphp

<div x-data="{ propertyType: '{{ $currentType }}' }" class="space-y-8">

    <!-- Seção 1: Identificação e Tipo -->
    <div class="bg-white p-6 rounded-xl border border-slate-200 shadow-sm">
        <h2 class="text-lg font-bold text-slate-900 mb-4 border-b pb-2">1. Identificação e Classificação</h2>
        <div class="grid grid-cols-1 md:grid-cols-4 gap-4">
            <div>
                <label class="block text-xs font-bold text-slate-700 uppercase mb-1">Código do Imóvel (Pasta) *</label>
                <input type="text" name="code" value="{{ old('code', $property->code ?? '') }}" placeholder="Ex: AP101, CS202, FAZ001" required class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm uppercase font-mono">
                <span class="text-[11px] text-slate-500">As fotos serão salvas na pasta deste código.</span>
            </div>

            <div>
                <label class="block text-xs font-bold text-slate-700 uppercase mb-1">Tipo de Imóvel *</label>
                <select name="property_type" x-model="propertyType" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm font-semibold bg-amber-50/40">
                    <option value="casa">Casa</option>
                    <option value="apartamento">Apartamento</option>
                    <option value="terreno">Terreno</option>
                    <option value="fazenda">Fazenda / Sítio</option>
                </select>
            </div>

            <div>
                <label class="block text-xs font-bold text-slate-700 uppercase mb-1">Finalidade *</label>
                <select name="business_type" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
                    <option value="venda" @selected(old('business_type', $property->business_type ?? '') === 'venda')>Venda</option>
                    <option value="aluguel" @selected(old('business_type', $property->business_type ?? '') === 'aluguel')>Aluguel</option>
                </select>
            </div>

            <div>
                <label class="block text-xs font-bold text-slate-700 uppercase mb-1">Status *</label>
                <select name="status" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
                    <option value="disponivel" @selected(old('status', $property->status ?? 'disponivel') === 'disponivel')>Disponível</option>
                    <option value="reservado" @selected(old('status', $property->status ?? '') === 'reservado')>Reservado</option>
                    <option value="vendido" @selected(old('status', $property->status ?? '') === 'vendido')>Vendido</option>
                    <option value="alugado" @selected(old('status', $property->status ?? '') === 'alugado')>Alugado</option>
                </select>
            </div>

            <div class="md:col-span-3">
                <label class="block text-xs font-bold text-slate-700 uppercase mb-1">Título do Anúncio *</label>
                <input type="text" name="title" value="{{ old('title', $property->title ?? '') }}" placeholder="Ex: Casa Duplex com Piscina ou Fazenda Produtiva com Lagoa" required class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
            </div>

            <div class="flex items-end pb-2">
                <label class="flex items-center space-x-2 cursor-pointer">
                    <input type="checkbox" name="publish_portals" value="1" @checked($publishPortals) class="rounded text-amber-500">
                    <span class="text-xs font-bold text-slate-800">Exportar para Portais (XML)</span>
                </label>
            </div>
        </div>
    </div>

    <!-- Seção 2: Valores e Localização -->
    <div class="bg-white p-6 rounded-xl border border-slate-200 shadow-sm">
        <h2 class="text-lg font-bold text-slate-900 mb-4 border-b pb-2">2. Localização e Valores</h2>
        <div class="grid grid-cols-1 md:grid-cols-3 gap-4">
            <div>
                <label class="block text-xs font-bold text-slate-700 uppercase mb-1">Cidade *</label>
                <input type="text" name="city" value="{{ old('city', $property->city ?? '') }}" required class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
            </div>
            <div>
                <label class="block text-xs font-bold text-slate-700 uppercase mb-1">Bairro / Região *</label>
                <input type="text" name="neighborhood" value="{{ old('neighborhood', $property->neighborhood ?? '') }}" required class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
            </div>
            <div>
                <label class="block text-xs font-bold text-slate-700 uppercase mb-1">Endereço / Referência</label>
                <input type="text" name="address" value="{{ old('address', $property->address ?? '') }}" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
            </div>

            <div>
                <label class="block text-xs font-bold text-slate-700 uppercase mb-1">Preço Principal (R$) *</label>
                <input type="number" step="0.01" name="price" value="{{ old('price', $property->price ?? '') }}" required class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
            </div>
            <div>
                <label class="block text-xs font-bold text-slate-700 uppercase mb-1">Taxa de Condomínio (R$)</label>
                <input type="number" step="0.01" name="condo_fee" value="{{ old('condo_fee', $property->condo_fee ?? '') }}" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
            </div>
            <div>
                <label class="block text-xs font-bold text-slate-700 uppercase mb-1">IPTU (R$)</label>
                <input type="number" step="0.01" name="tax_fee" value="{{ old('tax_fee', $property->tax_fee ?? '') }}" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
            </div>
        </div>
    </div>

    <!-- Seção 3: Características Dinâmicas conforme o Tipo Selecionado -->
    <div class="bg-white p-6 rounded-xl border border-slate-200 shadow-sm">
        <h2 class="text-lg font-bold text-slate-900 mb-4 border-b pb-2">
            3. Características Específicas (<span class="capitalize text-amber-600" x-text="propertyType"></span>)
        </h2>

        <!-- BLOCO A: CASA OU APARTAMENTO -->
        <div x-show="propertyType === 'casa' || propertyType === 'apartamento'" x-cloak class="grid grid-cols-2 md:grid-cols-6 gap-4">
            <div>
                <label class="block text-xs font-bold text-slate-700 mb-1">Quartos</label>
                <input type="number" name="details[bedrooms]" value="{{ $details['bedrooms'] ?? 0 }}" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
            </div>
            <div>
                <label class="block text-xs font-bold text-slate-700 mb-1">Suítes</label>
                <input type="number" name="details[suites]" value="{{ $details['suites'] ?? 0 }}" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
            </div>
            <div>
                <label class="block text-xs font-bold text-slate-700 mb-1">Banheiros</label>
                <input type="number" name="details[bathrooms]" value="{{ $details['bathrooms'] ?? 0 }}" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
            </div>
            <div>
                <label class="block text-xs font-bold text-slate-700 mb-1">Vagas Garagem</label>
                <input type="number" name="details[garages]" value="{{ $details['garages'] ?? 0 }}" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
            </div>
            <div>
                <label class="block text-xs font-bold text-slate-700 mb-1">Área Construída (m²)</label>
                <input type="number" step="0.01" name="details[built_area]" value="{{ $details['built_area'] ?? '' }}" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
            </div>
            <div>
                <label class="block text-xs font-bold text-slate-700 mb-1">Área Total (m²)</label>
                <input type="number" step="0.01" name="details[total_area]" value="{{ $details['total_area'] ?? '' }}" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
            </div>
        </div>

        <!-- BLOCO B: TERRENO -->
        <div x-show="propertyType === 'terreno'" x-cloak class="grid grid-cols-1 md:grid-cols-3 gap-4">
            <div>
                <label class="block text-xs font-bold text-slate-700 mb-1">Área Total do Terreno (m²)</label>
                <input type="number" step="0.01" name="details[total_area]" value="{{ $details['total_area'] ?? '' }}" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
            </div>
            <div>
                <label class="block text-xs font-bold text-slate-700 mb-1">Topografia</label>
                <select name="details[topography]" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
                    <option value="Plano" @selected(($details['topography'] ?? '') === 'Plano')>Plano</option>
                    <option value="Aclive" @selected(($details['topography'] ?? '') === 'Aclive')>Aclive</option>
                    <option value="Declive" @selected(($details['topography'] ?? '') === 'Declive')>Declive</option>
                    <option value="Irregular" @selected(($details['topography'] ?? '') === 'Irregular')>Irregular</option>
                </select>
            </div>
            <div>
                <label class="block text-xs font-bold text-slate-700 mb-1">Zoneamento / Vocação</label>
                <input type="text" name="details[zoning]" value="{{ $details['zoning'] ?? '' }}" placeholder="Ex: Residencial, Comercial, Industrial" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
            </div>
        </div>

        <!-- BLOCO C: FAZENDA / SÍTIO -->
        <div x-show="propertyType === 'fazenda'" x-cloak class="grid grid-cols-1 md:grid-cols-5 gap-4 items-center">
            <div>
                <label class="block text-xs font-bold text-slate-700 mb-1">Tamanho (Hectares)</label>
                <input type="number" step="0.01" name="details[hectares]" value="{{ $details['hectares'] ?? '' }}" placeholder="Ex: 120" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
            </div>
            <div>
                <label class="block text-xs font-bold text-slate-700 mb-1">Distância do Asfalto (km)</label>
                <input type="number" step="0.1" name="details[asphalt_distance]" value="{{ $details['asphalt_distance'] ?? '' }}" placeholder="Ex: 4.5" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">
            </div>
            <label class="flex items-center space-x-2 pt-5 cursor-pointer">
                <input type="checkbox" name="details[has_lake]" value="1" @checked(!empty($details['has_lake'])) class="rounded text-amber-500">
                <span class="text-sm font-medium text-slate-700">Possui Lagoa / Açude</span>
            </label>
            <label class="flex items-center space-x-2 pt-5 cursor-pointer">
                <input type="checkbox" name="details[has_river]" value="1" @checked(!empty($details['has_river'])) class="rounded text-amber-500">
                <span class="text-sm font-medium text-slate-700">Possui Rio / Nascente</span>
            </label>
            <label class="flex items-center space-x-2 pt-5 cursor-pointer">
                <input type="checkbox" name="details[main_house]" value="1" @checked(!empty($details['main_house'])) class="rounded text-amber-500">
                <span class="text-sm font-medium text-slate-700">Possui Casa Sede</span>
            </label>
        </div>
    </div>

    <!-- Seção 4: Descrição e Fotos (Imagem Destacada + Álbum) -->
    <div class="bg-white p-6 rounded-xl border border-slate-200 shadow-sm space-y-4">
        <h2 class="text-lg font-bold text-slate-900 border-b pb-2">4. Descrição e Fotos do Imóvel</h2>

        <div>
            <label class="block text-xs font-bold text-slate-700 uppercase mb-1">Descrição Detalhada</label>
            <textarea name="description" rows="4" class="w-full rounded-md border border-slate-300 px-3 py-2 text-sm">{{ old('description', $property->description ?? '') }}</textarea>
        </div>

        <div class="grid grid-cols-1 md:grid-cols-2 gap-6 pt-2">
            <div>
                <label class="block text-xs font-bold text-slate-700 uppercase mb-1">Imagem Destacada (Capa)</label>
                <input type="file" name="featured_image" accept="image/*" class="w-full text-sm text-slate-600 file:mr-4 file:py-2 file:px-4 file:rounded file:border-0 file:bg-slate-900 file:text-white hover:file:bg-slate-800">
            </div>

            <div>
                <label class="block text-xs font-bold text-slate-700 uppercase mb-1">Álbum de Fotos do Imóvel (Múltiplas)</label>
                <input type="file" name="album[]" accept="image/*" multiple class="w-full text-sm text-slate-600 file:mr-4 file:py-2 file:px-4 file:rounded file:border-0 file:bg-amber-500 file:text-slate-950 font-semibold hover:file:bg-amber-600">
            </div>
        </div>
    </div>

    <div class="flex justify-end gap-3">
        <a href="{{ route('admin.properties.index') }}" class="bg-slate-200 hover:bg-slate-300 text-slate-800 font-semibold px-6 py-2.5 rounded-md text-sm">
            Cancelar
        </a>
        <button type="submit" class="bg-slate-900 hover:bg-slate-800 text-amber-400 font-bold px-8 py-2.5 rounded-md text-sm shadow">
            {{ $isEdit ? 'Salvar Alterações' : 'Cadastrar Imóvel' }}
        </button>
    </div>
</div>