feat: implement UI redesign with updated button styles and new components

Signed-off-by: Noooste <83548733+Noooste@users.noreply.github.com>

frontend/src/components/ui/empty-state.tsx

@@ -0,0 +1,32 @@
+import * as React from 'react';
+import { IconTile } from './icon-tile';
+import { cn } from '@/lib/utils';
+
+interface EmptyStateProps extends React.HTMLAttributes<HTMLDivElement> {
+  icon: React.ReactNode;
+  title: string;
+  description?: string;
+  action?: React.ReactNode;
+  tone?: 'primary' | 'neutral' | 'destructive';
+}
+
+export function EmptyState({ icon, title, description, action, tone = 'primary', className, ...props }: EmptyStateProps) {
+  return (
+    <div
+      className={cn(
+        'flex flex-col items-center justify-center gap-3 rounded-xl border border-[var(--border)] bg-[var(--card)] px-6 py-12 text-center',
+        className,
+      )}
+      {...props}
+    >
+      <IconTile icon={icon} tone={tone} size="lg" />
+      <div className="space-y-1">
+        <h3 className="text-[17px] font-semibold tracking-tight">{title}</h3>
+        {description && (
+          <p className="max-w-sm text-[13.5px] text-[var(--muted-foreground)]">{description}</p>
+        )}
+      </div>
+      {action && <div className="pt-1">{action}</div>}
+    </div>
+  );
+}