@props([
    'title' => null,
    'subtitle' => null,
    'points' => [],
    'labels' => [],
    'navSeries' => [],
    'benchmarkSeries' => [],
    'navLabel' => 'NAV',
    'benchmarkLabel' => null,
    'value' => null,
    'valueLabel' => null,
    'trendValue' => null,
    'trendLabel' => null,
    'trendDirection' => null,
    'autoTrend' => true,
    'unit' => null,
    'prefix' => null,
    'suffix' => null,
    'decimals' => 1,
    'width' => null,
    'min' => null,
    'max' => null,
    'height' => 300,
    'variant' => 'panel',
    'showHeader' => true,
    'showLegend' => true,
    'showPoints' => true,
    'showGrid' => true,
    'emptyText' => null,
    'navColor' => 'var(--primary)',
    'benchmarkColor' => 'var(--accent)',
    'id' => null,
])

@php
    $title = $title ?: __('kview-visualization::visualization.chart.title');
    $benchmarkLabel = $benchmarkLabel ?: __('kview-visualization::visualization.chart.benchmark');
    $emptyText = $emptyText ?: __('kview-visualization::visualization.chart.empty');
    $chartTitle = __('kview-visualization::visualization.chart.chart_title');
    $variant = in_array($variant, ['panel', 'bare', 'compact'], true) ? $variant : 'panel';
    $decimals = is_numeric($decimals) ? max(0, (int) $decimals) : 1;
    $chartWidth = max(720, min(1280, is_numeric($width) ? (int) $width : ($variant === 'compact' ? 760 : 1080)));
    $chartHeight = max(220, (int) $height);
    $pad = [
        'top' => $variant === 'compact' ? 18 : 24,
        'right' => 26,
        'bottom' => 44,
        'left' => 56,
    ];
    $plotWidth = $chartWidth - $pad['left'] - $pad['right'];
    $plotHeight = $chartHeight - $pad['top'] - $pad['bottom'];

    $toList = static function ($value): array {
        if ($value instanceof \Illuminate\Support\Collection) {
            return $value->values()->all();
        }

        if ($value instanceof \Traversable) {
            return array_values(iterator_to_array($value, false));
        }

        return is_array($value) ? array_values($value) : [];
    };

    $toNumber = static function ($value): ?float {
        if ($value === null || $value === '') {
            return null;
        }

        if (is_numeric($value)) {
            return (float) $value;
        }

        if (! is_string($value)) {
            return null;
        }

        $normalized = trim(str_replace(["\xc2\xa0", ' ', '%', 'EUR', '$'], '', $value));

        if (preg_match('/^-?\d+,\d+$/', $normalized)) {
            $normalized = str_replace(',', '.', $normalized);
        }

        return is_numeric($normalized) ? (float) $normalized : null;
    };

    $valueFrom = static function ($item, array $keys) {
        if (! is_array($item) && ! is_object($item)) {
            return $item;
        }

        foreach ($keys as $key) {
            $value = data_get($item, $key);

            if ($value !== null && $value !== '') {
                return $value;
            }
        }

        return null;
    };

    $labelFrom = static function ($item, int $index, array $labels): string {
        $label = null;

        if (is_array($item) || is_object($item)) {
            $label = data_get($item, 'label')
                ?? data_get($item, 'period')
                ?? data_get($item, 'quarter')
                ?? data_get($item, 'date')
                ?? data_get($item, 'x');
        }

        $label ??= $labels[$index] ?? null;

        if ($label instanceof \DateTimeInterface) {
            return $label->format('M y');
        }

        return $label !== null && $label !== '' ? (string) $label : (string) ($index + 1);
    };

    $rawPoints = $toList($points);
    $labels = $toList($labels);
    $navSeries = $toList($navSeries);
    $benchmarkSeries = $toList($benchmarkSeries);

    if (empty($rawPoints)) {
        $count = max(count($labels), count($navSeries), count($benchmarkSeries));
        $rawPoints = $count > 0
            ? array_map(static fn ($index) => ['index' => $index], range(0, $count - 1))
            : [];
    }

    $chartRows = [];

    foreach ($rawPoints as $index => $point) {
        $navItem = $navSeries[$index] ?? null;
        $benchmarkItem = $benchmarkSeries[$index] ?? null;

        $chartRows[] = [
            'label' => $labelFrom($point, $index, $labels),
            'nav' => $toNumber(
                (is_array($point) || is_object($point))
                    ? $valueFrom($point, ['nav', 'nav_value', 'value', 'fund', 'fund_value', 'y'])
                    : ($navItem !== null ? $valueFrom($navItem, ['nav', 'nav_value', 'value', 'fund', 'fund_value', 'y']) : $point)
            ),
            'benchmark' => $toNumber(
                (is_array($point) || is_object($point))
                    ? $valueFrom($point, ['benchmark', 'benchmark_value', 'comparison', 'reference'])
                    : $valueFrom($benchmarkItem, ['benchmark', 'benchmark_value', 'value', 'comparison', 'reference', 'y'])
            ),
        ];

        if (! empty($navSeries)) {
            $chartRows[$index]['nav'] = $toNumber($valueFrom($navItem, ['nav', 'nav_value', 'value', 'fund', 'fund_value', 'y']));
        }

        if (! empty($benchmarkSeries)) {
            $chartRows[$index]['benchmark'] = $toNumber($valueFrom($benchmarkItem, ['benchmark', 'benchmark_value', 'value', 'comparison', 'reference', 'y']));
        }
    }

    $numericValues = [];
    $navValues = [];

    foreach ($chartRows as $row) {
        if ($row['nav'] !== null) {
            $numericValues[] = $row['nav'];
            $navValues[] = $row['nav'];
        }

        if ($row['benchmark'] !== null) {
            $numericValues[] = $row['benchmark'];
        }
    }

    $hasChart = count($chartRows) > 0 && count($numericValues) > 0;
    $hasNav = collect($chartRows)->contains(fn ($row) => $row['nav'] !== null);
    $hasBenchmark = collect($chartRows)->contains(fn ($row) => $row['benchmark'] !== null);

    $formatValue = static function (?float $number) use ($decimals, $prefix, $suffix, $unit): string {
        if ($number === null) {
            return '-';
        }

        $formatted = number_format($number, $decimals, '.', ' ');
        $parts = [];

        if ($prefix) {
            $parts[] = $prefix;
        }

        $parts[] = $formatted;

        if ($unit) {
            $parts[] = $unit;
        }

        if ($suffix) {
            $parts[] = $suffix;
        }

        return trim(implode(' ', $parts));
    };

    $svgNumber = static function (float $number): string {
        return rtrim(rtrim(number_format($number, 2, '.', ''), '0'), '.');
    };

    $tooltipWidth = 180;
    $tooltipHeight = 68;
    $tooltipX = static function (float $x) use ($chartWidth, $tooltipWidth): float {
        return max(8, min($chartWidth - $tooltipWidth - 8, $x - ($tooltipWidth / 2)));
    };
    $tooltipY = static function (float $y) use ($tooltipHeight): float {
        return $y > 86 ? $y - $tooltipHeight - 16 : $y + 18;
    };
    $baselineFor = static function (array $coords): ?float {
        foreach ($coords as $point) {
            $value = (float) ($point['value'] ?? 0);

            if (abs($value) > 0.000001) {
                return $value;
            }
        }

        return null;
    };
    $trendFrom = static function (?float $current, ?float $baseline): array {
        if ($current !== null && abs($current) <= 0.000001) {
            return ['label' => '0% depuis départ', 'direction' => 'neutral'];
        }

        if ($current === null || $baseline === null || abs($baseline) < 0.000001) {
            return ['label' => null, 'direction' => 'neutral'];
        }

        $change = (($current - $baseline) / abs($baseline)) * 100;
        $label = ($change > 0 ? '+' : '').number_format($change, 1, '.', '').'% depuis départ';

        return [
            'label' => $label,
            'direction' => $change > 0 ? 'up' : ($change < 0 ? 'down' : 'neutral'),
        ];
    };
    $niceStep = static function (float $range, int $intervals = 4): float {
        if ($range <= 0) {
            return 1.0;
        }

        $roughStep = $range / max($intervals, 1);
        $power = 10 ** floor(log10($roughStep));
        $fraction = $roughStep / $power;
        $niceFraction = match (true) {
            $fraction <= 1.5 => 1,
            $fraction <= 3 => 2,
            $fraction <= 7 => 5,
            default => 10,
        };

        return $niceFraction * $power;
    };

    $domainMin = null;
    $domainMax = null;
    $ticks = [];
    $navCoords = [];
    $benchmarkCoords = [];
    $xLabels = [];
    $tickValues = [];
    $navPolyline = '';
    $benchmarkPolyline = '';
    $navArea = '';
    $baselineY = $pad['top'] + $plotHeight;

    if ($hasChart) {
        $rawMin = $toNumber($min) ?? min($numericValues);
        $rawMax = $toNumber($max) ?? max($numericValues);

        if ($rawMin === $rawMax) {
            $rawMin -= 1;
            $rawMax += 1;
        }

        $hasExplicitMin = $toNumber($min) !== null;
        $hasExplicitMax = $toNumber($max) !== null;
        $range = $rawMax - $rawMin;
        $padding = max($range * 0.12, abs($rawMax) * 0.015, 1);
        $domainMin = $hasExplicitMin ? (float) $toNumber($min) : ($rawMin - $padding);
        $domainMax = $hasExplicitMax ? (float) $toNumber($max) : ($rawMax + $padding);

        if (! $hasExplicitMin && $rawMin >= 0 && $domainMin < 0) {
            $domainMin = 0.0;
        }

        if (! $hasExplicitMax && $rawMax <= 0 && $domainMax > 0) {
            $domainMax = 0.0;
        }

        if (! $hasExplicitMin && ! $hasExplicitMax) {
            $tickDomainMin = $rawMin >= 0 ? 0.0 : $rawMin;
            $tickDomainMax = $rawMax <= 0 ? 0.0 : $rawMax;
            $tickStep = $niceStep(max(abs($tickDomainMax - $tickDomainMin), 1), 4);
            $maxTickLabels = 5;
            $domainMin = floor($tickDomainMin / $tickStep) * $tickStep;
            $domainMax = ceil($tickDomainMax / $tickStep) * $tickStep;

            if ($rawMin >= 0) {
                $domainMin = 0.0;
            }

            if ($rawMax <= 0) {
                $domainMax = 0.0;
            }

            if ($domainMin === $domainMax) {
                $domainMax += $tickStep;
            }

            $tickCount = (int) floor(($domainMax - $domainMin) / $tickStep) + 1;
            while ($tickCount > $maxTickLabels) {
                $tickStep *= 2;
                $domainMin = floor($domainMin / $tickStep) * $tickStep;
                $domainMax = ceil($domainMax / $tickStep) * $tickStep;

                if ($rawMin >= 0) {
                    $domainMin = 0.0;
                }

                if ($rawMax <= 0) {
                    $domainMax = 0.0;
                }

                $tickCount = (int) floor(($domainMax - $domainMin) / $tickStep) + 1;
            }

            for ($valueForTick = $domainMin; $valueForTick <= $domainMax + ($tickStep / 2); $valueForTick += $tickStep) {
                $tickValues[] = $valueForTick;
            }
        }

        $domainRange = max($domainMax - $domainMin, 1);
        $lastIndex = max(count($chartRows) - 1, 1);
        $labelStep = max(1, (int) ceil(count($chartRows) / 6));

        foreach ($chartRows as $index => $row) {
            $x = $pad['left'] + ($index / $lastIndex) * $plotWidth;

            if ($row['nav'] !== null) {
                $y = $pad['top'] + $plotHeight - (($row['nav'] - $domainMin) / $domainRange) * $plotHeight;
                $navCoords[] = [
                    'x' => $x,
                    'y' => $y,
                    'label' => $row['label'],
                    'value' => $row['nav'],
                    'display' => $formatValue($row['nav']),
                    'tooltip_x' => $tooltipX($x),
                    'tooltip_y' => $tooltipY($y),
                ];
            }

            if ($row['benchmark'] !== null) {
                $y = $pad['top'] + $plotHeight - (($row['benchmark'] - $domainMin) / $domainRange) * $plotHeight;
                $benchmarkCoords[] = [
                    'x' => $x,
                    'y' => $y,
                    'label' => $row['label'],
                    'value' => $row['benchmark'],
                    'display' => $formatValue($row['benchmark']),
                    'tooltip_x' => $tooltipX($x),
                    'tooltip_y' => $tooltipY($y),
                ];
            }

            if ($index === 0 || $index === count($chartRows) - 1 || $index % $labelStep === 0) {
                $xLabels[] = [
                    'x' => $x,
                    'label' => $row['label'],
                    'anchor' => $index === 0 ? 'start' : ($index === count($chartRows) - 1 ? 'end' : 'middle'),
                ];
            }
        }

        $navTrendBaseline = $baselineFor($navCoords);
        foreach ($navCoords as $coordIndex => $point) {
            $trend = $trendFrom($point['value'], $navTrendBaseline);
            $navCoords[$coordIndex]['trend_label'] = $trend['label'];
            $navCoords[$coordIndex]['trend_direction'] = $trend['direction'];
        }

        $benchmarkTrendBaseline = $baselineFor($benchmarkCoords);
        foreach ($benchmarkCoords as $coordIndex => $point) {
            $trend = $trendFrom($point['value'], $benchmarkTrendBaseline);
            $benchmarkCoords[$coordIndex]['trend_label'] = $trend['label'];
            $benchmarkCoords[$coordIndex]['trend_direction'] = $trend['direction'];
        }

        $navPolyline = collect($navCoords)
            ->map(fn ($point) => $svgNumber($point['x']).','.$svgNumber($point['y']))
            ->implode(' ');
        $benchmarkPolyline = collect($benchmarkCoords)
            ->map(fn ($point) => $svgNumber($point['x']).','.$svgNumber($point['y']))
            ->implode(' ');

        if (count($navCoords) > 1) {
            $firstNav = $navCoords[0];
            $lastNav = $navCoords[count($navCoords) - 1];
            $navArea = $svgNumber($firstNav['x']).','.$svgNumber($baselineY).' '.$navPolyline.' '.$svgNumber($lastNav['x']).','.$svgNumber($baselineY);
        }

        if ($tickValues === []) {
            for ($index = 0; $index <= 4; $index++) {
                $tickValues[] = $domainMin + ($domainRange / 4) * $index;
            }
        }

        foreach ($tickValues as $valueForTick) {
            $ticks[] = [
                'value' => $valueForTick,
                'y' => $pad['top'] + $plotHeight - (($valueForTick - $domainMin) / $domainRange) * $plotHeight,
            ];
        }
    }

    $latestNav = count($navCoords) ? $navCoords[count($navCoords) - 1]['value'] : null;
    $resolvedValue = $value ?? ($latestNav !== null ? $formatValue($latestNav) : null);
    $resolvedValueLabel = $valueLabel ?: __('kview-visualization::visualization.chart.latest', ['series' => $navLabel]);
    $resolvedTrendValue = $trendValue;
    $resolvedTrendLabel = $trendLabel;
    $resolvedTrendDirection = $trendDirection;

    if ($autoTrend && $resolvedTrendValue === null && count($navValues) > 1 && $navValues[0] != 0.0) {
        $change = (($navValues[count($navValues) - 1] - $navValues[0]) / abs($navValues[0])) * 100;
        $resolvedTrendValue = ($change > 0 ? '+' : '').number_format($change, 1, '.', '').'%';
        $resolvedTrendLabel = $resolvedTrendLabel ?: __('kview-visualization::visualization.chart.since_start');
        $resolvedTrendDirection = $change > 0 ? 'up' : ($change < 0 ? 'down' : 'neutral');
    }

    $resolvedTrendDirection = in_array($resolvedTrendDirection, ['up', 'down', 'neutral'], true) ? $resolvedTrendDirection : 'neutral';
    $safeId = preg_replace('/[^A-Za-z0-9\-_:.]/', '-', $id ?: 'fund-performance-chart-'.substr(md5(($title ?: 'chart').serialize($chartRows).uniqid('', true)), 0, 10));
    $gradientId = $safeId.'-nav-fill';
    $visibleHeader = $showHeader && ($title || $subtitle || $resolvedValue || $resolvedTrendValue || $showLegend);
    $minimumChartWidth = min($chartWidth, max(620, 220 + (count($chartRows) * 78)));
    $rootStyle = trim('--fpc-nav-color: '.$navColor.'; --fpc-benchmark-color: '.$benchmarkColor.'; --fpc-min-chart-width: '.$minimumChartWidth.'px; '.($attributes->get('style') ?? ''));
