<?php
    if (file_exists("./content/header.php")){
        include_once("./content/header.php");
    }
?>
<div class="pageCnt">
    <div class="centerCell">
        <div class="card">
            <div class="regTitCnt">
                <div class="lvlRegTit poppins-bold" id="titleLvlNat">Nivel Básico</div>
                <div class="lvlRegDsc poppins-regular" id="dscLvlNat">Complete los siguientes datos de profesión y residencia para subir de nivel en la aplicación.</div>
            </div>
            <div class="regForm">
                <div class="tableCnt">
                    <div class="tableForm tableFormDiv">
                        <div class="cellForm cellForm25">
                            <div class="divForm">
                                
                                <p class="poppins-bold">Sexo</p>
                                <select id="gender" name="gender" class="frmInpt poppins-regular">
                                    <option value="" class="poppins-medium"  selected>Selecciona</option>
                                    <option class="poppins-medium" value="M">Masculino</option>
                                    <option class="poppins-medium" value="F">Femenino</option>
                                 </select>
                                <div class="poppins-regular errorReg"></div>
                            </div>
                        </div>
                        <div class="cellForm cellForm25">
                            <div class="divForm">
                                <p class="poppins-bold">Estado Civil</p>
                                <select id="maritalstatus" name="maritalstatus" class="frmInpt poppins-regular">
                                    <option value="" class="poppins-medium" selected >Selecciona</option>
                                    <option class="poppins-medium" value="1">Soltero</option>
                                    <option class="poppins-medium" value="2">Casado</option>
                                    <option class="poppins-medium" value="3">Divorciado</option>
                                    <option class="poppins-medium" value="4">Viudo</option>
                                 </select>
                                <div class="poppins-regular errorReg"></div>
                            </div>
                        </div>
                        <div class="cellForm cellForm25">
                            <div class="divForm">
                                <p class="poppins-bold">Estado de Residencia</p>
                                <select id="regionid" name="regionid" class="frmInpt poppins-regular">
                                    <option value="" class="poppins-medium" selected >Selecciona</option>
                                 </select>
                                <div class="poppins-regular errorReg"></div>
                            </div>
                        </div>
                        <div class="cellForm cellForm25">
                            <div class="divForm">
                                <p class="poppins-bold">Ciudad de Residencia</p>
                                <select id="cityid" name="cityid" class="frmInpt poppins-regular">
                                    <option value="" class="poppins-medium" selected >Selecciona</option>
                                 </select>
                                <div class="poppins-regular errorReg"></div>
                            </div>
                        </div>                   
                    </div>
                    <div class="tableForm">
                        <div class="cellForm cellForm50">
                            <div class="divForm" >
                                <p class="poppins-bold">Profesión</p>
                                <input type="text" name="profession" placeholder="Profesión" class="frmInpt poppins-regular" id="profession">                                
                                <div class="poppins-regular errorReg"></div>
                            </div>
                        </div>
                        <div class="cellForm cellForm50">
                            <div class="divForm" >
                                <p class="poppins-bold">Actividad Económica</p>
                                <select id="economicactivity" name="economicalactivity" class="frmInpt poppins-regular">
                                    <option value="" class="poppins-medium" selected >Selecciona</option>
                                 </select>
                                 <div class="poppins-regular errorReg"></div>
                            </div>
                        </div>              
                    </div>
                    <div class="tableForm">
                        <div class="cellForm cellForm50">
                            <div class="divForm">
                                <span class="infBtnLbl poppins-italic" id="companyOpt">Opcional</span>
                                <p class="poppins-bold">Nombre de Empresa</p>
                                <input type="text" name="company" placeholder="Nombre de empresa" class="frmInpt poppins-regular" id="company">                                
                                <div class="poppins-regular errorReg"></div>
                            </div>
                        </div>
                        <div class="cellForm cellForm50">
                            <div class="divForm" >
                                <p class="poppins-bold">Ocupación</p>
                                <select id="ocupation" name="ocupation" class="frmInpt poppins-regular">
                                    <option value="" class="poppins-medium" selected >Selecciona</option>
                                 </select>
                                 <div class="poppins-regular errorReg"></div>
                            </div>
                        </div>              
                    </div>
                    <div class="tableForm tableFormDiv">
                        <div class="cellForm cellForm50">
                            <div class="divForm">
                                <div class="cellSwitch">
                                    <div class="toggle">
                                        <label class="switch">
                                            <input type="checkbox" id="independentdealer">
                                            <span class="slider round"></span>
                                        </label>
                                    </div>
                                </div>
                                <div class="cellLbl">
                                    <div class="lblStat poppins-bold">
                                        <span>Comerciante Independiente</span>
                                    </div>
                                </div>
                            </div>
                            <div class="poppins-regular errorReg"></div>
                        </div>
                        <div class="cellForm cellForm50">
                        </div>
                    </div>                   
                    <div class="tableForm">
                        <div class="cellForm cellForm75">
                            <div class="divForm">
                                <p class="poppins-bold">Dirección de residencia</p>
                                <input type="text" name="street" placeholder="Dirección de residencia" class="frmInpt poppins-regular" id="street">                                
                                <div class="poppins-regular errorReg"></div>
                            </div>
                        </div>
                        <div class="cellForm cellForm25">
                            <div class="divForm" >
                                <p class="poppins-bold">Código postal</p>
                                <input type="text" name="postalcode" placeholder="Código postal" class="frmInpt poppins-regular" id="postalcode">                                
                                <div class="poppins-regular errorReg"></div>
                            </div>
                        </div>              
                    </div>
                    <div class="upldsCnt tableFormDiv" id="upldsCnt">
                        <div class="tableForm">
                            <div class="cellForm cellForm50">
                                <div class="divForm">
                                    <p class="poppins-bold upsLbl">Selfie con documento de identidad</p>
                                    <div class="divSearch">
                                        <div class="frmInpt searchText">
                                            <div class="poppins-regular">Seleccione</div>
                                        </div>
                                        <div class="searchBar">
                                            <input id="file01" type="file" class="fileInpt">
                                            <button type="submit" class="blueBtn poppins-medium searchLabel search">
                                                BUSCAR
                                            </button>
                                        </div>
                                    </div>
                                    <div class="poppins-regular errorReg"></div>
                                </div>
                            </div>
                            <div class="cellForm cellForm50">
                                <div class="divForm">
                                    <p class="poppins-bold invisible">-</p>
                                    <div class="tblImgBar">
                                        <div class="cellForm cellForm50 upProgCell invisible">
                                            <div class="progress">
                                                <div class="progBar"></div>
                                                <div class="progInfCnt">
                                                    <div class="cellIcProg">
                                                        <img src="./img/ic_aceptOn.svg">
                                                    </div>
                                                    <div class="cellTxtProg">
                                                        <p class="poppins-regular successfulUploadLabel">
                                                            Carga Exitosa
                                                        </p>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="cellForm cellForm25 upPrevCell" >
                                            <button class="notReadyButton poppins-medium" >
                                                Vista Previa
                                            </button>
                                        </div> 
                                        <div class="cellForm cellForm25 upDelCell" >
                                            <button  class="delUp notReadyButton poppins-medium" >
                                                Eliminar
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="tableForm">
                        <div class="cellForm cellForm50">
                            <div class="divForm">
                                <p class="poppins-bold">País emisor de documento de identidad</p>
                                <select id="doccountryid" name="doccountryid" class="frmInpt poppins-regular">
                                 </select>
                                <div class="poppins-regular errorReg"></div>
                            </div>
                        </div>
                        <div class="cellForm cellForm25">
                            <div class="divForm">
                                <p class="poppins-bold">Fecha de Emisión</p>
                                <input type="date" name="docissue" style="text-indent:6px" class="frmInpt poppins-regular" id="docissue">
                                <div class="poppins-regular errorReg"></div>
                            </div>
                        </div>
                        <div class="cellForm cellForm25">
                            <div class="divForm">
                                <p class="poppins-bold">Fecha de Expiración</p>
                                <input type="date" name="docexpiry" style="text-indent:6px" class="frmInpt poppins-regular" id="docexpiry">
                                <div class="poppins-regular errorReg"></div>
                            </div>
                        </div>                   
                    </div>
                    <div class="tableForm tableFormDiv">
                        <div class="cellForm cellForm50">
                            <div class="divForm">
                                <div class="cellSwitch">
                                    <div class="toggle">
                                        <label class="switch">
                                            <input type="checkbox" id="american">
                                            <span class="slider round"></span>
                                        </label>
                                    </div>
                                </div>
                                <div class="cellLbl">
                                    <div class="lblStat poppins-bold">
                                        <span>Ciudadano Americano</span>
                                    </div>
                                </div>
                            </div>
                            <div class="poppins-regular errorReg"></div>
                        </div>
                        <div class="cellForm cellForm50">
                        </div>
                    </div>  
                    <div class="tableForm tableFormDiv">
                        <div class="cellForm cellForm50">
                            
                        </div>
                        <div class="cellForm cellForm50">
                            <div class="divForm">
                            </div>
                        </div>                
                    </div>
                    <div class="tableForm tableFormDiv">
                        <div class="cellForm cellForm50">
                            <div class="divForm">
                                <div class="cellSwitch">
                                    <div class="toggle">
                                        <label class="switch">
                                            <input type="checkbox" id="politicallyexposed">
                                            <span class="slider round"></span>
                                        </label>
                                    </div>
                                </div>
                                <div class="cellLbl">
                                    <div class="lblStat poppins-bold">
                                        <span>Persona Expuesta Póliticamente (PEP)</span>
                                    </div>
                                </div>
                            </div>
                            <div class="poppins-regular errorReg"></div>
                            <div class="txtLngCnt">
                                <div class="pepFrmCnt">
                                    <div class="tableForm" >
                                        <div class="cellForm cellForm50">
                                            <div class="divForm">
                                                <p class="poppins-bold">Nombre del ente adscrito</p>
                                                <input type="text" name="affiliationbody" placeholder="Nombre del ente adscrito" class="frmInpt poppins-regular" id="affiliationbody">                                
                                                <div class="poppins-regular errorReg"></div>
                                            </div>
                                        </div>
                                        <div class="cellForm cellForm50">
                                            <div class="divForm" >
                                                <p class="poppins-bold">Cargo que desempeña</p>
                                                <input type="text" name="positionheld" placeholder="Cargo que desempeña" class="frmInpt poppins-regular" id="positionheld">                                
                                                <div class="poppins-regular errorReg"></div>
                                            </div>
                                        </div>              
                                    </div>
                                    <div class="tableForm" >
                                        <div class="cellForm cellForm50">
                                            <div class="divForm">
                                                <p class="poppins-bold">País</p>
                                                <select id="pepcountryid" name="pepcountryid" class="frmInpt poppins-regular">
                                                </select>                       
                                                <div class="poppins-regular errorReg"></div>
                                            </div>
                                        </div>
                                        <div class="cellForm cellForm50">
                                            <div class="divForm" >
                                                <p class="poppins-bold">Identificación del relacionado</p>
                                                <input type="text" name="peprelatedid" placeholder="V1234567" class="frmInpt poppins-regular" id="peprelatedid">                                
                                                <div class="poppins-regular errorReg"></div>
                                            </div>
                                        </div>              
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="cellForm cellForm50">
                        </div>
                    </div>  
                    <div class="buttons">
                        <div id="previous"><button type="submit" id="previous-button" class="poppins-medium whiteBtn"></button></div>
                        <div id="later"><button type="submit" id="later-button" class="poppins-medium whiteBtn"></button></div>
                        <div id="save"><button type="submit" id="save-button" class="poppins-medium blueBtn"></button></div>
                        <div id="next"><button type="submit" id="next-button" class="poppins-medium blueBtn"></button></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
