From 289d48846997b92955c0f632b959c94672879454 Mon Sep 17 00:00:00 2001
From: Forbes <forbes@kindred-systems.com>
Date: Fri, 13 Feb 2026 13:22:30 -0600
Subject: [PATCH] fix(web): table header color overlay1 + selected row mauve
 tint (#69)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- All thStyle objects: color subtext1/subtext0 → overlay1
- Selected row bg: surface1 → rgba(mauve, 0.08)

Files: ItemTable, BOMTab, ProjectsPage, SchemasPage,
SettingsPage, AuditTable

Closes #69
---
 web/src/components/audit/AuditTable.tsx | 4 ++--
 web/src/components/items/BOMTab.tsx     | 2 +-
 web/src/components/items/ItemTable.tsx  | 4 ++--
 web/src/pages/ProjectsPage.tsx          | 2 +-
 web/src/pages/SchemasPage.tsx           | 2 +-
 web/src/pages/SettingsPage.tsx          | 2 +-
 6 files changed, 8 insertions(+), 8 deletions(-)

diff --git a/web/src/components/audit/AuditTable.tsx b/web/src/components/audit/AuditTable.tsx
index c471d9a..4e2d089 100644
--- a/web/src/components/audit/AuditTable.tsx
+++ b/web/src/components/audit/AuditTable.tsx
@@ -85,7 +85,7 @@ export function AuditTable({
                 style={{
                   cursor: "pointer",
                   backgroundColor: isSelected
-                    ? "var(--ctp-surface1)"
+                    ? "rgba(203, 166, 247, 0.08)"
                     : "transparent",
                   transition: "background-color 0.15s",
                 }}
@@ -154,7 +154,7 @@ const thStyle: React.CSSProperties = {
   padding: "var(--d-th-py) var(--d-th-px)",
   fontSize: "var(--d-th-font)",
   borderBottom: "1px solid var(--ctp-surface1)",
-  color: "var(--ctp-subtext0)",
+  color: "var(--ctp-overlay1)",
   fontWeight: 500,
   position: "sticky",
   top: 0,
diff --git a/web/src/components/items/BOMTab.tsx b/web/src/components/items/BOMTab.tsx
index f6a5b73..0d1e64a 100644
--- a/web/src/components/items/BOMTab.tsx
+++ b/web/src/components/items/BOMTab.tsx
@@ -406,7 +406,7 @@ const thStyle: React.CSSProperties = {
   padding: "0.3rem 0.5rem",
   textAlign: "left",
   borderBottom: "1px solid var(--ctp-surface1)",
-  color: "var(--ctp-subtext1)",
+  color: "var(--ctp-overlay1)",
   fontWeight: 600,
   fontSize: "0.7rem",
   textTransform: "uppercase",
diff --git a/web/src/components/items/ItemTable.tsx b/web/src/components/items/ItemTable.tsx
index 9b3e44a..32b82fd 100644
--- a/web/src/components/items/ItemTable.tsx
+++ b/web/src/components/items/ItemTable.tsx
@@ -150,7 +150,7 @@ export function ItemTable({
     padding: "var(--d-th-py) var(--d-th-px)",
     textAlign: "left",
     borderBottom: "1px solid var(--ctp-surface1)",
-    color: "var(--ctp-subtext1)",
+    color: "var(--ctp-overlay1)",
     fontWeight: 600,
     fontSize: "var(--d-th-font)",
     textTransform: "uppercase",
@@ -203,7 +203,7 @@ export function ItemTable({
             {sortedItems.map((item, idx) => {
               const isSelected = item.part_number === selectedPN;
               const rowBg = isSelected
-                ? "var(--ctp-surface1)"
+                ? "rgba(203, 166, 247, 0.08)"
                 : idx % 2 === 0
                   ? "var(--ctp-base)"
                   : "var(--ctp-surface0)";
diff --git a/web/src/pages/ProjectsPage.tsx b/web/src/pages/ProjectsPage.tsx
index e07069e..baf36a4 100644
--- a/web/src/pages/ProjectsPage.tsx
+++ b/web/src/pages/ProjectsPage.tsx
@@ -555,7 +555,7 @@ const thStyle: React.CSSProperties = {
   padding: "0.5rem 0.75rem",
   textAlign: "left",
   borderBottom: "1px solid var(--ctp-surface1)",
-  color: "var(--ctp-subtext1)",
+  color: "var(--ctp-overlay1)",
   fontWeight: 600,
   fontSize: "0.8rem",
   textTransform: "uppercase",
diff --git a/web/src/pages/SchemasPage.tsx b/web/src/pages/SchemasPage.tsx
index 07e0b55..abb0eeb 100644
--- a/web/src/pages/SchemasPage.tsx
+++ b/web/src/pages/SchemasPage.tsx
@@ -691,7 +691,7 @@ const thStyle: React.CSSProperties = {
   padding: "0.4rem 0.75rem",
   textAlign: "left",
   borderBottom: "1px solid var(--ctp-surface1)",
-  color: "var(--ctp-subtext1)",
+  color: "var(--ctp-overlay1)",
   fontWeight: 600,
   fontSize: "0.8rem",
   textTransform: "uppercase",
diff --git a/web/src/pages/SettingsPage.tsx b/web/src/pages/SettingsPage.tsx
index 811e4b6..1b4d99c 100644
--- a/web/src/pages/SettingsPage.tsx
+++ b/web/src/pages/SettingsPage.tsx
@@ -479,7 +479,7 @@ const thStyle: React.CSSProperties = {
   padding: "0.5rem 0.75rem",
   textAlign: "left",
   borderBottom: "1px solid var(--ctp-surface1)",
-  color: "var(--ctp-subtext1)",
+  color: "var(--ctp-overlay1)",
   fontWeight: 600,
   fontSize: "0.8rem",
   textTransform: "uppercase",