@extends('layouts.app')

@php
    $displayName = $user->username ?: $user->name;
    $initial = mb_strtoupper(mb_substr($displayName, 0, 1));
    $countryTranslation = $user->country?->translations?->firstWhere('locale', app()->getLocale())
        ?? $user->country?->translations?->firstWhere('locale', 'en');
    $countryName = $countryTranslation?->name ?: $user->country?->official_name;
    $linkedAuthProviders = $user->authProviders->keyBy('provider');
    $socialAuthConfigured = [
        'google' => filled(config('services.google.client_id')) && filled(config('services.google.client_secret')),
        'apple' => filled(config('services.apple.client_id'))
            && filled(config('services.apple.team_id'))
            && filled(config('services.apple.key_id'))
            && (filled(config('services.apple.private_key')) || filled(config('services.apple.private_key_path'))),
    ];
    $visibleSocialProviders = array_values(array_filter(
        array_keys($socialAuthConfigured),
        static fn (string $provider): bool => $socialAuthConfigured[$provider] || $linkedAuthProviders->has($provider),
    ));
    $sections = [
        'profile' => ['icon' => 'profile', 'label' => __('ui.account_settings_tab_profile')],
        'privacy' => ['icon' => 'shield', 'label' => __('ui.account_settings_tab_privacy')],
        'security' => ['icon' => 'shield', 'label' => __('ui.account_settings_tab_security')],
        'preferences' => ['icon' => 'menu', 'label' => __('ui.account_settings_tab_preferences')],
        'account' => ['icon' => 'dashboard', 'label' => __('ui.account_settings_tab_account')],
    ];
@endphp

@section('title', __('ui.account_settings_title').' — Coaster World')

@section('content')
<section class="account-settings-hero">
    <div class="container account-settings-hero-inner">
        <div>
            <span class="eyebrow">{{ __('ui.account_settings_kicker') }}</span>
            <h1>{{ __('ui.account_settings_title') }}</h1>
            <p>{{ __('ui.account_settings_intro') }}</p>
        </div>
        <a href="{{ route('profiles.public', $user->username) }}" class="button button-ghost">{{ __('ui.account_settings_view_profile') }}</a>
    </div>
</section>

