@inject IViewLocalizer Localizer
@using Microsoft.AspNetCore.Mvc.Localization
@model LiteCharmsSecurity.STS.Identity.ViewModels.Account.RegisterViewModel
@{
    ViewData["Title"] = Localizer["Title"];
}

<div class="py-8">
    <h1 class="text-4xl font-bold mb-2">@ViewData["Title"]</h1>

    @await Html.PartialAsync("_ValidationSummary")

    <div class="card mt-6">
        <div class="card-header">
            <h2 class="card-title">@Localizer["SubTitle"]</h2>
        </div>
        <div class="card-content">
            <form asp-controller="Account" asp-action="Register" asp-route-returnurl="@ViewData["ReturnUrl"]" method="post" class="space-y-6">
                <div class="form-item">
                    <label asp-for="UserName" class="form-label">
                        <lucideicon name="user" class="inline-block h-4 w-4 mr-1" />
                        @Localizer["UserName"]
                    </label>
                    <input asp-for="UserName" class="input" tw-validation />
                    <span asp-validation-for="UserName" class="form-message"></span>
                </div>
                <div class="form-item">
                    <label asp-for="Email" class="form-label">
                        <lucideicon name="mail" class="inline-block h-4 w-4 mr-1" />
                        @Localizer["Email"]
                    </label>
                    <input asp-for="Email" class="input" tw-validation />
                    <span asp-validation-for="Email" class="form-message"></span>
                </div>
                <div class="form-item">
                    <label asp-for="Password" class="form-label">
                        <lucideicon name="lock" class="inline-block h-4 w-4 mr-1" />
                        @Localizer["Password"]
                    </label>
                    <input asp-for="Password" type="password" class="input" tw-validation />
                    <span asp-validation-for="Password" class="form-message"></span>
                </div>
                <div class="form-item">
                    <label asp-for="ConfirmPassword" class="form-label">
                        <lucideicon name="lock-keyhole" class="inline-block h-4 w-4 mr-1" />
                        @Localizer["ConfirmPassword"]
                    </label>
                    <input asp-for="ConfirmPassword" type="password" class="input" tw-validation />
                    <span asp-validation-for="ConfirmPassword" class="form-message"></span>
                </div>
                <div>
                    <button type="submit" class="btn-default">
                        <lucideicon name="user-plus" class="inline-block h-4 w-4 mr-2" />
                        @Localizer["Button"]
                    </button>
                </div>
            </form>
        </div>
    </div>
</div>