feat(ui): Semantic tokens refactor (#8087)

packages/cli/src/ui/auth/AuthDialog.tsx

@@ -7,7 +7,7 @@
 import type React from 'react';
 import { useCallback } from 'react';
 import { Box, Text } from 'ink';
-import { Colors } from '../colors.js';
+import { theme } from '../semantic-colors.js';
 import { RadioButtonSelect } from '../components/shared/RadioButtonSelect.js';
 import type { LoadedSettings } from '../../config/settings.js';
 import { SettingScope } from '../../config/settings.js';
@@ -149,14 +149,16 @@ Logging in with Google... Please restart Gemini CLI to continue.
   return (
     <Box
       borderStyle="round"
-      borderColor={Colors.Gray}
+      borderColor={theme.border.default}
       flexDirection="column"
       padding={1}
       width="100%"
     >
       <Text bold>Get started</Text>
       <Box marginTop={1}>
-        <Text>How would you like to authenticate for this project?</Text>
+        <Text color={theme.text.primary}>
+          How would you like to authenticate for this project?
+        </Text>
       </Box>
       <Box marginTop={1}>
         <RadioButtonSelect
@@ -167,17 +169,19 @@ Logging in with Google... Please restart Gemini CLI to continue.
       </Box>
       {authError && (
         <Box marginTop={1}>
-          <Text color={Colors.AccentRed}>{authError}</Text>
+          <Text color={theme.status.error}>{authError}</Text>
         </Box>
       )}
       <Box marginTop={1}>
-        <Text color={Colors.Gray}>(Use Enter to select)</Text>
+        <Text color={theme.text.secondary}>(Use Enter to select)</Text>
       </Box>
       <Box marginTop={1}>
-        <Text>Terms of Services and Privacy Notice for Gemini CLI</Text>
+        <Text color={theme.text.primary}>
+          Terms of Services and Privacy Notice for Gemini CLI
+        </Text>
       </Box>
       <Box marginTop={1}>
-        <Text color={Colors.AccentBlue}>
+        <Text color={theme.text.link}>
           {
             'https://github.com/google-gemini/gemini-cli/blob/main/docs/tos-privacy.md'
           }

packages/cli/src/ui/auth/AuthInProgress.tsx

@@ -8,7 +8,7 @@ import type React from 'react';
 import { useState, useEffect } from 'react';
 import { Box, Text } from 'ink';
 import Spinner from 'ink-spinner';
-import { Colors } from '../colors.js';
+import { theme } from '../semantic-colors.js';
 import { useKeypress } from '../hooks/useKeypress.js';
 
 interface AuthInProgressProps {
@@ -41,13 +41,13 @@ export function AuthInProgress({
   return (
     <Box
       borderStyle="round"
-      borderColor={Colors.Gray}
+      borderColor={theme.border.default}
       flexDirection="column"
       padding={1}
       width="100%"
     >
       {timedOut ? (
-        <Text color={Colors.AccentRed}>
+        <Text color={theme.status.error}>
           Authentication timed out. Please try again.
         </Text>
       ) : (