@extends('site.layouts.app', ['seoModel' => $travel])
@section('content')

<div class="page-wrapper content-wrapper page-trip">
    @php
    $banner_args = [
        'image_url'         => $travel->banner_desktop,
        'tablet_image'      => $travel->banner_tablet,
        'mobile_image_url'  => $travel->banner_mobile,
        'alt'               => !empty($travel->title) ? $travel->title : '',
        'title'             => !empty($travel->title) ? $travel->title : '',
        'tag'             => !empty($travel->tag) ? $travel->tag : '',
    ]
@endphp
@include('site._includes.mini-banner',  $banner_args)
    <section class="trip">
        <div class="container">
            <div class="trip__header">
                @if($travel->title_text)
                    <small>{{$travel->title_text}}</small>
                @endif
                @if($travel->sub_title_text)
                    <h2>{{$travel->sub_title_text}}</h2>
                @endif
                <img src="{{ asset('images/stars-partners.png') }}" alt="{{$travel->title}}">
            </div>
            <div class="trip__description">
               {!! $travel->text !!}
            </div>
            @if(($travel->media_type == 'youtube' && !empty($travel->youtube_link)) || ($travel->media_type == 'upload' && !empty($travel->video)))
                @php
                    $media = ($travel->media_type == "youtube") ? $travel->youtube_link : $travel->video;
                @endphp
                <div class="history__video" data-fancybox="video" data-src="{{ asset("storage/{$media}") }}">
                    <img src="{{ asset("storage/{$travel->image_video}") }}"  alt="{{$travel->title}}">
                </div>
            @endif

            @if(!empty($travel->gallery))
                <div class="trip__gallery">
                    <div class="swiper-container gallery__trip">
                        <div class="swiper-wrapper">
                            @foreach($travel->gallery as $image)
                                <div class="swiper-slide">
                                    <a data-fancybox="gallery-trip" href="{{ asset("storage/{$image}") }}">
                                        <img src="{{ asset("storage/{$image}") }}">
                                    </a>
                                </div>
                            @endforeach
                        </div>
                    </div>

                    <div class="gallery__buttons">
                        <div class="swiper-button-prev trip-button-prev">
                            <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <rect width="20" height="20" transform="matrix(-1 0 0 1 20 0)" fill="white"/>
                                <path d="M15.832 10H4.16536" stroke="#8AB277" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
                                <path d="M10 4.1665L4.16667 9.99984L10 15.8332" stroke="#8AB277" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
                            </svg>
                        </div>

                        <div class="swiper-button-next trip-button-next">
                            <svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
                                <rect width="20" height="20" fill="white"/>
                                <path d="M4.16797 10H15.8346" stroke="#8AB277" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
                                <path d="M10 4.1665L15.8333 9.99984L10 15.8332" stroke="#8AB277" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
                            </svg>
                        </div>
                    </div>

                    <div class="line-bottom"></div>

                    <img class="detalhe" src="{{ asset('images/butterfly-history.png') }}" alt="{{$travel->title}}">
                </div>
            @endif

            <section class="contact">
                <div class="contact__title">
                    @if ($travel->tag_contact)
                        <small>{{ $travel->tag_contact }}</small>
                    @endif
                    <h2>{{ $travel->title_contact }}</h2>
                </div>
                <div class="container">
                    <div class="contact__block">
                        @livewire('contact-form', ['contact' => $contact, 'recipientEmail' => $siteInfo->travel_from_email])
                    </div>
                </div>
            </section>
        </div>
    </section>
</div>
@endsection