@extends('layouts.default')
@section('content')
			<div class="page-title">
					<nav aria-label="breadcrumb">
		<ol class="breadcrumb">
			<li><h1>Edit profile</h1></li>
			<li class="breadcrumb-item">
				<a href="{{ url('index') }}">
					<svg width="16" height="16" viewBox="0 0 17 17" fill="none" xmlns="http://www.w3.org/2000/svg">
						<path d="M2.125 6.375L8.5 1.41667L14.875 6.375V14.1667C14.875 14.5424 14.7257 14.9027 14.4601 15.1684C14.1944 15.4341 13.8341 15.5833 13.4583 15.5833H3.54167C3.16594 15.5833 2.80561 15.4341 2.53993 15.1684C2.27426 14.9027 2.125 14.5424 2.125 14.1667V6.375Z" stroke="var(--bs-body-color)" stroke-linecap="round" stroke-linejoin="round"/>
						<path d="M6.375 15.5833V8.5H10.625V15.5833" stroke="var(--bs-body-color)" stroke-linecap="round" stroke-linejoin="round"/>
					</svg>
					Home
				</a>
			</li>
			<li class="breadcrumb-item active" aria-current="page">Edit profile</li>
		</ol>
	</nav>
			</div>
			<div class="container-fluid">

				<div class="row">
					<div class="col-xl-3">
						<div class="card h-auto">
							<div class="card-body py-sm-5">
								<div class="text-center">
									<div class="avatar avatar-xl avatar-preview rounded-circle">
										<img class="imagePreview w-100 h-100" src="{{ asset('images/avatar/middle/avatar2.webp') }}" alt="Avatar">
										<input type="file" class="imageUpload d-none" accept=".png, .jpg, .jpeg">
										<a href="javascript:void(0);" class="btn btn-square btn-primary btn-sm position-absolute bottom-0 end-0 shadow-sm upload-trigger rounded-circle border-2 border-white">
											<i class="fa fa-camera "></i>
										</a>
									</div>
									<div class="clearfix mt-3">
										<h6 class="mb-0">Elijah James</h6>
										<span>Developer</span>
									</div>
								</div>
							</div>
							<ul class="list-group list-group-flush">
								<li class="list-group-item d-flex justify-content-between py-3"><a href="app-profile">Models</a><span>36</span></li>
								<li class="list-group-item d-flex justify-content-between py-3"><a href="javascript:void(0);">Gallery</a><span>3</span></li>
								<li class="list-group-item d-flex justify-content-between py-3"><a href="app-profile">Lessons</a><span>1</span></li>
							</ul>
							<div class="card-footer p-4">
								<a href="javascript:void(0);" class="btn btn-outline-light w-100">Portfolio</a>
								<a href="https://www.dexignzone.com" target="_blank" class="btn btn-outline-primary w-100 mt-2"><span class="overflow-hidden">https://www.dexignzone.com</span></a>
							</div>
						</div>
					</div>
					<div class="col-xl-9">
						<form>
							<div class="card m-b30">
								<div class="card-header">
									<h6 class="card-title">Account Setup</h6>
								</div>
								<div class="card-body">
									<div class="row">
										<div class="col-sm-6 mb-4">
											<label class="form-label">First Name</label>
											<input type="text" class="form-control" value="John">
										</div>
										<div class="col-sm-6 mb-4">
											<label class="form-label">Last Name</label>
											<input type="text" class="form-control" value="Doe">
										</div>
										<div class="col-sm-6 mb-4">
											<label class="form-label">Specialty</label>
											<input type="text" class="form-control" value="Developer">
										</div>
										<div class="col-sm-6 mb-4">
											<label class="form-label">Skills</label>
											<input type="text" class="form-control basic-tagify" value="HTML, JavaScript, PHP">
										</div>
										<div class="col-sm-6 mb-4">
											<label class="form-label">Gender</label>
											<select class="selectpicker form-select" id="validationCustom05">
												<option  data-display="Select">Please select</option>
												<option value="html">Male</option>
												<option value="css">Female</option>
												<option value="javascript">Other</option>
											</select>
										</div>
										<div class="col-sm-6 mb-4">
											<label class="form-label">Birth</label>
											<input class="form-control bs-datepicker" type="text" value="03/13/2025">
										</div>
										<div class="col-sm-6 mb-4">
											<label class="form-label">Phone</label>
											<input type="number" class="form-control type-number" value="12345">
										</div>
										<div class="col-sm-6 mb-4">
											<label class="form-label">Email address</label>
											<input type="text" class="form-control" value="demo@gmail.com">
										</div>
										<div class="col-sm-6 mb-4">
											<label class="form-label">Country</label>
											<select class="selectpicker form-select" id="validationCustom01">
												<option  data-display="Select">Please select</option>
												<option value="russia">Russia</option>
												<option value="canada">Canada</option>
												<option value="china">China</option>
												<option value="india">India</option>
											</select>
										</div>
										<div class="col-sm-6 mb-4">
											<label class="form-label">City</label>
											<select class="selectpicker form-select" id="validationCustom02">
												<option  data-display="Select">Please select</option>
												<option>Krasnodar</option>
												<option>Tyumen</option>
												<option>Chelyabinsk</option>
												<option>Moscow</option>
											</select>
										</div>
									</div>
								</div>
								<div class="card-footer">
									<button class="btn btn-primary me-1">UPDATE</button>
									<a href="register" class="btn btn-link">Forgot your password?</a>
								</div>
							</div>
						</form>
					</div>
				</div>
           
			</div>
@endsection