feat: 테이블 테두리 및 라운드 제거, 검색 필터 제목 제거

- 모든 테이블 컴포넌트의 외곽 테두리(border) 제거
- 테이블 컨테이너의 라운드(rounded-lg) 제거
- 테이블 행 구분선(border-b)은 유지하여 데이터 구분
- FlowWidget과 TableListComponent에 동일한 스타일 적용
- 검색 필터 영역의 회색 배경(bg-muted/30) 제거
- 검색 필터 제목 제거
- AdvancedSearchFilters 컴포넌트의 '검색 필터' 제목 제거

frontend/lib/registry/components/card-display/CardDisplayComponent.tsx

@@ -187,8 +187,8 @@ export const CardDisplayComponent: React.FC<CardDisplayComponentProps> = ({
   };
 
   if (isDesignMode) {
-    componentStyle.border = "1px dashed #cbd5e1";
-    componentStyle.borderColor = isSelected ? "#3b82f6" : "#cbd5e1";
+    componentStyle.border = "1px dashed hsl(var(--border))";
+    componentStyle.borderColor = isSelected ? "hsl(var(--ring))" : "hsl(var(--border))";
   }
 
   // 표시할 데이터 결정 (로드된 테이블 데이터 우선 사용)
@@ -239,7 +239,7 @@ export const CardDisplayComponent: React.FC<CardDisplayComponentProps> = ({
           padding: "20px",
         }}
       >
-        <div className="text-gray-500">테이블 데이터를 로드하는 중...</div>
+        <div className="text-muted-foreground">테이블 데이터를 로드하는 중...</div>
       </div>
     );
   }
@@ -394,7 +394,7 @@ export const CardDisplayComponent: React.FC<CardDisplayComponentProps> = ({
                 gridColumn: "1 / -1",
                 textAlign: "center",
                 padding: "40px 20px",
-                color: "#6b7280",
+                color: "hsl(var(--muted-foreground))",
                 fontSize: "14px",
               }}
             >
