@extends('layouts.app')

@php
    $countryTranslation = $user->country?->translations?->firstWhere('locale', app()->getLocale())
        ?? $user->country?->translations?->firstWhere('locale', 'en');
    $countryName = $countryTranslation?->name ?: $user->country?->official_name;
    $displayName = '@'.$user->username;
    $rankingMetrics = [
        'xp' => '✦',
        'coasters' => '🎢',
        'parks' => '🎡',
        'badges' => '🏅',
        'challenges' => '🏆',
    ];
@endphp

@section('title', $displayName.' — Coaster World')

@section('content')
<section class="explorer-public-hero explorer-public-hero-v2">
    <div class="container explorer-public-hero-grid">
        <div class="explorer-public-identity">
            <div class="profile-avatar explorer-public-avatar">{{ mb_strtoupper(mb_substr($user->username, 0, 1)) }}</div>
            <div>
                <span class="eyebrow">{{ __('ui.public_profile_v2_kicker') }}</span>
                <h1>{{ $displayName }}</h1>
                <p class="explorer-public-tagline">{{ __('ui.public_profile_v2_intro') }}</p>
                <div class="profile-meta">
                    @if($countryName)<span><x-country-label :code="$user->country?->iso2" :name="$countryName" size="small" /></span>@endif
                    <span>{{ __('ui.profile_member_since', ['year' => $user->created_at?->format('Y')]) }}</span>
                    <span>{{ __('ui.public_profile_visibility_label') }}: {{ __('ui.public_profile_visibility_'.$profileVisibility) }}</span>
                </div>
                <div class="explorer-rank-chip">
                    <span>{{ __('ui.progression_explorer_rank_'.$explorerRankKey) }}</span>
                    <strong>{{ __('ui.progression_level', ['level' => $explorerLevel]) }}</strong>
                    <small>{{ number_format($totalXp, 0, ',', ' ') }} XP</small>
                    @if($isFriend)<small>✓ {{ __('ui.friends_state_friends') }}</small>@endif
                </div>
            </div>
        </div>

        <div class="explorer-public-actions">
            @if($isOwner)
                <a class="button button-primary" href="{{ route('profile') }}">{{ __('ui.public_profile_back_private') }}</a>
            @endif

            @if($friendState === 'available')
                <form method="post" action="{{ route('friends.send', $user) }}">
                    @csrf
                    <button type="submit" class="button button-primary">{{ __('ui.friends_add') }}</button>
                </form>
            @endif

            @if($friendState === 'friends')
                <a class="button button-ghost" href="{{ route('friends.index') }}">✓ {{ __('ui.friends_state_friends') }}</a>
            @endif

            @if($friendState === 'outgoing')
                <span class="button button-ghost is-static">{{ __('ui.friends_state_sent') }}</span>
            @endif

            @if($friendState === 'incoming')
                <a class="button button-primary" href="{{ route('friends.index') }}">{{ __('ui.public_profile_friend_request_received') }}</a>
            @endif

            @if($friendState === 'closed')
                <span class="button button-ghost is-static">{{ __('ui.friends_state_closed') }}</span>
            @endif

            <button type="button" class="button button-ghost" data-copy-profile-link data-copy-success="{{ __('ui.public_profile_link_copied') }}">
                {{ __('ui.public_profile_copy_link') }}
            </button>

            @if($canSafetyActions)
                <details class="social-safety-menu">
                    <summary class="button button-ghost">{{ __('ui.social_safety_actions') }}</summary>
                    <div class="social-safety-popover">
                        <strong>{{ __('ui.social_report_user_title') }}</strong>
                        <p>{{ __('ui.social_report_user_intro') }}</p>
                        <form method="post" action="{{ route('reports.users.store', $user) }}" class="social-report-form">
                            @csrf
                            <label>
                                <span>{{ __('ui.social_report_reason') }}</span>
                                <select name="reason_code" required>
                                    @foreach(['spam','harassment','hate','inappropriate','impersonation','dangerous','privacy','other'] as $reportReason)
                                        <option value="{{ $reportReason }}">{{ __('ui.social_report_reason_'.$reportReason) }}</option>
                                    @endforeach
                                </select>
                            </label>
                            <label>
                                <span>{{ __('ui.social_report_details') }}</span>
                                <textarea name="details" rows="3" maxlength="1500" placeholder="{{ __('ui.social_report_details_placeholder') }}"></textarea>
                            </label>
                            <button type="submit" class="button button-primary">{{ __('ui.social_report_submit') }}</button>
                        </form>
                        <div class="social-safety-divider"></div>
                        <strong>{{ __('ui.social_block_title') }}</strong>
                        <p>{{ __('ui.social_block_intro') }}</p>
                        <form method="post" action="{{ route('social.blocks.store', $user) }}" data-admin-confirm="{{ __('ui.social_block_confirm') }}">
                            @csrf
                            <input type="hidden" name="reason_code" value="other">
                            <button type="submit" class="button button-ghost social-danger-button">{{ __('ui.social_block_button') }}</button>
                        </form>
                    </div>
                </details>
            @endif
        </div>
    </div>
