From 01cd764c4c288162d17fb972534d9500264cc405 Mon Sep 17 00:00:00 2001
From: Charles de Dreuille <charles.dedreuille@gmail.com>
Date: Fri, 13 Feb 2026 13:48:37 +0000
Subject: [PATCH] Cleanup borders and surfaces

Signed-off-by: Charles de Dreuille <charles.dedreuille@gmail.com>
---
 .../src/components/Dialog/Dialog.module.css   |  8 +++----
 .../src/components/Header/Header.module.css   |  4 ++--
 .../ui/src/components/Menu/Menu.module.css    |  8 +++----
 .../src/components/Tooltip/Tooltip.module.css | 22 ++++---------------
 4 files changed, 14 insertions(+), 28 deletions(-)

diff --git a/packages/ui/src/components/Dialog/Dialog.module.css b/packages/ui/src/components/Dialog/Dialog.module.css
index cd0351cc4a..f5968820a2 100644
--- a/packages/ui/src/components/Dialog/Dialog.module.css
+++ b/packages/ui/src/components/Dialog/Dialog.module.css
@@ -43,9 +43,9 @@
   }
 
   .bui-Dialog {
-    background: var(--bui-bg-neutral-1);
+    background: var(--bui-bg-popover);
     border-radius: 0.5rem;
-    border: 1px solid var(--bui-border-2);
+    border: 1px solid var(--bui-border-1);
     color: var(--bui-fg-primary);
     position: relative;
     width: min(var(--bui-dialog-min-width, 400px), calc(100vw - 3rem));
@@ -73,7 +73,7 @@
     align-items: center;
     padding-inline: var(--bui-space-3);
     padding-block: var(--bui-space-2);
-    border-bottom: 1px solid var(--bui-border-2);
+    border-bottom: 1px solid var(--bui-border-1);
   }
 
   .bui-DialogHeaderTitle {
@@ -89,7 +89,7 @@
     gap: var(--bui-space-2);
     padding-inline: var(--bui-space-3);
     padding-block: var(--bui-space-3);
-    border-top: 1px solid var(--bui-border-2);
+    border-top: 1px solid var(--bui-border-1);
   }
 
   .bui-DialogBody {
diff --git a/packages/ui/src/components/Header/Header.module.css b/packages/ui/src/components/Header/Header.module.css
index ec00d85f86..f945b70bf0 100644
--- a/packages/ui/src/components/Header/Header.module.css
+++ b/packages/ui/src/components/Header/Header.module.css
@@ -43,7 +43,7 @@
     justify-content: space-between;
     background-color: var(--bui-bg-neutral-1);
     padding-inline: var(--bui-space-5);
-    border-bottom: 1px solid var(--bui-border-2);
+    border-bottom: 1px solid var(--bui-border-1);
     color: var(--bui-fg-primary);
     height: 52px;
   }
@@ -89,7 +89,7 @@
 
   .bui-HeaderTabsWrapper {
     padding-inline: var(--bui-space-3);
-    border-bottom: 1px solid var(--bui-border-2);
+    border-bottom: 1px solid var(--bui-border-1);
     background-color: var(--bui-bg-neutral-1);
   }
 }
diff --git a/packages/ui/src/components/Menu/Menu.module.css b/packages/ui/src/components/Menu/Menu.module.css
index d21806b506..4967d26551 100644
--- a/packages/ui/src/components/Menu/Menu.module.css
+++ b/packages/ui/src/components/Menu/Menu.module.css
@@ -21,9 +21,9 @@
     display: flex;
     flex-direction: column;
     box-shadow: var(--bui-shadow);
-    border: 1px solid var(--bui-border-2);
+    border: 1px solid var(--bui-border-1);
     border-radius: var(--bui-radius-2);
-    background: var(--bui-bg-neutral-1);
+    background: var(--bui-bg-popover);
     color: var(--bui-fg-primary);
     outline: none;
     transition: transform 200ms, opacity 200ms;
@@ -183,7 +183,7 @@
 
   .bui-MenuSeparator {
     height: 1px;
-    background: var(--bui-border-2);
+    background: var(--bui-border-1);
     margin-inline: var(--bui-space-1_5);
     margin-block: var(--bui-space-1);
   }
@@ -194,7 +194,7 @@
     flex-shrink: 0;
     display: flex;
     align-items: center;
-    border-bottom: 1px solid var(--bui-border-2);
+    border-bottom: 1px solid var(--bui-border-1);
     background-color: var(--bui-bg-neutral-1);
     height: 2rem;
 
diff --git a/packages/ui/src/components/Tooltip/Tooltip.module.css b/packages/ui/src/components/Tooltip/Tooltip.module.css
index 9c9bc503b5..22a3283790 100644
--- a/packages/ui/src/components/Tooltip/Tooltip.module.css
+++ b/packages/ui/src/components/Tooltip/Tooltip.module.css
@@ -20,8 +20,8 @@
   .bui-Tooltip {
     box-shadow: var(--bui-shadow);
     border-radius: 4px;
-    background: var(--bui-bg-neutral-1);
-    border: 1px solid var(--bui-border-2);
+    background: var(--bui-bg-popover);
+    border: 1px solid var(--bui-border-1);
     forced-color-adjust: none;
     outline: none;
     padding: var(--bui-space-2) var(--bui-space-3);
@@ -74,11 +74,11 @@
       elements in order to guarantee that the stroke is
       always overlaying a consistent color. */
       path:nth-child(1) {
-        fill: var(--bui-bg-neutral-1);
+        fill: var(--bui-bg-popover);
       }
 
       path:nth-child(2) {
-        fill: var(--bui-fg-secondary);
+        fill: var(--bui-border-1);
       }
 
       /* The arrow svg overlaps the tooltip by 2px, so we
@@ -105,18 +105,4 @@
       transform: rotate(-90deg);
     }
   }
-
-  [data-theme='dark'] .bui-Tooltip {
-    background: var(--bui-bg-neutral-2);
-    box-shadow: none;
-    border: 1px solid var(--bui-border-2);
-  }
-
-  [data-theme='dark'] .bui-TooltipArrow svg path:nth-child(1) {
-    fill: var(--bui-bg-neutral-2);
-  }
-
-  [data-theme='dark'] .bui-TooltipArrow svg path:nth-child(2) {
-    fill: var(--bui-fg-secondary);
-  }
 }