(김준회) 돌체 관련, 다크모드 지원하도록 개선

- 가능하면 시멘틱 색상 사용(muted, muted-foreground)
- 어려운 컬러는 dark: 변수로 다크모드 클래스 지정

4 files changed, 34 insertions, 34 deletions

diff --git a/components/ship-vendor-document/add-attachment-dialog.tsx b/components/ship-vendor-document/add-attachment-dialog.tsx
index 8c5e17c8..6765bcf5 100644
--- a/components/ship-vendor-document/add-attachment-dialog.tsx
+++ b/components/ship-vendor-document/add-attachment-dialog.tsx
@@ -135,16 +135,16 @@ function FileUploadArea({
   return (
     <div className="space-y-4">
       <div
-        className="border-2 border-dashed border-gray-300 rounded-lg p-6 text-center cursor-pointer hover:border-gray-400 transition-colors"
+        className="border-2 border-dashed border-border rounded-lg p-6 text-center cursor-pointer hover:border-border transition-colors"
         onDrop={handleDrop}
         onDragOver={handleDragOver}
         onClick={() => fileInputRef.current?.click()}
       >
-        <Paperclip className="mx-auto h-12 w-12 text-gray-400 mb-4" />
-        <p className="text-sm text-gray-600 mb-2">
+        <Paperclip className="mx-auto h-12 w-12 text-muted-foreground mb-4" />
+        <p className="text-sm text-muted-foreground mb-2">
           Drag files to add here or click to select
         </p>
-        <p className="text-xs text-gray-500">
+        <p className="text-xs text-muted-foreground">
           Supports PDF, Word, Excel, Image, Text, ZIP, CAD files (DWG, DXF, STEP, STL, IGES) (max 1GB)
         </p>
         <p className="text-xs text-orange-600 mt-1">
@@ -167,15 +167,15 @@ function FileUploadArea({
             {files.map((file, index) => (
               <div
                 key={index}
-                className="flex items-center justify-between p-2 bg-gray-50 rounded border"
+                className="flex items-center justify-between p-2 bg-muted/50 rounded border"
               >
                 <div className="flex items-center space-x-2 flex-1">
-                  <FileText className="h-4 w-4 text-gray-500" />
+                  <FileText className="h-4 w-4 text-muted-foreground" />
                   <div className="flex-1 min-w-0">
                     <p className="text-sm font-medium truncate" title={file.name}>
                       {file.name}
                     </p>
-                    <p className="text-xs text-gray-500">
+                    <p className="text-xs text-muted-foreground">
                       {formatFileSize(file.size)}
                     </p>
                   </div>
diff --git a/components/ship-vendor-document/edit-revision-dialog.tsx b/components/ship-vendor-document/edit-revision-dialog.tsx
index 313a27bc..2b8735e7 100644
--- a/components/ship-vendor-document/edit-revision-dialog.tsx
+++ b/components/ship-vendor-document/edit-revision-dialog.tsx
@@ -190,12 +190,12 @@ function RevisionInfoDisplay({ revision }: { revision: RevisionInfo }) {
       case 'APPROVED': return 'bg-green-100 text-green-800'
       case 'UPLOADED': return 'bg-blue-100 text-blue-800'
       case 'REJECTED': return 'bg-red-100 text-red-800'
-      default: return 'bg-gray-100 text-gray-800'
+      default: return 'bg-muted text-muted-foreground'
     }
   }
 
   return (
-    <div className="space-y-3 p-4 bg-gray-50 rounded-lg border">
+    <div className="space-y-3 p-4 bg-muted/50 rounded-lg border">
       <div className="flex items-center justify-between">
         <div className="flex items-center gap-3">
           <Badge variant="outline" className="text-base font-mono">
@@ -211,7 +211,7 @@ function RevisionInfoDisplay({ revision }: { revision: RevisionInfo }) {
           )}
         </div>
         
-        <div className="flex items-center gap-2 text-sm text-gray-600">
+        <div className="flex items-center gap-2 text-sm text-muted-foreground">
           <FileText className="h-4 w-4" />
           <span>{revision.attachments?.length || 0} file(s)</span>
           {processedCount > 0 && (
@@ -224,11 +224,11 @@ function RevisionInfoDisplay({ revision }: { revision: RevisionInfo }) {
 
       <div className="grid grid-cols-2 gap-4 text-sm">
         <div>
-          <span className="text-gray-500">Uploader:</span>
+          <span className="text-muted-foreground">Uploader:</span>
           <span className="ml-2 font-medium">{revision.uploaderName || '-'}</span>
         </div>
         <div>
-          <span className="text-gray-500">Upload Date:</span>
+          <span className="text-muted-foreground">Upload Date:</span>
           <span className="ml-2">
             {revision.uploadedAt 
               ? new Date(revision.uploadedAt).toLocaleDateString()
@@ -240,7 +240,7 @@ function RevisionInfoDisplay({ revision }: { revision: RevisionInfo }) {
 
       {revision.comment && (
         <div className="pt-2 border-t">
-          <span className="text-gray-500 text-sm">Current Comment:</span>
+          <span className="text-muted-foreground text-sm">Current Comment:</span>
           <p className="mt-1 text-sm bg-white p-2 rounded border">
             {revision.comment}
           </p>
@@ -577,10 +577,10 @@ export function EditRevisionDialog({
                       {revision.attachments.map((file, index) => (
                         <div
                           key={file.id}
-                          className="flex items-center justify-between p-2 bg-gray-50 rounded text-sm"
+                          className="flex items-center justify-between p-2 bg-muted/50 rounded text-sm"
                         >
                           <div className="flex items-center gap-2 flex-1 min-w-0">
-                            <FileText className="h-4 w-4 text-gray-500 flex-shrink-0" />
+                            <FileText className="h-4 w-4 text-muted-foreground flex-shrink-0" />
                             <span className="truncate" title={file.fileName}>
                               {file.fileName}
                             </span>
@@ -667,7 +667,7 @@ export function EditRevisionDialog({
                   </div>
                 </div>
 
-                <div className="space-y-3 text-sm text-gray-600">
+                <div className="space-y-3 text-sm text-muted-foreground">
                   <p>This action will permanently delete:</p>
                   <ul className="list-disc list-inside space-y-1 ml-4">
                     <li>Revision metadata and settings</li>
diff --git a/components/ship-vendor-document/new-revision-dialog.tsx b/components/ship-vendor-document/new-revision-dialog.tsx
index 4fe4de98..1ffcf630 100644
--- a/components/ship-vendor-document/new-revision-dialog.tsx
+++ b/components/ship-vendor-document/new-revision-dialog.tsx
@@ -195,16 +195,16 @@ function FileUploadArea({
   return (
     <div className="space-y-4">
       <div
-        className="border-2 border-dashed border-gray-300 rounded-lg p-6 text-center cursor-pointer hover:border-gray-400 transition-colors"
+        className="border-2 border-dashed border-border rounded-lg p-6 text-center cursor-pointer hover:border-border transition-colors"
         onDrop={handleDrop}
         onDragOver={handleDragOver}
         onClick={() => fileInputRef.current?.click()}
       >
-        <Upload className="mx-auto h-12 w-12 text-gray-400 mb-4" />
-        <p className="text-sm text-gray-600 mb-2">
+        <Upload className="mx-auto h-12 w-12 text-muted-foreground mb-4" />
+        <p className="text-sm text-muted-foreground mb-2">
           Drag files here or click to select
         </p>
-        <p className="text-xs text-gray-500">
+        <p className="text-xs text-muted-foreground">
           Supports PDF, Word, Excel, Image, Text, ZIP files (max 1GB)
         </p>
         <p className="text-xs text-orange-600 mt-1">
@@ -227,15 +227,15 @@ function FileUploadArea({
             {files.map((file, index) => (
               <div
                 key={index}
-                className="flex items-center justify-between p-2 bg-gray-50 rounded border"
+                className="flex items-center justify-between p-2 bg-muted/50 rounded border"
               >
                 <div className="flex items-center space-x-2 flex-1">
-                  <FileText className="h-4 w-4 text-gray-500" />
+                  <FileText className="h-4 w-4 text-muted-foreground" />
                   <div className="flex-1 min-w-0">
                     <p className="text-sm font-medium truncate" title={file.name}>
                       {file.name}
                     </p>
-                    <p className="text-xs text-gray-500">
+                    <p className="text-xs text-muted-foreground">
                       {formatFileSize(file.size)}
                     </p>
                   </div>
diff --git a/components/ship-vendor-document/user-vendor-document-table-container.tsx b/components/ship-vendor-document/user-vendor-document-table-container.tsx
index c9118cd0..7fac34a9 100644
--- a/components/ship-vendor-document/user-vendor-document-table-container.tsx
+++ b/components/ship-vendor-document/user-vendor-document-table-container.tsx
@@ -290,7 +290,7 @@ function RevisionTable({
                         {revision.usageType ? (
                           revision.usageType
                         ) : (
-                          <span className="text-gray-400 text-xs">-</span>
+                          <span className="text-muted-foreground text-xs">-</span>
                         )}
                       </span>
                     </TableCell>
@@ -312,12 +312,12 @@ function RevisionTable({
                     <TableCell className="py-1 px-2">
                       {revision.comment ? (
                         <div className="max-w-24">
-                          <p className="text-xs text-gray-700 bg-gray-50 p-1 rounded truncate" title={revision.comment}>
+                          <p className="text-xs text-foreground bg-muted/50 p-1 rounded truncate" title={revision.comment}>
                             {revision.comment}
                           </p>
                         </div>
                       ) : (
-                        <span className="text-gray-400 text-xs">-</span>
+                        <span className="text-muted-foreground text-xs">-</span>
                       )}
                     </TableCell>
                     <TableCell>
@@ -332,7 +332,7 @@ function RevisionTable({
                         <span>{revision.attachments.length}</span>
                         {/* ✅ 처리된 파일 수 표시 */}
                         {processStatus === 'partially-processed' && (
-                          <span className="text-xs text-gray-500">
+                          <span className="text-xs text-muted-foreground">
                             ({revision.attachments.filter(att => 
                               att.dolceFilePath && att.dolceFilePath.trim() !== ''
                             ).length} processed)
@@ -363,7 +363,7 @@ function RevisionTable({
                           className={`h-8 px-2 ${
                             canEdit 
                               ? 'text-blue-600 hover:text-blue-700 hover:bg-blue-50' 
-                              : 'text-gray-400 cursor-not-allowed'
+                              : 'text-muted-foreground cursor-not-allowed'
                           }`}
                           disabled={!canEdit}
                           title={
@@ -610,7 +610,7 @@ function AttachmentTable({
                           className={`h-8 px-2 ${
                             canDeleteFile(file) 
                               ? 'text-red-600 hover:text-red-700 hover:bg-red-50' 
-                              : 'text-gray-400 cursor-not-allowed'
+                              : 'text-muted-foreground cursor-not-allowed'
                           }`}
                           disabled={!canDeleteFile(file) || deletingFileId === file.id}
                           title={
@@ -1225,16 +1225,16 @@ function SelectedDocumentInfo() {
   }
 
   return (
-    <div className="flex flex-wrap items-center gap-3 rounded-lg bg-gray-50 p-4">
+    <div className="flex flex-wrap items-center gap-3 rounded-lg bg-muted/50 p-4">
       <div className="flex items-center gap-2">
         <Badge variant="secondary" className="text-sm">
           Document: {doc.docNumber}
         </Badge>
-        <span className="max-w-[300px] truncate text-sm font-medium text-gray-700">
+        <span className="max-w-[300px] truncate text-sm font-medium text-foreground">
           {doc.title}
         </span>
       </div>
-      <div className="flex items-center gap-2 text-sm text-gray-600">
+      <div className="flex items-center gap-2 text-sm text-muted-foreground">
         <span>•</span>
         <span>Total {totalRevisions} revisions</span>
         {selectedRevision && (
@@ -1302,8 +1302,8 @@ export function UserVendorDocumentDisplay({
       <Card>
         <CardContent className="flex items-center justify-center py-8">
           <div className="text-center">
-            <AlertCircle className="mx-auto mb-2 h-8 w-8 text-gray-400" />
-            <p className="text-gray-600">Unable to load data.</p>
+            <AlertCircle className="mx-auto mb-2 h-8 w-8 text-muted-foreground" />
+            <p className="text-muted-foreground">Unable to load data.</p>
           </div>
         </CardContent>
       </Card>