refactor: standardize LogoSpinner component styling across various components

- Updated LogoSpinner instances to use a consistent emerald color scheme in OnboardingTracker, PostPaymentOnboarding, OrganizationSetupForm, and other components.
- Adjusted global CSS variable for primary foreground color to enhance visual consistency.

Author: claudfuen

apps/app/src/components/ai/chat-empty.tsx

@@ -7,7 +7,7 @@ type Props = {
 export function ChatEmpty({ firstName }: Props) {
   return (
     <div className="todesktop:mt-24 mt-[200px] flex w-full flex-col items-center justify-center text-center md:mt-24">
-      <LogoSpinner raceColor="#00DC73" />
+      <LogoSpinner />
       <span className="mt-6 text-xl font-medium">
         Hi {firstName}, how can I help <br />
         you today?

apps/app/src/components/ai/message.tsx

@@ -71,7 +71,7 @@ export function ReasoningMessagePart({ part, isReasoning }: ReasoningMessagePart
           <div className="ml-4 flex-1 overflow-hidden pl-2 text-xs">
             <div className="font-medium">Reasoning</div>
             <div className="mt-2 animate-spin">
-              <LogoSpinner raceColor="#00DC73" size={16} />
+              <LogoSpinner size={16} />
             </div>
           </div>
         </div>

apps/app/src/components/ui/loader.tsx

@@ -4,7 +4,7 @@ const Loader = () => {
   return (
     <div className="bg-card/80 border-border flex h-full w-full items-center justify-center rounded-sm border py-24 backdrop-blur-sm">
       <div>
-        <LogoSpinner className="text-emerald-700 dark:text-emerald-500" />
+        <LogoSpinner />
       </div>
     </div>
   );

packages/ui/src/globals.css

@@ -47,7 +47,7 @@
     --popover: 228 10% 10%;
     --popover-foreground: 0 0% 98%;
     --primary: 160 84% 40%; /* emerald-500 */
-    --primary-foreground: 240 3% 10%;
+    --primary-foreground: 0 0% 98%;
     --secondary: 225 10% 20%;
     --secondary-foreground: 0 0% 98%;
     --muted: 225 10% 20%;