</section>

@if(session('friend_status'))
<section class="social-feedback-strip"><div class="container"><div class="admin-success">✓ {{ session('friend_status') }}</div></div></section>
@endif
@if(session('friend_error'))
<section class="social-feedback-strip"><div class="container"><div class="admin-error">{{ session('friend_error') }}</div></div></section>
@endif
@if(session('social_report_status'))
<section class="social-feedback-strip"><div class="container"><div class="admin-success">✓ {{ session('social_report_status') }}</div></div></section>
@endif

<section class="profile-stats-strip explorer-public-stats-strip">
    <div class="container profile-stats-grid explorer-public-stats explorer-public-stats-v2">
        <div><strong>{{ $visitedParks->count() }}</strong><span>{{ __('ui.profile_parks') }}</span></div>
        <div><strong>{{ $coasterRides->count() }}</strong><span>{{ __('ui.profile_coasters') }}</span></div>
        <div><strong>{{ $countries->count() }}</strong><span>{{ __('ui.profile_countries') }}</span></div>
        <div><strong>{{ $achievementCount }}</strong><span>{{ __('ui.progression_hub_badges') }}</span></div>
        <div><strong>{{ $challengeCount }}</strong><span>{{ __('ui.progression_hub_challenges') }}</span></div>
        <div><strong>{{ $roadTripCount }}</strong><span>{{ __('ui.road_trips_nav') }}</span></div>
    </div>
</section>

<section class="section explorer-profile-dashboard-section">
    <div class="container explorer-profile-dashboard">
        <article class="explorer-season-card">
            <div class="explorer-card-heading">
                <div>
                    <span class="eyebrow">{{ __('ui.public_profile_season_kicker') }}</span>
                    <h2>{{ __('ui.public_profile_season_title', ['year' => $seasonYear]) }}</h2>
                </div>
                <span class="explorer-season-year">{{ $seasonYear }}</span>
            </div>
            <p>{{ __('ui.public_profile_season_intro') }}</p>
            <div class="explorer-season-grid">
                <div><span>🎢</span><strong>{{ $seasonCoasters }}</strong><small>{{ __('ui.profile_coasters') }}</small></div>
                <div><span>🎡</span><strong>{{ $seasonParks }}</strong><small>{{ __('ui.profile_parks') }}</small></div>
                <div><span>🎟️</span><strong>{{ $seasonRides->count() }}</strong><small>{{ __('ui.public_profile_rides_count') }}</small></div>
                <div><span>🏆</span><strong>{{ $seasonChallenges }}</strong><small>{{ __('ui.progression_hub_challenges') }}</small></div>
                <div class="is-wide"><span>✦</span><strong>{{ number_format($seasonXp, 0, ',', ' ') }}</strong><small>{{ __('ui.public_profile_xp_this_year') }}</small></div>
            </div>
        </article>

        <article class="explorer-level-card">
            <div class="explorer-card-heading">
                <div>
                    <span class="eyebrow">{{ __('ui.public_profile_passport_kicker') }}</span>
                    <h2>{{ __('ui.public_profile_passport_title') }}</h2>
                </div>
                <div class="explorer-level-badge">{{ $explorerLevel }}</div>
            </div>
            <p>{{ __('ui.public_profile_passport_intro') }}</p>
            <div class="explorer-level-copy">
                <strong>{{ __('ui.progression_explorer_rank_'.$explorerRankKey) }}</strong>
                <span>{{ number_format($totalXp, 0, ',', ' ') }} / {{ number_format($explorerNextLevelXp, 0, ',', ' ') }} XP</span>
            </div>
            <div class="explorer-level-progress"><i style="width: {{ $explorerLevelPercent }}%"></i></div>
            <small>{{ __('ui.public_profile_level_progress', ['percent' => $explorerLevelPercent]) }}</small>
        </article>
    </div>
