updated design

resources/themes/backend/assets/css/app.css

@@ -11,7 +11,8 @@
 @custom-variant dark (&:where(.dark, .dark *));
 
 @theme {
-    --font-sans: 'Instrument Sans', ui-sans-serif, system-ui, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
+    --font-sans: 'Instrument Sans', ui-sans-serif, system-ui, sans-serif,
+        'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
 
     --color-zinc-50: #fafafa;
     --color-zinc-100: #f5f5f5;
@@ -25,16 +26,17 @@
     --color-zinc-900: #171717;
     --color-zinc-950: #0a0a0a;
 
-    --color-accent: var(--color-neutral-800);
+    /* Keep Flux controls on the same Helpdesk/Core blue accent. */
-    --color-accent-content: var(--color-neutral-800);
+    --color-accent: #2563eb;
-    --color-accent-foreground: var(--color-white);
+    --color-accent-content: #1d4ed8;
+    --color-accent-foreground: #ffffff;
 }
 
 @layer theme {
     .dark {
-        --color-accent: var(--color-white);
+        --color-accent: #60a5fa;
-        --color-accent-content: var(--color-white);
+        --color-accent-content: #93c5fd;
-        --color-accent-foreground: var(--color-neutral-800);
+        --color-accent-foreground: #172554;
     }
 }
 

resources/themes/backend/views/layouts/app/sidebar.blade.php

@@ -8,7 +8,7 @@
 <flux:sidebar
     sticky
     collapsible="mobile"
-    class="border-e border-zinc-200 bg-zinc-50 dark:border-zinc-700 dark:bg-zinc-900"
+    class="hd-sidebar border-e border-zinc-200 bg-zinc-50 dark:border-zinc-700 dark:bg-zinc-900"
 >
     <flux:sidebar.header>
         <x-app-logo
@@ -31,35 +31,56 @@
                 {{ __('Dashboard') }}
             </flux:sidebar.item>
         </flux:sidebar.group>
+
+        <flux:sidebar.group :heading="__('Helpdesk')" class="grid">
+            <flux:sidebar.item
+                icon="inbox"
+                :href="route('helpdesk.tickets.index')"
+                :current="request()->routeIs('helpdesk.tickets.*')"
+                wire:navigate
+            >
+                {{ __('Tickets') }}
+            </flux:sidebar.item>
+
+            <flux:sidebar.item
+                icon="squares-2x2"
+                :href="route('helpdesk.kanban')"
+                :current="request()->routeIs('helpdesk.kanban')"
+                wire:navigate
+            >
+                {{ __('Kanban') }}
+            </flux:sidebar.item>
+
+            <flux:sidebar.item
+                icon="lifebuoy"
+                :href="route('helpdesk.index')"
+                :current="request()->routeIs('helpdesk.index')"
+                wire:navigate
+            >
+                {{ __('Support') }}
+            </flux:sidebar.item>
+
+            @if (auth()->user()->isHelpdeskAdmin())
+                <flux:sidebar.item
+                    icon="cog"
+                    :href="route('helpdesk.settings')"
+                    :current="request()->routeIs('helpdesk.settings')"
+                    wire:navigate
+                >
+                    {{ __('Settings') }}
+                </flux:sidebar.item>
+            @endif
+        </flux:sidebar.group>
     </flux:sidebar.nav>
 
     <flux:spacer />
 
-    <flux:sidebar.nav>
-        <flux:sidebar.item
-            icon="folder"
-            href="https://github.com/laravel/livewire-starter-kit"
-            target="_blank"
-        >
-            {{ __('Repository') }}
-        </flux:sidebar.item>
-
-        <flux:sidebar.item
-            icon="book-open"
-            href="https://laravel.com/docs/starter-kits#livewire"
-            target="_blank"
-        >
-            {{ __('Documentation') }}
-        </flux:sidebar.item>
-    </flux:sidebar.nav>
-
     <x-desktop-user-menu
         class="hidden lg:block"
         :name="auth()->user()->name"
     />
 </flux:sidebar>
 
-<!-- Mobile User Menu -->
 <flux:header class="lg:hidden">
     <flux:sidebar.toggle
         class="lg:hidden"
@@ -101,11 +122,29 @@
 
             <flux:menu.radio.group>
                 <flux:menu.item
-                    :href="route('profile.edit')"
+                    :href="route('helpdesk.index')"
-                    icon="cog"
+                    icon="lifebuoy"
                     wire:navigate
                 >
-                    {{ __('Settings') }}
+                    {{ __('Support') }}
+                </flux:menu.item>
+
+                @if (auth()->user()->isHelpdeskAdmin())
+                    <flux:menu.item
+                        :href="route('helpdesk.settings')"
+                        icon="cog"
+                        wire:navigate
+                    >
+                        {{ __('Helpdesk Settings') }}
+                    </flux:menu.item>
+                @endif
+
+                <flux:menu.item
+                    :href="route('profile.edit')"
+                    icon="user-circle"
+                    wire:navigate
+                >
+                    {{ __('Profile Settings') }}
                 </flux:menu.item>
             </flux:menu.radio.group>