{{--
<div class="overlay" id="overlay">
    <div class="container h-100">
        <div class="row align-items-center justify-content-center h-100">
            <div class="col-md-4 text-center text-md-start">
                <p class="coming-soon">{{ \App\Helpers\TranslationHelper::translate('This content will be available soon') }}</p>
</div>
<div class="col-md-4 text-center">
    <button class="lock-btn" onclick="unlockContent()">
        <img src="{{ asset('front/assets/img/lock.png') }}" alt="" class="img-fluid">
    </button>
</div>
</div>
</div>
</div>


<script>
    function unlockContent() {
        let overlay = document.getElementById("overlay");
        overlay.style.opacity = "0";

        setTimeout(() => {
            overlay.style.display = "none";
            document.getElementById("main-content").style.display = "block";
        }, 300);
    }
</script> --}}


{{-- <div class="swiper-main-one">
        <div class="swiper mySwiper">
            <div class="swiper-wrapper">
                <div class="swiper-slide"> {{ setting('title_header', app()->getLocale()) }}</div>
</div>
</div>
</div> --}}

{{-- <div class="swiper-main-one">
    <div class="swiper mySwiper">
        <div class="swiper-wrapper">
            <div class="swiper-slide">
                {{ setting('title_header', app()->getLocale()) }}
</div>
</div>
</div>
</div> --}}

<div class="swiper-main-one">
    <div class="swiper mySwiper">
        <div class="swiper-wrapper">
            <div class="swiper-slide marquee {{ app()->getLocale() == 'ar' ? 'marquee-rtl' : 'marquee-ltr' }}">
                {{ setting('title_header', app()->getLocale()) }}
            </div>
        </div>
    </div>
</div>

<style>
    .marquee {
        white-space: nowrap;
        overflow: hidden;
        display: inline-block;
        animation-duration: 20s;
        animation-timing-function: linear;
        animation-iteration-count: infinite;
    }

    .marquee-ltr {
        animation-name: marquee-ltr;
    }

    @keyframes marquee-ltr {
        from {
            transform: translateX(100%);
        }

        to {
            transform: translateX(-100%);
        }
    }

    .marquee-rtl {
        animation-name: marquee-rtl;
    }

    @keyframes marquee-rtl {
        from {
            transform: translateX(-100%);
        }

        to {
            transform: translateX(100%);
        }
    }

    .custom-dropdown {
        background-color: #d85c78 !important;
        border: none;
    }
</style>



