@php
    $content = $header->content_blocks ?? [];
       $buttonData = $content['contact_us_button'] ?? [];
@endphp


<div class="header-top">
    <div class="auto-container">
        <div class="clearfix">
            <div class="top-left">
                <div class="text text-uppercase">
                    <!--   TOP BAR TITLE (Unchanged) -->
                    {{ translate_label($content, 'top_bar_title') }}
                </div>
            </div>

            <!--   SOCIAL MEDIA LINKS (Unchanged) -->
            <div class="top-right pull-right">
                <div class="social-box">
                    @foreach ($content['social_links'] ?? [] as $link)
                        @php
                            $platform = $link['social_media_links'] ?? [];
                        @endphp
                        <x-redirect-link
                            :item-data="$platform"
                            :label="translate_label( $platform, 'button_text')"
                            target="_blank"
                        />
                    @endforeach
                </div>
            </div>
            <!--   END OF TOP BAR SOCIAL MEDIA LINKS -->

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

<div class="header-upper">
    <div class="auto-container">
        <div class="clearfix">

            <!--   LOGO (Unchanged) -->
            <div class="pull-left logo-box">
                <div class="logo">
                    <img src="{{ image_storage($content, 'logo_path') }}"
                         alt="Image Logo" style="max-height: 90px; max-width: 260px;">
                </div>
            </div>
            <!--   END OF LOGO -->

            <!--   SOCIAL MEDIA ICONS, CONTACT US BUTTON, AND LANGUAGE SWITCHER (Unchanged) -->
            <div class="pull-right upper-right clearfix">
                <!--   SOCIAL MEDIA ICONS -->
                @foreach($content['social_media_icons'] ?? [] as $social_media )
                    <x-redirect-link
                        :item-data="$social_media"
                        class="upper-column info-box mr-3"
                        target="_blank"
                    >
                        <div class="icon-box svg-container">
                            {!!  $social_media['social_media'] !!}
                        </div>
                        <ul class="py-1 max-w-150px">
                            <li><strong>{{ translate_label($social_media, 'social_title')}}</strong></li>
                            <li>{{ translate_label($social_media, 'social_subtitle')  }}</li>
                        </ul>
                    </x-redirect-link>
                @endforeach
                <!--   END OF SOCIAL MEDIA ICONS -->


                <!--   CONTACT US BUTTON -->
                <div class="upper-column info-box d-inline px-2">
                    <div class="outer-box p-0">
                        <x-redirect-link
                            :item-data="$buttonData"
                            :label="translate_label( $buttonData, 'button_text')"
                            class="btn-web-catalog"
                        />
                    </div>
                </div>
                <!--   END OF CONTACT US BUTTON -->

                <!--   LANGUAGE SWITCHER -->
                <div class="upper-column info-box d-inline px-2 m-0">
                    <div class="outer-box p-0">
                        <div class="drop-responsive">
                            <div class="dropdown">
                                <button class="btn dropdown-toggle" type="button" id="dropdownMenuButton"
                                        data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                                    <img src=" {{ $globalLang->flag_image }}"
                                         class="img-fluid">{{ __('nationality.' . $globalLang->language) }}
                                </button>
                                <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
                                    @foreach ($globalDivision->languages as $language)
                                        <a class="dropdown-item"
                                           href="{{ url('locale/' . $language->language_code) }} "><img
                                                src="{{ $language->flag_image }}"
                                                class="img-fluid">{{ __('nationality.' . $language->language) }}
                                        </a>
                                    @endforeach
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <!--   END OF LANGUAGE SWITCHER -->

            </div>
            <!--   END OF SOCIAL MEDIA ICONS, CONTACT US BUTTON, AND LANGUAGE SWITCHER -->

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