@extends("Site.Layouts.blank")
@section ("content")


    <section class=" relative">

        <!-- *=*=*=*=*=*=*=*=*=* Section Banner *=*=*=*=*=*=*=*=*=* -->
        <div class="w-full relative overflow-x-hidden overflow-y-hidden">
            <img class="w-full    min-h-[320px] md:h-auto object-cover " src="{{$setting['News_page_banner']}}" alt="banner">
            <div class="left_bottom-absolute min-w-full">
                <div class="Banner_text-wrapper">
                    <h1> @lang('site.News') </h1>
                </div>
            </div>
        </div>

    </section>


    <!-- *=*=*=*=*=*=*=*=*=* Section News List *=*=*=*=*=*=*=*=*=* -->

    <section>

        @foreach($News_list as $news)
            <div class="mx-2 sm:mx-5 md:mx-7 lg:mx-14 2xl:mx-40  my-10 pb-6 border-b border-slate-400	">
                <span class="float-none  @if(app()->getLocale() == 'ar') md:float-left @else md:float-right @endif  text-gray-400 text-xl mt-10 "> {{$news->formatted_publish_data}} </span>

                <a href="{{$news->path()}}" class=" md:flex gap-4  relative group " >

                   <div>
                       <img src="{{$news->image}}" alt="{{$news->title}}" class="mx-auto">
                   </div>
                    <div class="mt-8">
                        <h2 class="text-2xl md:text-3xl lg:text-[40px] font-thin text-gray-400 lg:!leading-[2.75rem] "> {{$news->title}} </h2>
                        <p class="leading-loose mt-2"> {!! nl2br(e($news->sub_content)) !!}  </p>

                        <span class="md:absolute bottom-2.5  block  mt-6 md:mt-0 group-hover:font-bold "> @lang('site.Read more').. </span>
                    </div>

                </a>
            </div>
        @endforeach

    </section>


    <div  class="table mx-auto my-7">
        {{$News_list->links('Site.paginator')}}
    </div>


    <!-- *=*=*=*=*=*=*=*=*=* Section CONTACT US *=*=*=*=*=*=*=*=*=* -->
    @include('Site._contact_us')

@endsection


@section("script")
    <script>

    </script>
@endsection