refactor: Update UI components to TailAdmin theme

- Changed badge, button, card, dropdown, input, modal, select, table, tabs, toggle, and tooltip components to align with the TailAdmin design system.
- Updated class names and styles for consistency across components.
- Enhanced accessibility and responsiveness in various components.
- Improved hover and focus states for better user experience.

extensions/Servers/Proxmox/views/components/ui/toggle.blade.php

@@ -1,5 +1,5 @@
 {{--
-    Toggle/Switch Component - shadcn-style
+    Toggle/Switch Component - TailAdmin style
     
     Usage:
     <x-proxmox::ui.toggle wire:model="enabled" label="Enable Feature" />
@@ -11,14 +11,14 @@
     'disabled' => false,
 ])
 
-<label {{ $attributes->only('class')->class(['flex items-center justify-between gap-4 cursor-pointer']) }}>
+<label {{ $attributes->only('class')->class(['flex cursor-pointer items-center justify-between gap-4']) }}>
     @if($label || $description)
         <div class="space-y-0.5">
             @if($label)
-                <span class="text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70">{{ $label }}</span>
+                <span class="text-theme-sm font-medium text-gray-700 dark:text-gray-300">{{ $label }}</span>
             @endif
             @if($description)
-                <p class="text-[0.8rem] text-muted-foreground">{{ $description }}</p>
+                <p class="text-theme-xs text-gray-500 dark:text-gray-400">{{ $description }}</p>
             @endif
         </div>
     @endif
@@ -27,17 +27,18 @@
         <input
             type="checkbox"
             {{ $attributes->whereDoesntStartWith('class')->merge(['disabled' => $disabled]) }}
-            class="sr-only peer"
+            class="peer sr-only"
         />
         <div @class([
-            'inline-flex h-5 w-9 shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors duration-150',
-            'bg-input peer-checked:bg-primary',
-            'peer-focus-visible:outline-none peer-focus-visible:ring-2 peer-focus-visible:ring-ring peer-focus-visible:ring-offset-2 peer-focus-visible:ring-offset-background',
+            'block h-6 w-11 rounded-full border-2 border-transparent transition-colors duration-200',
+            'bg-gray-200 peer-checked:bg-brand-500',
+            'peer-focus-visible:outline-none peer-focus-visible:ring-3 peer-focus-visible:ring-brand-500/20',
             'peer-disabled:cursor-not-allowed peer-disabled:opacity-50',
+            'dark:bg-gray-700 dark:peer-checked:bg-brand-500',
         ])></div>
         <div @class([
-            'pointer-events-none absolute top-0.5 left-0.5 block size-4 rounded-full bg-background shadow-lg ring-0 transition-transform duration-150',
-            'peer-checked:translate-x-4',
+            'pointer-events-none absolute left-0.5 top-0.5 size-5 rounded-full bg-white shadow-theme-sm ring-0 transition-transform duration-200',
+            'peer-checked:translate-x-5',
         ])></div>
     </div>
 </label>