{{-- <x-modal-card> --}}
{{-- @slot('body') --}}

<div>
    <form id="FormCliente">
        <input type="hidden" name="_token" id="token" value="{{ csrf_token() }}">

        <input type="hidden" id="IdCliente" name="IdCliente" value="{{ $cliente->CLIE_ID }}">

        <div class="col-md-12">
            <ul class="nav nav-tabs justify-content-center" data-bs-toggle="tabs">
                <li class="nav-item">
                    <a href="#tabs-info-general" class="nav-link active" data-bs-toggle="tab">
                        <i class="fas fa-boxes"></i>&nbsp; General
                    </a>
                </li>
                <li class="nav-item">
                    <a href="#tabs-info-tarjetas" class="nav-link" data-bs-toggle="tab">
                        <i class="fas fa-map"></i>&nbsp;
                        Tarjetas
                    </a>
                </li>
                <li class="nav-item">
                    <a href="#tabs-info-direcciones" class="nav-link" data-bs-toggle="tab">
                        <i class="fas fa-map"></i>&nbsp;
                        Direcciones
                    </a>
                </li>
                <li class="nav-item">
                    <a href="#tabs-info-preferencias" class="nav-link" data-bs-toggle="tab">
                        <i class="fas fa-map"></i>&nbsp;
                        Preferencias
                    </a>
                </li>
            </ul>
            <div class="card-body">
                <div class="tab-content">
                    <div class="tab-pane active show" id="tabs-info-general">
                        <div class="row">
                            <ul class="nav nav-tabs" style="border-bottom: 0px" data-bs-toggle="tabs">
                                <li class="nav-item">
                                    <a href="#tabs-cliente" class="nav-link active" data-bs-toggle="tab">
                                        <i class="fas fa-user"></i>&nbsp; Cliente
                                    </a>
                                </li>
                                <li class="nav-item">
                                    <a href="#tabs-usuario" class="nav-link" data-bs-toggle="tab">
                                        <i class="fas fa-user"></i>&nbsp; Usuario
                                    </a>
                                </li>
                            </ul>
                            <div class="card-body">
                                <div class="tab-content">
                                    @include('clientes._partials.form-crear')

                                    <div class="col-12 mt-3" style="border-top: 1px solid #e1e1e1;
                                    padding-top: 13px;">
                                        <button type="button" class="btn btn-success" onclick="MakeRequestData('{{ route('guardar-cliente') }}', '', 'POST', 2, '#FormCliente', '', true, true, true)"><i class="fas fa-save"></i>&nbsp;&nbsp; Guardar cambios</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="tab-pane" id="tabs-info-tarjetas">
                        @include('clientes.cliente-tarjeta.index')
                    </div>
                    <div class="tab-pane" id="tabs-info-direcciones">
                        @include('clientes.cliente-direccion.index')
                    </div>
                    <div class="tab-pane" id="tabs-info-preferencias">

                    </div>
                </div>
            </div>
        </div>
    </form>
</div>