@@ -428,8 +428,8 @@ export const CardDisplayComponent: React.FC<CardDisplayComponentProps> = ({
                   {/* 카드 이미지 - 통일된 디자인 */}
                   {componentConfig.cardStyle?.showImage && componentConfig.columnMapping?.imageColumn && (
                     <div className="mb-4 flex justify-center">
-                      <div className="flex h-20 w-20 items-center justify-center rounded-full bg-gradient-to-br from-blue-100 to-indigo-100 shadow-sm border-2 border-white">
-                        <span className="text-2xl text-blue-600">👤</span>
+                      <div className="flex h-20 w-20 items-center justify-center rounded-full bg-gradient-to-br from-primary/10 to-primary/20 shadow-sm border-2 border-background">
+                        <span className="text-2xl text-primary">👤</span>
                       </div>
                     </div>
                   )}
@@ -437,21 +437,21 @@ export const CardDisplayComponent: React.FC<CardDisplayComponentProps> = ({
                   {/* 카드 타이틀 - 통일된 디자인 */}
                   {componentConfig.cardStyle?.showTitle && (
                     <div className="mb-3">
-                      <h3 className="text-xl font-bold text-gray-900 leading-tight">{titleValue}</h3>
+                      <h3 className="text-xl font-bold text-foreground leading-tight">{titleValue}</h3>
                     </div>
                   )}
 
                   {/* 카드 서브타이틀 - 통일된 디자인 */}
                   {componentConfig.cardStyle?.showSubtitle && (
                     <div className="mb-3">
-                      <p className="text-sm font-semibold text-blue-600 bg-blue-50 px-3 py-1 rounded-full inline-block">{subtitleValue}</p>
+                      <p className="text-sm font-semibold text-primary bg-primary/10 px-3 py-1 rounded-full inline-block">{subtitleValue}</p>
                     </div>
                   )}
 
                   {/* 카드 설명 - 통일된 디자인 */}
                   {componentConfig.cardStyle?.showDescription && (
                     <div className="mb-4 flex-1">
-                      <p className="text-sm leading-relaxed text-gray-700 bg-gray-50 p-3 rounded-lg">
+                      <p className="text-sm leading-relaxed text-foreground bg-muted p-3 rounded-lg">
                         {truncateText(descriptionValue, componentConfig.cardStyle?.maxDescriptionLength || 100)}
                       </p>
                     </div>
@@ -460,15 +460,15 @@ export const CardDisplayComponent: React.FC<CardDisplayComponentProps> = ({
                   {/* 추가 표시 컬럼들 - 통일된 디자인 */}
                   {componentConfig.columnMapping?.displayColumns &&
                     componentConfig.columnMapping.displayColumns.length > 0 && (
-                      <div className="space-y-2 border-t border-gray-200 pt-4">
+                      <div className="space-y-2 border-t border-border pt-4">
                         {componentConfig.columnMapping.displayColumns.map((columnName, idx) => {
                           const value = getColumnValue(data, columnName);
                           if (!value) return null;
 
                           return (
-                            <div key={idx} className="flex justify-between items-center text-sm bg-white/50 px-3 py-2 rounded-lg border border-gray-100">
-                              <span className="text-gray-600 font-medium capitalize">{getColumnLabel(columnName)}:</span>
-                              <span className="font-semibold text-gray-900 bg-gray-100 px-2 py-1 rounded-md text-xs">{value}</span>
+                            <div key={idx} className="flex justify-between items-center text-sm bg-background/50 px-3 py-2 rounded-lg border border-border">
+                              <span className="text-muted-foreground font-medium capitalize">{getColumnLabel(columnName)}:</span>
+                              <span className="font-semibold text-foreground bg-muted px-2 py-1 rounded-md text-xs">{value}</span>
                             </div>
                           );
                         })}
@@ -487,7 +487,7 @@ export const CardDisplayComponent: React.FC<CardDisplayComponentProps> = ({
                       상세보기
                     </button>
                     <button 
-                      className="text-xs font-medium text-gray-500 hover:text-gray-700 transition-colors"
+                      className="text-xs font-medium text-muted-foreground hover:text-foreground transition-colors"
                       onClick={(e) => {
                         e.stopPropagation();
                         handleCardEdit(data);
@@ -519,11 +519,11 @@ export const CardDisplayComponent: React.FC<CardDisplayComponentProps> = ({
                 {Object.entries(selectedData)
                   .filter(([key, value]) => value !== null && value !== undefined && value !== '')
                   .map(([key, value]) => (
-                    <div key={key} className="bg-gray-50 rounded-lg p-3">
-                      <div className="text-xs font-medium text-gray-500 uppercase tracking-wide mb-1">
+                    <div key={key} className="bg-muted rounded-lg p-3">
+                      <div className="text-xs font-medium text-muted-foreground uppercase tracking-wide mb-1">
                         {key.replace(/_/g, ' ')}
                       </div>
-                      <div className="text-sm font-medium text-gray-900 break-words">
+                      <div className="text-sm font-medium text-foreground break-words">
                         {String(value)}
                       </div>
                     </div>
@@ -534,7 +534,7 @@ export const CardDisplayComponent: React.FC<CardDisplayComponentProps> = ({
               <div className="flex justify-end pt-4 border-t">
                 <button
                   onClick={() => setViewModalOpen(false)}
-                  className="px-4 py-2 text-sm font-medium text-gray-700 bg-gray-100 hover:bg-gray-200 rounded-md transition-colors"
+                  className="px-4 py-2 text-sm font-medium text-foreground bg-muted hover:bg-muted/80 rounded-md transition-colors"
                 >
                   닫기
                 </button>
@@ -561,7 +561,7 @@ export const CardDisplayComponent: React.FC<CardDisplayComponentProps> = ({
                   .filter(([key, value]) => value !== null && value !== undefined)
                   .map(([key, value]) => (
                     <div key={key} className="space-y-2">
-                      <label className="text-sm font-medium text-gray-700 block">
+                      <label className="text-sm font-medium text-foreground block">
                         {key.replace(/_/g, ' ').toUpperCase()}
                       </label>
                       <Input
@@ -588,7 +588,7 @@ export const CardDisplayComponent: React.FC<CardDisplayComponentProps> = ({
                 </Button>
                 <Button
                   onClick={handleEditSave}
-                  className="bg-blue-600 hover:bg-blue-700"
+                  className="bg-primary hover:bg-primary/90"
                 >
                   저장
                 </Button>