@extends('layouts.site')

@section('content')
    @php
        /**/ [
            $name,
            $email,
            $phone,
            $whatsapp,
            $google_map_url,
            $addresss,
            $facebook,
            $instagram,
            $twitter,
            $youtube,
            $tiktok,
        ] = getGeneralSettings();

    @endphp
    @php

        $lang = app()->getLocale();
        $name = 'name_' . $lang;
        $details = 'details_' . $lang;

        $description = 'description_' . $lang;
        $question = 'question_' . $lang;
        $answer = 'answer_' . $lang;
        $img_alt = 'img_alt_' . $lang;
        $slug = 'slug_' . app()->getLocale();
        // $slug = 'slug_en';
    @endphp


    <!--Start Page Header-->
    <section class="page-header">
      <div class="page-header__bg" style="background-image: url({{ asset('assets/front/img/page.webp') }})">
        </div>
        <div class="container">
            <div class="page-header__inner text-center">
                <h2>{{ __('Services') }}</h2>
                <ul class="thm-breadcrumb">
                    <li><a href="{{ route('home_index') }}">{{ __('Home') }}</a></li>

                    <li><span class="icon-right-arrow-5"></span></li>
                    <li>
                        {{ app()->getLocale() == 'ar' ? 'التفاصيل' : 'services details' }}

                    </li>
                </ul>
            </div>
        </div>
        <svg class="wave" viewBox="0 0 1440 40" xmlns="http://www.w3.org/2000/svg">
            <path fill="#fff" fill-opacity="1" d="M0,40 Q360,10 720,30 T1440,40 L1440,50 L0,50Z">
            </path>
        </svg>
    </section>
@php
    $originalUrl = $service->vedio_url;
    if (strpos($originalUrl, 'youtube.com/shorts/') !== false) {
        preg_match('/shorts\/([^?]+)/', $originalUrl, $matches);
        $videoId = $matches[1] ?? '';
        $videoUrl = "https://www.youtube.com/watch?v=" . $videoId;
    } else {
        $videoUrl = $originalUrl;
    }