<section class="section account-settings-page">
    <div class="container account-settings-layout">
        <aside class="account-settings-sidebar" aria-label="{{ __('ui.account_settings_title') }}">
            <div class="account-settings-mini-profile">
                <div class="account-settings-mini-avatar">
                    @if($avatarUrl)
                        <img src="{{ $avatarUrl }}" alt="{{ $displayName }}">
                    @else
                        <span>{{ $initial }}</span>
                    @endif
                </div>
                <div>
                    <strong>{{ $displayName }}</strong>
                    <small>{{ $user->email }}</small>
                </div>
            </div>

            <nav class="account-settings-nav">
                @foreach($sections as $sectionKey => $item)
                    <a href="{{ route('account.settings', ['section' => $sectionKey]) }}" class="{{ $section === $sectionKey ? 'is-active' : '' }}" @if($section === $sectionKey) aria-current="page" @endif>
                        <span><x-nav-icon :name="$item['icon']" /></span>
                        <strong>{{ $item['label'] }}</strong>
                    </a>
                @endforeach
            </nav>
        </aside>

        <main class="account-settings-content">
            @if(session('account_settings_status'))
                <div class="form-success account-settings-flash" role="status">
                    {{ __('ui.account_settings_status_'.session('account_settings_status')) }}
                </div>
            @endif
            @if(session('security_status'))
                <div class="form-success account-settings-flash" role="status">
                    {{ __('ui.security_status_'.session('security_status')) }}
                </div>
            @endif
            @if($errors->any())
                <div class="admin-error account-settings-flash" role="alert">
                    {{ $errors->first() }}
                </div>
            @endif

            @if($section === 'profile')
                <div class="account-settings-heading">
                    <span class="eyebrow">{{ __('ui.account_settings_profile_kicker') }}</span>
                    <h2>{{ __('ui.account_settings_profile_title') }}</h2>
                    <p>{{ __('ui.account_settings_profile_intro') }}</p>
                </div>

                <article class="account-settings-card account-avatar-card">
                    <div class="account-settings-card-heading">
                        <div>
                            <h3>{{ __('ui.account_settings_avatar_title') }}</h3>
                            <p>{{ __('ui.account_settings_avatar_help') }}</p>
                        </div>
                    </div>
                    <div class="account-avatar-editor">
                        <div class="account-avatar-preview">
                            @if($avatarUrl)
                                <img src="{{ $avatarUrl }}" alt="{{ $displayName }}">
                            @else
                                <span>{{ $initial }}</span>
                            @endif
                        </div>
                        <div class="account-avatar-actions">
                            <form method="post" action="{{ route('account.settings.avatar') }}" enctype="multipart/form-data" class="account-avatar-upload">
                                @csrf
                                <label class="account-file-picker">
                                    <span>{{ __('ui.account_settings_avatar_choose') }}</span>
                                    <input type="file" name="media" accept="image/jpeg,image/png,image/webp" required>
                                </label>
                                <small>{{ __('ui.account_settings_avatar_formats') }}</small>
                                <button class="button button-primary" type="submit">{{ __('ui.account_settings_avatar_upload') }}</button>
                            </form>
                            @if($avatarUrl)
                                <form method="post" action="{{ route('account.settings.avatar.destroy') }}">
                                    @csrf
                                    @method('DELETE')
                                    <button class="button button-ghost" type="submit">{{ __('ui.account_settings_avatar_remove') }}</button>
                                </form>
                            @endif
                        </div>
                    </div>
                </article>

                <article class="account-settings-card">
                    <div class="account-settings-card-heading">
                        <div>
                            <h3>{{ __('ui.account_settings_identity_title') }}</h3>
                            <p>{{ __('ui.account_settings_identity_help') }}</p>
                        </div>
                    </div>
                    <form method="post" action="{{ route('account.settings.profile') }}" class="account-settings-form">
                        @csrf
                        @method('PUT')
                        <label>
                            <span>{{ __('ui.account_settings_username') }}</span>
                            <input type="text" name="username" maxlength="50" value="{{ old('username', $user->username) }}" required autocomplete="username" spellcheck="false">
                            <small>{{ __('ui.account_settings_username_help') }}</small>
                        </label>
                        <label>
                            <span>{{ __('ui.account_settings_country') }}</span>
                            <select name="country_id">
                                <option value="">{{ __('ui.account_settings_country_none') }}</option>
                                @foreach($countries as $country)
                                    @php
                                        $translation = $country->translations->firstWhere('locale', app()->getLocale())
                                            ?? $country->translations->firstWhere('locale', 'en');
                                        $label = $translation?->name ?: $country->official_name;
                                    @endphp
                                    <option value="{{ $country->id }}" @selected((string) old('country_id', $user->country_id) === (string) $country->id)>{{ $label }}</option>
                                @endforeach
                            </select>
                        </label>
                        <div class="account-settings-readonly">
                            <span>{{ __('ui.account_settings_public_address') }}</span>
                            <strong>{{ route('profiles.public', $user->username) }}</strong>
                        </div>
                        <button class="button button-primary" type="submit">{{ __('ui.account_settings_save') }}</button>
                    </form>
                </article>
            @endif

            @if($section === 'privacy')
                <div class="account-settings-heading">
                    <span class="eyebrow">{{ __('ui.account_settings_privacy_kicker') }}</span>
                    <h2>{{ __('ui.account_settings_privacy_title') }}</h2>
                    <p>{{ __('ui.account_settings_privacy_intro') }}</p>
                </div>

                <form method="post" action="{{ route('account.settings.privacy') }}" class="account-settings-stack-form">
                    @csrf
                    @method('PUT')

                    <article class="account-settings-card">
                        <h3>{{ __('ui.account_settings_visibility_title') }}</h3>
                        <p>{{ __('ui.account_settings_visibility_help') }}</p>
                        <div class="account-choice-grid is-three">
                            @foreach(['private','friends','public'] as $visibility)
                                <label class="account-choice-card">
                                    <input type="radio" name="activity_visibility" value="{{ $visibility }}" @checked(old('activity_visibility', $socialSettings->activity_visibility) === $visibility)>
                                    <span>
                                        <strong>{{ __('ui.public_profile_visibility_'.$visibility) }}</strong>
                                        <small>{{ __('ui.public_profile_visibility_'.$visibility.'_help') }}</small>
                                    </span>
                                </label>
                            @endforeach
                        </div>
                    </article>

                    <article class="account-settings-card">
                        <h3>{{ __('ui.account_settings_social_title') }}</h3>
                        <div class="account-settings-field-grid">
                            <label>
                                <span>{{ __('ui.friends_requests_setting') }}</span>
                                <select name="friend_request_scope">
                                    <option value="everyone" @selected(old('friend_request_scope', $socialSettings->friend_request_scope) === 'everyone')>{{ __('ui.friends_requests_everyone') }}</option>
                                    <option value="nobody" @selected(old('friend_request_scope', $socialSettings->friend_request_scope) === 'nobody')>{{ __('ui.friends_requests_nobody') }}</option>
                                </select>
                            </label>
                            <label>
                                <span>{{ __('ui.groups_invites_setting') }}</span>
                                <select name="group_invite_scope">
                                    <option value="friends" @selected(old('group_invite_scope', $socialSettings->group_invite_scope) === 'friends')>{{ __('ui.groups_invites_friends') }}</option>
                                    <option value="nobody" @selected(old('group_invite_scope', $socialSettings->group_invite_scope) === 'nobody')>{{ __('ui.groups_invites_nobody') }}</option>
                                </select>
                            </label>
                            <label>
                                <span>{{ __('ui.account_settings_challenges') }}</span>
                                <select name="challenge_scope">
                                    <option value="friends" @selected(old('challenge_scope', $socialSettings->challenge_scope) === 'friends')>{{ __('ui.account_settings_friends_only') }}</option>
                                    <option value="nobody" @selected(old('challenge_scope', $socialSettings->challenge_scope) === 'nobody')>{{ __('ui.account_settings_nobody') }}</option>
                                </select>
                            </label>
                            <label>
                                <span>{{ __('ui.park_presence_setting') }}</span>
                                <select name="park_presence_default">
                                    <option value="private" @selected(old('park_presence_default', $socialSettings->park_presence_default) === 'private')>{{ __('ui.park_presence_private') }}</option>
                                    <option value="friends" @selected(old('park_presence_default', $socialSettings->park_presence_default) === 'friends')>{{ __('ui.park_presence_friends') }}</option>
                                    <option value="public" @selected(old('park_presence_default', $socialSettings->park_presence_default) === 'public')>{{ __('ui.park_presence_public') }}</option>
                                </select>
                            </label>
                        </div>
                        <label class="account-toggle-row">
                            <input type="hidden" name="allow_ride_together" value="0">
                            <input type="checkbox" name="allow_ride_together" value="1" @checked(old('allow_ride_together', $socialSettings->allow_ride_together))>
                            <span>
                                <strong>{{ __('ui.account_settings_ride_together_title') }}</strong>
                                <small>{{ __('ui.account_settings_ride_together_help') }}</small>
                            </span>
                        </label>
                    </article>

                    <div class="account-settings-sticky-actions">
                        <button class="button button-primary" type="submit">{{ __('ui.account_settings_save_privacy') }}</button>
                    </div>
                </form>
            @endif

            @if($section === 'security')
                <div class="account-settings-heading">
                    <span class="eyebrow">{{ __('ui.security_kicker') }}</span>
                    <h2>{{ __('ui.security_account_security') }}</h2>
                    <p>{{ __('ui.security_intro') }}</p>
                </div>

                <article class="account-settings-card account-auth-methods">
                    <div class="account-settings-card-heading">
                        <div>
                            <h3>{{ __('ui.security_login_methods_title') }}</h3>
                            <p>{{ __('ui.security_login_methods_help') }}</p>
                        </div>
                    </div>
                    <div class="account-auth-method-list">
                        @foreach($visibleSocialProviders as $provider)
                            @php($connection = $linkedAuthProviders->get($provider))
                            <div class="account-auth-method-row">
                                <div class="account-auth-method-identity">
                                    <span class="auth-provider-mark is-{{ $provider }}" aria-hidden="true">{{ $provider === 'google' ? 'G' : 'A' }}</span>
                                    <div>
                                        <strong>{{ __('ui.security_provider_'.$provider) }}</strong>
                                        @if($connection?->provider_email)
                                            <small>{{ $connection->provider_email }}</small>
                                        @elseif(! $socialAuthConfigured[$provider])
                                            <small>{{ __('ui.security_provider_not_configured') }}</small>
                                        @else
                                            <small>{{ __('ui.security_provider_disconnected') }}</small>
                                        @endif
                                    </div>
                                </div>
                                <div class="account-auth-method-actions">
                                    @if($connection)
                                        <span class="security-badge is-ok">{{ __('ui.security_provider_connected') }}</span>
                                        <form method="post" action="{{ route('account.security.providers.destroy', $provider) }}">
                                            @csrf
                                            @method('DELETE')
                                            <button class="button button-ghost" type="submit">{{ __('ui.security_provider_disconnect') }}</button>
                                        </form>
                                    @elseif($socialAuthConfigured[$provider])
                                        <a class="button button-ghost" href="{{ route('social-auth.redirect', ['provider' => $provider]) }}">{{ __('ui.security_provider_connect') }}</a>
                                    @else
                                        <span class="security-badge is-warning">{{ __('ui.security_provider_not_configured') }}</span>
                                    @endif
                                </div>
                            </div>
                        @endforeach
                        <div class="account-auth-method-row">
                            <div class="account-auth-method-identity">
                                <span class="auth-provider-mark is-password" aria-hidden="true">•</span>
                                <div>
                                    <strong>{{ __('ui.security_provider_password') }}</strong>
                                    <small>{{ filled($user->password) ? __('ui.security_provider_connected') : __('ui.security_provider_disconnected') }}</small>
                                </div>
                            </div>
                            <span class="security-badge {{ filled($user->password) ? 'is-ok' : 'is-warning' }}">{{ filled($user->password) ? __('ui.security_provider_connected') : __('ui.security_provider_disconnected') }}</span>
                        </div>
                    </div>
                </article>

                <div class="account-settings-two-col">
                    <article class="account-settings-card">
                        <div class="account-settings-card-heading">
                            <div>
                                <h3>{{ __('ui.security_email_verification_title') }}</h3>
                                <p>{{ $user->email }}</p>
                            </div>
                            @if($user->hasVerifiedEmail())
                                <span class="security-badge is-ok">{{ __('ui.security_verified') }}</span>
                            @else
                                <span class="security-badge is-warning">{{ __('ui.security_unverified') }}</span>
                            @endif
                        </div>
                        @if(! $user->hasVerifiedEmail())
                            <p>{{ __('ui.security_verification_help') }}</p>
                            <form method="post" action="{{ route('verification.send') }}">
                                @csrf
                                <button type="submit" class="button button-primary">{{ __('ui.security_resend_verification') }}</button>
                            </form>
                        @endif
                    </article>

                    <article class="account-settings-card">
                        <h3>{{ filled($user->password) ? __('ui.security_change_password') : __('ui.security_set_password') }}</h3>
                        <p>{{ filled($user->password) ? __('ui.security_change_password_help') : __('ui.security_set_password_help') }}</p>
                        <form method="post" action="{{ route('account.security.password') }}" class="account-settings-form">
                            @csrf
                            @method('PUT')
                            @if(filled($user->password))
                                <label>
                                    <span>{{ __('ui.security_current_password') }}</span>
                                    <x-password-input name="current_password" autocomplete="current-password" required />
                                </label>
                            @endif
                            <label>
                                <span>{{ __('ui.security_new_password') }}</span>
                                <x-password-input name="password" autocomplete="new-password" required />
                                <small>{{ __('ui.security_password_requirements') }}</small>
                            </label>
                            <label>
                                <span>{{ __('ui.auth_password_confirm') }}</span>
                                <x-password-input name="password_confirmation" autocomplete="new-password" required />
                            </label>
                            <button type="submit" class="button button-primary">{{ filled($user->password) ? __('ui.security_change_password') : __('ui.security_set_password') }}</button>
                        </form>
                    </article>
                </div>

                <article class="account-settings-card account-settings-sessions">
                    <div class="account-settings-card-heading">
                        <div>
                            <h3>{{ __('ui.security_sessions_title') }}</h3>
                            <p>{{ __('ui.security_sessions_help') }}</p>
                        </div>
                        @if($sessionsAvailable && $sessions->count() > 1)
                            <form method="post" action="{{ route('account.security.sessions.others') }}">
                                @csrf
                                @method('DELETE')
                                <button type="submit" class="button button-ghost">{{ __('ui.security_close_other_sessions') }}</button>
                            </form>
                        @endif
                    </div>
                    @if($sessionsAvailable)
                        <div class="security-session-list">
                            @forelse($sessions as $sessionItem)
                                <div class="security-session-row">
                                    <div>
                                        <strong>{{ $sessionItem->label }}</strong>
                                        <span>{{ $sessionItem->ip_address ?: __('ui.security_ip_unknown') }}</span>
                                        <small>{{ __('ui.security_last_activity', ['date' => \Illuminate\Support\Carbon::createFromTimestamp($sessionItem->last_activity)->diffForHumans()]) }}</small>
                                    </div>
                                    <div class="security-session-actions">
                                        @if($sessionItem->is_current)
                                            <span class="security-badge is-ok">{{ __('ui.security_current_session') }}</span>
                                        @endif
                                        <form method="post" action="{{ route('account.security.sessions.destroy', $sessionItem->id) }}">
                                            @csrf
                                            @method('DELETE')
                                            <button type="submit" class="button button-ghost">{{ $sessionItem->is_current ? __('ui.security_logout_here') : __('ui.security_close_session') }}</button>
                                        </form>
                                    </div>
                                </div>
                            @empty
                                <p>{{ __('ui.security_no_sessions') }}</p>
                            @endforelse
                        </div>
                    @else
                        <p>{{ __('ui.security_sessions_unavailable') }}</p>
                    @endif
                </article>
            @endif

            @if($section === 'preferences')
                <div class="account-settings-heading">
                    <span class="eyebrow">{{ __('ui.account_settings_preferences_kicker') }}</span>
                    <h2>{{ __('ui.account_settings_preferences_title') }}</h2>
                    <p>{{ __('ui.account_settings_preferences_intro') }}</p>
                </div>

                <article class="account-settings-card">
                    <form method="post" action="{{ route('account.settings.preferences') }}" class="account-settings-form">
                        @csrf
                        @method('PUT')
                        <div class="account-settings-field-grid">
                            <label>
                                <span>{{ __('ui.account_settings_language') }}</span>
                                <select name="locale">
                                    @foreach($localeOptions as $localeCode => $localeLabel)
                                        <option value="{{ $localeCode }}" @selected(old('locale', $user->locale ?: app()->getLocale()) === $localeCode)>{{ $localeLabel }}</option>
                                    @endforeach
                                </select>
                            </label>
                            <label>
                                <span>{{ __('ui.account_settings_timezone') }}</span>
                                <select name="timezone">
                                    @foreach($timezones as $timezone)
                                        <option value="{{ $timezone }}" @selected(old('timezone', $user->timezone ?: config('app.timezone')) === $timezone)>{{ $timezone }}</option>
                                    @endforeach
                                </select>
                            </label>
                        </div>
                        <button class="button button-primary" type="submit">{{ __('ui.account_settings_save_preferences') }}</button>
                    </form>
                </article>

                <article class="account-settings-card account-settings-link-card">
                    <div>
                        <h3>{{ __('ui.account_settings_notifications_title') }}</h3>
                        <p>{{ __('ui.account_settings_notifications_help') }}</p>
                    </div>
                    <a href="{{ route('notifications.index') }}" class="button button-ghost">{{ __('ui.account_settings_notifications_open') }}</a>
                </article>
            @endif

            @if($section === 'account')
                <div class="account-settings-heading">
                    <span class="eyebrow">{{ __('ui.account_settings_account_kicker') }}</span>
                    <h2>{{ __('ui.account_settings_account_title') }}</h2>
                    <p>{{ __('ui.account_settings_account_intro') }}</p>
                </div>

                <article class="account-settings-card account-settings-link-card">
                    <div>
                        <h3>{{ __('ui.security_export_title') }}</h3>
                        <p>{{ __('ui.security_export_help') }}</p>
                    </div>
                    <form method="post" action="{{ route('account.privacy.export') }}">
                        @csrf
                        <button type="submit" class="button button-primary">{{ __('ui.security_export_button') }}</button>
                    </form>
                </article>

                <article class="account-settings-card account-settings-danger">
                    <span class="eyebrow">{{ __('ui.security_danger_kicker') }}</span>
                    <h3>{{ __('ui.security_delete_title') }}</h3>
                    <p>{{ __('ui.security_delete_help') }}</p>
                    <details class="security-delete-details">
                        <summary>{{ __('ui.security_delete_open') }}</summary>
                        <form method="post" action="{{ route('account.privacy.erase') }}" class="account-settings-form">
                            @csrf
                            @method('DELETE')
                            @if(filled($user->password))
                                <label>
                                    <span>{{ __('ui.security_current_password') }}</span>
                                    <x-password-input name="current_password" autocomplete="current-password" required />
                                </label>
                            @else
                                <div class="security-danger-note">{{ __('ui.security_delete_social_only_note') }}</div>
                            @endif
                            <label>
                                <span>{{ __('ui.security_delete_confirmation', ['word' => 'DELETE']) }}</span>
                                <input type="text" name="confirmation" required autocomplete="off" spellcheck="false">
                            </label>
                            <div class="security-danger-note">{{ __('ui.security_delete_irreversible') }}</div>
                            <button type="submit" class="button button-danger">{{ __('ui.security_delete_button') }}</button>
                        </form>
                    </details>
                </article>
            @endif
        </main>
    </div>
</section>
@endsection