@extends('web.layouts.main')
@section('content')


<main>
        <!--start header-->
        <section class="pg-header">
            <div class="text text-center">
                <h4 class="mb-0">خدماتنا </h4>
            </div>
        </section>
         <!--start services-pg-->
        <section class="services-pg">
            <div class="container">
                @foreach($types as $type)
                <div class="nutrition">
                    <div class="row">
                        <div class="col-md-7 m-auto">
                            <div class="text text-center wow fadeInUp mb-5" data-wow-duration="2s">
                                <!-- <span>خدماتنا</span> -->
                                <h3> {{$type->name}}</h3>
                                <p>
                                   {{$type->description}}
                                        </p>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        @foreach(services($type->id) as $row)
                        
                        @if(count(steps($row->id)) == 0)
                        <div class="col-md-6">
                            <div class="item">
                                <div class="text">
                                    <h6>{{$row->name}}</h6>
                                    <p>
                                        {{$row->description}}
                                    </p>
                                    <div class="links">
                                        <a href="{{url('requests')}}">احجز الآن</a>
                                        <a data-fancybox href="{{$row->youtube}}"> قصة نجاح</a>
                                    </div>
                                </div>
                                <div class="icon-container" data-wow-duration="2s">
                                    <img src="{{asset($row->image)}}" alt="">
                                </div>
                            </div>
                        </div>
                        @else
                         <div class="col-md-12">
                            <div class="item">
                                <div class="text">
                                    <h6>{{$row->name}}</h6>
                                    <h6>  الخطوات :</h6>
                                    <p>
                                        @foreach(steps($row->id) as $step)
                                        • {{$step->step}} <br>
                                        @endforeach
                                    </p>
                                    <div class="links">
                                        <a href="{{url('requests')}}">احجز الآن</a>
                                        
                                    </div>
                                </div>
                                <div class="icon-container" data-wow-duration="2s">
                                    <img src="{{asset($row->image)}}" alt="">
                                </div>
                            </div>
                        </div>
                        @endif
                        @endforeach
                    </div>
                </div>
              @endforeach
            </div>
        </section>
    </main>
    
    @stop