feat: update color handling for dark mode compatibility

- Updated various components to utilize `getAdaptiveLabelColor` for dynamic label color adjustments based on the current theme.
- Enhanced dark mode styles in `globals.css` for better visual consistency across components.

Made-with: Cursor

frontend/lib/registry/components/v2-text-display/TextDisplayComponent.tsx

@@ -4,6 +4,7 @@ import React from "react";
 import { ComponentRendererProps } from "../../types";
 import { TextDisplayConfig } from "./types";
 import { filterDOMProps } from "@/lib/utils/domPropsFilter";
+import { getAdaptiveLabelColor } from "@/lib/utils/darkModeColor";
 
 export interface TextDisplayComponentProps extends ComponentRendererProps {
   // 추가 props가 필요한 경우 여기에 정의
@@ -63,7 +64,7 @@ export const TextDisplayComponent: React.FC<TextDisplayComponentProps> = ({
   const textStyle: React.CSSProperties = {
     fontSize: customStyle.fontSize || componentConfig.fontSize || "14px",
     fontWeight: customStyle.fontWeight || componentConfig.fontWeight || "normal",
-    color: customStyle.color || componentConfig.color || "hsl(var(--foreground))",
+    color: getAdaptiveLabelColor(customStyle.color || componentConfig.color),
     textAlign: (customStyle.textAlign || componentConfig.textAlign || "left") as React.CSSProperties["textAlign"],
     backgroundColor: customStyle.backgroundColor || componentConfig.backgroundColor || "transparent",
     padding: componentConfig.padding || "0",