diff --git a/app/assets/stylesheets/components/topics.css b/app/assets/stylesheets/components/topics.css
index 95d0ef2..7f36f15 100644
--- a/app/assets/stylesheets/components/topics.css
+++ b/app/assets/stylesheets/components/topics.css
@@ -293,6 +293,11 @@ a.topic-icon {
   }
 }
 
+.topic-row.is-popover-open {
+  position: relative;
+  z-index: 5;
+}
+
 .topic-row.topic-new,
 .topic-row.topic-reading {
   background: var(--color-bg-unread);
diff --git a/app/javascript/controllers/hover_popover_controller.js b/app/javascript/controllers/hover_popover_controller.js
index f8995ef..a94b67f 100644
--- a/app/javascript/controllers/hover_popover_controller.js
+++ b/app/javascript/controllers/hover_popover_controller.js
@@ -13,12 +13,14 @@ export default class extends Controller {
   show() {
     this._clearTimeout()
     this.element.classList.add("is-open")
+    this._updateRowOpenState()
   }
 
   scheduleHide() {
     this._clearTimeout()
     this.hideTimeout = setTimeout(() => {
       this.element.classList.remove("is-open")
+      this._updateRowOpenState()
     }, this.delay)
   }
 
@@ -28,4 +30,12 @@ export default class extends Controller {
       this.hideTimeout = null
     }
   }
+
+  _updateRowOpenState() {
+    const row = this.element.closest(".topic-row")
+    if (!row) return
+
+    const hasOpenPopover = row.querySelector(".topic-icon.is-open")
+    row.classList.toggle("is-popover-open", Boolean(hasOpenPopover))
+  }
 }