@endphp


<figure
    {{ $attributes->except('style')->class([
        'fund-performance-chart',
        'fund-performance-chart--'.$variant,
    ])->merge([
        'id' => $safeId,
        'aria-labelledby' => $safeId.'-title',
        'aria-describedby' => $safeId.'-data',
        'style' => $rootStyle,
    ]) }}
>
    @if ($visibleHeader)
        <figcaption class="fund-performance-chart__header">
            <div>
                @if ($title)
                    <h3 class="fund-performance-chart__title" id="{{ $safeId }}-title">{{ $title }}</h3>
                @else
                    <h3 class="sr-only" id="{{ $safeId }}-title">{{ $chartTitle }}</h3>
                @endif

                @if ($subtitle)
                    <p class="fund-performance-chart__subtitle">{{ $subtitle }}</p>
                @endif

                @if ($showLegend && $hasChart)
                    <ul class="fund-performance-chart__legend" aria-label="{{ __('kview-visualization::visualization.chart.legend') }}">
                        @if ($hasNav)
                            <li class="fund-performance-chart__legend-item">
                                <span class="fund-performance-chart__legend-line fund-performance-chart__legend-line--nav" aria-hidden="true"></span>
                                <span>{{ $navLabel }}</span>
                            </li>
                        @endif

                        @if ($hasBenchmark)
                            <li class="fund-performance-chart__legend-item">
                                <span class="fund-performance-chart__legend-line fund-performance-chart__legend-line--benchmark" aria-hidden="true"></span>
                                <span>{{ $benchmarkLabel }}</span>
                            </li>
                        @endif
                    </ul>
                @endif
            </div>

            @if ($resolvedValue || $resolvedTrendValue)
                <div class="fund-performance-chart__summary">
                    @if ($resolvedValue)
                        <div>
                            <span class="fund-performance-chart__metric-label">{{ $resolvedValueLabel }}</span>
                            <strong class="fund-performance-chart__metric-value" data-partial-placeholder="text">{{ $resolvedValue }}</strong>
                        </div>
                    @endif

                    @if ($resolvedTrendValue)
                        <span class="fund-performance-chart__trend fund-performance-chart__trend--{{ $resolvedTrendDirection }}" data-partial-placeholder="text">
                            @if ($resolvedTrendDirection === 'down')
                                <svg viewBox="0 0 24 24" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round">
                                    <path d="M3 7l6 6 4-4 8 8M14 17h7v-7" />
                                </svg>
                            @elseif ($resolvedTrendDirection === 'up')
                                <svg viewBox="0 0 24 24" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round">
                                    <path d="M3 17l6-6 4 4 8-8M14 7h7v7" />
                                </svg>
                            @else
                                <svg viewBox="0 0 24 24" aria-hidden="true" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round">
                                    <path d="M5 12h14" />
                                </svg>
                            @endif
                            <span>{{ $resolvedTrendValue }}</span>
                            @if ($resolvedTrendLabel)
                                <span>{{ $resolvedTrendLabel }}</span>
                            @endif
                        </span>
                    @endif
                </div>
            @endif
        </figcaption>
    @else
        <figcaption class="sr-only" id="{{ $safeId }}-title">{{ $title ?: $chartTitle }}</figcaption>
    @endif

    @if ($hasChart)
        <div
            class="fund-performance-chart__canvas"
            role="region"
            aria-label="{{ __('kview-visualization::visualization.chart.timeline', ['title' => $title ?: $chartTitle]) }}"
            tabindex="0"
            data-partial-placeholder="block"
        >
            <svg
                class="fund-performance-chart__svg"
                viewBox="0 0 {{ $chartWidth }} {{ $chartHeight }}"
                role="img"
                aria-labelledby="{{ $safeId }}-title"
                aria-describedby="{{ $safeId }}-svg-desc"
                preserveAspectRatio="xMidYMid meet"
            >
                <desc id="{{ $safeId }}-svg-desc">
                    {{ __('kview-visualization::visualization.chart.description', [
                        'series' => $hasBenchmark
                            ? __('kview-visualization::visualization.chart.series_pair', ['first' => $navLabel, 'second' => $benchmarkLabel])
                            : $navLabel,
                        'count' => count($chartRows),
                    ]) }}
                </desc>
                <defs>
                    <linearGradient id="{{ $gradientId }}" x1="0" y1="0" x2="0" y2="1">
                        <stop offset="0%" stop-color="var(--fpc-nav-color)" stop-opacity="0.22" />
                        <stop offset="100%" stop-color="var(--fpc-nav-color)" stop-opacity="0" />
                    </linearGradient>
                </defs>

                @if ($showGrid)
                    @foreach ($ticks as $tick)
                        <line
                            class="fund-performance-chart__grid"
                            x1="{{ $pad['left'] }}"
                            y1="{{ $svgNumber($tick['y']) }}"
                            x2="{{ $chartWidth - $pad['right'] }}"
                            y2="{{ $svgNumber($tick['y']) }}"
                        />
                        <text
                            class="fund-performance-chart__axis-label"
                            x="{{ $pad['left'] - 10 }}"
                            y="{{ $svgNumber($tick['y'] + 3) }}"
                            text-anchor="end"
                        >{{ $formatValue($tick['value']) }}</text>
                    @endforeach
                @endif

                @foreach ($xLabels as $label)
                    <text
                        class="fund-performance-chart__axis-label"
                        x="{{ $svgNumber($label['x']) }}"
                        y="{{ $chartHeight - 12 }}"
                        text-anchor="{{ $label['anchor'] }}"
                    >{{ $label['label'] }}</text>
                @endforeach

                @if ($navArea)
                    <polygon points="{{ $navArea }}" fill="url(#{{ $gradientId }})" />
                @endif

                @if ($hasBenchmark && $benchmarkPolyline)
                    <polyline class="fund-performance-chart__line fund-performance-chart__line--benchmark" points="{{ $benchmarkPolyline }}" />
                @endif

                @if ($hasNav && $navPolyline)
                    <polyline class="fund-performance-chart__line fund-performance-chart__line--nav" points="{{ $navPolyline }}" />
                @endif

                @if ($showPoints)
                    @foreach ($benchmarkCoords as $point)
                        <g class="fund-performance-chart__data-point" tabindex="0" focusable="true" role="img" aria-label="{{ $point['label'] }}: {{ $benchmarkLabel }} {{ $point['display'] }}{{ $point['trend_label'] ? ', '.$point['trend_label'] : '' }}">
                            <circle class="fund-performance-chart__hit" cx="{{ $svgNumber($point['x']) }}" cy="{{ $svgNumber($point['y']) }}" r="14" />
                            <circle
                                class="fund-performance-chart__point fund-performance-chart__point--benchmark"
                                cx="{{ $svgNumber($point['x']) }}"
                                cy="{{ $svgNumber($point['y']) }}"
                                r="3"
                            />
                            <line class="fund-performance-chart__guide" x1="{{ $svgNumber($point['x']) }}" y1="{{ $pad['top'] }}" x2="{{ $svgNumber($point['x']) }}" y2="{{ $svgNumber($baselineY) }}" />
                            <g class="fund-performance-chart__tooltip" transform="translate({{ $svgNumber($point['tooltip_x']) }} {{ $svgNumber($point['tooltip_y']) }})">
                                <rect class="fund-performance-chart__tooltip-box" width="{{ $tooltipWidth }}" height="{{ $tooltipHeight }}" rx="8" />
                                <text class="fund-performance-chart__tooltip-label" x="12" y="17">{{ $point['label'] }}</text>
                                <text class="fund-performance-chart__tooltip-value" x="12" y="35">{{ $point['display'] }}</text>
                                <text class="fund-performance-chart__tooltip-series" x="12" y="47">{{ $benchmarkLabel }}</text>
                                @if ($point['trend_label'])
                                    <text class="fund-performance-chart__tooltip-trend fund-performance-chart__tooltip-trend--{{ $point['trend_direction'] }}" x="12" y="60">{{ $point['trend_label'] }}</text>
                                @endif
                            </g>
                        </g>
                    @endforeach

                    @foreach ($navCoords as $point)
                        <g class="fund-performance-chart__data-point" tabindex="0" focusable="true" role="img" aria-label="{{ $point['label'] }}: {{ $navLabel }} {{ $point['display'] }}{{ $point['trend_label'] ? ', '.$point['trend_label'] : '' }}">
                            <circle class="fund-performance-chart__hit" cx="{{ $svgNumber($point['x']) }}" cy="{{ $svgNumber($point['y']) }}" r="14" />
                            <circle
                                class="fund-performance-chart__point fund-performance-chart__point--nav {{ $loop->last ? 'is-last' : '' }}"
                                cx="{{ $svgNumber($point['x']) }}"
                                cy="{{ $svgNumber($point['y']) }}"
                                r="{{ $loop->last ? 4.8 : 3.2 }}"
                            />
                            <line class="fund-performance-chart__guide" x1="{{ $svgNumber($point['x']) }}" y1="{{ $pad['top'] }}" x2="{{ $svgNumber($point['x']) }}" y2="{{ $svgNumber($baselineY) }}" />
                            <g class="fund-performance-chart__tooltip" transform="translate({{ $svgNumber($point['tooltip_x']) }} {{ $svgNumber($point['tooltip_y']) }})">
                                <rect class="fund-performance-chart__tooltip-box" width="{{ $tooltipWidth }}" height="{{ $tooltipHeight }}" rx="8" />
                                <text class="fund-performance-chart__tooltip-label" x="12" y="17">{{ $point['label'] }}</text>
                                <text class="fund-performance-chart__tooltip-value" x="12" y="35">{{ $point['display'] }}</text>
                                <text class="fund-performance-chart__tooltip-series" x="12" y="47">{{ $navLabel }}</text>
                                @if ($point['trend_label'])
                                    <text class="fund-performance-chart__tooltip-trend fund-performance-chart__tooltip-trend--{{ $point['trend_direction'] }}" x="12" y="60">{{ $point['trend_label'] }}</text>
                                @endif
                            </g>
                        </g>
                    @endforeach
                @endif
            </svg>
        </div>
    @else
        <div class="fund-performance-chart__empty" role="status">{{ $emptyText }}</div>
    @endif

    <table class="sr-only" id="{{ $safeId }}-data">
        <caption>{{ __('kview-visualization::visualization.chart.data', ['title' => $title ?: $chartTitle]) }}</caption>
        <thead>
            <tr>
                <th scope="col">{{ __('kview-visualization::visualization.chart.period') }}</th>
                @if ($hasNav)
                    <th scope="col">{{ $navLabel }}</th>
                @endif
                @if ($hasBenchmark)
                    <th scope="col">{{ $benchmarkLabel }}</th>
                @endif
            </tr>
        </thead>
        <tbody>
            @foreach ($chartRows as $row)
                <tr>
                    <th scope="row">{{ $row['label'] }}</th>
                    @if ($hasNav)
                        <td>{{ $formatValue($row['nav']) }}</td>
                    @endif
                    @if ($hasBenchmark)
                        <td>{{ $formatValue($row['benchmark']) }}</td>
                    @endif
                </tr>
            @endforeach
        </tbody>
    </table>
</figure>