Appointment Form - Copy this React, Tailwind Component to your project

<! Appointment Start > <div class="container fluid py 5" id="registrar"> <div class="container py 5"> <div class="bg appointment rounded"> <div class="row h 100 align items center justify content center"> <div class="col lg 6 py 5"> <div class="rounded p 5 my 5" style="background: rgba(55, 55, 63, .7);"> <h1 class="text center text white mb 4">Llena el siguiente formulario para registrar tu información</h1> <div class="form group"> <input type="number" class="form control border 0 p 4" placeholder="Numero de Documento de Identidad" id="txt_documento" required="required" onkeypress="return soloNumeros(event)" /> </div> <div class="form group"> <input type="text" class="form control border 0 p 4" placeholder="Nombre Completo" id="txt_nombre" required="required" /> </div> <div class="form group"> <input type="number" class="form control border 0 p 4" placeholder="Numero de Celular" id="txt_celular" required="required" /> </div> <div class="form group"> <select class="custom select border 0 px 4" id="select_departamento" onchange="Cargar_Select_Provincia()" style="height: 47px;"> </select> </div> <div class="form group"> <select class="custom select border 0 px 4" id="select_provincia" onchange="Cargar_Select_Distrito()" style="height: 47px;"> </select> </div> <div class="form group"> <select class="custom select border 0 px 4" id="select_distrito" style="height: 47px;"> </select> </div> <div> <button class="btn btn primary btn block border 0 py 3" onclick=" Registrar_Cliente();" type="submit">Registrar</button> </div> </form> </div> </div> </div> </div> </div> </div> <! Appointment End > estructutra ese codigo para que el formulario sea mas amigable con el usuario