@component('fragments.modal')
        @slot('idmodal')
            modify_modal
        @endslot

        @slot('title')
            Editar Cliente
        @endslot

        @slot('action')
            <form class="needs-validation" method="POST" action="{{url('cliente_controller/edit')}}" role="form" enctype="multipart/form-data">
        @endslot

        @slot('form')
            {{ csrf_field() }}
                <!--<div class="container-fluid">-->

                    <ul class="nav nav-tabs" id="clientes" role="tablist">
                        <li class="nav-item">
                            <a class="nav-link active" id="generales-tab-modify" data-toggle="tab" href="#generales-modify" role="tab" aria-controls="generales" aria-selected="true">Generales</a>
                        </li>
                        <li class="nav-item">
                            <a class="nav-link" id="opcionales-tab-modify" data-toggle="tab" href="#opcionales-modify" role="tab" aria-controls="opcionales" aria-selected="false">Opcionales</a>
                        </li>
                    </ul>
                    <div class="tab-content" id="myTabContent">
                        <div class="tab-pane fade show active" id="generales-modify" role="tabpanel" aria-labelledby="generales-tab-modify">
                            <div class="container" style="margin-top:10px;">
                                <input type="hidden" name="id_clnt" id="id_clnt">
                                <div class="form-row">
                                    <div class="form-group col-md-12">
                                        <label class="font-weight-bold" for="tipo_cliente">Tipo Cliente</label>
                                        <select class="custom-select" id="tipo_cliente" name="tipo_cliente" required>
                                            <option selected disabled>Elegir tipo cliente...</option>
                                            <option value="Directo">Directo</option>
                                            <option value="Gestor">Gestor</option>
                                        </select>
                                    </div>
                                </div>

                                <div class="form-row" hidden="true" id="change_directo_modify">
                                    <div class="form-group col-md-12">
                                        <label class="font-weight-bold" for="nombre_comercial" class="">Nombre comercial empresa</label>
                                        <input type="text" class="form-control" id="nombre_comercial" name="nombre_comercial" placeholder="Nombre comercial de la empresa">
                                    </div>
                                </div>

                                <div class="form-row">
                                    <div class="form-group col-md-4">
                                        <label class="font-weight-bold" for="nombre" class="">Nombres</label>
                                        <input type="text" class="form-control" id="nombre" name="nombre" placeholder="Nombre" required>
                                    </div>
                                    <div class="form-group col-md-4">
                                        <label class="font-weight-bold" for="apaterno" class="">Apellido paterno</label>
                                        <input type="text" class="form-control" placeholder="apaterno" id="apaterno" name="apaterno" required>
                                    </div>
                                    <div class="form-group col-md-4">
                                        <label class="font-weight-bold" for="amaterno" class="">Apellido materno</label>
                                        <input type="text" class="form-control" placeholder="amaterno" id="amaterno" name="amaterno">
                                    </div>
                                </div>

                                <div class="form-row">
                                    <div class="form-group col-md-12">
                                        <label class="font-weight-bold" for="alias" class="">Alias</label>
                                        <input type="text" class="form-control" placeholder="Alias" id="alias" name="alias" required>
                                    </div>
                                </div>

                                <div class="form-row">
                                    <div class="form-group col-md-12">
                                        <label class="font-weight-bold" for="email" class="">Email</label>
                                        <input type="text" class="form-control" placeholder="Email" id="email" name="email" required>
                                    </div>
                                </div>

                                <div class="form-row">
                                    <div class="form-group col-md-4">
                                        <label class="font-weight-bold" for="tel_oficina" class="">Teléfono oficina</label>
                                        <input type="text" class="form-control" placeholder="Teléfono oficina" id="tel_oficina" name="tel_oficina" required>
                                    </div>
                                    <div class="form-group col-md-4">
                                        <label class="font-weight-bold" for="ext" class="">Extensión</label>
                                        <input type="text" class="form-control" placeholder="Extensión" id="ext" name="ext">
                                    </div>
                                    <div class="form-group col-md-4">
                                        <label class="font-weight-bold" for="tel_movil" class="">Teléfono móvil</label>
                                        <input type="text" class="form-control" placeholder="Teléfono móvil" id="tel_movil" name="tel_movil">
                                    </div>
                                </div>

                                <div class="form-row">
                                    <div class="form-group col-md-12">
                                        <label class="font-weight-bold" for="notas" class="">Notas</label>
                                        <textarea type="text" class="form-control" placeholder="Notas" id="notas" name="notas"></textarea>
                                    </div>
                                </div>

                            </div>

                        </div>
                        <div class="tab-pane fade" id="opcionales-modify" role="tabpanel" aria-labelledby="opcionales-tab-modify">

                            <div class="container" style="margin-top:10px;">

                                <div class="form-row">
                                    <div class="form-group col-md-4">
                                        <label class="font-weight-bold" for="calle">Calle</label>
                                        <input type="text" class="form-control" placeholder="Calle" id="calle" name="calle">
                                    </div>
                                    <div class="form-group col-md-4">
                                        <label class="font-weight-bold" for="numero_exterior">Número exterior</label>
                                        <input type="text" class="form-control" placeholder="Número Exterior" id="numero_exterior" name="numero_exterior">
                                    </div>
                                    <div class="form-group col-md-4">
                                        <label class="font-weight-bold" for="numero_interior">Número interior</label>
                                        <input type="text" class="form-control" placeholder="Número interior" id="numero_interior" name="numero_interior">
                                    </div>
                                </div>

                                <div class="form-row">
                                    <div class="form-group col-md-12">
                                        <label class="font-weight-bold" for="cp" class="">Código postal</label>
                                        <input type="text" class="form-control" placeholder="Código postal" id="cp" name="cp">
                                    </div>
                                </div>

                                <div class="form-row">
                                    <div class="form-group col-md-4">
                                        <label class="font-weight-bold" for="id_estado" class="">Estado</label>
                                        <select class="custom-select" id="id_estado">
                                            <option selected disabled>Selecciona estado...</option>
                                            @foreach ($estados as $estado)
                                                <option value="{{$estado->id_estado}}" class="text-uppercase">{{ $estado->estado }}</option>
                                            @endforeach
                                        </select>
                                    </div>
                                    <div class="form-group col-md-4">
                                        <label class="font-weight-bold" for="colonia" class="">Colonia</label>
                                        <input type="text" class="form-control" placeholder="Colonia" id="colonia" name="colonia">
                                    </div>
                                    <div class="form-group col-md-4">
                                        <label class="font-weight-bold" for="municipio" class="">Municipio/Delegacion</label>
                                        <input type="text" class="form-control" placeholder="Municipio/Delegacion" id="municipio" name="municipio">
                                    </div>
                                </div>

                                <div id="change_gestor_modify" hidden="true">
                                    <div class="ui divider"></div>
                                    <label class="font-weight-bold text-center col-md-12" style="margin-bottom:10px;">Datos Fiscales</label>

                                    <div class="form-row">
                                        <div class="form-group col-md-4">
                                            <label class="font-weight-bold" for="rfc">RFC</label>
                                            <input type="text" class="form-control" placeholder="RFC" id="rfc" name="rfc">
                                        </div>
                                        <div class="form-group col-md-4">
                                            <label class="font-weight-bold" for="razon_social">Razón social</label>
                                            <input type="text" class="form-control" placeholder="Razón social" id="razon_social" name="razon_social">
                                        </div>
                                        <div class="form-group col-md-4">
                                            <label class="font-weight-bold" for="email_facturacion">Email de facturación</label>
                                            <input type="text" class="form-control" placeholder="Email de facturación" id="email_facturacion" name="email_facturacion">
                                        </div>
                                    </div>
                                </div>

                                <div class="form-row">
                                    <div class="form-group col-md-6">
                                        <label class="font-weight-bold" for="nombre" class="">IFE o INE</label>
                                        <div class="custom-file">
                                            <input type="file" class="custom-file-input" id="url_ine" lang="es">
                                            <label class="custom-file-label" for="url_ine">Seleccionar Archivo</label>
                                        </div>
                                    </div>

                                    <div class="form-group col-md-6">
                                        <label class="font-weight-bold" for="nombre" class="">Alta hacienda</label>
                                        <div class="custom-file">
                                            <input type="file" class="custom-file-input" id="url_alta_hacienda" lang="es">
                                            <label class="custom-file-label" for="url_alta_hacienda">Seleccionar Archivo</label>
                                        </div>
                                    </div>
                                </div>

                                <div class="form-row">
                                    <div class="form-group col-md-12">
                                        <label class="font-weight-bold" for="descuento" class="">Porcentaje de descuento</label>
                                        <input type="text" class="form-control" placeholder="Porcentaje de descuento" id="descuento" name="descuento">
                                    </div>
                                </div>

                            </div>

                        </div>
                    </div>
                <!--</div>-->
        @endslot

        @slot('button')
            <button type="submit" class="btn btn-primary">
                <i class="save icon"></i>Guardar
            </button>
        @endslot
    @endcomponent