✅ UI refactor and some logical fixes

apps/frontend/src/app.css

@@ -216,6 +216,56 @@
 	}
 }
 
+/* Custom Scrollbar Styling */
+@layer base {
+	/* For Webkit browsers (Chrome, Safari, Edge) */
+	::-webkit-scrollbar {
+		width: 12px;
+		height: 12px;
+	}
+
+	::-webkit-scrollbar-track {
+		background: white;
+		border-radius: 10px;
+	}
+
+	::-webkit-scrollbar-thumb {
+		background: hsl(var(--primary));
+		border-radius: 10px;
+		border: 3px solid white;
+	}
+
+	::-webkit-scrollbar-thumb:hover {
+		background: hsl(var(--primary) / 0.8);
+	}
+
+	/* For Firefox */
+	* {
+		scrollbar-width: thin;
+		scrollbar-color: hsl(var(--primary)) white;
+	}
+
+	/* Thin scrollbar for command lists */
+	.command-scrollbar::-webkit-scrollbar {
+		width: 8px;
+	}
+
+	.command-scrollbar::-webkit-scrollbar-track {
+		background: hsl(var(--muted));
+		border-radius: 10px;
+	}
+
+	.command-scrollbar::-webkit-scrollbar-thumb {
+		background: hsl(var(--primary));
+		border-radius: 10px;
+		border: 2px solid hsl(var(--muted));
+	}
+
+	.command-scrollbar::-webkit-scrollbar-thumb:hover {
+		background: hsl(var(--primary) / 0.8);
+	}
+}
+
 .all-reset {
 	all: unset;
 }