{{-- Header demo-digital-agency-2 — Usa componentes compartidos --}}
<header id="header" class="header-transparent header-effect-shrink @yield('header_classes')" data-plugin-options="{'stickyEnabled': true, 'stickyEffect': 'shrink', 'stickyEnableOnBoxed': true, 'stickyEnableOnMobile': false, 'stickyChangeLogo': false, 'stickyStartAt': 1, 'stickyHeaderContainerHeight': 100}">
    <div class="header-body border-top-0 bg-color-dark box-shadow-none">
        <div class="header-container container">
            <div class="header-row">
                <div class="header-column header-column-logo">
                    <div class="header-row">
                        <div class="header-logo">
                            <a href="{{ url('/') }}">
                                <img alt="{{ config('site.assets.main_logo_alt', config('site.name')) }}" height="{{ config('site.assets.main_logo_height', 59) }}" src="{{ site_asset_url('main_logo') }}">
                            </a>
                        </div>
                    </div>
                </div>
                <div class="header-column header-column-nav-menu justify-content-end w-100">
                    <div class="header-row">
                        <div class="header-nav header-nav-links header-nav-dropdowns-dark header-nav-light-text order-2 order-lg-1">
                            <div class="header-nav-main header-nav-main-mobile-dark header-nav-main-square header-nav-main-dropdown-no-borders header-nav-main-effect-2 header-nav-main-sub-effect-1">
                                <nav class="collapse">
                                    <ul class="nav nav-pills" id="mainNav">
                                        <x-header-nav :dropdowns="true" classes="dropdown-primary" link-classes="text-capitalize font-weight-semibold custom-text-3" />

                                        @auth
                                        <li class="dropdown dropdown-primary">
                                            <a class="nav-link font-weight-bold text-uppercase dropdown-toggle" href="">
                                                {{ Auth::user()->name }}
                                            </a>
                                            <ul class="dropdown-menu">
                                                <li><a class="dropdown-item" href="{{ url('home') }}">{{ __('My Dashboard') }}</a></li>
                                                <li>
                                                    <a class="dropdown-item" href="{{ route('logout') }}" onclick="event.preventDefault(); document.getElementById('logout-form').submit();">{{ __('Logout') }}</a>
                                                    <form id="logout-form" action="{{ route('logout') }}" method="POST" class="d-none">@csrf</form>
                                                </li>
                                            </ul>
                                        </li>
                                        @endauth
                                    </ul>
                                </nav>
                            </div>
                            <button class="btn header-btn-collapse-nav" data-bs-toggle="collapse" data-bs-target=".header-nav-main nav">
                                <i class="fas fa-bars"></i>
                            </button>
                        </div>
                    </div>
                </div>
                <div class="header-column justify-content-end d-none d-lg-flex">
                    <div class="header-row">
                        <x-social-icons theme="light" size="lg" classes="header-social-icons d-lg-flex m-0 ms-lg-2" />
                    </div>
                </div>
            </div>
        </div>
    </div>
</header>