</section>

@if($rankingPositions)
<section class="section section-soft explorer-public-rankings-section">
    <div class="container">
        <div class="section-heading explorer-section-heading-row">
            <div>
                <span class="eyebrow">{{ __('ui.public_profile_rankings_kicker') }}</span>
                <h2>{{ __('ui.public_profile_rankings_title') }}</h2>
                <p>{{ __('ui.public_profile_rankings_intro', ['count' => $communityRanking['eligibleCount'] ?? 0]) }}</p>
            </div>
            @auth
                <a class="button button-ghost" href="{{ route('rankings.index', ['scope' => 'community', 'period' => 'all', 'metric' => 'xp']) }}">{{ __('ui.rankings_nav') }}</a>
            @endauth
        </div>
        <div class="explorer-public-ranking-grid">
            @foreach($rankingMetrics as $metric => $icon)
                <article>
                    <span class="explorer-ranking-icon">{{ $icon }}</span>
                    <small>{{ __('ui.rankings_metric_'.$metric) }}</small>
                    @if(data_get($rankingPositions, $metric.'.position'))
                        <strong>#{{ number_format((int) data_get($rankingPositions, $metric.'.position'), 0, ',', ' ') }}</strong>
                        <em>{{ number_format((int) data_get($rankingPositions, $metric.'.value', 0), 0, ',', ' ') }}</em>
                    @endif
                    @if(! data_get($rankingPositions, $metric.'.position'))
                        <strong>—</strong>
                        <em>{{ __('ui.public_profile_rank_unranked') }}</em>
                    @endif
                </article>
            @endforeach
        </div>
    </div>
</section>
@endif

@if(! $rankingPositions)
<section class="section section-soft explorer-public-rankings-section">
    <div class="container">
        <div class="explorer-private-ranking-note">
            <span>🔒</span>
            <div>
                <strong>{{ __('ui.public_profile_rankings_private_title') }}</strong>
                <p>{{ __('ui.public_profile_rankings_private_text') }}</p>
            </div>
        </div>
    </div>
</section>
@endif

@if($skills->isNotEmpty())
<section class="section">
    <div class="container">
        <div class="section-heading">
            <span class="eyebrow">{{ __('ui.public_profile_skills_kicker') }}</span>
            <h2>{{ __('ui.public_profile_skills_title') }}</h2>
            <p>{{ __('ui.public_profile_skills_intro') }}</p>
        </div>
        <div class="explorer-skill-grid">
            @foreach($skills as $userSkill)
                @php
                    $skillTranslation = $userSkill->skill?->translations?->firstWhere('locale', app()->getLocale())
                        ?? $userSkill->skill?->translations?->firstWhere('locale', 'en');
                @endphp
                <article class="explorer-skill-card">
                    <div>
                        <span>{{ data_get($userSkill->skill?->metadata, 'icon', '✦') }}</span>
                        <small>{{ __('ui.rankings_level_value', ['level' => $userSkill->level]) }}</small>
                    </div>
                    <strong>{{ $skillTranslation?->name ?: $userSkill->skill?->key }}</strong>
                    <p>{{ $skillTranslation?->description }}</p>
                    <div class="explorer-skill-progress"><i style="width: {{ $userSkill->level_percent }}%"></i></div>
                    <small>{{ number_format((int) $userSkill->xp_total, 0, ',', ' ') }} XP</small>
                </article>
            @endforeach
        </div>
    </div>
