<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Connexion - Plateforme d'Inscription</title>
    <!-- Bootstrap CSS -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/css/bootstrap.min.css" rel="stylesheet">
    <!-- Font Awesome -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
    <!-- Google Fonts - Montserrat -->
    <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;500;600;700&display=swap" rel="stylesheet">
    <link href="../auth-style.css" rel="stylesheet">

</head>
<body>
<div class="container-custom">
    <div class="card main-card">
        <div class="logo">
            <div class="logo-icon">
                <i class="fas fa-graduation-cap"></i>
            </div>
            <h1>Plateforme EST</h1>
        </div>



       <form id="loginForm" method="POST" action="">
    <div class="row"> <!-- Hna fin k-t-t-jam3 l-grid -->
        
        <div class="col- mb-3"> 
            <label class="form-label">CIN</label>
            <div class="input-with-icon">
            <i class="fas fa-user"></i>
            <input type="text" class="form-control" name="cin" id="cin" placeholder="Entrez votre CIN" required >
             
            <div id="cin-error" class="text-danger" style="display: none;">
                 Le CIN n'existe pas.
            </div>
         </div>

        <div class="col- mb-3"> 
            <label class="form-label">Email</label>
            <div class="input-with-icon">
            <i class="fas fa-user"></i>
            <input type="email" class="form-control" name="email" id="email" placeholder="Entrez votre Email" required >

             
            <div id="email-error" class="text-danger" style="display: none;">
                  L'email n'existe pas.
            </div>
         </div>

        <div class="col- mb-3"> 
            <label class="form-label">Nom</label>
            <div class="input-with-icon">
             <i class="fas fa-user"></i>
            <input type="text" class="form-control" name="nom" id="nom" placeholder="Entrez votre Nom" required >
          
            <div id="nom-error" class="text-danger" style="display: none;">
                  ce nom n'existe pas.
            </div>
         </div>

        <div class="col- mb-3"> 
            <label class="form-label">Prenom</label>
            <div class="input-with-icon">
            <i class="fas fa-user"></i>
            <input type="text" class="form-control" name="prenom" id="prenom" placeholder="Entrez votre Prenom" required >
            
            <div id="prenom-error" class="text-danger" style="display: none;">
                  ce prenom n'existe pas.
            </div>
         </div>

         <div class="col- mb-3"> 
            <label class="form-label">Phone</label>
            <div class="input-with-icon">
            <i class="fas fa-user"></i>
            <input type="text" class="form-control" name="Phone" id="Phone" placeholder="Phone" required >
        
             <div id="Phone-error" class="text-danger" style="display: none;">
                  Le phone n'existe pas.
            </div>
         </div>

        <div class="col- mb-3"> 
            <label class="form-label">login</label>
            <div class="input-with-icon">
            <i class="fas fa-user"></i>
            <input type="text" class="form-control" name="login" id="login" placeholder="login" required >
        
             <div id="login-error" class="text-danger" style="display: none;">
                  le login n'existe pas.
            </div>
         </div>

        <div class="col- mb-3"> 
            <label class="form-label">Password  </label>
            <div class="input-with-icon">
            <i class="fas fa-lock"></i>
            <input type="password" class="form-control" name="Password" id="Password" placeholder="Password" required >
        
             <div id="Password-error" class="text-danger" style="display: none;">
                   le password n'existe pas.
            </div>
         </div>
    </div> <!-- Hna k-t-ssali l-row -->
        </form>
           <div class="forgot-password">
                <a href="/est-concours/app/cnx/employee/forgot-password" >Mot de passe oublié ?</a>
            </div>

          <button type="button" id="btn-create-employee" class="btn btn-custom-secondary">
                  <i class="fas fa-user-plus"></i> Créer un compte
          </button>

            <div class="separator">
                <span>Avez vous deja un compte ?</span>
            </div>

            <button type="button" class="btn btn-custom-primary d-flex align-items-center justify-content-center gap-2 mb-3"  onclick="redirectToLogin()">
                <i class="fas fa-sign-in-alt"></i> Se Connecter
            </button>

            <!-- <div class="admin-link">
                 <a href="admin-login.php">
                     <i class="fas fa-cog"></i> Accès Administration
                 </a>
             </div>-->
        </form>
    </div>
</div>

<script src="main.js" defer></script>

<!-- Bootstrap JS Bundle with Popper -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap/5.3.0/js/bootstrap.bundle.min.js"></script>


</body>
</html>
