@extends('front.front_layouts.main')

@section('content')

    <section class="top-section">
        <div class="container">
            <div class="header">
                <h2 class="title"><img class="ml-2 icon" src="{{ asset('front_asset/assets/images/icons/checklist.png') }}" alt="">باقات الإشتراك</h2>
                <div class="line"></div>
            </div>
            <div class="row justify-content-center">
                @foreach($packages as $package)
                    <div class="col-12 col-md-6 col-lg-4 col-xl-3">
                        <div class="package">
                            <div class="pack-head">
                                {{--<span>{{ $package->name }}</span>--}}
                                {{--<h3>{{ $package->title }}</h3>--}}
                                <span>{{ $package->title }}</span>
                                <h3>{{ $package->price }} دولار</h3>
                            </div>
                            <div class="pack-body">
                                @php
                                    $lines=  explode("\n", str_replace("\r", "", $package->description));
                                @endphp
                                <ul>
                                    @foreach( $lines as $line)
                                        <li>{!! $line !!}</li>
                                    @endforeach
                                </ul>
                                <div class="text-center">
                                @if(auth('supplier')->check())
                                    <a class="btn d-inline-block hvr-shadow"
                                       href="{{route('supplier.subscription')}}">إشتراك</a>
                                @else
                                    <a class="btn d-inline-block hvr-shadow" data-toggle="modal"
                                            href="#login-confirm">إشتراك</a>
                                @endif
                                </div>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
        </div>
    </section>
@endsection