@extends('Shop.layout.layout', [
    'title' => __('home.title'),
])

@section('content')
    <div class="row">
        <div class="col-12">
            <h1>{{ $article['name'] }}</h1>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-12 col-lg-4">
            <div style="max-width: 100%;">
                @include('components.multi-images', [
                    'image' => $article['image'],
                    'images' => $article['images'],
                ])
            </div>
        </div>
        <div class="col-lg-5 col-xs-12 text-justify">
            {!! $article['description']['semences'] ?? null !!}
            {!! $article['description']['plants'] ?? null !!}
            {!! $article['description']['variety'] ?? null !!}
            {!! $article['description']['merchandise'] ?? null !!}

            @if ($article['description']['plus'] ?? false)
                <h3>Spécificités</h3>
                {!! $article['description']['plus'] !!}
            @endif

            @if (count($article['tags'] ?? []))
                <h3>Caractéristiques</h3>
                @foreach ($article['tags'] as $tag_group => $items)
                    <div class="mb-2">
                        {{ $tag_group }} :
                        @foreach ($items as $tag)
                            <span class="btn btn-xs btn-secondary pt-0 pb-0">{{ $tag }}</span>
                        @endforeach
                    </div>
                @endforeach
            @endif

            @if ($article['description']['specie'] ?? false)
                <h3 class="mt-3">Complément</h3>
                {!! $article['description']['specie'] ?? null !!}
                {!! $article['description']['producer'] ?? null !!}
            @endif

        </div>
        <div class="col-lg-3 col-xs-12">
            @if (config('app.debug') && !empty($article['available_sale_channels']))
                <div class="alert alert-info p-2 mb-3">
                    <strong class="d-block">Offres :</strong>
                    <ul class="list-unstyled mb-0 small">
                        @php
                            $currentSaleChannelId = $article['current_sale_channel']['id'] ?? null;
                        @endphp
                        @foreach ($article['available_sale_channels'] as $channel)
                            @php
                                $isCurrentChannel = $currentSaleChannelId === $channel['id'];
                                $priceTaxed = $channel['price_taxed'] ?? null;
                                $quantity = $channel['quantity'] ?? null;
                                $offerStock = $channel['offer_stock_current'] ?? null;
                                $offerIsActive = $channel['offer_is_active'] ?? false;
                                $offerHasStock = $channel['offer_has_stock'] ?? null;
                                $highlightStyle = $isCurrentChannel ? 'background-color: rgba(0, 0, 0, 0.06);' : '';
                                $nameClass = ($offerIsActive && $offerHasStock !== false) ? '' : 'text-muted';
                                $flags = [];
                                if (! $offerIsActive) {
                                    $flags[] = 'inactive';
                                }
                                if ($offerHasStock === false) {
                                    $flags[] = 'no-stock';
                                }
                            @endphp
                            <li style="{{ $highlightStyle }}">
                                <div class="d-flex justify-content-between align-items-start">
                                    <span class="{{ $nameClass }}">
                                        • {{ $channel['name'] }}
                                        <span class="d-block text-muted" style="font-size: 0.85em; padding-left: 0.9em;">
                                            Code {{ $channel['code'] }}{!! $flags ? ' · <strong class="text-dark">'.implode('</strong> · <strong class="text-dark">', $flags).'</strong>' : '' !!}
                                        </span>
                                    </span>
                                    @if ($priceTaxed !== null)
                                        <span class="ml-2 text-nowrap text-right {{ $nameClass }}">
                                            {{ number_format($priceTaxed, 2, ',', ' ') }} € TTC
                                            @if (! empty($quantity))
                                                <span class="d-block text-muted" style="font-size: 0.85em;">Qté min. {{ $quantity }}</span>
                                            @endif
                                        </span>
                                    @else
                                        <span class="ml-2 text-muted">–</span>
                                    @endif
                                </div>
                            </li>
                        @endforeach
                    </ul>
                </div>
            @endif
            @include('Shop.Articles.partials.ArticleAddBasket')
        </div>
    </div>
@endsection

@include('load.layout.modal')