@page "/login"
@layout MinimalLayout
@using ReAct_PME.WebUI.ServicesUI

<PageTitle>Login - ReAct_PME</PageTitle>

<div class="login-container">
    <div class="login-image"></div>

    <div class="login-form-section">
        <h1>AI-100-SaaS</h1>
        <p>Bienvenue sur votre nouvelle application</p>

        <h3>Connexion</h3>

        <EditForm Model="loginModel" OnValidSubmit="HandleLogin" class="login-form">
            <video id="video" autoplay playsinline style="display:none"></video>
            <canvas id="canvas" style="display:none"></canvas>
            <label> Nom utilisateur</label>
            <InputText @bind-Value="loginModel.Username"
                       placeholder="Utilisateur"
                       class="form-input" />
            <label>Mot de passe</label>
            <InputText @bind-Value="loginModel.Password"
                       type="password"
                       placeholder="Mot de passe"
                       class="form-input" />

            <button type="submit" class="btn btn-login btn-tertiary">
                Se connecter
            </button>
        </EditForm>

        @if (!string.IsNullOrEmpty(errorMessage))
        {
            <p class="error-message">@errorMessage</p>
        }
    </div>
</div>
                