@extends('layouts.dashboard.inface', ['section' => 'leads'])

@section('extra-styles')
@endsection

@section('content')
    @php
        $isEditing = !empty($editingLeadId);
    @endphp
    <div class="flex flex-col overflow-auto p-6 md:p-10 gap-8">
        <div class="flex flex-col gap-1">
            <div class="mb-8">
                <a class="inline-flex items-center text-sm font-medium text-slate-500 hover:text-primary dark:text-slate-400 dark:hover:text-blue-400 transition-colors"
                    href="{{ $isEditing ? route('realEstate.lead.show', $editingLeadId) : route('realEstate.leads') }}">
                    <span class="material-symbols-outlined mr-1" style="font-size: 18px;">arrow_back</span>
                    {{ $isEditing ? 'Volver al detalle' : 'Volver al listado' }}
                </a>
            </div>
            <h2 class="text-[#111318] dark:text-white text-3xl md:text-4xl font-bold tracking-tight">
                {{ $isEditing ? 'Editar Prospecto' : 'Nuevo Prospecto' }}
            </h2>
            <p class="text-[#616f89] dark:text-gray-400 text-base">
                {{ $isEditing ? 'Actualiza la información del prospecto seleccionado desde esta misma pantalla.' : 'Completa la información para dar de alta a un nuevo interesado.' }}
            </p>
        </div>
        <livewire:real-estate.leads.create-lead-form :editing-lead-id="$editingLeadId"></livewire:real-estate.leads.create-lead-form>
    </div>
@endsection