🫧 fix: Paint Chat Surfaces From Theme Roles

client/src/components/Banners/Banner.tsx

@@ -58,11 +58,11 @@ export const Banner = ({ onHeightChange }: { onHeightChange?: (height: number) =
   return (
     <div
       ref={bannerRef}
-      className="sticky top-0 z-20 flex items-center bg-presentation px-2 py-1 text-text-primary dark:bg-gradient-to-r md:relative"
+      className="bg-presentation text-text-primary sticky top-0 z-20 flex items-center px-2 py-1 md:relative"
     >
       <div
         className={cn(
-          'w-full truncate text-center text-base [&_a]:text-link [&_a]:underline',
+          '[&_a]:text-link w-full truncate text-center text-base [&_a]:underline',
           !banner.persistable && 'px-4',
         )}
         dangerouslySetInnerHTML={{ __html: sanitizedMessage }}
@@ -75,7 +75,7 @@ export const Banner = ({ onHeightChange }: { onHeightChange?: (height: number) =
           className="size-8"
           onClick={onClick}
         >
-          <XIcon className="mx-auto h-4 w-4 text-text-primary" aria-hidden="true" />
+          <XIcon className="text-text-primary mx-auto h-4 w-4" aria-hidden="true" />
         </Button>
       )}
     </div>

client/src/components/Chat/Messages/Content/Parts/CodeWindowHeader.tsx

@@ -25,7 +25,7 @@ export default function CodeWindowHeader({ language, code, diffStats }: CodeWind
   }, [code]);
 
   return (
-    <div className="flex items-center justify-between bg-surface-primary-alt px-1.5 py-1.5 font-sans text-xs text-text-secondary dark:bg-transparent">
+    <div className="text-text-secondary flex items-center justify-between px-1.5 py-1.5 font-sans text-xs">
       <span className="flex items-center gap-1.5 pl-1.5 text-xs font-medium">
         <LangIcon lang={language} className="size-3.5 shrink-0" />
         {language}

client/src/components/Chat/Messages/Content/Parts/SkillCall.tsx

@@ -63,7 +63,7 @@ export default function SkillCall({
           icon={
             <ScrollText
               className={cn(
-                'size-4 shrink-0 text-text-secondary',
+                'text-text-secondary size-4 shrink-0',
                 phase === 'running' && 'animate-pulse',
               )}
               aria-hidden="true"
@@ -79,14 +79,14 @@ export default function SkillCall({
             <div
               className={cn(
                 toolPanelSpacingClassName,
-                'overflow-hidden rounded-lg border border-border-light bg-surface-secondary',
+                'border-border-light bg-surface-secondary overflow-hidden rounded-lg border',
               )}
             >
-              <div className="bg-surface-primary-alt p-4 text-xs dark:bg-transparent">
-                <div className="mb-1.5 text-[10px] font-medium uppercase tracking-wide text-text-secondary">
+              <div className="p-4 text-xs">
+                <div className="text-text-secondary mb-1.5 text-[10px] font-medium tracking-wide uppercase">
                   {localize('com_ui_output')}
                 </div>
-                <div className="max-h-[200px] overflow-auto text-text-primary">
+                <div className="text-text-primary max-h-[200px] overflow-auto">
                   <Stdout output={output} />
                 </div>
               </div>