@endphp
    <!--Start Services Details -->
    <section class="services-details-page direction">
        <div class="container">
            <div class="row">
                <!--Start Services Details Page Content-->
                <div class="col-xl-8  wow fadeInDown" data-wow-delay=".3s">
                    <div class="services-details-page__content">
                        <div class="services-details-page__content-img1 cs_video_block cs_style_2 position-relative">
                            <div class="backservdetails"
                                style="background-image: url({{ asset('assets/images/services/' . $service->img) }} );"
                                alt="{{ $service->$img_alt ?? 'services img' }}"></div>
                          <a href="{{ $videoUrl }}" class="cs_play_btn video-popup"><i class="fa fa-play iconplaytreat"></i></a> 
                        </div>

                        <div class="services-details-page__content-text1">
                            <div class="top-text">
                                <div class="title">
                                    <h2> {{ $service->$name }}</h2>
                                </div>
                            </div>
                            <p> {!! html_entity_decode($service->$details) !!}</p>

  @if (isset($service->upload_file) && !empty($service->upload_file))
 <div class="sidebar__brochure-single catlog col-md-5">
                                      <a href="{{ asset('assets/images/services_pdf/' . $service->upload_file) }}"
                                                target="_blank">   <div class="left-content">
                                            <div class="icon">
                                                <img src="{{ asset('assets/front/img/sidebar-icon1.webp') }}"
                                                    alt="pdf icon">
                                            </div>
                                            <div class="text-box">
                                                <h4>
                                                    {{ app()->getLocale() == 'ar' ? 'بروفايل الخدمة' : 'Service Brochure' }}


                                                </h4>
                                            </div>
                                        </div></a>

                                        <div class="btn-box">
                                            <a href="{{ asset('assets/images/services_pdf/' . $service->upload_file) }}"
                                                target="_blank"><span class="icon-right-arrow-5"></span></a>
                                        </div>
                                    </div> 
                                  @endif 
                         </div>

                    </div>
                </div>

                <!--Start Sidebar-->
                <div class="col-xl-4  wow fadeInUp" data-wow-delay=".3s">
                    <div class="sidebar">
                        <!--Start Sidebar Single-->
                        <div class="sidebar__single sidebar__services wow fadeInUp" data-wow-delay=".2s">
                            <div class="title-box">
                                <h2> {{ app()->getLocale() == 'ar' ? 'خدماتنا' : 'Services List' }}</h2>
                            </div>
                           
                            @php
                                $services = \App\Models\Service::where('is_active', 1)->get();
                             //   dump("  $service->id");
                            @endphp
                            @if ($services && $services->count() > 0)
                                <ul class="sidebar__services-list">
                                    @foreach ($services as $servicee)

                                        <li class="@if ($servicee->id == $service->id) active @endif"    >
                                            <a href="{{ route('site.servicesDetails', ['slug' => $servicee->$slug]) }} ">
                                                {{ $servicee->$name }}
                                                @if (app()->getLocale() == 'ar')
                                                    <span class="icon-right-arrow-5"></span>
                                                @else
                                                    <span class="icon-right-arrow-5"></span>
                                                @endif


                                            </a>
                                        </li>
                                    @endforeach
                                </ul>
                            @endif
                        </div>

                        <!--Start Sidebar Single-->
                        <div class="sidebar__single sidebar__brochure wow fadeInUp" data-wow-delay=".3s">
                            <div class="title-box">
                                <h2>
  {{ app()->getLocale() == 'ar' ? 'بروفايل' : 'Brochure' }}</h3>

                                </h2>
                            </div>
                            <div class="sidebar__brochure-box">
                                @if (isset($service->upload_file) && !empty($service->upload_file))
                                    <div class="sidebar__brochure-single">
                                        <div class="left-content">
                                            <div class="icon">
                                                <img src="{{ asset('assets/front/img/sidebar-icon1.webp') }}"
                                                    alt="pdf icon">
                                            </div>
                                            <div class="text-box">
                                                <h4>
                                                    {{ app()->getLocale() == 'ar' ? 'بروفايل الخدمة' : 'Service Brochure' }}


                                                </h4>
                                            </div>
                                        </div>

                                        <div class="btn-box">
                                            <a href="{{ asset('assets/images/services_pdf/' . $service->upload_file) }}"
                                                target="_blank"><span class="icon-right-arrow-5"></span></a>
                                        </div>
                                    </div>
                                @endif
                                @php
    $settings = \App\Models\Setting::first();
    $pdf = app()->getLocale() == 'ar'
        ? asset('assets/images/services_pdf/' . $settings->upload_file)
        : asset('assets/images/services_pdf/' . $settings->upload_file_en);
@endphp

                                    <div class="sidebar__brochure-single">
                                        <div class="left-content">
                                            <div class="icon">
                                                <img src="{{ asset('assets/front/img/sidebar-icon1.webp') }}"
                                                    alt="pdf icon">
                                            </div>
                                            <div class="text-box">
                                                <h4>
                                                    {{ app()->getLocale() == 'ar' ? 'بروفايل الشركة' : 'Company Profile' }}


                                                </h4>
                                            </div>
                                        </div>

                                        <div class="btn-box">
                                            <a href="{{ $pdf }}" target="_blank"><span
                                                    class="icon-right-arrow-5"></span></a>
                                        </div>
                                    </div>
                            </div>
                        </div>

                    </div>
                </div>
                <!--End Sidebar-->
            </div>
        </div>
    </section>


@stop

@section('scripts')
    <script>
        function toggleContent() {
            var content = document.getElementById('seo-content');
            var readMoreBtn = document.getElementById('read-more-btn');
            var readLessBtn = document.getElementById('read-less-btn');

            if (content.style.display === 'none' || content.style.display === '') {
                content.style.display = 'block'; // إظهار المحتوى
                readMoreBtn.style.display = 'none'; // إخفاء زر "اقرأ المزيد"
                readLessBtn.style.display = 'block'; // إظهار زر "اقرأ أقل"
            } else {
                content.style.display = 'none'; // إخفاء المحتوى
                readMoreBtn.style.display = 'block'; // إظهار زر "اقرأ المزيد"
                readLessBtn.style.display = 'none'; // إخفاء زر "اقرأ أقل"
            }
        }
    </script>
    <script>
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            }
        });
    </script>

@stop