@extends('components.layouts.platform-app', ['platformSiteSettings' => $platformSiteSettings ?? null])

@section('title', '정보수정')

@section('content-shell')
    <div class="mx-auto w-full max-width px-4 py-6 md:px-6 lg:px-8">
        <div class="mx-auto max-w-4xl space-y-6">
            @if (session('status'))
                <x-ui.alert variant="success" title="안내">
                    {{ session('status') }}
                </x-ui.alert>
            @endif

            @if ($errors->any())
                <x-ui.alert variant="danger" title="입력 오류">
                    <ul class="m-0 list-disc space-y-1 pl-5">
                        @foreach ($errors->all() as $error)
                            <li>{{ $error }}</li>
                        @endforeach
                    </ul>
                </x-ui.alert>
            @endif

            <div class="grid gap-4 lg:grid-cols-[minmax(0,1.3fr)_minmax(280px,0.7fr)]">
                <x-ui.card padded class="space-y-5 border border-muted bg-card shadow-sm">
                    <div class="space-y-2">
                        <div class="text-xs font-bold uppercase tracking-[0.18em] c-subtle">Account</div>
                        <h1 class="text-2xl font-extrabold tracking-[-0.05em] c-main">내 정보 수정</h1>
                        <p class="text-sm leading-6 c-muted">
                            이름, 이메일, 비밀번호를 변경할 수 있습니다.
                        </p>
                    </div>

                    <form method="POST" action="{{ route('user.update') }}" class="space-y-4">
                        @csrf
                        @method('PUT')

                        <div class="grid gap-4 md:grid-cols-2">
                            <x-ui.input
                                floating
                                id="name"
                                name="name"
                                type="text"
                                label="이름"
                                autocomplete="name"
                                :value="old('name', $user?->name)"
                                :error="$errors->first('name')"
                                required
                            />

                            <x-ui.input
                                floating
                                id="email"
                                name="email"
                                type="email"
                                label="이메일"
                                autocomplete="email"
                                :value="old('email', $user?->email)"
                                :error="$errors->first('email')"
                                required
                            />
                        </div>

                        <div class="rounded-[var(--radius-xl)] border border-muted bg-surface p-4">
                            <div class="space-y-1">
                                <div class="text-sm font-extrabold tracking-[-0.03em] c-main">비밀번호 변경</div>
                                <p class="text-xs leading-5 c-muted">
                                    비밀번호를 바꾸려면 현재 비밀번호를 함께 입력하세요. 비워두면 변경되지 않습니다.
                                </p>
                            </div>

                            <div class="mt-4 grid gap-4">
                                <x-ui.input
                                    floating
                                    id="current_password"
                                    name="current_password"
                                    type="password"
                                    label="현재 비밀번호"
                                    autocomplete="current-password"
                                    :error="$errors->first('current_password')"
                                />

                                <div class="grid gap-4 md:grid-cols-2">
                                    <x-ui.input
                                        floating
                                        id="password"
                                        name="password"
                                        type="password"
                                        label="새 비밀번호"
                                        autocomplete="new-password"
                                        :error="$errors->first('password')"
                                    />

                                    <x-ui.input
                                        floating
                                        id="password_confirmation"
                                        name="password_confirmation"
                                        type="password"
                                        label="새 비밀번호 확인"
                                        autocomplete="new-password"
                                    />
                                </div>
                            </div>
                        </div>

                        <div class="flex flex-wrap items-center gap-3 pt-2">
                            <x-ui.button type="submit" variant="primary" size="md">
                                저장하기
                            </x-ui.button>

                            <x-ui.button href="{{ route('platform.home') }}" variant="ghost" size="md">
                                돌아가기
                            </x-ui.button>
                        </div>
                    </form>
                </x-ui.card>

                <x-ui.card padded class="space-y-4 border border-muted bg-card shadow-sm">
                    <div class="space-y-2">
                        <div class="text-xs font-bold uppercase tracking-[0.18em] c-subtle">Profile</div>
                        <h2 class="text-xl font-extrabold tracking-[-0.04em] c-main">현재 계정</h2>
                    </div>

                    <div class="space-y-3">
                        <div class="flex items-center justify-between gap-3 rounded-2xl border border-muted bg-surface px-4 py-3">
                            <span class="text-sm c-muted">이름</span>
                            <span class="text-sm font-semibold c-main">{{ $user?->name ?? '-' }}</span>
                        </div>

                        <div class="flex items-center justify-between gap-3 rounded-2xl border border-muted bg-surface px-4 py-3">
                            <span class="text-sm c-muted">이메일</span>
                            <span class="break-all text-right text-sm font-semibold c-main">{{ $user?->email ?? '-' }}</span>
                        </div>

                        <div class="flex items-center justify-between gap-3 rounded-2xl border border-muted bg-surface px-4 py-3">
                            <span class="text-sm c-muted">역할</span>
                            <span class="text-sm font-semibold c-main">{{ $user?->role ?? '-' }}</span>
                        </div>
                    </div>

                    <div class="rounded-[var(--radius-xl)] border border-muted bg-base p-4">
                        <div class="text-sm font-semibold c-main">팁</div>
                        <p class="mt-2 text-sm leading-6 c-muted">
                            수정 후에는 바로 현재 계정에 반영됩니다.
                        </p>
                    </div>
                </x-ui.card>
            </div>
        </div>
    </div>
@endsection