@php
    // Caso a variável $clientesList não esteja definida, busca todos os clientes ordenados por razão_social (ASC)
    if (!isset($clientesList)) {
        $clientesList = \App\Models\Cliente::orderBy('razao_social', 'asc')->get();
    }
@endphp

<div class="cliente-form border p-3 mb-3 d-flex flex-wrap" id="cliente-form-{{ $uniqueId }}">
    <!-- Bloco para selecionar um contratante já cadastrado (lado a lado) -->
    <div class="mb-3 me-3 flex-fill" style="min-width: 300px;">
        <label for="select_cliente_{{ $uniqueId }}" class="form-label">Selecione um Contratante Existente</label>
        <select class="form-select select-cliente" id="select_cliente_{{ $uniqueId }}" name="select_cliente" data-choices="data-choices" data-options='{"removeItemButton":true,"placeholder":true}'>
            <option value="" disabled selected>Selecione um cliente...</option>
            @if($clientesList->count())
                @foreach($clientesList as $cliente)
                    <option value="{{ $cliente->id }}"
                        data-razao-social="{{ $cliente->razao_social }}"
                        data-nome-fantasia="{{ $cliente->nome_fantasia }}"
                        data-tipo="{{ $cliente->tipo }}"
                        data-documento="{{ $cliente->documento }}"
                        data-email="{{ $cliente->email }}"
                        data-telefone="{{ $cliente->telefone }}"
                        data-cep="{{ $cliente->cep }}"
                        data-logradouro="{{ $cliente->logradouro }}"
                        data-numero="{{ $cliente->numero }}"
                        data-complemento="{{ $cliente->complemento }}"
                        data-bairro="{{ $cliente->bairro }}"
                        data-cidade="{{ $cliente->cidade }}"
                        data-estado="{{ $cliente->estado }}"
                        data-regime-tributario="{{ $cliente->regime_tributario }}"
                        data-nome-responsavel="{{ $cliente->nome_responsavel }}"
                        data-observacoes="{{ $cliente->observacoes }}">
                        {{ $cliente->razao_social }} ({{ $cliente->documento }})
                    </option>
                @endforeach
            @endif
        </select>
    </div>

    <!-- Ou cadastro via CPF/CNPJ (lado a lado) -->
    <div class="mb-3 flex-fill" style="min-width: 300px;">
        <label for="cpf_cnpj_search_{{ $uniqueId }}" class="form-label">CPF/CNPJ</label>
        <input type="text" class="form-control cpf-cnpj" id="cpf_cnpj_search_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][cpf_cnpj]" placeholder="Digite o CPF ou CNPJ" required>
    </div>

    <!-- Bloco de dados do cliente -->
    <div class="cliente-dados mt-4 w-100 d-none">
        <input type="hidden" id="cliente_id_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][id]" value="{{ old('clientes.' . $uniqueId . '.id') }}">

        <div class="row g-3 needs-validation" novalidate>
            <div class="col-md-6">
                <label class="form-label" for="razao_social_{{ $uniqueId }}">Razão Social / Nome</label>
                <input type="text" class="form-control" id="razao_social_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][razao_social]" value="{{ old('clientes.' . $uniqueId . '.razao_social') }}" required>
                <div class="invalid-feedback">Por favor, informe a razão social.</div>
            </div>

            <div class="col-md-6">
                <label class="form-label" for="nome_fantasia_{{ $uniqueId }}">Nome Fantasia</label>
                <input type="text" class="form-control" id="nome_fantasia_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][nome_fantasia]" value="{{ old('clientes.' . $uniqueId . '.nome_fantasia') }}">
            </div>

            <div class="col-md-3">
                <label class="form-label" for="tipo_{{ $uniqueId }}">Tipo</label>
                <select class="form-select" id="tipo_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][tipo]" required disabled>
                    <option value="cnpj" {{ old('clientes.' . $uniqueId . '.tipo') === 'cnpj' ? 'selected' : '' }}>CNPJ</option>
                    <option value="cpf" {{ old('clientes.' . $uniqueId . '.tipo') === 'cpf' ? 'selected' : '' }}>CPF</option>
                </select>
                <!-- Campo hidden para enviar o valor -->
                <input type="hidden" name="clientes[{{ $uniqueId }}][tipo]" value="{{ old('clientes.' . $uniqueId . '.tipo', 'cpf') }}">
                <div class="invalid-feedback">Por favor, selecione o tipo.</div>
            </div>

            <div class="col-md-3">
                <label class="form-label" for="documento_{{ $uniqueId }}">CNPJ/CPF</label>
                <input type="text" class="form-control" id="documento_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][documento]" value="{{ old('clientes.' . $uniqueId . '.documento') }}" required readonly>
                <div class="invalid-feedback">Por favor, informe o CNPJ ou CPF.</div>
            </div>

            <div class="col-md-3">
                <label class="form-label" for="email_{{ $uniqueId }}">Email</label>
                <input type="email" class="form-control" id="email_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][email]" value="{{ old('clientes.' . $uniqueId . '.email') }}">
            </div>

            <div class="col-md-3">
                <label class="form-label" for="telefone_{{ $uniqueId }}">Telefone</label>
                <input type="text" class="form-control" id="telefone_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][telefone]" value="{{ old('clientes.' . $uniqueId . '.telefone') }}">
            </div>

            <h4 class="mt-4 mb-3">Endereço</h4>

            <div class="col-md-3">
                <label class="form-label" for="cep_{{ $uniqueId }}">CEP</label>
                <input type="text" class="form-control cep" id="cep_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][cep]" value="{{ old('clientes.' . $uniqueId . '.cep') }}" maxlength="9">
            </div>

            <div class="col-md-6">
                <label class="form-label" for="logradouro_{{ $uniqueId }}">Logradouro</label>
                <input type="text" class="form-control logradouro" id="logradouro_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][logradouro]" value="{{ old('clientes.' . $uniqueId . '.logradouro') }}">
            </div>

            <div class="col-md-3">
                <label class="form-label" for="numero_{{ $uniqueId }}">Número</label>
                <input type="text" class="form-control" id="numero_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][numero]" value="{{ old('clientes.' . $uniqueId . '.numero') }}">
            </div>

            <div class="col-md-4">
                <label class="form-label" for="complemento_{{ $uniqueId }}">Complemento</label>
                <input type="text" class="form-control" id="complemento_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][complemento]" value="{{ old('clientes.' . $uniqueId . '.complemento') }}">
            </div>

            <div class="col-md-4">
                <label class="form-label" for="bairro_{{ $uniqueId }}">Bairro</label>
                <input type="text" class="form-control bairro" id="bairro_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][bairro]" value="{{ old('clientes.' . $uniqueId . '.bairro') }}">
            </div>

            <div class="col-md-4">
                <label class="form-label" for="cidade_{{ $uniqueId }}">Cidade</label>
                <input type="text" class="form-control" id="cidade_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][cidade]" value="{{ old('clientes.' . $uniqueId . '.cidade') }}">
            </div>

            <div class="col-md-6">
                <label class="form-label" for="estado_{{ $uniqueId }}">Estado</label>
                <select class="form-select estado" id="estado_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][estado]" required>
                    <option value="">Selecione</option>
                    <option value="AC" {{ old('clientes.' . $uniqueId . '.estado') === 'AC' ? 'selected' : '' }}>Acre</option>
                    <option value="AL" {{ old('clientes.' . $uniqueId . '.estado') === 'AL' ? 'selected' : '' }}>Alagoas</option>
                    <option value="AM" {{ old('clientes.' . $uniqueId . '.estado') === 'AM' ? 'selected' : '' }}>Amazonas</option>
                    <option value="AP" {{ old('clientes.' . $uniqueId . '.estado') === 'AP' ? 'selected' : '' }}>Amapá</option>
                    <option value="BA" {{ old('clientes.' . $uniqueId . '.estado') === 'BA' ? 'selected' : '' }}>Bahia</option>
                    <option value="CE" {{ old('clientes.' . $uniqueId . '.estado') === 'CE' ? 'selected' : '' }}>Ceará</option>
                    <option value="DF" {{ old('clientes.' . $uniqueId . '.estado') === 'DF' ? 'selected' : '' }}>Distrito Federal</option>
                    <option value="ES" {{ old('clientes.' . $uniqueId . '.estado') === 'ES' ? 'selected' : '' }}>Espírito Santo</option>
                    <option value="GO" {{ old('clientes.' . $uniqueId . '.estado') === 'GO' ? 'selected' : '' }}>Goiás</option>
                    <option value="MA" {{ old('clientes.' . $uniqueId . '.estado') === 'MA' ? 'selected' : '' }}>Maranhão</option>
                    <option value="MT" {{ old('clientes.' . $uniqueId . '.estado') === 'MT' ? 'selected' : '' }}>Mato Grosso</option>
                    <option value="MS" {{ old('clientes.' . $uniqueId . '.estado') === 'MS' ? 'selected' : '' }}>Mato Grosso do Sul</option>
                    <option value="MG" {{ old('clientes.' . $uniqueId . '.estado') === 'MG' ? 'selected' : '' }}>Minas Gerais</option>
                    <option value="PA" {{ old('clientes.' . $uniqueId . '.estado') === 'PA' ? 'selected' : '' }}>Pará</option>
                    <option value="PB" {{ old('clientes.' . $uniqueId . '.estado') === 'PB' ? 'selected' : '' }}>Paraíba</option>
                    <option value="PR" {{ old('clientes.' . $uniqueId . '.estado') === 'PR' ? 'selected' : '' }}>Paraná</option>
                    <option value="PE" {{ old('clientes.' . $uniqueId . '.estado') === 'PE' ? 'selected' : '' }}>Pernambuco</option>
                    <option value="PI" {{ old('clientes.' . $uniqueId . '.estado') === 'PI' ? 'selected' : '' }}>Piauí</option>
                    <option value="RJ" {{ old('clientes.' . $uniqueId . '.estado') === 'RJ' ? 'selected' : '' }}>Rio de Janeiro</option>
                    <option value="RN" {{ old('clientes.' . $uniqueId . '.estado') === 'RN' ? 'selected' : '' }}>Rio Grande do Norte</option>
                    <option value="RS" {{ old('clientes.' . $uniqueId . '.estado') === 'RS' ? 'selected' : '' }}>Rio Grande do Sul</option>
                    <option value="RO" {{ old('clientes.' . $uniqueId . '.estado') === 'RO' ? 'selected' : '' }}>Rondônia</option>
                    <option value="RR" {{ old('clientes.' . $uniqueId . '.estado') === 'RR' ? 'selected' : '' }}>Roraima</option>
                    <option value="SC" {{ old('clientes.' . $uniqueId . '.estado') === 'SC' ? 'selected' : '' }}>Santa Catarina</option>
                    <option value="SP" {{ old('clientes.' . $uniqueId . '.estado') === 'SP' ? 'selected' : '' }}>São Paulo</option>
                    <option value="SE" {{ old('clientes.' . $uniqueId . '.estado') === 'SE' ? 'selected' : '' }}>Sergipe</option>
                    <option value="TO" {{ old('clientes.' . $uniqueId . '.estado') === 'TO' ? 'selected' : '' }}>Tocantins</option>
                </select>
            </div>

            <h4 class="mt-4 mb-3">Outras Informações</h4>
            <div class="col-md-6">
                <label class="form-label" for="regime_tributario_{{ $uniqueId }}">Regime Tributário</label>
                <input type="text" class="form-control" id="regime_tributario_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][regime_tributario]" value="{{ old('clientes.' . $uniqueId . '.regime_tributario') }}">
            </div>

            <div class="col-md-6">
                <label class="form-label" for="nome_responsavel_{{ $uniqueId }}">Nome do Responsável</label>
                <input type="text" class="form-control" id="nome_responsavel_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][nome_responsavel]" value="{{ old('clientes.' . $uniqueId . '.nome_responsavel') }}">
            </div>

            <div class="col-12">
                <label class="form-label" for="observacoes_{{ $uniqueId }}">Observações</label>
                <textarea class="form-control" id="observacoes_{{ $uniqueId }}" name="clientes[{{ $uniqueId }}][observacoes]" rows="3">{{ old('clientes.' . $uniqueId . '.observacoes') }}</textarea>
            </div>
        </div>
        <div class="d-flex justify-content-end mt-3">
            <button type="button" class="btn btn-primary cadastrar-cliente" data-id="{{ $uniqueId }}">
                <i class="fas fa-plus"></i> Incluir
            </button>
            <button type="button" class="btn btn-info editar-cliente d-none" data-id="{{ $uniqueId }}">
                <i class="fas fa-save"></i> Incluir
            </button>
        </div>
    </div>
</div>