{{-- Sind Portfolio — BPMS overview cards (year-linked) --}}
@php
    $portfolioYear = $sindPortfolioCards['year'] ?? ($defaultBudgetYear ?? '');
    $portfolioCards = $sindPortfolioCards['cards'] ?? [];
    $shareBar = static function (float $share, int $value): float {
        if ($value <= 0) {
            return 0.0;
        }

        return max(4.0, min(100.0, $share > 0 ? $share : 4.0));
    };
    $shareLabel = static function (float $share, int $value): string {
        if ($value <= 0) {
            return '0%';
        }
        if ($share < 0.1) {
            return '<0.1%';
        }

        return number_format($share, 1).'%';
    };
@endphp
<section class="dd-sind-portfolio" id="dd-sind-portfolio" aria-live="polite">
    <div class="dd-sind-portfolio__head">
        <div>
            <h2 class="dd-sind-portfolio__title">Portfolio Overview</h2>
            <p class="dd-sind-portfolio__subtitle">Scheme counts and budget signals for the selected year</p>
        </div>
    </div>
    <div class="dd-sind-portfolio__grid" id="dd-sind-portfolio-grid">
        @forelse ($portfolioCards as $card)
            @php
                $tone = (int) ($card['tone'] ?? 1);
                $format = (string) ($card['format'] ?? 'count');
                $value = (int) ($card['value'] ?? 0);
                $display = $format === 'money'
                    ? number_format($value).' M'
                    : number_format($value);
                $cardId = (string) ($card['id'] ?? '');
                $breakdown = is_array($card['breakdown'] ?? null) ? $card['breakdown'] : [];
                $breakdown = array_values(array_filter(
                    $breakdown,
                    static fn ($item): bool => (int) ($item['value'] ?? 0) > 0
                ));
                $mixCount = count($breakdown);
                $isSplit = $cardId === 'all_schemes' && $mixCount > 0;
                $share = (float) ($card['share'] ?? 0);
                $showShare = $format === 'count' && $cardId !== 'all_schemes';
            @endphp
            <article
                class="dd-portfolio-card dd-portfolio-card--tone-{{ $tone }}{{ $isSplit ? ' dd-portfolio-card--split' : '' }}{{ $showShare ? ' dd-portfolio-card--metered' : '' }}"
                data-card-id="{{ $cardId }}"
                data-format="{{ $format }}"
            >
                @if ($isSplit)
                    <div class="dd-portfolio-split__head">
                        <div class="dd-portfolio-split__heading">
                            <span class="dd-portfolio-split__title">{{ $card['label'] ?? 'All Active Schemes' }}</span>
                            <span class="dd-portfolio-split__badge">Active</span>
                        </div>
                        <span class="dd-portfolio-split__hero" data-card-value>{{ $display }}</span>
                    </div>
                    <div class="dd-portfolio-split" role="list" aria-label="Active scheme mix" data-mix-count="{{ $mixCount }}">
                        @foreach ($breakdown as $item)
                            @php
                                $itemValue = (int) ($item['value'] ?? 0);
                                $itemShare = (float) ($item['share'] ?? 0);
                                $bar = $shareBar($itemShare, $itemValue);
                                $pct = $shareLabel($itemShare, $itemValue);
                            @endphp
                            <div
                                class="dd-portfolio-mix__item"
                                role="listitem"
                                data-mix-id="{{ $item['id'] ?? '' }}"
                                title="{{ $item['title'] ?? ($item['label'] ?? '') }} · {{ $pct }} of all active schemes"
                            >
                                <span class="dd-portfolio-mix__label">{{ $item['label'] ?? '' }}</span>
                                <span class="dd-portfolio-mix__value">{{ number_format($itemValue) }}</span>
                                <span class="dd-portfolio-mix__share">
                                    <span class="dd-portfolio-mix__pct">{{ $pct }}</span>
                                    <span class="dd-portfolio-mix__bar" aria-hidden="true"><span style="width: {{ $bar }}%"></span></span>
                                </span>
                            </div>
                        @endforeach
                    </div>
                    <div class="dd-portfolio-split__stack" aria-hidden="true">
                        @foreach ($breakdown as $item)
                            <span data-mix-id="{{ $item['id'] ?? '' }}" style="width: {{ (float) ($item['share'] ?? 0) }}%"></span>
                        @endforeach
                    </div>
                @else
                    <div class="dd-portfolio-card__icon" aria-hidden="true">
                        <i class="fas {{ $card['icon'] ?? 'fa-layer-group' }}"></i>
                    </div>
                    <div class="dd-portfolio-card__body">
                        <p class="dd-portfolio-card__label">{{ $card['label'] ?? '' }}</p>
                        @if (! empty($card['subtitle']))
                            <p class="dd-portfolio-card__hint">{{ $card['subtitle'] }}</p>
                        @endif
                        @if ($showShare)
                            <p class="dd-portfolio-card__value" data-card-value>{{ $display }}</p>
                            <div class="dd-portfolio-card__share">
                                <span class="dd-portfolio-card__pct">{{ $shareLabel($share, $value) }}</span>
                                <span class="dd-portfolio-card__meter" title="{{ $shareLabel($share, $value) }} of all active schemes" aria-hidden="true">
                                    <span style="width: {{ $shareBar($share, $value) }}%"></span>
                                </span>
                            </div>
                        @else
                            <p class="dd-portfolio-card__value" data-card-value>{{ $display }}</p>
                        @endif
                    </div>
                @endif
            </article>
        @empty
            <div class="dd-sind-portfolio__empty" id="dd-sind-portfolio-empty">
                <i class="fas fa-spinner fa-spin" aria-hidden="true"></i>
                <span>Loading portfolio cards…</span>
            </div>
        @endforelse
    </div>
</section>