feat: Improve web search component styling and icon size

This commit enhances the visual appearance of the web search component by:

- Replacing the shimmer effect with an animated gradient border for a more modern look.
- Increasing the size of the Globe icon for better visibility.
- Removing the `shimmer-text` class and adjusting text styling.
- Adding `!important` to the rounded corners to ensure they are applied correctly.

Author: n4ze3m

src/components/Common/Playground/WebSearch.tsx

@@ -2,14 +2,14 @@ import { Globe } from "lucide-react"
 import { useTranslation } from "react-i18next"
 
 export const WebSearch = () => {
-  const { t } = useTranslation("common")
+  const {t} = useTranslation('common')
   return (
-    <div className="shimmer-container mt-4 flex w-56 items-center gap-4 rounded-lg bg-neutral-100 p-1 text-slate-900 dark:bg-neutral-800 dark:text-slate-50">
+    <div className="animated-gradient-border mt-4 flex w-56 items-center gap-4 !rounded-lg bg-neutral-100 p-1 text-slate-900 dark:bg-neutral-800 dark:text-slate-50">
       <div className="rounded p-1">
-        <Globe className="size-4" />
+        <Globe className="w-6 h-6" />
       </div>
-      <div className="shimmer-text text-sm font-semibold text-gray-500 dark:text-gray-500 line-clamp-1 text-wrap">
-        {t("webSearch")}
+      <div className="text-sm font-semibold">
+        {t('webSearch')}
       </div>
     </div>
   )