@if (count($packages = get_client_payment_packages()))
    <div class="pricing-area">
        <div class="container-fluid">
            <div class="section-title text-center">

                <span class="sp-before sp-after">{{ $data->sub_title('Bảng giá') }}</span>
                <h2 class="h2-color2">{{ $data->title('Lựa chọn gói phù hợp') }}</h2>

            </div>
            <div class="price-width">
                <div class="row">

                    @foreach ($packages as $item)
                        @php
                            $i = ($loop->index % 3) + 1;
                        @endphp
                        <div class="col-lg-4 col-sm-6">
                            <div class="pricing-card">
                                <div class="pricing-card-into color-bg{{ $i }}">
                                    <i class="flaticon-banner pricing-icon color-{{ $i }}"></i>
                                    <h3 class="color-{{ $i }}">{{ $item->name }}</h3>
                                    <div class="price-rate">
                                        <h2 class="color-{{ $i }}">{{ number_format($item->retail_price / 1000, 0, ',', '.') }}k</h2>
                                        <span class="color-{{ $i }}">{{ $item->quantity }} tháng</span>
                                    </div>
                                    <ul>
                                        {!! implode(
                                            '',
                                            array_map(function ($line) {
                                                $a = trim($line);
                                                if (preg_match('/^\[(f|x)\]/si', $a)) {
                                                    $a = preg_replace('/^\[(f|x)\]/si', '', $a);
                                                    $a = "<del>$a</del>";
                                                } elseif (preg_match('/^\[(t|true)\]/si', $a)) {
                                                    $a = preg_replace('/^\[(t|true)\]/si', '<i class="bx bx-check"></i> ', $a);
                                                }
                                                return "<li>$a</li>";
                                            }, nl2array($item->feature_text)),
                                        ) !!}
                                    </ul>
                                    <a href="{{ route('web.payments.detail', ['id' => $item->id]) }}" class="purchase-btn button-bg{{ $i }}">
                                        {{ $item->retail_price > 0 ? 'Mua gói' : 'Dùng thử' }}
                                    </a>
                                </div>
                            </div>
                        </div>
                    @endforeach
                </div>
            </div>
        </div>
        <div class="pricing-shape">
            <div class="shape1">
                <img src="{{ ai_startup_asset('img/shape/shape7.png') }}" alt="Images">
            </div>
            <div class="shape2">
                <img src="{{ ai_startup_asset('img/shape/shape4.png') }}" alt="Images">
            </div>
            <div class="shape3">
                <img src="{{ ai_startup_asset('img/shape/shape5.png') }}" alt="Images">
            </div>
            <div class="shape4">
                <img src="{{ ai_startup_asset('img/shape/shape6.png') }}" alt="Images">
            </div>
            <div class="shape5">
                <img src="{{ ai_startup_asset('img/shape/shape4.png') }}" alt="Images">
            </div>
            <div class="shape6">
                <img src="{{ ai_startup_asset('img/shape/shape8.png') }}" alt="Images">
            </div>
        </div>
    </div>
@else
@endif