@extends('layouts.admin')

@section('content')
	<h1 class="text-2xl font-semibold mb-4">My Account</h1>
	<form action="{{ route('admin.account.store') }}" method="POST" class="w-full max-w-3xl mx-auto">
	@csrf
	<div class="grid grid-cols-1 sm:grid-cols-2 gap-4">
		<x-admin.input label="Name" name="name">
			<input
				type="text"
				name="name"
				id="name"
				value="{{ old('name', auth()->user()->name) }}"
				class="block w-full border rounded px-3 py-2"
				required
				/>
		</x-admin.input>
		<x-admin.input label="Email" name="email">
			<input
				type="email"
				name="email"
				id="email"
				value="{{ old('email', auth()->user()->email) }}"
				class="block w-full border rounded px-3 py-2"
				required
				/>
		</x-admin.input>
		<h2 class="text-lg font-semibold mb-2 col-span-2">Change Password</h2>
		<p class="text-sm text-gray-500 mb-4 col-span-2">
			To change your password, enter your current password and a new one below.
			Leave blank to keep your existing password.
		</p>
		<x-admin.input label="Current Password" name="current_password">
			<input
				type="password"
				name="current_password"
				id="current_password"
				class="block w-full border rounded px-3 py-2"
				placeholder="Required only if changing password"
				/>
		</x-admin.input>
		<x-admin.input label="New Password" name="password">
			<input
				type="password"
				name="password"
				id="password"
				class="block w-full border rounded px-3 py-2"
				placeholder="Leave blank to keep current password"
				/>
		</x-admin.input>
		<x-admin.input label="Confirm New Password" name="password_confirmation">
			<input
				type="password"
				name="password_confirmation"
				id="password_confirmation"
				class="block w-full border rounded px-3 py-2"
				/>
		</x-admin.input>
	</div>
	<x-admin.submit text="Save Changes" />
	</form>
@endsection