Feat: Optimize the style of the chat page. (#13429)

### What problem does this PR solve?

Feat: Optimize the style of the chat page.
### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/components/message-input/next.tsx

@@ -14,6 +14,7 @@ import {
 } from '@/components/file-upload';
 import { Button } from '@/components/ui/button';
 import { Textarea } from '@/components/ui/textarea';
+import { cn } from '@/lib/utils';
 import { t } from 'i18next';
 import {
   Atom,
@@ -246,8 +247,10 @@ export function NextMessageInput({
               <Button
                 type="button"
                 size="sm"
-                variant={enableThinking ? 'accent' : 'transparent'}
-                className="border-0 h-7 text-sm"
+                variant={'outline'}
+                className={cn('border-0 h-7 text-sm bg-bg-card', {
+                  'bg-text-primary text-bg-base': enableThinking,
+                })}
                 onClick={handleThinkingToggle}
                 data-testid="chat-detail-thinking-toggle"
               >