@model EnotaryoPH.Web.Common.Models.IdentificationDocumentModel
@section Head {
    <link href="/lib/fontawesome-free-6.7.1-web/css/all.min.css" rel="stylesheet" />
}

<div class="row">
    <div class="col-12 col-lg-5 col-xl-4">
        <div class="card">
            <a href="#" target="_self" class="identification-document__a">
                <img id="identification-document__a__img" class="identification-document__a__img card-img w-100 d-block fit-cover identification-document__upload__image" src="@(!string.IsNullOrEmpty(Model.ImageBase64Url) ? Model.ImageBase64Url : "/images/image-white-on-gray-400x300.jpg")" style="height: 300px;" />
            </a>
            @Html.ValidationMessageFor(m => m.File)
            <div class="card-body p-2">
                <input type="hidden" asp-for="ImageBase64Url" class="identification-document__base64" />
                <input type="text" asp-for="Filename" class="card-text mb-1 form-control-plaintext identification-document__filename" />
                <div>
                    <input class="identification-document__upload__file" type="file" style="display:none;" asp-for="File" accept="image/*;capture=camera" capture="camera" />
                    <button class="btn btn-secondary btn-sm me-1 identification-document__upload__button" type="button">Upload Photo<i class="fas fa-upload ms-1"></i></button>
                </div>
            </div>
        </div>
    </div>
    <div class="col">
        <div class="row">
            <div class="col-12 col-lg-7">
                <div class="mb-3">
                    <label class="form-label">Type</label>
                    <select class="form-select form-select" required asp-for="IdentificationType" asp-items="Model.IdentificationTypes">
                        <option value="" selected>Choose an option</option>
                    </select>
                    @Html.ValidationMessageFor(m => m.IdentificationType)
                </div>
            </div>
            <div class="col-12 col-lg-7">
                <div class="mb-3">
                    <label class="form-label">ID Number</label>
                    <input class="form-control form-control" type="text" required asp-for="IdNumber" />
                    @Html.ValidationMessageFor(m => m.IdNumber)
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-12 col-lg-7">
                <div class="mb-3">
                    <label class="form-label">Place Issued</label>
                    <input class="form-control form-control" type="text" required asp-for="PlaceIssued" />
                    @Html.ValidationMessageFor(m => m.PlaceIssued)
                </div>
            </div>
            <div class="col-12 col-lg-7">
                <div class="row">
                    <div class="col-12 col-sm-6">
                        <div class="mb-3">
                            <label class="form-label" asp-for="ExpirationDate">Expiration Date</label>
                            <input class="form-control form-control" type="date" required asp-for="ExpirationDate" />
                            @Html.ValidationMessageFor(m => m.ExpirationDate)
                        </div>
                    </div>
                    <div class="col-12 col-sm-6">
                        <div class="mb-3">
                            <label class="form-label" asp-for="DateIssued">Date Issued</label>
                            <input class="form-control form-control" type="date" required asp-for="DateIssued" />
                            @Html.ValidationMessageFor(m => m.DateIssued)
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>