fix(ui): review comments z-index stacking

3 files changed, 23 insertions, 16 deletions

diff --git a/packages/ui/src/components/session-review.css b/packages/ui/src/components/session-review.css
index 20d2fef15..363343f91 100644
--- a/packages/ui/src/components/session-review.css
+++ b/packages/ui/src/components/session-review.css
@@ -44,10 +44,11 @@
 
   [data-component="sticky-accordion-header"] {
     top: 40px;
+  }
 
-    &[data-expanded]::before {
-      top: -40px;
-    }
+  [data-component="sticky-accordion-header"][data-expanded]::before,
+  [data-slot="accordion-item"][data-expanded] [data-component="sticky-accordion-header"]::before {
+    top: -40px;
   }
 
   [data-slot="accordion-trigger"] {
@@ -79,6 +80,7 @@
 
   [data-slot="session-review-accordion-content"] {
     position: relative;
+    z-index: 0;
     overflow: hidden;
   }
 
@@ -211,7 +213,9 @@
   [data-slot="session-review-diff-wrapper"] {
     position: relative;
     overflow: hidden;
+    z-index: 0;
     --line-comment-z: 5;
     --line-comment-popover-z: 30;
+    --line-comment-open-z: 6;
   }
 }
diff --git a/packages/ui/src/components/session-turn.css b/packages/ui/src/components/session-turn.css
index 82b57d13d..840fde05f 100644
--- a/packages/ui/src/components/session-turn.css
+++ b/packages/ui/src/components/session-turn.css
@@ -409,10 +409,11 @@
 
   [data-component="sticky-accordion-header"] {
     top: var(--sticky-header-height, 0px);
+  }
 
-    &[data-expanded]::before {
-      top: calc(-1 * var(--sticky-header-height, 0px));
-    }
+  [data-component="sticky-accordion-header"][data-expanded]::before,
+  [data-slot="accordion-item"][data-expanded] [data-component="sticky-accordion-header"]::before {
+    top: calc(-1 * var(--sticky-header-height, 0px));
   }
 
   [data-slot="session-turn-accordion-trigger-content"] {
diff --git a/packages/ui/src/components/sticky-accordion-header.css b/packages/ui/src/components/sticky-accordion-header.css
index 0fbc354fb..bee8ea78f 100644
--- a/packages/ui/src/components/sticky-accordion-header.css
+++ b/packages/ui/src/components/sticky-accordion-header.css
@@ -1,16 +1,18 @@
 [data-component="sticky-accordion-header"] {
   position: sticky;
   top: 0px;
+}
 
-  &[data-expanded] {
-    z-index: 10;
+[data-component="sticky-accordion-header"][data-expanded],
+[data-slot="accordion-item"][data-expanded] [data-component="sticky-accordion-header"] {
+  z-index: 10;
+}
 
-    &::before {
-      content: "";
-      z-index: -10;
-      position: absolute;
-      inset: 0;
-      background-color: var(--background-stronger);
-    }
-  }
+[data-component="sticky-accordion-header"][data-expanded]::before,
+[data-slot="accordion-item"][data-expanded] [data-component="sticky-accordion-header"]::before {
+  content: "";
+  z-index: -10;
+  position: absolute;
+  inset: 0;
+  background-color: var(--background-stronger);
 }