Update utils.py

utils.py

@@ -538,30 +538,26 @@ def build_fig_timeline(speakers_dataFrame, currTotalTime, speaker_color_map, get
     )
     fig.update_yaxes(autorange="reversed")
 
-    # Add vertical shading for multi-voice intervals.
-    # add_vrect doesn't support hover, so we also add an invisible scatter
-    # trace on top of each band to carry the tooltip.
+    # Add vertical shading for multi-voice intervals as filled scatter shapes.
+    # go.Scatter with fill="toself" supports hover; add_vrect does not.
     MV_COLOR = "#64A377"
+    # We need the y-axis range — use a large span that covers all speaker rows
+    y_speakers = df["Resource"].unique().tolist()
+    y_min, y_max = -0.5, len(y_speakers) - 0.5
     for start_s, end_s in (mv_intervals or []):
         x0_dt = base + dt.timedelta(seconds=start_s)
         x1_dt = base + dt.timedelta(seconds=end_s)
-        fig.add_vrect(
-            x0=x0_dt, x1=x1_dt,
-            fillcolor=MV_COLOR,
-            opacity=0.30,
-            layer="below",
-            line_width=0,
-        )
-        # Invisible scatter at midpoint to carry hover tooltip
-        mid_dt = base + dt.timedelta(seconds=(start_s + end_s) / 2)
         fig.add_trace(go.Scatter(
-            x=[mid_dt],
-            y=[None],
-            mode="markers",
-            marker=dict(size=0, opacity=0),
+            x=[x0_dt, x1_dt, x1_dt, x0_dt, x0_dt],
+            y=[y_min,  y_min,  y_max,  y_max,  y_min],
+            fill="toself",
+            fillcolor=f"rgba(100,163,119,0.25)",
+            line=dict(width=0),
+            mode="lines",
             showlegend=False,
+            yaxis="y",
             hovertemplate=(
-                f"<b>Resource: Multi Voice</b><br>"
+                f"<b>Multi Voice</b><br>"
                 f"Start: {_seconds_to_hhmmss(start_s)}<br>"
                 f"Finish: {_seconds_to_hhmmss(end_s)}"
                 "<extra></extra>"