refactor: update UI components to shadcn-style

- Refactored select component to align with shadcn design principles.
- Updated server status indicator component for consistency with shadcn style.
- Modified spinner component to follow shadcn design guidelines.
- Enhanced stat card component with shadcn-inspired styles.
- Adjusted tab panel component to reflect shadcn design updates.
- Revamped table row and table data cell components to match shadcn aesthetics.
- Updated table header cell component for improved styling consistency.
- Refined table component to align with shadcn design principles.
- Enhanced tabs component with shadcn-inspired styles.
- Updated toggle component to follow shadcn design guidelines.
- Refactored tooltip component to align with shadcn design principles.
- Updated server card component to reflect shadcn-inspired design.

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

@@ -1,5 +1,5 @@
 {{--
-    Tooltip Component - TailServer Theme
+    Tooltip Component - shadcn-style
     
     Usage:
     <x-proxmox::ui.tooltip text="This is a tooltip">
@@ -19,13 +19,6 @@
         'left' => 'right-full top-1/2 -translate-y-1/2 mr-2',
         'right' => 'left-full top-1/2 -translate-y-1/2 ml-2',
     ];
-    
-    $arrows = [
-        'top' => 'top-full left-1/2 -translate-x-1/2 border-t-zinc-800 border-x-transparent border-b-transparent border-4',
-        'bottom' => 'bottom-full left-1/2 -translate-x-1/2 border-b-zinc-800 border-x-transparent border-t-transparent border-4',
-        'left' => 'left-full top-1/2 -translate-y-1/2 border-l-zinc-800 border-y-transparent border-r-transparent border-4',
-        'right' => 'right-full top-1/2 -translate-y-1/2 border-r-zinc-800 border-y-transparent border-l-transparent border-4',
-    ];
 @endphp
 
 <div 
@@ -40,17 +33,16 @@
     <div
         x-show="show"
         x-cloak
-        x-transition:enter="transition ease-out duration-150"
-        x-transition:enter-start="opacity-0 scale-90"
-        x-transition:enter-end="opacity-100 scale-100"
-        x-transition:leave="transition ease-in duration-100"
-        x-transition:leave-start="opacity-100 scale-100"
-        x-transition:leave-end="opacity-0 scale-90"
+        x-transition:enter="transition ease-out duration-100"
+        x-transition:enter-start="opacity-0"
+        x-transition:enter-end="opacity-100"
+        x-transition:leave="transition ease-in duration-75"
+        x-transition:leave-start="opacity-100"
+        x-transition:leave-end="opacity-0"
         class="absolute z-50 {{ $positions[$position] ?? $positions['top'] }} pointer-events-none"
     >
-        <div class="relative bg-zinc-900 text-white text-xs font-medium rounded-lg px-2.5 py-1.5 whitespace-nowrap shadow-xl ring-1 ring-white/10">
+        <div class="overflow-hidden rounded-md bg-primary px-3 py-1.5 text-xs text-primary-foreground">
             {{ $text }}
-            <div class="absolute {{ $arrows[$position] ?? $arrows['top'] }}"></div>
         </div>
     </div>
 </div>