<!-- ============= header =============== -->
<nav class="navbar navbar-expand-lg">
    <div class="container">
        <a class="navbar-brand" href="{{route('site.home')}}">
            <img src="{{ setting('image_logo', 'en') }}" alt="logo">
        </a>

        <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent"
            aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
            <span class="navbar-toggler-icon"></span>
        </button>
        <div class="collapse navbar-collapse" id="navbarSupportedContent">
            <ul class="navbar-nav mx-auto mb-2 mb-lg-0">
                <li class="nav-item">
                    <a class="nav-link"
                        href="{{route('site.home')}}">{{ \App\Helpers\TranslationHelper::translate('Home') }}</a>
                </li>

                <li class="nav-item">
                    <a class="nav-link"
                        href="{{route('blogs')}}">{{ \App\Helpers\TranslationHelper::translate('News&Videos') }}</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link"
                        href="{{route('about')}}">{{ \App\Helpers\TranslationHelper::translate('About Us') }}</a>
                </li>



                <li class="nav-item dropdown" style="color: #fff;">
                    <a style="color: #fff;" class="nav-link dropdown-toggle" href="#" role="button"
                        data-bs-toggle="dropdown" aria-expanded="false">
                        {{ \App\Helpers\TranslationHelper::translate('Royal Crown Vip card') }}
                        <i class="fas fa-chevron-down"></i>
                    </a>
                    <ul class="dropdown-menu custom-dropdown" style="color: #fff;">
                        <li><a class="dropdown-item"
                                href="{{route('regular-card')}}">{{ \App\Helpers\TranslationHelper::translate('Regular User Cards') }}</a>
                        </li>
                        <li><a class="dropdown-item"
                                href="{{route('royal-card')}}">{{ \App\Helpers\TranslationHelper::translate('Royal Cards') }}</a>
                        </li>
                        <li><a class="dropdown-item"
                                href="{{route('imperial-card')}}">{{ \App\Helpers\TranslationHelper::translate('Imperial Cards') }}</a>
                        </li>
                    </ul>
                </li>



                {{-- <li class="nav-item dropdown">
                        <a style="color: #fff;" class="nav-link dropdown-toggle" href="#" role="button"
                            data-bs-toggle="dropdown" aria-expanded="false">
                             {{ \App\Helpers\TranslationHelper::translate('Our Projects') }}
                <i class="fas fa-chevron-down"></i>
                </a>

                <ul class="dropdown-menu">
                    <li><a class="dropdown-item"
                            href="#">{{ \App\Helpers\TranslationHelper::translate('Wallet Application') }}</a></li>
                    <li><a class="dropdown-item"
                            href="#">{{ \App\Helpers\TranslationHelper::translate('Live Streaming Application') }}</a>
                    </li>
                    <li><a class="dropdown-item"
                            href="#">{{ \App\Helpers\TranslationHelper::translate('My Project Application') }}</a></li>
                    <li><a class="dropdown-item"
                            href="#">{{ \App\Helpers\TranslationHelper::translate('Salut Jobs') }}</a></li>
                    <li><a class="dropdown-item" href="#">{{ \App\Helpers\TranslationHelper::translate('Game') }}</a>
                    </li>
                </ul>

                </li> --}}

                <li class="nav-item">
                    <a class="nav-link"
                        href="{{route('contact-us')}}">{{ \App\Helpers\TranslationHelper::translate('Contact Us') }}</a>
                </li>


                {{-- <li class="nav-item">
                    <a class="nav-link"
                        href="{{route('charitable-Works')}}">{{ \App\Helpers\TranslationHelper::translate('charity') }}</a>
                </li> --}}
            </ul>
            <form class="d-flex" role="search">
                {{-- <button class="btn cart ms-2" type="button" id="shop-now">
                        <i style="margin-left: 5px;" class="fas fa-shopping-cart"></i> اشترى الآن
                    </button> --}}

                {{-- <a href="{{ route('buy-couronne') }}" class="btn cart ms-2" >
                <i style="margin-left: 5px;" class="fas fa-shopping-cart"></i>
                {{ \App\Helpers\TranslationHelper::translate('Buy Now') }}
                </a> --}}
                <div class="dropdown">
                    <button class="btn cart ms-2 dropdown-toggle" type="button" id="currencyDropdown"
                        data-bs-toggle="dropdown" aria-expanded="false">
                        <i class="fas fa-shopping-cart me-1"></i>
                        {{ \App\Helpers\TranslationHelper::translate('currency buying and selling') }}
                    </button>
                    <ul class="dropdown-menu" aria-labelledby="currencyDropdown">
                        <li>
                            <a class="dropdown-item" href="{{ route('royal-crown-coin') }}">
                                <i class="fas fa-shopping-bag me-2"></i>
                                {{ \App\Helpers\TranslationHelper::translate('Buy Now Royal Crown Vip') }}
                            </a>
                        </li>

                        <li>
                            <a class="dropdown-item" href="{{ route('sell-couronne') }}">
                                <i class="fas fa-money-bill-wave me-2"></i>
                                {{ \App\Helpers\TranslationHelper::translate('Sell Now Royal Crown Vip') }}
                            </a>
                        </li>
                    </ul>
                </div>


                {{-- <button class="btn cart ms-2" type="button" id="shop-now"
        onclick="window.location.href='#'">
    <i style="margin-left: 5px;" class="fas fa-shopping-cart"></i>{{ \App\Helpers\TranslationHelper::translate('Buy Now') }}
                </button> --}}


                {{-- <button class="btn ms-2" type="button" id="language-toggle">
                    <i class="fas fa-globe"></i>
                    {{ app()->getLocale() == 'ar' ? 'English' : 'العربية' }}
                </button> --}}
                @php
                use Mcamara\LaravelLocalization\Facades\LaravelLocalization;
                $locales = LaravelLocalization::getSupportedLocales();
                $current = app()->getLocale();
            @endphp
            
            <div class="dropdown" 
                 @if(in_array($current, ['en', 'fr'])) 
                 style="left: 10px !important; background: rgb(164, 34, 73);" 
                 @endif>
                <button class="btn btn-secondary dropdown-toggle" type="button" data-bs-toggle="dropdown" aria-expanded="false">
                    {{ strtoupper($current) }}
                </button>
                <ul class="dropdown-menu">
                    @foreach($locales as $localeCode => $properties)
                        @if($localeCode !== $current)
                            <li>
                                <a class="dropdown-item" rel="alternate" hreflang="{{ $localeCode }}" href="{{ LaravelLocalization::getLocalizedURL($localeCode) }}">
                                    {{ $properties['native'] }}
                                </a>
                            </li>
                        @endif
                    @endforeach
                </ul>
            </div>
            




                {{--
                                @auth
    <a class="btn cart ms-2" href="{{ route('user.profile') }}">
                {{ \App\Helpers\TranslationHelper::translate('Profile') }}
                </a>
                @else
                <a class="btn cart ms-2" href="{{ route('user.login.form') }}">
                    {{ \App\Helpers\TranslationHelper::translate('Login') }}
                </a>
                @endauth --}}

            </form>


        </div>
    </div>
</nav>



@push('js')

<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

<script>
    document.getElementById('language-toggle').addEventListener('click', function() {
        var currentLang = "{{ app()->getLocale() }}"; // احصل على اللغة الحالية من Laravel
        var newLang = currentLang === 'ar' ? 'en' : 'ar'; // التبديل بين العربية والإنجليزية
        var newUrl = "{{ LaravelLocalization::getLocalizedURL('en') }}"; // رابط الإنجليزية
        if (newLang === 'ar') {
            newUrl = "{{ LaravelLocalization::getLocalizedURL('ar') }}"; // رابط العربية
        }
        window.location.href = newUrl; // توجيه المستخدم للغة الجديدة
    });
</script>
@endpush