{% extends "../../admin-njk/layouts/master.njk" %}

{% block csslib %}
	<link href='/cms-static/admin/assets/plugins/custom/datatables/datatables.bundle.css' rel='stylesheet' type='text/css'/>
{% endblock %}

{% block jslib %}
	<script src='/cms-static/admin/assets/plugins/custom/datatables/datatables.bundle.js'></script>

	<script src='/cms-static/common/js/form-data-json.min.js'></script>
	<script src='/cms-static/common/js/es-form.js'></script>
{% endblock %}

{% block content %}
	{% block title %}
		<title>Profile Update - {{browserTitle | upper()}} CMS</title>
	{% endblock %}
	
	<div class="d-flex flex-column flex-column-fluid">
		<div class="app-toolbar py-3 py-lg-6" id="beaver_app_toolbar">
			<div class="app-container container-xxl d-flex flex-stack" id="beaver_app_toolbar_container">
				<div class="page-title d-flex flex-column justify-content-center flex-wrap me-3">
					<h1 class="page-heading d-flex text-dark fw-bold fs-3 flex-column justify-content-center my-0">Account Settings</h1>
					<ul class="breadcrumb breadcrumb-separatorless fw-semibold fs-7 my-0 pt-1">
						<li class="breadcrumb-item text-muted">
							<a class="text-muted text-hover-primary" >Dashboard</a>
						</li>
						<li class="breadcrumb-item">
							<span class="bullet bg-gray-400 w-5px h-2px"></span></li>
						<li class="breadcrumb-item text-muted">Account <span class="bullet bg-gray-400 w-5px h-2px"></span></li>
						<li class="breadcrumb-item text-muted">Profile Update</li>
					</ul>
				</div>
			</div>
		</div>
		<div class="app-content flex-column-fluid" id="beaver_app_content">
			<div class="app-container container-xxl" id="beaver_app_content_container">
				<div class="card mb-5 mb-xl-10">
					<div class="card-header border-0 cursor-pointer" role="button" data-bs-toggle="collapse" data-bs-target="#beaver_account_profile_details" aria-expanded="true" aria-controls="beaver_account_profile_details">
						<div class="card-title m-0">
							<h3 class="fw-bold m-0">Profile Update</h3>
						</div>
					</div>
					<div id="beaver_account_settings_profile_details">
						<form class="form es-form" id="beaver_account_profile_details_form" action="/admin/admin-user/update-profile" data-redirect-url="/admin/admin-user" method="post" autocomplete="off">
							<div class="card-body border-top p-9">
								<div class="row mb-6">
									<label class="col-lg-4 col-form-label required fw-semibold fs-6">Name</label>
									<div class="col-lg-8">
										<div class="row">
											<div class="col-lg-12 fv-row">
												<input type="text" class="form-control form-control-lg form-control-solid mb-3 mb-lg-0" name="name" placeholder="First name" value="{{ userDetails.name }}">
												<div class="fv-plugins-message-container invalid-feedback" id="field-error-name"></div>
											</div>
										</div>
									</div>
								</div>
								<div class="row mb-6">
									<label class="col-lg-4 col-form-label required fw-semibold fs-6">Email</label>
									<div class="col-lg-8 fv-row">
										<input type="text" class="form-control form-control-lg form-control-solid" name="email" placeholder="Company name" value="{{ userDetails.email }}">
										<div class="fv-plugins-message-container invalid-feedback" id="field-error-email"></div>
									</div>
								</div>
								<div class="row mb-6">
									<label class="col-lg-4 col-form-label fw-semibold fs-6">
										<span class="required">Current Password</span>
										<i class="fas fa-exclamation-circle ms-1 fs-7" data-bs-toggle="tooltip" title="Current password should be enter to update profile details"></i>
									</label>
									<div class="col-lg-8 fv-row">
										<input class="form-control form-control-lg form-control-solid" type="password" name="password" placeholder="Current Password" value="" autocomplete="new-password"/>
										<div class="fv-plugins-message-container invalid-feedback" id="field-error-password"></div>
									</div>
								</div>
							</div>
							<div class="card-footer d-flex justify-content-end py-6 px-9">
								<button class="btn btn-primary form-submit-btn" id="beaver_account_profile_details_submit" type="submit">
									<span class="preloader d-none">Updating</span>
									<span class="label">Save Changes</span></button>
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>
	</div>

{% endblock %}