</section>
@endif

@include('pages.partials.local-experts-profile', ['localExpertise' => $localExpertise])

@if($recentActivity->isNotEmpty())
<section class="section section-soft">
    <div class="container">
        <div class="section-heading">
            <span class="eyebrow">{{ __('ui.public_profile_activity_kicker') }}</span>
            <h2>{{ __('ui.public_profile_activity_title') }}</h2>
            <p>{{ __('ui.public_profile_activity_intro') }}</p>
        </div>
        <div class="explorer-activity-timeline">
            @foreach($recentActivity as $event)
                <article class="explorer-activity-item is-{{ $event['kind'] }}">
                    <div class="explorer-activity-icon">
                        @if($event['kind'] === 'ride')🎢@endif
                        @if($event['kind'] === 'attraction')🎠@endif
                        @if($event['kind'] === 'visit')🎡@endif
                        @if($event['kind'] === 'badge')🏅@endif
                        @if($event['kind'] === 'challenge')🏆@endif
                        @if($event['kind'] === 'road_trip')🧭@endif
                    </div>
                    <div class="explorer-activity-copy">
                        <span>{{ __('ui.public_profile_activity_'.$event['kind']) }}</span>
                        @if($event['url'])
                            <a href="{{ $event['url'] }}">{{ $event['title'] }}</a>
                        @endif
                        @if(! $event['url'])
                            <strong>{{ $event['title'] }}</strong>
                        @endif
                        @if($event['subtitle'])<small>{{ $event['subtitle'] }}</small>@endif
                    </div>
                    <time datetime="{{ $event['moment']->toDateString() }}">
                        @if($event['precision'] === 'year'){{ $event['moment']->format('Y') }}@endif
                        @if($event['precision'] !== 'year'){{ $event['moment']->locale(app()->getLocale())->translatedFormat('d M Y') }}@endif
                    </time>
                </article>
            @endforeach
        </div>
    </div>
</section>
@endif

<section class="section">
    <div class="container">
        <div class="section-heading">
            <span class="eyebrow">{{ __('ui.public_profile_records_kicker') }}</span>
            <h2>{{ __('ui.public_profile_records_title') }}</h2>
            <p>{{ __('ui.public_profile_records_intro') }}</p>
        </div>
        <div class="profile-records-grid">
            <article class="profile-record-card">
                <span>{{ __('ui.profile_fastest') }}</span>
                @if($fastest)
                    <strong>{{ rtrim(rtrim((string)$fastest->attraction->coaster->speed_kmh, '0'), '.') }} <small>km/h</small></strong>
                    <a href="{{ route('coasters.show', $fastest->attraction->coaster) }}">{{ $fastest->attraction->official_name }}</a>
                    <x-ride-queue-badges :attraction="$fastest->attraction" size="compact" class="profile-queue-badges" />
                @endif
                @if(! $fastest)<strong>—</strong><small>{{ __('ui.profile_no_record') }}</small>@endif
            </article>
            <article class="profile-record-card">
                <span>{{ __('ui.profile_highest') }}</span>
                @if($highest)
                    <strong>{{ rtrim(rtrim((string)$highest->attraction->coaster->height_m, '0'), '.') }} <small>m</small></strong>
                    <a href="{{ route('coasters.show', $highest->attraction->coaster) }}">{{ $highest->attraction->official_name }}</a>
                    <x-ride-queue-badges :attraction="$highest->attraction" size="compact" class="profile-queue-badges" />
                @endif
                @if(! $highest)<strong>—</strong><small>{{ __('ui.profile_no_record') }}</small>@endif
            </article>
            <article class="profile-record-card">
                <span>{{ __('ui.profile_longest') }}</span>
                @if($longest)
                    <strong>{{ rtrim(rtrim((string)$longest->attraction->coaster->length_m, '0'), '.') }} <small>m</small></strong>
                    <a href="{{ route('coasters.show', $longest->attraction->coaster) }}">{{ $longest->attraction->official_name }}</a>
                    <x-ride-queue-badges :attraction="$longest->attraction" size="compact" class="profile-queue-badges" />
                @endif
                @if(! $longest)<strong>—</strong><small>{{ __('ui.profile_no_record') }}</small>@endif
            </article>
        </div>
    </div>
