ui优化

apps/frontend/src/views/admin/AdminFulfillmentBindingsView.vue

@@ -919,13 +919,13 @@ onMounted(loadConfigs)
 .panel-header h1,
 .section-title-row h3 {
   margin: 0;
-  color: #1d3555;
+  color: var(--text-primary);
 }
 
 .panel-header p,
 .section-title-row p {
   margin: 6px 0 0;
-  color: #64748b;
+  color: var(--text-secondary);
 }
 
 .panel-header {
@@ -957,7 +957,7 @@ onMounted(loadConfigs)
   border-radius: 999px;
   background: rgba(37, 89, 167, 0.08);
   border: 1px solid rgba(37, 89, 167, 0.12);
-  color: #2559a7;
+  color: var(--color-primary-dark);
   font-size: 12px;
   font-weight: 700;
   letter-spacing: 0.04em;
@@ -999,7 +999,7 @@ onMounted(loadConfigs)
   padding: 8px 12px;
   border-radius: 14px;
   background: rgba(15, 23, 42, 0.05);
-  color: #1d3555;
+  color: var(--text-primary);
   word-break: break-all;
 }
 
@@ -1019,13 +1019,13 @@ onMounted(loadConfigs)
 }
 
 .overview-stat span {
-  color: #64748b;
+  color: var(--text-secondary);
   font-size: 12px;
   font-weight: 700;
 }
 
 .overview-stat strong {
-  color: #1d3555;
+  color: var(--text-primary);
   font-size: 22px;
   line-height: 1.1;
 }
@@ -1043,7 +1043,7 @@ onMounted(loadConfigs)
   padding: 0 12px;
   border-radius: 999px;
   background: rgba(15, 23, 42, 0.04);
-  color: #475467;
+  color: var(--text-secondary);
   font-size: 12px;
   font-weight: 600;
 }
@@ -1084,7 +1084,7 @@ onMounted(loadConfigs)
 
 .toolbar-hint {
   margin: 10px 0 0;
-  color: #64748b;
+  color: var(--text-secondary);
   font-size: 12px;
 }
 
@@ -1103,7 +1103,7 @@ onMounted(loadConfigs)
 }
 
 .lookup-summary-item strong {
-  color: #1d3555;
+  color: var(--text-primary);
 }
 
 .binding-card {
@@ -1137,11 +1137,11 @@ onMounted(loadConfigs)
   gap: 10px;
   align-items: center;
   flex-wrap: wrap;
-  color: #1d3555;
+  color: var(--text-primary);
 }
 
 .binding-subtle {
-  color: #64748b;
+  color: var(--text-secondary);
   font-size: 13px;
 }
 
@@ -1164,7 +1164,7 @@ onMounted(loadConfigs)
 .collapse-button {
   border: 1px solid rgba(86, 108, 138, 0.18);
   background: rgba(255, 255, 255, 0.96);
-  color: #1d3555;
+  color: var(--text-primary);
   border-radius: 999px;
   padding: 7px 12px;
   font: inherit;
@@ -1174,7 +1174,7 @@ onMounted(loadConfigs)
 .binding-collapsed-preview {
   display: grid;
   gap: 6px;
-  color: #64748b;
+  color: var(--text-secondary);
   font-size: 13px;
 }
 
@@ -1190,7 +1190,7 @@ onMounted(loadConfigs)
   border-radius: 14px;
   background: #fff4f2;
   border: 1px solid rgba(244, 63, 94, 0.18);
-  color: #b42318;
+  color: var(--color-danger);
   font-weight: 600;
 }
 
@@ -1200,13 +1200,13 @@ onMounted(loadConfigs)
 }
 
 .field-block span {
-  color: #475467;
+  color: var(--text-secondary);
   font-size: 12px;
   font-weight: 700;
 }
 
 .field-help {
-  color: #64748b;
+  color: var(--text-secondary);
   font-size: 12px;
   line-height: 1.5;
 }
@@ -1236,13 +1236,13 @@ onMounted(loadConfigs)
 }
 
 .text-input--readonly {
-  color: #475467;
+  color: var(--text-secondary);
   background: rgba(148, 163, 184, 0.08);
 }
 
 .binding-inline-error {
   margin: 10px 0 0;
-  color: #b42318;
+  color: var(--color-danger);
   font-size: 13px;
   font-weight: 600;
 }
@@ -1259,7 +1259,7 @@ onMounted(loadConfigs)
   display: inline-flex;
   gap: 8px;
   align-items: center;
-  color: #475467;
+  color: var(--text-secondary);
 }
 
 .data-table {
@@ -1273,12 +1273,12 @@ onMounted(loadConfigs)
   padding: 12px 10px;
   text-align: left;
   border-bottom: 1px solid rgba(86, 108, 138, 0.08);
-  color: #334155;
+  color: var(--text-primary);
   vertical-align: top;
 }
 
 .data-table th {
-  color: #64748b;
+  color: var(--text-secondary);
   font-size: 13px;
 }
 
@@ -1288,17 +1288,17 @@ onMounted(loadConfigs)
 }
 
 .cell-subtle {
-  color: #64748b;
+  color: var(--text-secondary);
   font-size: 12px;
 }
 
 .empty-block,
 .empty-inline {
-  color: #64748b;
+  color: var(--text-secondary);
 }
 
 .error-copy {
-  color: #b42318;
+  color: var(--color-danger);
 }
 
 @media (max-width: 980px) {