removing avatars

frontend/src/components/Chat/ThinkingIndicator.tsx

@@ -1,63 +1,48 @@
-import { Box, Stack, Avatar, Typography } from '@mui/material';
-import SmartToyOutlinedIcon from '@mui/icons-material/SmartToyOutlined';
+import { Box, Typography } from '@mui/material';
 
 /** Pulsing dots shown while the agent is processing. */
 export default function ThinkingIndicator() {
   return (
-    <Stack direction="row" spacing={1.5} alignItems="flex-start">
-      <Avatar
+    <Box sx={{ pt: 0.75 }}>
+      <Typography
+        variant="caption"
         sx={{
-          width: 28,
-          height: 28,
-          bgcolor: 'primary.main',
-          flexShrink: 0,
-          mt: 0.5,
+          fontWeight: 700,
+          fontSize: '0.72rem',
+          color: 'var(--muted-text)',
+          textTransform: 'uppercase',
+          letterSpacing: '0.04em',
+          display: 'flex',
+          alignItems: 'center',
+          gap: 0.75,
         }}
       >
-        <SmartToyOutlinedIcon sx={{ fontSize: 16, color: '#fff' }} />
-      </Avatar>
-
-      <Box sx={{ pt: 0.75 }}>
-        <Typography
-          variant="caption"
+        Thinking
+        <Box
+          component="span"
           sx={{
-            fontWeight: 700,
-            fontSize: '0.72rem',
-            color: 'var(--muted-text)',
-            textTransform: 'uppercase',
-            letterSpacing: '0.04em',
-            display: 'flex',
-            alignItems: 'center',
-            gap: 0.75,
+            display: 'inline-flex',
+            gap: '3px',
+            '& span': {
+              width: 4,
+              height: 4,
+              borderRadius: '50%',
+              bgcolor: 'primary.main',
+              animation: 'dotPulse 1.4s ease-in-out infinite',
+            },
+            '& span:nth-of-type(2)': { animationDelay: '0.2s' },
+            '& span:nth-of-type(3)': { animationDelay: '0.4s' },
+            '@keyframes dotPulse': {
+              '0%, 80%, 100%': { opacity: 0.25, transform: 'scale(0.8)' },
+              '40%': { opacity: 1, transform: 'scale(1)' },
+            },
           }}
         >
-          Thinking
-          <Box
-            component="span"
-            sx={{
-              display: 'inline-flex',
-              gap: '3px',
-              '& span': {
-                width: 4,
-                height: 4,
-                borderRadius: '50%',
-                bgcolor: 'primary.main',
-                animation: 'dotPulse 1.4s ease-in-out infinite',
-              },
-              '& span:nth-of-type(2)': { animationDelay: '0.2s' },
-              '& span:nth-of-type(3)': { animationDelay: '0.4s' },
-              '@keyframes dotPulse': {
-                '0%, 80%, 100%': { opacity: 0.25, transform: 'scale(0.8)' },
-                '40%': { opacity: 1, transform: 'scale(1)' },
-              },
-            }}
-          >
-            <span />
-            <span />
-            <span />
-          </Box>
-        </Typography>
-      </Box>
-    </Stack>
+          <span />
+          <span />
+          <span />
+        </Box>
+      </Typography>
+    </Box>
   );
 }