</section>

@if($achievements->isNotEmpty())
<section class="section section-soft">
    <div class="container">
        <div class="section-heading">
            <span class="eyebrow">{{ __('ui.public_profile_trophies_kicker') }}</span>
            <h2>{{ __('ui.public_profile_trophies_title') }}</h2>
            <p>{{ __('ui.public_profile_trophies_intro') }}</p>
        </div>
        <div class="progression-badge-grid explorer-public-badge-grid">
            @foreach($achievements as $unlock)
                @php
                    $translation = $unlock->achievement?->translations?->firstWhere('locale', app()->getLocale())
                        ?? $unlock->achievement?->translations?->firstWhere('locale', 'en');
                @endphp
                <article class="progression-badge is-unlocked is-tier-{{ data_get($unlock->achievement?->metadata, 'tier', 'bronze') }}">
                    <div class="progression-badge-icon">{{ data_get($unlock->achievement?->metadata, 'icon', '✦') }}</div>
                    <span>{{ __('ui.progression_category_'.($unlock->achievement?->category ?? 'coaster')) }}</span>
                    <strong>{{ $translation?->name ?: $unlock->achievement?->key }}</strong>
                    <p>{{ $translation?->description }}</p>
                </article>
            @endforeach
        </div>
    </div>
</section>
@endif

@if($challengeShowcase->isNotEmpty())
<section class="section">
    <div class="container">
        <div class="section-heading">
            <span class="eyebrow">{{ __('ui.public_profile_challenges_kicker') }}</span>
            <h2>{{ __('ui.public_profile_challenges_title') }}</h2>
            <p>{{ __('ui.public_profile_challenges_intro') }}</p>
        </div>
        <div class="explorer-challenge-grid">
            @foreach($challengeShowcase as $participant)
                @php
                    $challenge = $participant->challenge;
                    $parkTranslation = $challenge?->park?->translations?->firstWhere('locale', app()->getLocale())
                        ?? $challenge?->park?->translations?->firstWhere('locale', 'en');
                    $target = (int) data_get($challenge?->rules, 'target_score', 0);
                @endphp
                <article class="explorer-challenge-card">
                    <span>🏆 {{ __('ui.public_profile_challenge_completed') }}</span>
                    <strong>{{ $challenge?->name }}</strong>
                    @if($challenge?->park)<small>{{ $parkTranslation?->name ?: $challenge->park->official_name }}</small>@endif
                    <div>
                        <b>{{ number_format((int) $participant->score, 0, ',', ' ') }}</b>
                        @if($target > 0)<em>/ {{ $target }}</em>@endif
                    </div>
                    @if($participant->completed_at)<time>{{ $participant->completed_at->locale(app()->getLocale())->translatedFormat('d M Y') }}</time>@endif
                </article>
            @endforeach
        </div>
    </div>
</section>
@endif

