@props(['experience', 'periodLabel' => 'Période'])

@php
    $level = data_get($experience, 'level', []);
    $accent = data_get($level, 'color', '#57d39b');
    $format = fn (mixed $value): string => $value === null
        ? '—'
        : rtrim(rtrim(number_format((float) $value, 2, ',', ' '), '0'), ',');
    $periodBestIsAllTime = data_get($experience, 'period_best') !== null
        && (float) data_get($experience, 'period_best') === (float) data_get($experience, 'all_time_best');
    $formatPercent = function (mixed $value): string {
        if ($value === null) return '—';
        return ((float) $value > 0 ? '+' : '').number_format((float) $value, 1, ',', ' ').' %';
    };
    $percentTone = fn (mixed $value): string => $value === null || (float) $value === 0.0 ? 'neutral' : ((float) $value > 0 ? 'positive' : 'negative');
@endphp

<section
    {{ $attributes->class(['dashboard-panel', 'score-overview-card'])->style([
        '--score-accent: '.$accent,
        '--score-progress: '.data_get($experience, 'progress_percent', 0).'%',
    ]) }}
>
    <div class="score-overview-card__header">
        <div>
            <p class="dashboard-kicker">{{ __('Score du jour') }}</p>
            <div class="score-overview-card__score">
                @if (data_get($experience, 'is_calculable', true))
                    <strong>{{ $format(data_get($experience, 'score')) }}</strong>
                    <span>{{ __('points') }}</span>
                @else
                    <strong>—</strong>
                    <span>{{ __('non calculable') }}</span>
                @endif
            </div>
        </div>
        <span class="score-status-badge">{{ data_get($level, 'label') }}</span>
    </div>

    <div class="score-overview-progress">
        <div class="score-overview-progress__meta">
            <span>{{ __('Progression') }}</span>
            <strong>{{ data_get($experience, 'is_calculable', true) ? $format(data_get($experience, 'score')).' / '.data_get($experience, 'maximum_label', 100) : __('Non calculable') }}</strong>
        </div>
        <div class="score-overview-progress__track">
            <div></div>
        </div>
    </div>

    <div class="score-overview-stats">
        <div class="score-overview-stat">
            <span>{{ __('Moyenne') }}</span>
            <strong>{{ $format(data_get($experience, 'period_average')) }}</strong>
            <small>{{ $periodLabel }}</small>
            <b class="is-{{ $percentTone(data_get($experience, 'percent_vs_period_average')) }}">{{ $formatPercent(data_get($experience, 'percent_vs_period_average')) }} {{ __('vs moyenne') }}</b>
        </div>
        <div class="score-overview-stat score-overview-stat--rank">
            <span>{{ __('Classement') }}</span>
            <strong>#{{ data_get($experience, 'period_rank') ?? '—' }} <em>/ {{ data_get($experience, 'period_count', 0) }}</em></strong>
            <small>{{ $periodLabel }}</small>
            <b class="is-neutral">Top {{ $formatPercent(data_get($experience, 'period_rank_percent')) }}</b>
        </div>
        <div class="score-overview-stat {{ $periodBestIsAllTime ? 'score-overview-stat--gold' : 'score-overview-stat--silver' }}">
            <span>{{ __('Record période') }}</span>
            <strong>{{ $format(data_get($experience, 'period_best')) }}</strong>
            <small>
                @if (data_get($experience, 'is_all_time_record'))
                    {{ __('Record absolu') }}
                @elseif (data_get($experience, 'is_period_record'))
                    {{ __('Score actuel') }}
                @else
                    {{ $periodLabel }}
                @endif
            </small>
            <b class="is-{{ $percentTone(data_get($experience, 'percent_vs_period_record')) }}">{{ $formatPercent(data_get($experience, 'percent_vs_period_record')) }} {{ __('vs record') }}</b>
        </div>
        <div class="score-overview-stat score-overview-stat--gold">
            <span>{{ __('Record all-time') }}</span>
            <strong>{{ $format(data_get($experience, 'all_time_best')) }}</strong>
            <small>{{ __('Toutes périodes') }}</small>
            <b class="is-{{ $percentTone(data_get($experience, 'percent_vs_all_time_record')) }}">{{ $formatPercent(data_get($experience, 'percent_vs_all_time_record')) }} {{ __('vs record') }}</b>
        </div>
    </div>
</section>