@extends('frontend.layouts.app')

@section('content')
    <!--==============================
    Breadcumb
============================== -->
    <div class="breadcumb-wrapper " data-bg-src="{{asset('frontend/coreui/assets/img/breadcumb/breadcumb-bg.jpg')}}">
        <div class="container z-index-common">
            <div class="breadcumb-content">
                <h1 class="breadcumb-title">UCSF Academic Calendar</h1>
                <div class="breadcumb-menu-wrap">
                    <ul class="breadcumb-menu">
                        <li><a href="{{route('front.home')}}">Home</a></li>
                        <li>Academic Calendar</li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
    <div class="row">
        <div class="col-sm-12 col-lg-12 col-md-12 text-center mt-5">
            <h2 style="color: #E8063C">Academic Year Overview</h2>
            <p class="text-center fs-3 container">The academic calendar of University Cambridge School Faisalabad (UCSF)
                is designed to balance learning, examinations, holidays, and extracurricular activities. It helps students
                and parents stay updated with important dates throughout the year.
            </p>
        </div>
    </div>

        <section class="vs-product-wrapper space-top space-extra-bottom">
            <div class="container">
                <div class="row justify-content-center">
                    @if($calender->isEmpty())
                        <div class="col-lg-12 col-md-12 col-sm-12">
                            <h2 class="feature-title me-xxl-5">NO Record Found !</h2>
                        </div>
                        @else
                    @foreach($calender as $cal)
                        <div class="col-md-6 col-lg-4 col-xl-3">
                            <div class="vs-product product-style1 d-flex flex-column w-100 h-100">
                                <div class="product-img">
                                    <a href="#"><img
                                            src="{{ asset("storage/Academic-Calender/image/{$cal->image}") }}"
                                            alt="Image" class="img-fluid"></a>
                                </div>
                                <div class="product-content">
                                    <h3 class="product-title"><a class="text-inherit">{{$cal->name}}</a></h3>
                                    <p class="service-text flex-grow-1">
                                        {{$cal->sub_details}}
                                    </p>
                                    <div class="actions mt-auto">
                                        <a href="{{ asset("storage/Academic-Calender/calendar/{$cal->calendar}") }}"
                                           download="" class="vs-btn"><i class="cil cil-download"></i>Download</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    @endforeach
                    @endif

                </div>
            </div>
        </section>
@endsection
@push('head-scripts')
<script type="application/ld+json">
{
  "@context": "https://schema.org",
  "@type": "CollectionPage",
  "name": "Academic Calendar - University Cambridge School Faisalabad",
  "description": "Academic calendar of University Cambridge School Faisalabad (UCSF) with important dates for examinations, holidays, and extracurricular activities.",
  "url": "{{ route('front.calender') }}",
  "mainEntity": {
    "@type": "CollegeOrUniversity",
    "name": "University Cambridge School Faisalabad",
    "url": "{{ url('/') }}"
  },
  "hasPart": [
    @foreach($calender as $cal)
    {
      "@type": "Event",
      "name": "{{ $cal->name }}",
      "description": "{{ $cal->description }}",
      "startDate": "{{ $cal->start_date }}",
      "endDate": "{{ $cal->end_date }}",
      "organizer": {
        "@type": "CollegeOrUniversity",
        "name": "University Cambridge School Faisalabad"
      }
    }{{ !$loop->last ? ',' : '' }}
    @endforeach
  ]
}
</script>
@endpush