feat: initialize Laravel project with React 19 starter kit (#2001)

* feat: initialize Laravel project with React 19 starter kit

- Add Laravel backend with Inertia.js integration
- Set up React 19 with TypeScript frontend
- Configure shadcn/ui component library
- Add Vite build tooling and development setup
- Include authentication scaffolding with Inertia
- Set up responsive layouts and UI components

* Potential fix for code scanning alert no. 595: Workflow does not contain permissions

Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>

resources/js/components/appearance-dropdown.tsx

@@ -0,0 +1,53 @@
+import { Button } from '@/components/ui/button';
+import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from '@/components/ui/dropdown-menu';
+import { useAppearance } from '@/hooks/use-appearance';
+import { Monitor, Moon, Sun } from 'lucide-react';
+import { HTMLAttributes } from 'react';
+
+export default function AppearanceToggleDropdown({ className = '', ...props }: HTMLAttributes<HTMLDivElement>) {
+    const { appearance, updateAppearance } = useAppearance();
+
+    const getCurrentIcon = () => {
+        switch (appearance) {
+            case 'dark':
+                return <Moon className="h-5 w-5" />;
+            case 'light':
+                return <Sun className="h-5 w-5" />;
+            default:
+                return <Monitor className="h-5 w-5" />;
+        }
+    };
+
+    return (
+        <div className={className} {...props}>
+            <DropdownMenu>
+                <DropdownMenuTrigger asChild>
+                    <Button variant="ghost" size="icon" className="h-9 w-9 rounded-md">
+                        {getCurrentIcon()}
+                        <span className="sr-only">Toggle theme</span>
+                    </Button>
+                </DropdownMenuTrigger>
+                <DropdownMenuContent align="end">
+                    <DropdownMenuItem onClick={() => updateAppearance('light')}>
+                        <span className="flex items-center gap-2">
+                            <Sun className="h-5 w-5" />
+                            Light
+                        </span>
+                    </DropdownMenuItem>
+                    <DropdownMenuItem onClick={() => updateAppearance('dark')}>
+                        <span className="flex items-center gap-2">
+                            <Moon className="h-5 w-5" />
+                            Dark
+                        </span>
+                    </DropdownMenuItem>
+                    <DropdownMenuItem onClick={() => updateAppearance('system')}>
+                        <span className="flex items-center gap-2">
+                            <Monitor className="h-5 w-5" />
+                            System
+                        </span>
+                    </DropdownMenuItem>
+                </DropdownMenuContent>
+            </DropdownMenu>
+        </div>
+    );
+}