tag colors

frontend/src/styles/documents/listing.css

@@ -14,8 +14,6 @@
   min-height: 0;
 }
 
-
-
 .documents-panel tr.folder.is-drop-target {
   outline: 2px dashed var(--accent-strong, var(--accent));
   outline-offset: -2px;
@@ -760,15 +758,42 @@
 }
 
 .tag-chip {
+  --tag-chip-resolved-l: var(--tag-chip-base-l, 0.9);
+  --tag-chip-resolved-c: var(--tag-chip-base-c, 0);
+  --tag-chip-resolved-h: var(--tag-chip-base-h, 0deg);
   gap: 0.25rem;
   border-radius: 1rem;
   padding: 0.2rem 0.4rem;
   font-weight: 600;
+  border: none;
+  background: oklch(
+    min(1, calc(var(--tag-chip-resolved-l) + (1 - var(--tag-chip-resolved-l)) * var(--tag-chip-bg-lighten)))
+    calc(var(--tag-chip-resolved-c) * var(--tag-chip-bg-chroma-scale))
+    var(--tag-chip-resolved-h)
+    / 0.9
+  );
+  --tag-chip-outline-color: var(
+    --tag-chip-outline,
+    oklch(
+      min(1, calc(var(--tag-chip-resolved-l) + (1 - var(--tag-chip-resolved-l)) * var(--tag-chip-outline-lighten)))
+      min(1, calc(var(--tag-chip-resolved-c) * var(--tag-chip-outline-chroma-scale)))
+      var(--tag-chip-resolved-h)
+    )
+  );
+  --tag-chip-text-color: var(
+    --tag-chip-text,
+    oklch(
+      clamp(0, calc(var(--tag-chip-resolved-l) + var(--tag-chip-text-lighten)), 1)
+      clamp(0, calc(var(--tag-chip-resolved-c) * var(--tag-chip-text-chroma-scale)), 1)
+      var(--tag-chip-resolved-h)
+    )
+  );
+  color: var(--tag-chip-text-color, currentColor);
 }
 
 .tag-chip--more {
   background: transparent;
-  border-color: var(--border-strong);
+  border: 1px dashed var(--border-strong);
   color: var(--muted);
 }