@if($roadTripShowcase->isNotEmpty())
<section class="section section-soft">
    <div class="container">
        <div class="section-heading">
            <span class="eyebrow">{{ __('ui.public_profile_road_trips_kicker') }}</span>
            <h2>{{ __('ui.public_profile_road_trips_title') }}</h2>
            <p>{{ __('ui.public_profile_road_trips_intro') }}</p>
        </div>
        <div class="explorer-road-trip-grid">
            @foreach($roadTripShowcase as $roadTripData)
                <article class="explorer-road-trip-card">
                    <div class="explorer-road-trip-compass">🧭</div>
                    <span>{{ __('ui.road_trip_status_completed') }}</span>
                    <strong>{{ $roadTripData['trip']->title }}</strong>
                    <div class="explorer-road-trip-stats">
                        <span><b>{{ $roadTripData['park_count'] }}</b>{{ __('ui.profile_parks') }}</span>
                        <span><b>{{ $roadTripData['country_count'] }}</b>{{ __('ui.profile_countries') }}</span>
                        <span><b>{{ $roadTripData['completed_stops'] }}</b>{{ __('ui.public_profile_completed_stops') }}</span>
                    </div>
                    @if($roadTripData['trip']->ends_on)
                        <time>{{ $roadTripData['trip']->ends_on->locale(app()->getLocale())->translatedFormat('d M Y') }}</time>
                    @endif
                </article>
            @endforeach
        </div>
    </div>
</section>
@endif

@if($coasterCards->isNotEmpty())
<section class="section">
    <div class="container">
        <div class="section-heading">
            <span class="eyebrow">{{ __('ui.progression_cards_kicker') }}</span>
            <h2>{{ __('ui.public_profile_cards_title') }}</h2>
            <p>{{ __('ui.public_profile_cards_intro') }}</p>
        </div>

        <div class="progression-card-grid explorer-public-card-grid">
            @foreach($coasterCards as $ownedCard)
                @php
                    $card = $ownedCard->card;
                    $coaster = $card?->coaster;
                    $attraction = $coaster?->attraction;
                    $translation = $attraction?->translations?->firstWhere('locale', app()->getLocale())
                        ?? $attraction?->translations?->firstWhere('locale', 'en');
                    $parkTranslation = $attraction?->park?->translations?->firstWhere('locale', app()->getLocale())
                        ?? $attraction?->park?->translations?->firstWhere('locale', 'en');
                @endphp
                @if($coaster && $attraction)
                    <a href="{{ route('coasters.show', $coaster) }}" class="progression-coaster-card is-{{ $card->visual_tier }}">
                        <div class="progression-card-tier">{{ __('ui.progression_tier_'.$card->visual_tier) }}</div>
                        <div class="progression-card-symbol">🎢</div>
                        <div class="progression-card-copy">
                            <span>{{ $parkTranslation?->name ?: $attraction->park?->official_name }}</span>
                            <strong>{{ $translation?->name ?: $attraction->official_name }}</strong>
                            <x-ride-queue-badges :attraction="$attraction" size="compact" class="progression-queue-badges" />
                            <small>{{ $coaster->manufacturer?->name ?: __('ui.coaster_unknown') }}</small>
                        </div>
                    </a>
                @endif
            @endforeach
        </div>
    </div>
</section>
@endif

@if($manufacturerStats->isNotEmpty())
<section class="section section-soft">
    <div class="container">
        <div class="section-heading">
            <span class="eyebrow">{{ __('ui.profile_manufacturers_kicker') }}</span>
            <h2>{{ __('ui.public_profile_manufacturers_title') }}</h2>
        </div>
        <div class="explorer-manufacturer-grid">
            @foreach($manufacturerStats as $manufacturer => $count)
                <div>
                    <strong>{{ $manufacturer }}</strong>
                    <span>{{ trans_choice('ui.profile_manufacturer_count', $count, ['count' => $count]) }}</span>
                </div>
            @endforeach
        </div>
    </div>
</section>
@endif

<section class="section explorer-public-privacy-note">
    <div class="container">
        <p>{{ __('ui.public_profile_privacy_note_v2') }}</p>
    </div>
</section>
@endsection