update badges, cosmetic things and UI change

src/components/badges/SecurityBadge.tsx

@@ -0,0 +1,20 @@
+import React from 'react';
+import { AlertTriangle } from 'lucide-react';
+
+interface SecurityBadgeProps {
+  onClick: () => void;
+}
+
+const SecurityBadge: React.FC<SecurityBadgeProps> = ({ onClick }) => {
+  return (
+    <button
+      className="flex items-center gap-2 text-amber-500/80 hover:text-amber-500 transition-colors"
+      onClick={onClick}
+    >
+      <AlertTriangle className="w-4 h-4" />
+      <span className="text-xs font-medium">Security Info</span>
+    </button>
+  );
+};
+
+export default SecurityBadge;