Make background darker so tables are more clearly readable. Try some things with the header bar

resources/js/components/NavMain.vue

@@ -21,7 +21,7 @@ const page = usePage();
         <SidebarMenuItem :key="'dashboard'">
             <SidebarMenuButton as-child :is-active="urlIsActive(dashboard(), page.url)" :tooltip="'Dashboard'">
                 <Link :href="dashboard()">
-                <component :is="LayoutGrid" class="text-gray-400" />
+                <component :is="LayoutGrid" class="text-gray-500" stroke-width="1.5" />
                 <span>Dashboard</span>
                 </Link>
             </SidebarMenuButton>
@@ -37,7 +37,7 @@ const page = usePage();
             <SidebarMenuItem v-for="item in group.items" :key="item.title">
                 <SidebarMenuButton as-child :is-active="urlIsActive(item.href, page.url)" :tooltip="item.title">
                     <Link :href="item.href">
-                    <component :is="item.icon" :class="item.color" />
+                    <component :is="item.icon" :class="item.color" stroke-width="1.5" />
                     <span>{{ item.title }}</span>
                     </Link>
                 </SidebarMenuButton>