@extends('layouts.app')

@section('content')
    <div class="container">
        <div class="hero">
            <div class="swiper">
                <div class="swiper-slide">
                    @if($project->mobile_image)
                        <source srcset="{{ asset('projects/mobile/' . $project->mobile_image) }}" media="(max-width: 768px)">
                    @endif
                    @if($project->desktop_image)
                        <img src="{{ asset('projects/desktop/' . $project->desktop_image) }}"
                            alt="{{ $project->getTranslation('title', app()->getLocale(), false) }}" class="">
                    @endif
                    @php
                        $projectTitle = $project->getTranslation('title', app()->getLocale(), false);
                    @endphp
                    @if($projectTitle)
                        <div class="caption">
                            <h3>{{ $projectTitle }}</h3>
                        </div>
                    @endif
                </div>
            </div>
        </div>
    </div>
    <div class="container novedades page-container">
        <div class="content">
            @php
                $projectDescription = $project->getTranslation('description', app()->getLocale(), false);
            @endphp
            @if($projectDescription)
                {!! $projectDescription !!}
            @endif
        </div>
    </div>

    <div class="container">
        <div class="our-programs grid">
            @foreach($pages as $page)
                @php
                    $pageTitle = $page->getTranslation('title', app()->getLocale(), false);
                @endphp
                @if($pageTitle)
                    <a href="{{ route('page.show', $page->slug) }}" class="program-card summer-program">
                        <div class="img">
                            <img src="{{ asset('pages/desktop/' . $page->desktop_image) }}" alt="">
                        </div>
                        <div class="description">
                            <div class="bottom-card">
                                <h4 class="title-program">{{ $pageTitle }}</h4>
                            </div>
                        </div>
                    </a>
                @endif
            @endforeach
        </div>
    </div>

    {{-- Sección de Novedades/Cursos --}}
    @if($news->count() > 0)
        <div class="container page-container">
            <div class="content our-courses">
                <h1 class="title">
                    {{ App::getLocale() == 'es' ? '. cursos' : '. courses' }}
                </h1>
                @foreach($news as $novelty)
                    @php
                        $noveltyTitle = $novelty->getTranslation('title', app()->getLocale(), false);
                    @endphp
                    @if($noveltyTitle)
                        <a href="{{ route('news.single', $novelty->id) }}" class="course-card">
                            <div class="icon">
                                <i class="fa fa-check"></i>
                            </div>
                            <!-- <div class="img">
                                                                                                                                                                        <img src="{{ asset('news/desktop/' . $novelty->desktop_image) }}" alt="">
                                                                                                                                                                    </div> -->
                            <div class="description">
                                <div class="bottom-card">
                                    <h4 class="title-program">{{ $noveltyTitle }}</h4>
                                </div>
                            </div>
                        </a>
                    @endif
                @endforeach
            </div>
        </div>
    @endif
@endsection