@if($subscribe)
@if($subscribe->start_date <= date('Y-m-d'))
    <div class="card_shadow">
        <div class="choose_plan_card_info">
            <div class="row">
                <div class="col-lg-9">
                    <div class="inf">
                        <p> {{__('web.current_subscribe')}} </p>
                        <h5> {{$subscribe->section->descriptions()->name}}  </h5>
                        <h6 class="mt3 mainColor"> {{$subscribe->species->species->descriptions()->name}} </h6>
                        <small> 
                            {{$subscribe->days}} {{__('web.day')}} <i class="far fa-circle mx-2 small"></i> 
                            @foreach($subscribe->sides as $side)
                                <small> {{$side->count}} {{$side->side->descriptions()->name}} <i class="far fa-circle mx-2 small"></i> </small> 
                            @endforeach
                            @if($subscribe->count_snacks > 0)
                                <small> {{$subscribe->count_snacks}} {{__('web.snacks')}} <i class="far fa-circle mx-2 small"></i> </small>
                            @endif
                            {{$subscribe->species->calories}} {{__('web.calories')}}
                        </small>
                    </div>
                </div>
                <div class="col-lg-3">
                    <div class="price_side">
                        <div class="price_card mt-4 mt-lg-0">
                            @if($subscribe->type == 'points')
                                <h5> {{$subscribe->points}} <small> {{__('web.point')}} </small> </h5>
                            @else
                                <h5> {{$subscribe->total}} <small> {{__('web.sar')}} </small> </h5>
                            @endif
                            <p> {{__('web.subscribe_cost')}} </p>
                        </div>
                        <ul class="sub_date">
                            <li> 
                                <span class="icon"> <img src="{{url('')}}/assets/web/images/new_imgs/icons/date.svg" alt=""> </span>
                                <div class="inf">
                                    <p class="fw-bold"> {{date('Y.m.d',strtotime($subscribe->start_date))}} </p>
                                    <p> {{__('web.start_date')}} </p>
                                </div>
                            </li>
                            <li> 
                                <span class="icon"> <img src="{{url('')}}/assets/web/images/new_imgs/icons/date.svg" alt=""> </span>
                                <div class="inf">
                                    <p class="fw-bold"> {{date('Y.m.d',strtotime($subscribe->end_date))}} </p>
                                    <p> {{__('web.end_date')}} </p>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <div class="days_choose_sec">
            <div class="container">                                                    
                <div class="single_day_tabs">
                    @foreach($days as $key=>$row)
                        <div class="single_day_item mb-4">
                            <div class="day_title mb-4">
                                <h6 class="mainColor"> {{__('web.'.date('l',strtotime($row->date)))}} {{date('d',strtotime($row->date))}} {{__('web.'.date('F',strtotime($row->date)))}}  {{date('Y',strtotime($row->date))}}</h6>
                                @if($row->canEdit())
                                    <a href="{{url(getCurrentLocale().'/subscribe/edit/'.$row->id)}}" class="nav-link butn butn_line rounded-pill" >
                                        <span> {{__('web.edit_day')}} </span>
                                   </a>
                               @endif
                            </div>
                            <ul class="nav nav-pills" id="pills-tab" role="tablist">
                                @if($subscribe->cost->breakfast > 0)
                                <li class="nav-item" role="presentation">
                                  <button class="nav-link " id="pills{{$key}}-meal1-tab" data-bs-toggle="pill" data-bs-target="#pills{{$key}}-meal1" type="button" role="tab" aria-controls="pills{{$key}}-meal1" aria-selected="false">
                                        <img src="{{url('')}}/assets/web/images/new_imgs/icons/004-restaurant.svg" alt="" class="icon"> <strong> {{__('web.breakfast')}} </strong>
                                  </button>
                                </li>
                                @endif
                                @if($subscribe->cost->main > 0)
                                <li class="nav-item" role="presentation">
                                  <button class="nav-link" id="pills{{$key}}-meal2-tab" data-bs-toggle="pill" data-bs-target="#pills{{$key}}-meal2" type="button" role="tab" aria-controls="pills{{$key}}-meal2" aria-selected="false">
                                    <img src="{{url('')}}/assets/web/images/new_imgs/icons/002-restaurant.svg" alt="" class="icon"> <strong> {{__('web.main')}} </strong>
                                  </button>
                                </li>
                                @endif
                                @if($subscribe->count_snacks > 0)
                                <li class="nav-item" role="presentation">
                                  <button class="nav-link" id="pills{{$key}}-meal3-tab" data-bs-toggle="pill" data-bs-target="#pills{{$key}}-meal3" type="button" role="tab" aria-controls="pills{{$key}}-meal3" aria-selected="false">
                                    <img src="{{url('')}}/assets/web/images/new_imgs/icons/009-pizza.svg" alt="" class="icon"> <strong> {{__('web.snacks')}} </strong>
                                  </button>
                                </li>
                                @endif
                                @if(count($subscribe->sides) > 0)
                                    @foreach($subscribe->sides as $side)
                                        <li class="nav-item" role="presentation">
                                            <button class="nav-link" id="pills{{$key}}-side{{$side->id}}-meal4-tab" data-bs-toggle="pill" data-bs-target="#pills{{$key}}-side{{$side->id}}-meal4" type="button" role="tab" aria-controls="pills{{$key}}-side{{$side->id}}-meal4" aria-selected="false">
                                                <img src="{{url('')}}/assets/web/images/new_imgs/icons/024-cupcake.svg" alt="" class="icon"> <strong> {{$side->side->descriptions()->name}} </strong>
                                            </button>
                                        </li>
                                    @endforeach
                                @endif
                              </ul>
                            <div class="tab-content" id="pills-tabContent">
                                <div class="tab-pane fade" id="pills{{$key}}-meal1" role="tabpanel" aria-labelledby="pills{{$key}}-meal1-tab">
                                    <div class="row">
                                        @if(count($subscribe->meals('breakfast',$row->date)) > 0)
                                            <div class="days_slider">
                                                <div class="swiper-container">
                                                    <div class="swiper-wrapper">
                                                        @foreach($subscribe->mealsEdit('breakfast',$row->date,$row->id) as $keyMeal=>$meal)
                                                            @include('web.pages.components.mealEdit',['meal'=>$meal,'key'=>$key,'status'=>'breakfast','keyMeal'=>$keyMeal,'day'=>$row,'package_id'=>$subscribe->package_id])
                                                        @endforeach
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="swiper-button-next"></div>
                                            <div class="swiper-button-prev"></div>
                                        @else
                                            <div class="col-lg-12">
                                                <div class="text-center py-5 mt-5">
                                                    <div class="alert alert-warning py-5" role="alert">
                                                        <h5 class="mb-0"> {{__('web.not_exists_meals')}} </h5>
                                                    </div>
                                                </div>
                                            </div>
                                        @endif
                                    </div>
                                </div>
                                <div class="tab-pane fade" id="pills{{$key}}-meal2" role="tabpanel" aria-labelledby="pills{{$key}}-meal2-tab">
                                    <div class="row">
                                        @if(count($subscribe->meals('main',$row->date)) > 0)
                                            <div class="days_slider">
                                                <div class="swiper-container">
                                                    <div class="swiper-wrapper">
                                                        @foreach($subscribe->mealsEdit('main',$row->date,$row->id) as $keyMeal=>$meal)
                                                            @include('web.pages.components.mealEdit',['meal'=>$meal,'key'=>$key,'status'=>'main','keyMeal'=>$keyMeal,'day'=>$row,'package_id'=>$subscribe->package_id])
                                                        @endforeach
                                                    </div>
                                                </div>
                                            </div>
                                            <div class="swiper-button-next"></div>
                                            <div class="swiper-button-prev"></div>
                                        @else
                                            <div class="col-lg-12">
                                                <div class="text-center py-5 mt-5">
                                                    <div class="alert alert-warning py-5" role="alert">
                                                        <h5 class="mb-0"> {{__('web.not_exists_meals')}} </h5>
                                                    </div>
                                                </div>
                                            </div>
                                        @endif
                                    </div>
                                </div>
                                @if($subscribe->count_snacks > 0)
                                    <div class="tab-pane fade" id="pills{{$key}}-meal3" role="tabpanel" aria-labelledby="pills{{$key}}-meal3-tab">
                                        <div class="row">
                                            @if(count($subscribe->meals('snack',$row->date)) > 0)
                                                <div class="days_slider">
                                                    <div class="swiper-container">
                                                        <div class="swiper-wrapper">
                                                            @foreach($subscribe->mealsEdit('snack',$row->date,$row->id) as $keyMeal=>$meal)
                                                                @include('web.pages.components.mealEdit',['meal'=>$meal,'key'=>$key,'status'=>'snacks','keyMeal'=>$keyMeal,'day'=>$row,'package_id'=>$subscribe->package_id])
                                                            @endforeach
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="swiper-button-next"></div>
                                                <div class="swiper-button-prev"></div>
                                            @else
                                                <div class="col-lg-12">
                                                    <div class="text-center py-5 mt-5">
                                                        <div class="alert alert-warning py-5" role="alert">
                                                            <h5 class="mb-0"> {{__('web.not_exists_meals')}} </h5>
                                                        </div>
                                                    </div>
                                                </div>
                                            @endif
                                        </div>
                                    </div>
                                @endif
                                @if(count($subscribe->sides) > 0)
                                    @foreach($subscribe->sides as $side)
                                        <div class="tab-pane fade" id="pills{{$key}}-side{{$side->id}}-meal4" role="tabpanel" aria-labelledby="pills{{$key}}-side{{$side->id}}-meal4-tab">
                                            <div class="row">
                                                @if(count($subscribe->meals('side',$row->date,$side->side_id)) > 0)
                                                    <div class="days_slider">
                                                        <div class="swiper-container">
                                                            <div class="swiper-wrapper">
                                                                @foreach($subscribe->mealsEdit('side',$row->date,$row->id,$side->side_id) as $keyMeal=>$meal)
                                                                    @include('web.pages.components.mealEdit',['meal'=>$meal,'key'=>$key,'status'=>'sides','keyMeal'=>$keyMeal,'day'=>$row,'package_id'=>$subscribe->package_id])
                                                                @endforeach
                                                            </div>
                                                        </div>
                                                    </div>
                                                    <div class="swiper-button-next"></div>
                                                    <div class="swiper-button-prev"></div>
                                                @else
                                                    <div class="col-lg-12">
                                                        <div class="text-center py-5 mt-5">
                                                            <div class="alert alert-warning py-5" role="alert">
                                                                <h5 class="mb-0"> {{__('web.not_exists_meals')}} </h5>
                                                            </div>
                                                        </div>
                                                    </div>
                                                @endif
                                            </div>
                                        </div>
                                    @endforeach
                                @endif
                              </div>
                        </div>
                    @endforeach
                </div>
            </div>
        </div>
    </div>
    
    
    
    <script>
        var swiper = new Swiper('.single_day_tabs .days_slider .swiper-container', {
            // slidesPerView: 5,
            spaceBetween: 30,
            // centeredSlides: true,
            speed: 1000,
            pagination: false,
            navigation: {
                nextEl: '.days_slider .swiper-button-next',
                prevEl: '.days_slider .swiper-button-prev',
            },
            mousewheel: false,
            keyboard: true,
            autoplay: {
                delay: 5000,
            },
            loop: false,
            breakpoints: {
                0: {
                    slidesPerView: 1,
                },
                480: {
                    slidesPerView: 1,
                },
                787: {
                    slidesPerView: 2,
                },
                991: {
                    slidesPerView: 2,
                },
                1200: {
                    slidesPerView: 2.5,
                }
            }
        });
    </script>

    <script>
        var swiper = new Swiper('.days_slider_2 .swiper-container', {
            // slidesPerView: 5,
            spaceBetween: 30,
            // centeredSlides: true,
            speed: 1000,
            pagination: false,
            navigation: {
                nextEl: '.days_slider_2 .swiper-button-next',
                prevEl: '.days_slider_2 .swiper-button-prev',
            },
            mousewheel: false,
            keyboard: true,
            autoplay: false,
            loop: false,
            breakpoints: {
                0: {
                    slidesPerView: 1,
                },
                480: {
                    slidesPerView: 1,
                },
                787: {
                    slidesPerView: 2,
                },
                991: {
                    slidesPerView: 2,
                },
                1200: {
                    slidesPerView: 3.5,
                }
            },
        });
    </script>
    <script>
        let action_calculate = {!! json_encode(url(getCurrentLocale().'/subscribe/calculate/meal')) !!}
        let url_change_day = {!! json_encode(url(getCurrentLocale().'/subscribe/change/day')) !!}
    </script>

    <script src="{{url('')}}/assets/web/js/custom/calculatePackage.js"></script>
@else

    <div class="card_shadow">
        <div class="title mb-3">
            <h4> {{__('web.will_start_in') .' '. $subscribe->start_date}} </h4>
        </div>
    </div>
@endif

@else
    <div class="card_shadow">
        <div class="title mb-3">
            <h4> {{__('web.not_exist_yet')}} </h4>
        </div>
    </div>
@endif