<div class="c-experiences u-slant-top-reversed u-mb-neg-slant-height">
    <div class="c-experiences__placeholder">

        <h2 class="c-experiences__heading u-spacing-mt10">Kies je belevingsprogramma</h2>

        <div class="c-experiences__grid">
            @foreach($program as $programItem)
                <div class="c-experiences__program  @if($programItem->highlighted) c-experiences__program--highlighted @endif">

                    @if($programItem->highlighted)
                        <div class="c-experiences__highlight-label  c-experiences__fat-text">Meest gekozen door bedrijven</div>
                    @endif

                    <h3 class="c-experiences__title">{{ $programItem->product->translation->name }}</h3>
                    <div class="c-experiences__price">
                        <span class="c-experiences__amount">
                            {{ explode(',', $programItem->price)[0] }}<sup>{{ explode(',', $programItem->price)[1] }}</sup>
                        </span>
                        <p class="c-experiences__price-text">
                            p.p. ({{ $programItem->price_ex }} ex btw)
                        </p>
                    </div>

                    <div class="c-experiences__ratings">

                        @foreach(['score_teamwork', 'score_endurance', 'score_strategy'] as $rating)
                            <div class="c-experiences__rating">
                                <div class="c-experiences__rating-label  c-experiences__fat-text">{{ __('site/products.stats.' .$rating) }}</div>

                                <div class="c-experiences__cows">
                                    @for($i = 0; $i <= $programItem->product->{$rating}; $i++)
                                        <span class="c-experiences__cow  c-experiences__cow--active">
                                            <svg width="29" height="20">
                                                <use href="/img/icon-bull.svg#bull"></use>
                                            </svg>
                                        </span>
                                    @endfor
                                    @for($i = 0; $i < (5 - $programItem->product->{$rating}); $i++)
                                        <span class="c-experiences__cow  c-experiences__cow--inactive">
                                            <svg width="29" height="20">
                                                <use href="/img/icon-bull.svg#bull"></use>
                                            </svg>
                                        </span>
                                    @endfor
                                </div>
                            </div>
                        @endforeach
                    </div>

                    <ul class="c-experiences__list">
                        @foreach(__('site/products.list_items.' . $programItem->product->code_name) as $listItem)
                            <li class="c-experiences__list-item">{{ $listItem }}</li>
                        @endforeach
                    </ul>

                    <div class="c-experiences__pay-offs">
                        <div class="c-experiences__pay-off  c-experiences__fat-text">
                        <span class="c-experiences__icon  c-experiences__icon--clock">
                            <svg width="23" height="23">
                                <use href="/img/icon-clock.svg#clock"></use>
                            </svg>
                        </span>
                            Ruim {{ (int) $programItem->product->duration }} uur
                        </div>
                        <div class="c-experiences__pay-off  c-experiences__fat-text">
                        <span class="c-experiences__icon  c-experiences__icon--group">
                            <svg width="24" height="24">
                                <use href="/img/icon-group.svg#group"></use>
                            </svg>
                        </span>
                            Van {{ $programItem->min_persons }} tot {{ $programItem->max_persons }} pers.
                        </div>
                    </div>

                    <p class="c-experiences__offer">
                        Met meer dan {{ $programItem->max_persons }} personen?<br/>
                        @if(isset($links->quotation))<a href="{{ $links->quotation->route }}">Vraag een offerte aan!</a>@endif
                    </p>

                    <div class="c-experiences__button-area">
                        <a class="c-experiences__button" href="{{ $links->products->route }}/{{ $programItem->product->translation->slug }}">
                            Lees meer
                        </a>
                    </div>

                </div>

            @endforeach
        </div>

    </div>
</div>