Refactor Proxmox server views for improved UI consistency and usability

- Updated server card component to use new UI elements and improved layout.
- Enhanced status display with badges and better status indicators.
- Refined quick info row for server details with consistent styling.
- Reorganized server configuration statistics into stat cards for clarity.
- Improved help modals for statistics and storage management sections.
- Streamlined alerts and warnings for better user experience.
- Updated storage management view to utilize new UI components and improve readability.

extensions/Servers/Proxmox/views/components/ui/confirm-dialog.blade.php

@@ -0,0 +1,116 @@
+{{--
+    Confirm Dialog Component - TailServer Theme
+    For dangerous actions like delete, stop, etc.
+    
+    Usage:
+    <x-proxmox::ui.confirm-dialog
+        title="Stop Server?"
+        message="This will immediately stop the server."
+        confirm-label="Stop"
+        cancel-label="Cancel"
+        variant="danger"
+        wire:click="stopServer"
+    />
+--}}
+
+@props([
+    'title' => 'Confirm Action',
+    'message' => 'Are you sure you want to proceed?',
+    'confirmLabel' => 'Confirm',
+    'cancelLabel' => 'Cancel',
+    'variant' => 'danger', // danger, warning, primary
+    'open' => false,
+])
+
+@php
+    $variants = [
+        'danger' => [
+            'icon' => 'ri-error-warning-line',
+            'iconBg' => 'bg-danger/10',
+            'iconColor' => 'text-danger',
+            'buttonBg' => 'bg-danger hover:bg-danger/90',
+        ],
+        'warning' => [
+            'icon' => 'ri-alert-line',
+            'iconBg' => 'bg-warning/10',
+            'iconColor' => 'text-warning',
+            'buttonBg' => 'bg-warning hover:bg-warning/90',
+        ],
+        'primary' => [
+            'icon' => 'ri-question-line',
+            'iconBg' => 'bg-primary/10',
+            'iconColor' => 'text-primary',
+            'buttonBg' => 'bg-primary hover:bg-primary/90',
+        ],
+    ];
+    
+    $config = $variants[$variant] ?? $variants['danger'];
+@endphp
+
+<div
+    x-data="{ open: @js($open) }"
+    x-show="open"
+    x-cloak
+    @keydown.escape.window="open = false"
+    class="fixed inset-0 z-50 overflow-y-auto"
+    {{ $attributes->whereDoesntStartWith('wire:click') }}
+>
+    <div class="flex items-center justify-center min-h-screen p-4">
+        <!-- Backdrop -->
+        <div 
+            x-show="open"
+            x-transition:enter="ease-out duration-300"
+            x-transition:enter-start="opacity-0"
+            x-transition:enter-end="opacity-100"
+            x-transition:leave="ease-in duration-200"
+            x-transition:leave-start="opacity-100"
+            x-transition:leave-end="opacity-0"
+            @click="open = false"
+            class="fixed inset-0 bg-black/60 backdrop-blur-md"
+        ></div>
+
+        <!-- Dialog -->
+        <div
+            x-show="open"
+            x-transition:enter="ease-out duration-300"
+            x-transition:enter-start="opacity-0 scale-95 translate-y-4"
+            x-transition:enter-end="opacity-100 scale-100 translate-y-0"
+            x-transition:leave="ease-in duration-200"
+            x-transition:leave-start="opacity-100 scale-100 translate-y-0"
+            x-transition:leave-end="opacity-0 scale-95 translate-y-4"
+            class="relative bg-background rounded-2xl shadow-2xl ring-1 ring-neutral/10 w-full max-w-md p-6"
+        >
+            <div class="flex flex-col items-center text-center">
+                <!-- Icon -->
+                <div class="p-4 rounded-2xl {{ $config['iconBg'] }} mb-4 shadow-lg">
+                    <x-dynamic-component :component="$config['icon']" class="size-8 {{ $config['iconColor'] }}" />
+                </div>
+                
+                <!-- Title -->
+                <h3 class="text-lg font-semibold text-base mb-2">{{ $title }}</h3>
+                
+                <!-- Message -->
+                <p class="text-sm text-base/60 mb-6">{{ $message }}</p>
+                
+                <!-- Actions -->
+                <div class="flex gap-3 w-full">
+                    <button
+                        type="button"
+                        @click="open = false"
+                        class="flex-1 px-4 py-2.5 bg-neutral/5 hover:bg-neutral/15 rounded-xl text-sm font-medium text-base transition-all duration-200 hover:shadow-sm active:scale-95"
+                    >
+                        {{ $cancelLabel }}
+                    </button>
+                    <button
+                        type="button"
+                        @click="open = false"
+                        {{ $attributes->whereStartsWith('wire:click') }}
+                        class="flex-1 px-4 py-2.5 {{ $config['buttonBg'] }} rounded-xl text-sm font-medium text-white transition-all duration-200 shadow-md hover:shadow-lg active:scale-95"
+                    >
+                        {{ $confirmLabel }}
+                    </button>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>