Refactor color variables and styles across components for a cohesive design update

- Updated active state colors in ToastSelect component for better visibility.
- Adjusted box-shadow and border colors in ModelMappingDiagram styles.
- Changed provider colors in ModelMappingDiagram for improved aesthetics.
- Modified background and border styles in ProviderNav for a more modern look.
- Updated accent colors in StatCards to align with new color scheme.
- Refined token colors in TokenBreakdownChart for consistency.
- Adjusted sparkline colors in useSparklines hook to match new design.
- Changed error icon color in AiProvidersOpenAIEditPage for better contrast.
- Updated failure badge styles in AiProvidersPage for a cleaner appearance.
- Refined various status styles in AuthFilesPage for improved clarity.
- Updated colors in ConfigPage to use new variable definitions.
- Refined error and warning styles in LoginPage for better user feedback.
- Adjusted log status colors in LogsPage for consistency with new theme.
- Updated OAuthPage styles to reflect new color variables.
- Refined quota styles in QuotaPage for better visual hierarchy.
- Updated system page styles for improved user experience.
- Adjusted usage page styles to align with new design language.
- Refactored component styles to use new color variables in components.scss.
- Updated layout styles to reflect new primary color definitions.
- Refined theme colors in themes.scss for a more cohesive look.
- Updated color variables in variables.scss to reflect new design choices.
- Adjusted chart colors in usage.ts for consistency with new color scheme.

src/pages/AuthFilesPage.module.scss

@@ -56,7 +56,7 @@
 
 .errorBox {
   padding: $spacing-md;
-  background-color: rgba(239, 68, 68, 0.1);
+  background-color: rgba($error-color, 0.1);
   border: 1px solid var(--danger-color);
   border-radius: $radius-md;
   color: var(--danger-color);
@@ -382,11 +382,11 @@
 }
 
 .quotaBarFillMedium {
-  background-color: var(--warning-color, #f59e0b);
+  background-color: var(--warning-color);
 }
 
 .quotaBarFillLow {
-  background-color: var(--danger-color, #ef4444);
+  background-color: var(--danger-color);
 }
 
 .quotaMeta {
@@ -443,7 +443,7 @@
 .quotaError {
   font-size: 12px;
   color: var(--danger-color);
-  background-color: rgba(239, 68, 68, 0.08);
+  background-color: rgba($error-color, 0.08);
   border: 1px solid var(--danger-color);
   border-radius: $radius-sm;
   padding: $spacing-xs $spacing-sm;
@@ -451,9 +451,9 @@
 
 .quotaWarning {
   font-size: 12px;
-  color: var(--warning-color, #f59e0b);
-  background-color: rgba(245, 158, 11, 0.12);
-  border: 1px solid var(--warning-color, #f59e0b);
+  color: var(--warning-text);
+  background-color: var(--warning-bg);
+  border: 1px solid var(--warning-border);
   border-radius: $radius-sm;
   padding: $spacing-xs $spacing-sm;
 }
@@ -586,9 +586,9 @@
 }
 
 .statFailure {
-  background-color: var(--failure-badge-bg, #fee2e2);
-  color: var(--failure-badge-text, #991b1b);
-  border-color: var(--failure-badge-border, #fca5a5);
+  background-color: var(--failure-badge-bg);
+  color: var(--failure-badge-text);
+  border-color: var(--failure-badge-border);
 }
 
 // 状态监测栏
@@ -627,11 +627,11 @@
 }
 
 .statusBlockFailure {
-  background-color: var(--danger-color, #ef4444);
+  background-color: var(--danger-color);
 }
 
 .statusBlockMixed {
-  background-color: var(--warning-color, #f59e0b);
+  background-color: var(--warning-color);
 }
 
 .statusBlockIdle {
@@ -661,8 +661,8 @@
 }
 
 .statusRateLow {
-  color: var(--failure-badge-text, #991b1b);
-  background: var(--failure-badge-bg, #fee2e2);
+  color: var(--failure-badge-text);
+  background: var(--failure-badge-bg);
 }
 
 .prefixProxyEditor {
@@ -687,7 +687,7 @@
   padding: $spacing-sm $spacing-md;
   border-radius: $radius-md;
   border: 1px solid var(--danger-color);
-  background-color: rgba(239, 68, 68, 0.1);
+  background-color: rgba($error-color, 0.1);
   color: var(--danger-color);
   font-size: 12px;
 }
@@ -1097,7 +1097,7 @@
 .modelExcludedBadge {
   font-size: 10px;
   color: var(--danger-color);
-  background-color: rgba(239, 68, 68, 0.1);
+  background-color: rgba($error-color, 0.1);
   padding: 2px 6px;
   border-radius: 8px;
   border: 1px solid var(--danger-color);