@section('meta_title')
    @lang('languages.packages')
@endsection

@section('meta_desc')
    {{ 'Yara Net Internet Service Provider Packages in Afghanistan' }}
@endsection

@extends('Frontend.master_page')

@section('title')
    <h2>@lang('languages.packages')</h2>
@endsection

@section('page_path')
    <ul class="breadcrumb">
        <li class="breadcrumb-item">
            <a href="/">@lang('languages.home')</a>
        </li>
        <li class="breadcrumb-item active">
            @lang('languages.packages')
        </li>
    </ul>
@endsection


@section('content')
    <section class="s-pt-50 s-pt-md-70 s-pt-xl-61 s-pb-60 s-pb-md-40 s-pb-xl-50 ls ms">
        <div class="container">
            <div class="row c-gutter-30">

                @forelse ($packages as $package)
                    <div class="col-lg-4 col-md-4">
                        <div class="pricing-plan box-shadow color_style2">
                            <div class="plan-name">
                                <h3>
                                    {{ $package->name }}
                                </h3>
                            </div>
                            <div class="plan-header">
                                <ul>
                                    <li>
                                        <p class="plan-header-title">internet</p>
                                        <p class="plan-header-aftertitle">{{ $package->speed }} Mbps</p>
                                        <p class="plan-header-text">Download Speeds</p>
                                    </li>
                                </ul>
                                @if ($package->image)
                                    <img alt="" src="/Images/{{ $package->image }}">
                                @endif
                            </div>

                            <div class="plan-features">
                                <ul class="list-styled-circle">
                                    @forelse ($package->features as $feature)
                                        <li>{{ $feature->name }}</li>
                                    @empty
                                    @endforelse

                                </ul>
                            </div>
                            <div class="price-wrap ">
                                <span class="plan-sign">{{ $package->currency }}</span>
                                <span class="plan-price">{{ $package->price }}</span>
                                <span class="plan-decimals">/{{ $package->per }}</span>
                            </div>

                            <div class="plan-button">
                                <a href="/contact-us" class="btn btn-maincolor">Shop Now</a>
                            </div>
                        </div>
                    </div>
                    <div class="divider-30 d-md-none"></div>
                @empty
                @endforelse
            </div>
        </div>
    </section>

@endsection