{{-- form starts --}}
<form class="needs-validation" id="form" name="form" novalidate>
    @csrf
    <!-- /tab-content -->
    <div class="tab-content" id="myTabContent-2">
        <div class="tab-pane fade show active" id="withoutSpace" Aulae="tabpanel" aria-labelledby="home-tab-2">
            <div class="card-body p-4">
                <div class="row">

                    <!-- data -->
                    {{-- <input id="txt_iduser" name="txt_iduser" type="hidden"> --}}
                    <div class="col-xl-12 col-md-12 col-sm-12 col-12 mb-3 d-flex justify-content-end">
                        <div class="mx-3">
                            <a href="javascript:void(0);" data-bs-toggle="modal" data-bs-target="#modalTarifasTramite"
                                data-bs-placement="top"
                                title="Detalle de requisitos y precios para tramite documentario"
                                class="fs-5 hover:text-danger">
                                <i class="fa-solid fa-money-bill"></i><span>
                                    Tarifario
                                    de Trámites</span>
                            </a>
                        </div>
                        <div class="mx-3">
                            {{-- href="{{ route('modulo.download.guia.requicitos.tramite.documentario') }}" --}}
                            <a href="javascript:void(0);" target="_blank" data-bs-placement="top"
                                title="Detalle de requisitos y precios para tramite documentario"
                                class="fs-5 hover:text-danger">
                                <i class="fa-solid fa-book"></i><span>
                                    Descargar
                                    requisitos</span>

                            </a>
                        </div>
                        <div>
                            {{-- href="{{ route('modulo.download.guia.tramite.documentario') }}"  --}}
                            <a href="javascript:void(0);" target="_blank" data-bs-placement="top"
                                title="Acceso a Guía de usuario" class="fs-5 hover:text-danger">
                                <i class="fa-solid fa-file-pdf"></i> <span>
                                    Descargar
                                    manual</span>
                            </a>
                        </div>
                    </div>


                    <!-- data -->
                    <fieldset
                        style="border: 1px groove #ddd !important;
                    padding: 0 1.4em 1.4em 1.4em !important;
                    margin: 0 0 1.5em 0 !important;
                    -webkit-box-shadow: 0px 0px 0px 0px #000;
                    box-shadow: 0px 0px 0px 0px #000;">

                        <legend class="text-primary mt-2 mb-3"
                            style="font-size: 1.2em !important;
                        font-weight: bold !important;
                        text-align: left !important;">
                            DATOS DEL DOCUMENTO
                        </legend>


                        {{-- row --}}
                        <div class="row m-0 p-0 col-xl-12 col-md-12 col-sm-12 col-12 mb-3">
                            {{-- field --}}
                            <div class="col-xl-12 col-md-12 col-sm-12 col-12 mb-3">
                                <label for="txt_td_tipo" class="form-label text-primary">Tipo de
                                    Trámite
                                    @include('include.span.obligatory')
                                </label>
                                <select id="txt_td_tipo" name="txt_td_tipo"
                                    class="default-select  form-control form-control-sm" required>
                                    {{-- combobox --}}
                                </select>
                            </div>
                        </div>

                        {{-- row --}}
                        <div class="row m-0 p-0 col-xl-12 col-md-12 col-sm-12 col-12 mb-3">
                            {{-- field --}}
                            <div class="col-xl-12 col-md-12 col-sm-12 col-12 mb-3">
                                <label for="txt_area" class="form-label text-primary">Área a
                                    la
                                    que se dirige
                                    @include('include.span.obligatory')
                                </label>
                                <select id="txt_area" name="txt_area"
                                    class="default-select  form-control form-control-sm" required>
                                    {{-- combobox --}}
                                </select>
                            </div>
                        </div>

                        {{-- row --}}
                        <div class="row m-0 p-0 col-xl-12 col-md-12 col-sm-12 col-12 mb-3">
                            {{-- field --}}
                            <div class="col-xl-12 col-md-12 col-sm-12 col-12 mb-3">
                                <label for="txt_asunto" class="form-label text-primary">Asunto
                                    @include('include.span.obligatory')
                                </label>
                                <textarea id="txt_asunto" name="txt_asunto" rows="2" class="form-control"
                                    placeholder="Ingrese fundamentación de la solicitud" required></textarea>
                                @include('include.div.invalid-feedback')
                                {{-- mensaje de error campo vacio --}}
                            </div>
                        </div>

                        {{-- row --}}
                        <div class="row m-0 p-0 col-xl-12 col-md-12 col-sm-12 col-12 mb-3">
                            {{-- field --}}
                            <div class="col-xl-12 col-md-12 col-sm-12 col-12 mb-3">
                                <label for="txt_documentos" class="form-label text-primary">Documentos
                                    que se
                                    adjuntan</label>
                                <textarea id="txt_documentos" name="txt_documentos" rows="2" class="form-control"
                                    placeholder="Ingrese la lista documentos adjuntos en su archivo"></textarea>
                                @include('include.div.invalid-feedback')
                                {{-- mensaje de error campo vacio --}}
                            </div>
                        </div>

                        {{-- row --}}
                        <div class="row m-0 p-0 col-xl-12 col-md-12 col-sm-12 col-12 mb-3">
                            {{-- field --}}
                            <div class="col-xl-6 col-md-6 col-sm-6 col-12 mb-3">
                                <label for="txt_folios" class="form-label text-primary">N°
                                    Folios
                                    @include('include.span.obligatory')
                                </label>
                                <input id="txt_folios" name="txt_folios"
                                    placeholder="Digite la cantidad de hojas de su documento" type="number"
                                    maxlength="2" onkeypress='return event.charCode >= 48 && event.charCode <= 57'
                                    class="form-control form-control-sm" autocomplete="off" required>
                                @include('include.div.invalid-feedback')
                                {{-- mensaje de error campo vacio --}}
                            </div>

                            {{-- field --}}
                            <div class="col-xl-6 col-md-6 col-sm-6 col-12 mb-3">
                                <label for="txt_fechadoc" class="form-label text-primary">Fecha
                                    documento
                                    @include('include.span.obligatory')
                                </label>
                                <input id="txt_fechadoc" name="txt_fechadoc" type="text"
                                    class="form-control form-control-sm text-uppercase" autocomplete="off" readonly
                                    required>
                                @include('include.div.invalid-feedback')
                                {{-- mensaje de error campo vacio --}}
                            </div>

                        </div>

                        {{-- row --}}
                        <div class="row m-0 p-0 col-xl-12 col-md-12 col-sm-12 col-12 mb-3">
                            <div class="col-xl-6 col-lg-6 col-md-6 col-sm-6 col-12 mb-3">
                                <label for="documento" class="form-label text-primary">Inserte
                                    Documento
                                    @include('include.span.obligatory')
                                </label>
                                <input class="form-control form-control-sm" type="file" id="documento"
                                    name="documento" accept=".pdf" required>
                                <div class="invalid-feedback" id="validate_message_File_docuemento">
                                    Inserte los archivos requeridos.
                                </div>
                            </div>
                            <div class="col-xl-6 col-md-6 col-sm-6 col-12 mb-3">
                                <label for="check_tyc" class="form-label text-primary">Términos
                                    y
                                    condiciones
                                    @include('include.span.obligatory')
                                </label>
                                <div class="form-check mb-2">
                                    <input id="check_tyc" name="check_tyc" type="checkbox" class="form-check-input"
                                        required>
                                    <label class="form-check-label">Acepto
                                        los términos y
                                        condiciones</label>
                                </div>
                            </div>
                        </div>
                    </fieldset>

                    <fieldset
                        style="border: 1px groove #ddd !important;
                    padding: 0 1.4em 1.4em 1.4em !important;
                    margin: 0 0 1.5em 0 !important;
                    -webkit-box-shadow: 0px 0px 0px 0px #000;
                    box-shadow: 0px 0px 0px 0px #000;">

                        <legend class="text-primary mt-2"
                            style="font-size: 1.2em !important;
                        font-weight: bold !important;
                        text-align: left !important;">
                            DATOS DEL CONTACTO
                        </legend>
                        <div class="row m-0 p-0 col-xl-12 col-md-12 col-sm-12 col-12 mb-3">
                            <!-- Nombres -->
                            <div class="gmail-box d-flex justify-content-start">
                                <a href="https://api.whatsapp.com/send?phone= 951538036&amp;text=Saludos cordinales, deseO comunicarme con usted para:"
                                    target="_blank" class="gmail">
                                    <h4><i class="fa-brands fa-whatsapp"></i>
                                        ###-###-###</h4>
                                </a>
                                <a target="_blank" href="mailto:dev@silfersystem.com" class="gmail px-5">
                                    <h4><i class="fa fa-envelope"></i>
                                        dev@silfersystem.com</h4>
                                </a>
                            </div>
                        </div>
                    </fieldset>
                </div>
            </div>
            <div class="card-footer text-lg-end text-end">
                <button id="btnRegistrarTD" type="button" class="btn btn-primary btn-sm ">Registrar</button>
            </div>
        </div>
    </div>
    <!-- /tab-content -->
</form>
{{-- form end --}}