@local <!-- views/components/layout/sidebar/header.blade.php --> @endlocal
<div class="bg-header-dark">
    <div class="content-header bg-white-5">
        <!-- Logo -->
        <a class="fw-semibold text-white tracking-wide" href="/">
            <span class="smini-visible">
              D<span class="opacity-75">x</span>
            </span>
            <span class="smini-hidden">
              T<span class="opacity-75">oo</span>ls
            </span>
        </a>
        <!-- END Logo -->

        <!-- Options -->
        <div>

            <!-- Toggle Sidebar Style -->
            @local
            <!-- Layout API, functionality initialized in Template._uiApiLayout() -->
            <!-- Class Toggle, functionality initialized in Helpers.dmToggleClass() -->
            @endlocal
            <x-generic.button class="btn-sm" fa-class="fa-toggle-off" fa-id="sidebar-style-toggler" data-target="sidebar-style-toggler" data-class="fa-toggle-off fa-toggle-on" on-click="DashApp.layout('sidebar_style_toggle');DashApp.layout('header_style_toggle');"></x-generic.button>
            <!-- END Toggle Sidebar Style -->


            <!-- Dark Mode -->
            @local <!-- Layout API, functionality initialized in Template._uiApiLayout() --> @endlocal
            <x-generic.button class="btn-sm" fa-class="fa-moon" fa-id="dark-mode-toggler" data-target="dark-mode-toggler" data-class="far fa" on-click="DashApp.layout('dark_mode_toggle');"></x-generic.button>
            <!-- END Dark Mode -->

            <!-- Close Sidebar, Visible only on mobile screens -->
            @local <!-- Layout API, functionality initialized in Template._uiApiLayout() --> @endlocal
            <x-generic.button class="btn-sm d-lg-none" fa-class="fa-times-circle" data-toggle="layout" data-action="sidebar_close"></x-generic.button>
            <!-- END Close Sidebar -->
        </div>
        <!-- END Options -->
    </div>
</div>