@optifye/dashboard-core 6.11.17 → 6.11.19

package/dist/index.mjs

@@ -1,22 +1,22 @@
-import * as React141 from 'react';
-import React141__default, { createContext, useRef, useCallback, useState, useMemo, useEffect, forwardRef, useImperativeHandle, useLayoutEffect, memo as memo$1, useContext, useSyncExternalStore, useId, Children, isValidElement, useInsertionEffect, startTransition, Fragment as Fragment$1, createElement, Component } from 'react';
+import * as React142 from 'react';
+import React142__default, { createContext, useRef, useCallback, useState, useMemo, useEffect, forwardRef, useImperativeHandle, useLayoutEffect, memo as memo$1, useContext, useSyncExternalStore, useId, Children, isValidElement, useInsertionEffect, startTransition, Fragment as Fragment$1, createElement, Component } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useRouter } from 'next/router';
 import { toast } from 'sonner';
-import { fromZonedTime, formatInTimeZone, toZonedTime } from 'date-fns-tz';
+import { formatInTimeZone, fromZonedTime, toZonedTime } from 'date-fns-tz';
 import { format, addDays, subMonths, endOfMonth, startOfMonth, endOfDay, eachDayOfInterval, getDay, isSameDay, isWithinInterval, startOfDay, parseISO, subDays, differenceInMinutes, addMinutes, addMonths, isValid, formatDistanceToNow, isToday, isFuture, isBefore } from 'date-fns';
 import mixpanel from 'mixpanel-browser';
 import { EventEmitter } from 'events';
 import { createClient, REALTIME_SUBSCRIBE_STATES } from '@supabase/supabase-js';
 import Hls, { Events, ErrorTypes } from 'hls.js';
 import useSWR from 'swr';
-import { Camera, AlertTriangle, ChevronDown, ChevronUp, Check, Map as Map$1, Video, ShieldCheck, Star, Award, Filter, X, Coffee, Plus, ArrowUp, ArrowDown, ArrowRight, ArrowLeft, Clock, Calendar, Save, AlertCircle, Loader2, Minus, ChevronLeft, ChevronRight, TrendingUp, Sparkles, Pause, Play, XCircle, HelpCircle, Activity, Wrench, UserX, Package, RefreshCw, Palette, CheckCircle2, TrendingDown, FolderOpen, Folder, Tag, Sliders, Layers, Search, Edit2, CheckCircle, User, Users, Shield, Building2, Mail, Lock, Info, Share2, Trophy, Target, Download, Sun, Moon, MousePointer, UserPlus, UserCog, Trash2, Eye, MoreVertical, BarChart3, Pencil, UserCheck, LogOut, Film, MessageSquare, Menu, Send, Copy, Settings, LifeBuoy, EyeOff, Zap, Flame, Crown, Medal } from 'lucide-react';
+import { Camera, AlertTriangle, ChevronDown, ChevronUp, Check, Map as Map$1, Video, ShieldCheck, Star, Award, Filter, X, Coffee, Plus, ArrowUp, ArrowDown, ArrowRight, ArrowLeft, Clock, Calendar, Save, AlertCircle, Loader2, Minus, ChevronLeft, ChevronRight, TrendingUp, Sparkles, Pause, Play, XCircle, HelpCircle, Activity, Wrench, UserX, Package, RefreshCw, Palette, CheckCircle2, TrendingDown, FolderOpen, Folder, Tag, Sliders, Layers, Search, Edit2, CheckCircle, User, Users, Shield, Building2, Mail, Lock, Info, Share2, Trophy, Target, Download, Copy, Sun, Moon, MousePointer, UserPlus, UserCog, Trash2, Eye, MoreVertical, BarChart3, Pencil, UserCheck, LogOut, Film, MessageSquare, Menu, Send, Settings, LifeBuoy, EyeOff, Zap, Flame, Crown, Medal } from 'lucide-react';
 import { memo, noop, warning, invariant, progress, secondsToMilliseconds, millisecondsToSeconds } from 'motion-utils';
 import { BarChart as BarChart$1, CartesianGrid, XAxis, YAxis, ReferenceLine, Tooltip, Legend, Bar, LabelList, ResponsiveContainer, PieChart, Pie, Cell, LineChart as LineChart$1, Line, ComposedChart, Area, ScatterChart, Scatter } from 'recharts';
 import { Slot } from '@radix-ui/react-slot';
 import * as SelectPrimitive from '@radix-ui/react-select';
 import { DayPicker, useNavigation as useNavigation$1 } from 'react-day-picker';
-import { AdjustmentsHorizontalIcon, ClockIcon, UsersIcon, UserCircleIcon, TicketIcon, CurrencyDollarIcon, QuestionMarkCircleIcon, XMarkIcon, ArrowRightIcon, Bars3Icon, HomeIcon, VideoCameraIcon, TrophyIcon, ChartBarIcon, LightBulbIcon, CubeIcon, HeartIcon, BellIcon, Cog6ToothIcon, ChevronRightIcon, ArrowRightStartOnRectangleIcon, ExclamationCircleIcon, ExclamationTriangleIcon, CalendarIcon, ChevronDownIcon, ChevronLeftIcon, EnvelopeIcon, DocumentTextIcon, ChevronUpIcon, ArrowDownTrayIcon, CheckCircleIcon, ChatBubbleLeftRightIcon, XCircleIcon, FunnelIcon, EyeIcon, InformationCircleIcon, ArrowLeftIcon, PlayCircleIcon } from '@heroicons/react/24/outline';
+import { AdjustmentsHorizontalIcon, ClockIcon, UsersIcon, UserCircleIcon, TicketIcon, CurrencyDollarIcon, QuestionMarkCircleIcon, XMarkIcon, InformationCircleIcon, ArrowRightIcon, Bars3Icon, HomeIcon, VideoCameraIcon, TrophyIcon, ChartBarIcon, LightBulbIcon, CubeIcon, HeartIcon, Cog6ToothIcon, ChevronRightIcon, ArrowRightStartOnRectangleIcon, ExclamationCircleIcon, ExclamationTriangleIcon, CalendarIcon, ChevronDownIcon, ChevronLeftIcon, EnvelopeIcon, DocumentTextIcon, ChevronUpIcon, ArrowDownTrayIcon, CheckCircleIcon, ChatBubbleLeftRightIcon, XCircleIcon, FunnelIcon, EyeIcon, ArrowLeftIcon, PlayCircleIcon } from '@heroicons/react/24/outline';
 import { CheckIcon } from '@heroicons/react/24/solid';
 import html2canvas from 'html2canvas';
 import jsPDF, { jsPDF as jsPDF$1 } from 'jspdf';
@@ -1938,14 +1938,14 @@ var useIdleTimeVlmConfig = () => {
   }
   return context;
 };
-var DashboardConfigContext = React141.createContext(void 0);
+var DashboardConfigContext = React142.createContext(void 0);
 var DashboardProvider = ({ config: userProvidedConfig, children }) => {
-  const fullConfig = React141.useMemo(() => mergeWithDefaultConfig(userProvidedConfig), [userProvidedConfig]);
+  const fullConfig = React142.useMemo(() => mergeWithDefaultConfig(userProvidedConfig), [userProvidedConfig]);
   _setDashboardConfigInstance(fullConfig);
-  React141.useEffect(() => {
+  React142.useEffect(() => {
     _setDashboardConfigInstance(fullConfig);
   }, [fullConfig]);
-  React141.useEffect(() => {
+  React142.useEffect(() => {
     if (!fullConfig.theme) return;
     const styleId = "dashboard-core-theme-vars";
     let styleEl = document.getElementById(styleId);
@@ -1971,7 +1971,7 @@ var DashboardProvider = ({ config: userProvidedConfig, children }) => {
   return /* @__PURE__ */ jsx(DashboardConfigContext.Provider, { value: fullConfig, children: /* @__PURE__ */ jsx(IdleTimeVlmConfigProvider, { children }) });
 };
 var useDashboardConfig = () => {
-  const ctx = React141.useContext(DashboardConfigContext);
+  const ctx = React142.useContext(DashboardConfigContext);
   if (!ctx) throw new Error("useDashboardConfig must be used within a DashboardProvider");
   return ctx;
 };
@@ -3981,7 +3981,8 @@ var dashboardService = {
           enable,
           monitoring_mode,
           assembly,
-          video_grid_metric_mode
+          video_grid_metric_mode,
+          recent_flow_window_minutes
         `).eq("enable", true);
       if (companyId) {
         query = query.eq("company_id", companyId);
@@ -4006,7 +4007,8 @@ var dashboardService = {
         video_grid_metric_mode: normalizeVideoGridMetricMode(
           line.video_grid_metric_mode,
           line.assembly ?? false
-        )
+        ),
+        recent_flow_window_minutes: line.recent_flow_window_minutes ?? 7
       }));
       return transformedLines;
     } catch (err) {
@@ -4043,7 +4045,7 @@ var dashboardService = {
         }
         const lineIdsToQuery = configuredLineIds;
         const [line1Result, metricsResult2] = await Promise.all([
-          supabase.from(linesTable).select("id, line_name, factory_id, monitoring_mode, assembly, video_grid_metric_mode, factories!lines_factory_id_fkey(factory_name), company_id, companies!lines_company_id_fkey(company_name:name)").eq("id", defaultLineId).single(),
+          supabase.from(linesTable).select("id, line_name, factory_id, monitoring_mode, assembly, video_grid_metric_mode, recent_flow_window_minutes, factories!lines_factory_id_fkey(factory_name), company_id, companies!lines_company_id_fkey(company_name:name)").eq("id", defaultLineId).single(),
           supabase.from(lineMetricsTable).select("*").in("line_id", lineIdsToQuery).eq("shift_id", queryShiftId).eq("date", queryDate)
         ]);
         if (line1Result.error) throw line1Result.error;
@@ -4099,6 +4101,7 @@ var dashboardService = {
           date: queryDate,
           shift_id: queryShiftId,
           monitoring_mode: line1Data.monitoring_mode ?? void 0,
+          recent_flow_window_minutes: line1Data.recent_flow_window_minutes ?? 7,
           metrics: {
             avg_efficiency: avgEfficiency,
             avg_cycle_time: combinedMetricsData.avg_cycle_time / numLines,
@@ -4122,7 +4125,7 @@ var dashboardService = {
         throw new Error("Company ID must be configured for detailed line requests.");
       }
       const [lineResult, metricsResult] = await Promise.all([
-        supabase.from(linesTable).select("id, line_name, factory_id, monitoring_mode, assembly, video_grid_metric_mode, factories!lines_factory_id_fkey(factory_name), company_id, companies!lines_company_id_fkey(company_name:name)").eq("id", lineIdToQuery).single(),
+        supabase.from(linesTable).select("id, line_name, factory_id, monitoring_mode, assembly, video_grid_metric_mode, recent_flow_window_minutes, factories!lines_factory_id_fkey(factory_name), company_id, companies!lines_company_id_fkey(company_name:name)").eq("id", lineIdToQuery).single(),
         supabase.from(lineMetricsTable).select("*").eq("line_id", lineIdToQuery).eq("shift_id", queryShiftId).eq("date", queryDate)
       ]);
       if (lineResult.error) throw lineResult.error;
@@ -4147,6 +4150,7 @@ var dashboardService = {
         date: queryDate,
         shift_id: queryShiftId,
         monitoring_mode: lineData.monitoring_mode ?? void 0,
+        recent_flow_window_minutes: lineData.recent_flow_window_minutes ?? 7,
         metrics: {
           avg_efficiency: metrics2?.avg_efficiency ?? 0,
           avg_cycle_time: metrics2?.avg_cycle_time || 0,
@@ -4635,6 +4639,11 @@ var workspaceService = {
   _workspaceVideoStreamsInFlight: /* @__PURE__ */ new Map(),
   _workspaceVideoStreamsCacheExpiryMs: 5 * 60 * 1e3,
   // 5 minutes cache
+  // Cache for workspace camera IPs derived from CV configs
+  _workspaceCameraIpsCache: /* @__PURE__ */ new Map(),
+  _workspaceCameraIpsInFlight: /* @__PURE__ */ new Map(),
+  _workspaceCameraIpsCacheExpiryMs: 5 * 60 * 1e3,
+  // 5 minutes cache
   async getWorkspaces(lineId, options) {
     const enabledOnly = options?.enabledOnly ?? false;
     const force = options?.force ?? false;
@@ -4736,6 +4745,61 @@ var workspaceService = {
     this._workspaceVideoStreamsInFlight.set(cacheKey, fetchPromise);
     return fetchPromise;
   },
+  async getWorkspaceCameraIps(params) {
+    const workspaceIds = (params.workspaceIds || []).filter(Boolean);
+    const lineIds = (params.lineIds || []).filter(Boolean);
+    const force = params.force ?? false;
+    if (!workspaceIds.length && !lineIds.length) {
+      return {};
+    }
+    const workspaceKey = workspaceIds.slice().sort().join(",");
+    const lineKey = lineIds.slice().sort().join(",");
+    const cacheKey = workspaceKey ? `workspaces:${workspaceKey}` : `lines:${lineKey}`;
+    const now4 = Date.now();
+    const cached = this._workspaceCameraIpsCache.get(cacheKey);
+    if (!force && cached && now4 - cached.timestamp < this._workspaceCameraIpsCacheExpiryMs) {
+      return cached.cameraIps;
+    }
+    const inFlight = this._workspaceCameraIpsInFlight.get(cacheKey);
+    if (!force && inFlight) {
+      return inFlight;
+    }
+    const fetchPromise = (async () => {
+      try {
+        const token = await getAuthToken2();
+        const apiUrl = getBackendUrl2();
+        const response = await fetch(`${apiUrl}/api/workspaces/camera-ips`, {
+          method: "POST",
+          headers: {
+            "Authorization": `Bearer ${token}`,
+            "Content-Type": "application/json"
+          },
+          body: JSON.stringify({
+            workspace_ids: workspaceIds.length ? workspaceIds : void 0,
+            line_ids: lineIds.length ? lineIds : void 0
+          })
+        });
+        if (!response.ok) {
+          const errorText = await response.text();
+          throw new Error(`Backend API error (${response.status}): ${errorText}`);
+        }
+        const data = await response.json();
+        const cameraIps = data.camera_ips || {};
+        this._workspaceCameraIpsCache.set(cacheKey, {
+          cameraIps,
+          timestamp: Date.now()
+        });
+        return cameraIps;
+      } catch (error) {
+        console.error("Error fetching workspace camera IPs:", error);
+        throw error;
+      } finally {
+        this._workspaceCameraIpsInFlight.delete(cacheKey);
+      }
+    })();
+    this._workspaceCameraIpsInFlight.set(cacheKey, fetchPromise);
+    return fetchPromise;
+  },
   /**
    * Fetches workspace display names from the database
    * Returns a map of workspace_id -> display_name
@@ -8480,7 +8544,8 @@ var LinesService = class {
         videoGridMetricMode: normalizeVideoGridMetricMode(
           line.video_grid_metric_mode,
           line.assembly ?? false
-        )
+        ),
+        recentFlowWindowMinutes: line.recent_flow_window_minutes ?? 7
       }));
     } catch (error) {
       console.error("Error fetching lines:", error);
@@ -8528,7 +8593,8 @@ var LinesService = class {
         videoGridMetricMode: normalizeVideoGridMetricMode(
           line.video_grid_metric_mode,
           line.assembly ?? false
-        )
+        ),
+        recentFlowWindowMinutes: line.recent_flow_window_minutes ?? 7
       }));
     } catch (error) {
       console.error("Error fetching all lines:", error);
@@ -8585,7 +8651,8 @@ var LinesService = class {
         videoGridMetricMode: normalizeVideoGridMetricMode(
           data.video_grid_metric_mode,
           data.assembly ?? false
-        )
+        ),
+        recentFlowWindowMinutes: data.recent_flow_window_minutes ?? 7
       };
     } catch (error) {
       console.error("Error fetching line:", error);
@@ -11123,7 +11190,7 @@ var useMobileMenu = () => {
 };
 var useHideMobileHeader = (shouldHide = true) => {
   const context = useMobileMenu();
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     if (context && shouldHide) {
       context.setHideMobileHeader(true);
       return () => {
@@ -13339,6 +13406,7 @@ var useDashboardMetrics = ({ onLineMetricsUpdate, lineId, userAccessibleLineIds
             actionName: item.action_name
           }),
           recent_flow_percent: item.recent_flow_percent ?? null,
+          recent_flow_window_minutes: item.recent_flow_window_minutes ?? null,
           recent_flow_effective_end_at: item.recent_flow_effective_end_at ?? null,
           recent_flow_computed_at: item.recent_flow_computed_at ?? null,
           incoming_wip_current: item.incoming_wip_current ?? null,
@@ -19883,6 +19951,53 @@ function useCompanyClipsCost() {
     refetch: fetchData
   };
 }
+function useCompanyHasVlmEnabledLine(options = {}) {
+  const { enabled = true } = options;
+  const { user } = useAuth();
+  const supabase = useSupabase();
+  const entityConfig = useEntityConfig();
+  const [hasVlmEnabledLine, setHasVlmEnabledLine] = useState(false);
+  const [isLoading, setIsLoading] = useState(enabled);
+  const companyId = user?.properties?.company_id || user?.company_id || entityConfig.companyId;
+  useEffect(() => {
+    let isCancelled = false;
+    const load = async () => {
+      if (!enabled || !companyId || !supabase) {
+        setHasVlmEnabledLine(false);
+        setIsLoading(false);
+        return;
+      }
+      setIsLoading(true);
+      try {
+        const { data, error } = await supabase.from("lines").select("id").eq("company_id", companyId).eq("idle_time_vlm_enabled", true).limit(1);
+        if (error) {
+          throw error;
+        }
+        if (isCancelled) {
+          return;
+        }
+        setHasVlmEnabledLine((data?.length || 0) > 0);
+      } catch (error) {
+        console.error("[useCompanyHasVlmEnabledLine] Error:", error);
+        if (!isCancelled) {
+          setHasVlmEnabledLine(false);
+        }
+      } finally {
+        if (!isCancelled) {
+          setIsLoading(false);
+        }
+      }
+    };
+    void load();
+    return () => {
+      isCancelled = true;
+    };
+  }, [companyId, enabled, supabase]);
+  return {
+    hasVlmEnabledLine,
+    isLoading
+  };
+}
 
 // src/lib/utils/api.ts
 var apiUtils = {
@@ -23115,7 +23230,7 @@ var MotionConfigContext = createContext({
 });
 
 // ../../node_modules/framer-motion/dist/es/components/AnimatePresence/PopChild.mjs
-var PopChildMeasure = class extends React141.Component {
+var PopChildMeasure = class extends React142.Component {
   getSnapshotBeforeUpdate(prevProps) {
     const element = this.props.childRef.current;
     if (element && prevProps.isPresent && !this.props.isPresent) {
@@ -23170,7 +23285,7 @@ function PopChild({ children, isPresent }) {
       document.head.removeChild(style);
     };
   }, [isPresent]);
-  return jsx(PopChildMeasure, { isPresent, childRef: ref, sizeRef: size, children: React141.cloneElement(children, { ref }) });
+  return jsx(PopChildMeasure, { isPresent, childRef: ref, sizeRef: size, children: React142.cloneElement(children, { ref }) });
 }
 
 // ../../node_modules/framer-motion/dist/es/components/AnimatePresence/PresenceChild.mjs
@@ -23207,7 +23322,7 @@ var PresenceChild = ({ children, initial, isPresent, onExitComplete, custom, pre
   useMemo(() => {
     presenceChildren.forEach((_, key) => presenceChildren.set(key, false));
   }, [isPresent]);
-  React141.useEffect(() => {
+  React142.useEffect(() => {
     !isPresent && !presenceChildren.size && onExitComplete && onExitComplete();
   }, [isPresent]);
   if (mode === "popLayout") {
@@ -30992,7 +31107,7 @@ var withAuth = (WrappedComponent2, options) => {
     requireAuth: true,
     ...options
   };
-  const WithAuthComponent = React141.memo(function WithAuthComponent2(props) {
+  const WithAuthComponent = React142.memo(function WithAuthComponent2(props) {
     const {
       session,
       user,
@@ -31003,9 +31118,9 @@ var withAuth = (WrappedComponent2, options) => {
       retrySessionHydration
     } = useAuth();
     const router = useRouter();
-    const [localLoading, setLocalLoading] = React141.useState(loading);
-    const [loadingTimeoutReached, setLoadingTimeoutReached] = React141.useState(false);
-    React141.useEffect(() => {
+    const [localLoading, setLocalLoading] = React142.useState(loading);
+    const [loadingTimeoutReached, setLoadingTimeoutReached] = React142.useState(false);
+    React142.useEffect(() => {
       if (process.env.NODE_ENV === "development" && process.env.DEBUG_AUTH === "true") {
         console.log("withAuth state:", {
           loading,
@@ -31017,7 +31132,7 @@ var withAuth = (WrappedComponent2, options) => {
         });
       }
     }, [authStatus, error, loading, session, user]);
-    const handleLoadingTimeout = React141.useCallback(() => {
+    const handleLoadingTimeout = React142.useCallback(() => {
       console.warn("[withAuth] Loading timeout reached");
       setLoadingTimeoutReached(true);
       if (hasStoredSupabaseSession()) {
@@ -31029,13 +31144,13 @@ var withAuth = (WrappedComponent2, options) => {
         router.replace(defaultOptions.redirectTo);
       }
     }, [retrySessionHydration, router]);
-    React141.useEffect(() => {
+    React142.useEffect(() => {
       if (!loading && authStatus !== "recovering" && defaultOptions.requireAuth && !session && !error) {
         console.log("[withAuth] No session found, redirecting to login");
         router.replace(defaultOptions.redirectTo);
       }
     }, [authStatus, defaultOptions.requireAuth, error, loading, router, session]);
-    React141.useEffect(() => {
+    React142.useEffect(() => {
       setLocalLoading(loading);
     }, [loading]);
     if (loading || localLoading) {
@@ -32034,11 +32149,11 @@ var BarChartComponent = ({
   aspect = 2,
   ...restOfChartProps
 }) => {
-  const containerRef = React141__default.useRef(null);
-  const [containerReady, setContainerReady] = React141__default.useState(false);
+  const containerRef = React142__default.useRef(null);
+  const [containerReady, setContainerReady] = React142__default.useState(false);
   const themeConfig = useThemeConfig();
   const { formatNumber } = useFormatNumber();
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     const checkContainerDimensions = () => {
       if (containerRef.current) {
         const rect = containerRef.current.getBoundingClientRect();
@@ -32152,7 +32267,7 @@ var BarChartComponent = ({
   }
   return /* @__PURE__ */ jsx("div", { className: clsx("w-full", className), children: chartContent });
 };
-var BarChart = React141__default.memo(BarChartComponent, (prevProps, nextProps) => {
+var BarChart = React142__default.memo(BarChartComponent, (prevProps, nextProps) => {
   if (prevProps.xAxisDataKey !== nextProps.xAxisDataKey || prevProps.xAxisLabel !== nextProps.xAxisLabel || prevProps.yAxisLabel !== nextProps.yAxisLabel || prevProps.yAxisUnit !== nextProps.yAxisUnit || JSON.stringify(prevProps.referenceLines || []) !== JSON.stringify(nextProps.referenceLines || []) || prevProps.layout !== nextProps.layout || prevProps.className !== nextProps.className || prevProps.showGrid !== nextProps.showGrid || prevProps.showLegend !== nextProps.showLegend || prevProps.showTooltip !== nextProps.showTooltip || prevProps.responsive !== nextProps.responsive || prevProps.aspect !== nextProps.aspect) {
     return false;
   }
@@ -32203,10 +32318,10 @@ var LineChartComponent = ({
   fillContainer = false,
   ...restOfChartProps
 }) => {
-  const containerRef = React141__default.useRef(null);
-  const [dimensions, setDimensions] = React141__default.useState({ width: 0, height: 0 });
-  const [hasValidData, setHasValidData] = React141__default.useState(false);
-  React141__default.useEffect(() => {
+  const containerRef = React142__default.useRef(null);
+  const [dimensions, setDimensions] = React142__default.useState({ width: 0, height: 0 });
+  const [hasValidData, setHasValidData] = React142__default.useState(false);
+  React142__default.useEffect(() => {
     const currentHasValidData = data && lines && lines.length > 0 && data.some(
       (item) => lines.some((line) => {
         const val = item[line.dataKey];
@@ -32217,7 +32332,7 @@ var LineChartComponent = ({
       setHasValidData(true);
     }
   }, [data, lines, hasValidData]);
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     if (!containerRef.current) return;
     const observer = new ResizeObserver((entries) => {
       const entry = entries[0];
@@ -32342,7 +32457,7 @@ var LineChartComponent = ({
   }
   return /* @__PURE__ */ jsx("div", { className: clsx("w-full", className), children: renderChartContent(restOfChartProps.width, restOfChartProps.height) });
 };
-var LineChart = React141__default.memo(LineChartComponent, (prevProps, nextProps) => {
+var LineChart = React142__default.memo(LineChartComponent, (prevProps, nextProps) => {
   if (prevProps.xAxisDataKey !== nextProps.xAxisDataKey || prevProps.xAxisLabel !== nextProps.xAxisLabel || prevProps.yAxisLabel !== nextProps.yAxisLabel || prevProps.yAxisUnit !== nextProps.yAxisUnit || prevProps.className !== nextProps.className || prevProps.showGrid !== nextProps.showGrid || prevProps.showLegend !== nextProps.showLegend || prevProps.showTooltip !== nextProps.showTooltip || prevProps.responsive !== nextProps.responsive || prevProps.aspect !== nextProps.aspect || JSON.stringify(prevProps.yAxisDomain) !== JSON.stringify(nextProps.yAxisDomain)) {
     return false;
   }
@@ -32436,7 +32551,7 @@ var OutputProgressChartComponent = ({
     ] }) })
   ] }) });
 };
-var OutputProgressChart = React141__default.memo(OutputProgressChartComponent);
+var OutputProgressChart = React142__default.memo(OutputProgressChartComponent);
 OutputProgressChart.displayName = "OutputProgressChart";
 var LargeOutputProgressChart = ({
   currentOutput,
@@ -32576,7 +32691,7 @@ var CycleTimeChartComponent = ({
     }
   ) }) });
 };
-var CycleTimeChart = React141__default.memo(CycleTimeChartComponent, (prevProps, nextProps) => {
+var CycleTimeChart = React142__default.memo(CycleTimeChartComponent, (prevProps, nextProps) => {
   if (prevProps.className !== nextProps.className) {
     return false;
   }
@@ -32595,6 +32710,212 @@ var CycleTimeChart = React141__default.memo(CycleTimeChartComponent, (prevProps,
   });
 });
 CycleTimeChart.displayName = "CycleTimeChart";
+
+// src/lib/utils/hourlyIdle.ts
+var DEFAULT_SHIFT_DURATION = 11;
+var normalizeMinuteSeries = (idleTimeHourly) => {
+  if (!idleTimeHourly || typeof idleTimeHourly !== "object") {
+    return {};
+  }
+  return Object.fromEntries(
+    Object.entries(idleTimeHourly).map(([key, value]) => {
+      if (Array.isArray(value)) {
+        return [key, value];
+      }
+      if (value && Array.isArray(value.values)) {
+        return [key, value.values];
+      }
+      return [key, []];
+    })
+  );
+};
+var parseTimeString = (timeValue) => {
+  const [hoursPart, minutesPart] = timeValue.split(":");
+  const hour = Number.parseInt(hoursPart, 10);
+  const minute = Number.parseInt(minutesPart ?? "0", 10);
+  const safeHour = Number.isFinite(hour) ? hour : 0;
+  const safeMinute = Number.isFinite(minute) ? minute : 0;
+  return {
+    hour: safeHour,
+    minute: safeMinute,
+    decimalHour: safeHour + safeMinute / 60
+  };
+};
+var buildShiftLayout = ({
+  shiftStart,
+  shiftEnd
+}) => {
+  const shiftStartTime = parseTimeString(shiftStart);
+  if (!shiftEnd) {
+    return {
+      shiftDuration: DEFAULT_SHIFT_DURATION,
+      shiftStartTime,
+      shiftEndTime: null,
+      hasPartialLastHour: false
+    };
+  }
+  const shiftEndTime = parseTimeString(shiftEnd);
+  let duration = shiftEndTime.decimalHour - shiftStartTime.decimalHour;
+  if (duration <= 0) {
+    duration += 24;
+  }
+  const hasPartialLastHour = shiftEndTime.minute > 0 && shiftEndTime.minute < 60;
+  const shiftDuration = hasPartialLastHour ? Math.ceil(duration) : Math.round(duration);
+  return {
+    shiftDuration,
+    shiftStartTime,
+    shiftEndTime,
+    hasPartialLastHour
+  };
+};
+var formatCompactTime = (hour, minute) => {
+  const period = hour >= 12 ? "PM" : "AM";
+  const hour12 = hour === 0 ? 12 : hour > 12 ? hour - 12 : hour;
+  if (minute === 0) {
+    return `${hour12}${period}`;
+  }
+  return `${hour12}:${minute.toString().padStart(2, "0")}${period}`;
+};
+var formatFullTime = (hour, minute) => {
+  const period = hour >= 12 ? "PM" : "AM";
+  const hour12 = hour === 0 ? 12 : hour > 12 ? hour - 12 : hour;
+  return `${hour12}:${minute.toString().padStart(2, "0")} ${period}`;
+};
+var getSlotTimeBounds = (hourIndex, layout2) => {
+  const isLastHour = hourIndex === layout2.shiftDuration - 1;
+  const startDecimalHour = layout2.shiftStartTime.decimalHour + hourIndex;
+  const startHour = Math.floor(startDecimalHour) % 24;
+  const startMinute = Math.round(startDecimalHour % 1 * 60);
+  let endHour;
+  let endMinute;
+  if (isLastHour && layout2.shiftEndTime) {
+    endHour = layout2.shiftEndTime.hour;
+    endMinute = layout2.shiftEndTime.minute;
+  } else {
+    const endDecimalHour = startDecimalHour + 1;
+    endHour = Math.floor(endDecimalHour) % 24;
+    endMinute = Math.round(endDecimalHour % 1 * 60);
+  }
+  return {
+    startHour,
+    startMinute,
+    endHour,
+    endMinute
+  };
+};
+var getIdleArrayForHour = (hourIndex, idleTimeHourly, layout2) => {
+  const actualHour = (layout2.shiftStartTime.hour + hourIndex) % 24;
+  const startMinute = layout2.shiftStartTime.minute;
+  if (startMinute > 0) {
+    if (hourIndex === 0) {
+      const firstHourData = idleTimeHourly[actualHour.toString()] || [];
+      const nextHourData2 = idleTimeHourly[((actualHour + 1) % 24).toString()] || [];
+      return [
+        ...firstHourData.slice(startMinute),
+        ...nextHourData2.slice(0, startMinute)
+      ];
+    }
+    if (hourIndex < layout2.shiftDuration - 1) {
+      const currentHourData3 = idleTimeHourly[actualHour.toString()] || [];
+      const nextHourData2 = idleTimeHourly[((actualHour + 1) % 24).toString()] || [];
+      return [
+        ...currentHourData3.slice(startMinute),
+        ...nextHourData2.slice(0, startMinute)
+      ];
+    }
+    if (layout2.hasPartialLastHour && layout2.shiftEndTime) {
+      const currentHourData3 = idleTimeHourly[actualHour.toString()] || [];
+      const nextHourData2 = idleTimeHourly[((actualHour + 1) % 24).toString()] || [];
+      return [
+        ...currentHourData3.slice(startMinute),
+        ...nextHourData2.slice(0, layout2.shiftEndTime.minute)
+      ];
+    }
+    const currentHourData2 = idleTimeHourly[actualHour.toString()] || [];
+    const nextHourData = idleTimeHourly[((actualHour + 1) % 24).toString()] || [];
+    return [
+      ...currentHourData2.slice(startMinute),
+      ...nextHourData.slice(0, startMinute)
+    ];
+  }
+  const currentHourData = idleTimeHourly[actualHour.toString()] || [];
+  if (hourIndex === layout2.shiftDuration - 1 && layout2.hasPartialLastHour && layout2.shiftEndTime) {
+    return currentHourData.slice(0, layout2.shiftEndTime.minute);
+  }
+  return currentHourData;
+};
+var buildHourlyIdleSlots = ({
+  idleTimeHourly,
+  shiftStart,
+  shiftEnd
+}) => {
+  const normalizedIdleTimeHourly = normalizeMinuteSeries(idleTimeHourly);
+  const layout2 = buildShiftLayout({ shiftStart, shiftEnd });
+  return Array.from({ length: layout2.shiftDuration }, (_, hourIndex) => {
+    const { startHour, startMinute, endHour, endMinute } = getSlotTimeBounds(hourIndex, layout2);
+    const idleArray = getIdleArrayForHour(hourIndex, normalizedIdleTimeHourly, layout2);
+    const idleMinutes = idleArray.filter((value) => value === 1 || value === "1").length;
+    return {
+      hourIndex,
+      hour: `${formatCompactTime(startHour, startMinute)}-${formatCompactTime(endHour, endMinute)}`,
+      timeRange: `${formatFullTime(startHour, startMinute)} - ${formatFullTime(endHour, endMinute)}`,
+      idleMinutes,
+      idleArray
+    };
+  });
+};
+var formatIdleTimestamp = ({
+  shiftStart,
+  hourIndex,
+  minuteIndex
+}) => {
+  const shiftStartTime = parseTimeString(shiftStart);
+  const totalMinutes = (shiftStartTime.hour + hourIndex) * 60 + shiftStartTime.minute + minuteIndex;
+  const hour = Math.floor(totalMinutes / 60) % 24;
+  const minute = totalMinutes % 60;
+  return formatFullTime(hour, minute);
+};
+var getHourlyIdlePeriods = ({
+  idleArray,
+  shiftStart,
+  hourIndex
+}) => {
+  if (!Array.isArray(idleArray) || idleArray.length === 0) {
+    return [];
+  }
+  const periods = [];
+  let currentRange = null;
+  idleArray.forEach((value, minuteIndex) => {
+    if (value === 1 || value === "1") {
+      if (!currentRange) {
+        currentRange = { start: minuteIndex, end: minuteIndex };
+      } else {
+        currentRange.end = minuteIndex;
+      }
+    } else if (value !== "x" && currentRange) {
+      periods.push(currentRange);
+      currentRange = null;
+    }
+  });
+  if (currentRange) {
+    periods.push(currentRange);
+  }
+  return periods.map((period) => ({
+    start: period.start,
+    end: period.end,
+    duration: period.end - period.start + 1,
+    startTime: formatIdleTimestamp({
+      shiftStart,
+      hourIndex,
+      minuteIndex: period.start
+    }),
+    endTime: formatIdleTimestamp({
+      shiftStart,
+      hourIndex,
+      minuteIndex: period.end + 1
+    })
+  }));
+};
 var CycleTimeOverTimeChart = ({
   data,
   idealCycleTime,
@@ -32604,19 +32925,20 @@ var CycleTimeOverTimeChart = ({
   datasetKey,
   className = "",
   showIdleTime = false,
-  idleTimeData = []
+  idleTimeData = [],
+  idleTimeSlots = []
 }) => {
   const MAX_DATA_POINTS = 40;
-  const containerRef = React141__default.useRef(null);
-  const [dimensions, setDimensions] = React141__default.useState({ width: 0, height: 0 });
-  const [hasValidData, setHasValidData] = React141__default.useState(false);
-  React141__default.useEffect(() => {
+  const containerRef = React142__default.useRef(null);
+  const [dimensions, setDimensions] = React142__default.useState({ width: 0, height: 0 });
+  const [hasValidData, setHasValidData] = React142__default.useState(false);
+  React142__default.useEffect(() => {
     const currentHasValidData = data && data.some((val) => val !== null && val > 0);
     if (currentHasValidData && !hasValidData) {
       setHasValidData(true);
     }
   }, [data, hasValidData]);
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     if (!containerRef.current) return;
     const observer = new ResizeObserver((entries) => {
       const entry = entries[0];
@@ -32648,7 +32970,7 @@ var CycleTimeOverTimeChart = ({
     const endLabel = shiftEnd && slotIndex === DURATION - 1 ? formatHourLabel(slotIndex + 1) : formatHourLabel(slotIndex + 1);
     return `${startLabel} - ${endLabel}`;
   };
-  const getDisplayData = React141__default.useCallback((rawData) => {
+  const getDisplayData = React142__default.useCallback((rawData) => {
     if (xAxisMode === "hourly") return rawData;
     return rawData.slice(Math.max(0, rawData.length - MAX_DATA_POINTS));
   }, [xAxisMode]);
@@ -32656,7 +32978,7 @@ var CycleTimeOverTimeChart = ({
   const DURATION = displayData.length;
   const effectiveDatasetKey = datasetKey || `cycle-time:${xAxisMode}`;
   const finalData = displayData;
-  const labelInterval = React141__default.useMemo(() => {
+  const labelInterval = React142__default.useMemo(() => {
     if (xAxisMode === "hourly") {
       return Math.max(1, Math.ceil(DURATION / 8));
     }
@@ -32697,8 +33019,8 @@ var CycleTimeOverTimeChart = ({
       return `${minutes} minutes ${seconds} seconds ago`;
     }
   };
-  const getNumericValue = React141__default.useCallback((value) => typeof value === "number" && Number.isFinite(value) ? value : null, []);
-  const renderChartTooltip = React141__default.useCallback((tooltipProps) => {
+  const getNumericValue = React142__default.useCallback((value) => typeof value === "number" && Number.isFinite(value) ? value : null, []);
+  const renderChartTooltip = React142__default.useCallback((tooltipProps) => {
     const { active, payload } = tooltipProps;
     if (!active || !Array.isArray(payload) || payload.length === 0) {
       return null;
@@ -32707,51 +33029,61 @@ var CycleTimeOverTimeChart = ({
     if (!visibleEntries.length) {
       return null;
     }
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        style: {
-          backgroundColor: "white",
-          border: "none",
-          borderRadius: "8px",
-          boxShadow: "0 4px 12px rgba(0,0,0,0.1)",
-          padding: "8px 12px",
-          fontSize: "13px"
-        },
-        children: [
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              style: {
-                color: "#374151",
-                fontWeight: 600,
-                marginBottom: "4px"
-              },
-              children: payload[0]?.payload?.tooltip || ""
-            }
-          ),
-          visibleEntries.map((entry) => {
-            const numericValue = getNumericValue(entry.value);
-            if (numericValue === null) {
-              return null;
-            }
-            return /* @__PURE__ */ jsx(
-              "div",
-              {
-                style: {
-                  color: "#4B5563",
-                  padding: "2px 0"
-                },
-                children: entry.name === "idleMinutes" ? `Idle Time: ${numericValue.toFixed(0)} minutes` : `Cycle Time: ${numericValue.toFixed(1)} seconds`
-              },
-              `${entry.name}-${numericValue}`
-            );
-          })
-        ]
-      }
-    );
-  }, [getNumericValue]);
-  const renderCycleDot = React141__default.useCallback((props) => {
+    const dataPoint = payload[0]?.payload || {};
+    const idlePeriods = showIdleTime && typeof dataPoint.idleMinutes === "number" && dataPoint.idleMinutes > 0 ? getHourlyIdlePeriods({
+      idleArray: dataPoint.idleArray,
+      shiftStart,
+      hourIndex: Number.isFinite(dataPoint.hourIndex) ? dataPoint.hourIndex : 0
+    }) : [];
+    return /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-xl shadow-xl border border-gray-100 p-4 min-w-[220px]", children: [
+      /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between mb-3", children: /* @__PURE__ */ jsx("p", { className: "font-semibold text-gray-900 text-sm", children: dataPoint.timeRange || dataPoint.tooltip || "" }) }),
+      /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
+        visibleEntries.map((entry) => {
+          const numericValue = getNumericValue(entry.value);
+          if (numericValue === null) {
+            return null;
+          }
+          if (entry.name === "idleMinutes") {
+            if (!showIdleTime) return null;
+            return /* @__PURE__ */ jsx("div", { className: "border-t border-gray-100 pt-2", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-sm text-gray-500", children: "Idle Time" }),
+              /* @__PURE__ */ jsxs("span", { className: "font-semibold text-orange-600 text-sm", children: [
+                numericValue.toFixed(0),
+                " minutes"
+              ] })
+            ] }) }, `${entry.name}-${numericValue}`);
+          }
+          return /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-sm text-gray-500", children: "Cycle Time" }),
+            /* @__PURE__ */ jsxs("span", { className: "font-semibold text-gray-900 text-sm", children: [
+              numericValue.toFixed(1),
+              " seconds"
+            ] })
+          ] }, `${entry.name}-${numericValue}`);
+        }),
+        idlePeriods.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mt-3 bg-gray-50 rounded-lg p-2.5", children: [
+          /* @__PURE__ */ jsx("p", { className: "font-medium text-gray-700 text-xs mb-2", children: "Idle periods:" }),
+          /* @__PURE__ */ jsx("div", { className: "space-y-1 max-h-32 overflow-y-auto pr-1", children: idlePeriods.map((period, index) => /* @__PURE__ */ jsxs("div", { className: "text-gray-600 flex items-center gap-2 text-xs", children: [
+            /* @__PURE__ */ jsx("span", { className: "inline-block w-1.5 h-1.5 bg-orange-400 rounded-full flex-shrink-0" }),
+            /* @__PURE__ */ jsx("span", { children: period.duration === 1 ? /* @__PURE__ */ jsxs(Fragment, { children: [
+              period.startTime,
+              " (",
+              period.duration,
+              " min)"
+            ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+              period.startTime,
+              " - ",
+              period.endTime,
+              " (",
+              period.duration,
+              " mins)"
+            ] }) })
+          ] }, index)) })
+        ] })
+      ] })
+    ] });
+  }, [getNumericValue, shiftStart, showIdleTime]);
+  const renderCycleDot = React142__default.useCallback((props) => {
     const { cx: cx2, cy, payload } = props;
     const cycleTime = getNumericValue(payload?.cycleTime);
     if (cycleTime === null) {
@@ -32784,7 +33116,7 @@ var CycleTimeOverTimeChart = ({
       }
     );
   }, [getNumericValue, idealCycleTime]);
-  const renderCycleActiveDot = React141__default.useCallback((props) => {
+  const renderCycleActiveDot = React142__default.useCallback((props) => {
     const { cx: cx2, cy, payload } = props;
     const cycleTime = getNumericValue(payload?.cycleTime);
     if (cycleTime === null) {
@@ -32805,7 +33137,7 @@ var CycleTimeOverTimeChart = ({
       }
     );
   }, [getNumericValue, idealCycleTime]);
-  const renderIdleDot = React141__default.useCallback((props) => {
+  const renderIdleDot = React142__default.useCallback((props) => {
     const { cx: cx2, cy, payload } = props;
     const idleMinutes = getNumericValue(payload?.idleMinutes);
     if (idleMinutes === null) {
@@ -32819,14 +33151,18 @@ var CycleTimeOverTimeChart = ({
         r: 4,
         fill: "#f59e0b",
         stroke: "#fff",
-        strokeWidth: 1
+        strokeWidth: 1,
+        style: {
+          opacity: showIdleTime ? 1 : 0,
+          transition: "opacity 0.3s ease-in-out"
+        }
       }
     );
-  }, [getNumericValue]);
-  const renderIdleActiveDot = React141__default.useCallback((props) => {
+  }, [getNumericValue, showIdleTime]);
+  const renderIdleActiveDot = React142__default.useCallback((props) => {
     const { cx: cx2, cy, payload } = props;
     const idleMinutes = getNumericValue(payload?.idleMinutes);
-    if (idleMinutes === null) {
+    if (idleMinutes === null || !showIdleTime) {
       return /* @__PURE__ */ jsx("g", {});
     }
     return /* @__PURE__ */ jsx(
@@ -32840,25 +33176,40 @@ var CycleTimeOverTimeChart = ({
         strokeWidth: 2
       }
     );
-  }, [getNumericValue]);
-  const chartData = React141__default.useMemo(() => Array.from({ length: DURATION }, (_, i) => {
+  }, [getNumericValue, showIdleTime]);
+  const chartData = React142__default.useMemo(() => Array.from({ length: DURATION }, (_, i) => {
     const cycleTime = getNumericValue(finalData[i]);
-    const idleMinutes = showIdleTime ? getNumericValue(idleTimeData[i]) : null;
+    const useIdleSlots = idleTimeSlots.length > 0;
+    const idleSlot = useIdleSlots ? idleTimeSlots[i] ?? null : null;
+    const idleMinutes = useIdleSlots ? idleSlot?.idleMinutes ?? null : getNumericValue(idleTimeData[i]);
     return {
       timeIndex: i,
       label: formatTimeLabel(i),
-      tooltip: formatTooltipTime(i),
+      tooltip: idleSlot?.timeRange || formatTooltipTime(i),
+      timeRange: idleSlot?.timeRange || formatTooltipTime(i),
+      hourIndex: idleSlot?.hourIndex ?? i,
       cycleTime,
       idleMinutes,
+      idleArray: idleSlot?.idleArray || [],
       color: cycleTime !== null && cycleTime <= idealCycleTime ? "#00AB45" : "#E34329"
     };
-  }), [DURATION, finalData, showIdleTime, idleTimeData, idealCycleTime, getNumericValue]);
+  }), [DURATION, finalData, idleTimeData, idleTimeSlots, idealCycleTime, getNumericValue]);
   const renderLegend = () => {
-    if (!showIdleTime) return null;
-    return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-start text-[10px] font-bold text-gray-500 mb-6 tracking-[0.05em] gap-5", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
-      /* @__PURE__ */ jsx("div", { className: "w-2.5 h-2.5 rounded-full bg-[#f59e0b]" }),
-      /* @__PURE__ */ jsx("span", { children: "Idle Time (min)" })
-    ] }) });
+    return /* @__PURE__ */ jsx(
+      "div",
+      {
+        className: "flex items-center justify-start text-[10px] font-bold text-gray-500 mb-6 tracking-[0.05em] gap-5",
+        style: {
+          opacity: showIdleTime ? 1 : 0,
+          pointerEvents: showIdleTime ? "auto" : "none",
+          transition: "opacity 0.3s ease-in-out"
+        },
+        children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+          /* @__PURE__ */ jsx("div", { className: "w-2.5 h-2.5 rounded-full bg-[#f59e0b]" }),
+          /* @__PURE__ */ jsx("span", { children: "Idle Time (min)" })
+        ] })
+      }
+    );
   };
   return /* @__PURE__ */ jsxs(
     "div",
@@ -32929,7 +33280,7 @@ var CycleTimeOverTimeChart = ({
                       }
                     }
                   ),
-                  showIdleTime && /* @__PURE__ */ jsx(
+                  /* @__PURE__ */ jsx(
                     YAxis,
                     {
                       yAxisId: "idle",
@@ -32938,7 +33289,11 @@ var CycleTimeOverTimeChart = ({
                       width: 35,
                       domain: [0, 60],
                       tickFormatter: (value) => `${value}m`,
-                      tick: { fontSize: 11, fill: "#f59e0b" },
+                      tick: {
+                        fontSize: 11,
+                        fill: showIdleTime ? "#f59e0b" : "transparent",
+                        style: { transition: "fill 0.3s ease-in-out" }
+                      },
                       axisLine: false,
                       tickLine: false
                     }
@@ -32986,7 +33341,7 @@ var CycleTimeOverTimeChart = ({
                     },
                     `${effectiveDatasetKey}:cycle`
                   ),
-                  showIdleTime && /* @__PURE__ */ jsx(
+                  /* @__PURE__ */ jsx(
                     Line,
                     {
                       type: "monotone",
@@ -33001,7 +33356,11 @@ var CycleTimeOverTimeChart = ({
                       isAnimationActive: true,
                       animationBegin: 300,
                       animationDuration: 1500,
-                      animationEasing: "ease-out"
+                      animationEasing: "ease-out",
+                      style: {
+                        strokeOpacity: showIdleTime ? 1 : 0,
+                        transition: "stroke-opacity 0.3s ease-in-out"
+                      }
                     },
                     `${effectiveDatasetKey}:idle`
                   )
@@ -33015,7 +33374,7 @@ var CycleTimeOverTimeChart = ({
     }
   );
 };
-var Card = React141.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var Card = React142.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "div",
   {
     ref,
@@ -33027,7 +33386,7 @@ var Card = React141.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */
   }
 ));
 Card.displayName = "Card";
-var CardHeader = React141.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardHeader = React142.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "div",
   {
     ref,
@@ -33036,7 +33395,7 @@ var CardHeader = React141.forwardRef(({ className, ...props }, ref) => /* @__PUR
   }
 ));
 CardHeader.displayName = "CardHeader";
-var CardTitle = React141.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardTitle = React142.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "h3",
   {
     ref,
@@ -33048,7 +33407,7 @@ var CardTitle = React141.forwardRef(({ className, ...props }, ref) => /* @__PURE
   }
 ));
 CardTitle.displayName = "CardTitle";
-var CardDescription = React141.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardDescription = React142.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "p",
   {
     ref,
@@ -33057,9 +33416,9 @@ var CardDescription = React141.forwardRef(({ className, ...props }, ref) => /* @
   }
 ));
 CardDescription.displayName = "CardDescription";
-var CardContent = React141.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("p-6 pt-0", className), ...props }));
+var CardContent = React142.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx("div", { ref, className: cn("p-6 pt-0", className), ...props }));
 CardContent.displayName = "CardContent";
-var CardFooter = React141.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var CardFooter = React142.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   "div",
   {
     ref,
@@ -33135,7 +33494,7 @@ var buttonVariants = cva(
     }
   }
 );
-var Button = React141.forwardRef(
+var Button = React142.forwardRef(
   ({ className, variant, size, asChild = false, ...props }, ref) => {
     const Comp = asChild ? Slot : "button";
     return /* @__PURE__ */ jsx(
@@ -33156,95 +33515,26 @@ var HourlyOutputChartComponent = ({
   shiftEnd,
   showIdleTime = false,
   idleTimeHourly,
-  idleTimeClips,
-  idleTimeClipClassifications,
-  shiftDate,
-  timezone,
   className = ""
 }) => {
-  const containerRef = React141__default.useRef(null);
-  const [containerReady, setContainerReady] = React141__default.useState(false);
-  const [containerWidth, setContainerWidth] = React141__default.useState(0);
-  const getTimeFromTimeString2 = (timeStr) => {
-    const [hours, minutes] = timeStr.split(":");
-    const hour = parseInt(hours);
-    const minute = parseInt(minutes || "0");
-    const decimalHour = hour + minute / 60;
-    return { hour, minute, decimalHour };
-  };
-  const shiftStartTime = getTimeFromTimeString2(shiftStart);
-  React141__default.useMemo(() => {
-    if (!shiftDate || !timezone) return null;
-    const hour = shiftStartTime.hour.toString().padStart(2, "0");
-    const minute = shiftStartTime.minute.toString().padStart(2, "0");
-    return fromZonedTime(`${shiftDate}T${hour}:${minute}:00`, timezone);
-  }, [shiftDate, timezone, shiftStartTime.hour, shiftStartTime.minute]);
-  const idleClipRanges = React141__default.useMemo(() => {
-    if (!idleTimeClips || idleTimeClips.length === 0) return [];
-    return idleTimeClips.map((clip) => ({
-      id: clip.id,
-      start: clip.idle_start_time ? new Date(clip.idle_start_time) : null,
-      end: clip.idle_end_time ? new Date(clip.idle_end_time) : null
-    })).filter((clip) => clip.start && clip.end);
-  }, [idleTimeClips]);
-  React141__default.useCallback((rangeStart, rangeEnd) => {
-    if (!rangeStart || !rangeEnd || idleClipRanges.length === 0) {
-      return "Reason unavailable";
-    }
-    const matchingClip = idleClipRanges.find((clip) => rangeStart >= clip.start && rangeEnd <= clip.end) || idleClipRanges.find((clip) => rangeStart < clip.end && rangeEnd > clip.start);
-    if (!matchingClip) {
-      return "Reason unavailable";
-    }
-    const classification = idleTimeClipClassifications?.[matchingClip.id];
-    if (!classification || classification.status === "processing") {
-      return "Analyzing...";
-    }
-    if (!classification.label) {
-      return "Reason unavailable";
-    }
-    return classification.displayName || classification.label.replace(/_/g, " ");
-  }, [idleClipRanges, idleTimeClipClassifications]);
-  const { shiftDuration, shiftEndTime, hasPartialLastHour } = React141__default.useMemo(() => {
-    console.log("[HourlyOutputChart] Calculating shift duration with:", {
+  const containerRef = React142__default.useRef(null);
+  const [containerReady, setContainerReady] = React142__default.useState(false);
+  const [containerWidth, setContainerWidth] = React142__default.useState(0);
+  const idleSlots = React142__default.useMemo(
+    () => buildHourlyIdleSlots({
+      idleTimeHourly,
       shiftStart,
-      shiftEnd,
-      shiftStartTime
-    });
-    if (!shiftEnd) {
-      console.log("[HourlyOutputChart] No shiftEnd provided, using default 11 hours");
-      return {
-        shiftDuration: 11,
-        shiftEndTime: null,
-        hasPartialLastHour: false
-      };
-    }
-    const endTime = getTimeFromTimeString2(shiftEnd);
-    let duration = endTime.decimalHour - shiftStartTime.decimalHour;
-    if (duration <= 0) {
-      duration += 24;
-    }
-    const hasPartial = endTime.minute > 0 && endTime.minute < 60;
-    const hourCount = hasPartial ? Math.ceil(duration) : Math.round(duration);
-    console.log("[HourlyOutputChart] Shift calculation results:", {
-      endTime,
-      duration,
-      hasPartial,
-      hourCount
-    });
-    return {
-      shiftDuration: hourCount,
-      shiftEndTime: endTime,
-      hasPartialLastHour: hasPartial
-    };
-  }, [shiftEnd, shiftStartTime.decimalHour]);
-  const SHIFT_DURATION = shiftDuration;
-  shiftEndTime ? shiftEndTime.hour : (shiftStartTime.hour + SHIFT_DURATION) % 24;
-  const [animatedData, setAnimatedData] = React141__default.useState(
+      shiftEnd
+    }),
+    [idleTimeHourly, shiftStart, shiftEnd]
+  );
+  const SHIFT_DURATION = idleSlots.length;
+  const [animatedData, setAnimatedData] = React142__default.useState(
     () => Array(SHIFT_DURATION).fill(0)
   );
-  const prevDataRef = React141__default.useRef(Array(SHIFT_DURATION).fill(0));
-  const animationFrameRef = React141__default.useRef(null);
-  React141__default.useEffect(() => {
+  const prevDataRef = React142__default.useRef(Array(SHIFT_DURATION).fill(0));
+  const animationFrameRef = React142__default.useRef(null);
+  React142__default.useEffect(() => {
     setAnimatedData((prev) => {
       if (prev.length !== SHIFT_DURATION) {
         return Array(SHIFT_DURATION).fill(0);
@@ -33253,14 +33543,14 @@ var HourlyOutputChartComponent = ({
     });
     prevDataRef.current = Array(SHIFT_DURATION).fill(0);
   }, [SHIFT_DURATION]);
-  const [idleBarState, setIdleBarState] = React141__default.useState({
+  const [idleBarState, setIdleBarState] = React142__default.useState({
     visible: showIdleTime,
     key: 0,
     shouldAnimate: false
   });
-  const prevShowIdleTimeRef = React141__default.useRef(showIdleTime);
-  const stateUpdateTimeoutRef = React141__default.useRef(null);
-  React141__default.useEffect(() => {
+  const prevShowIdleTimeRef = React142__default.useRef(showIdleTime);
+  const stateUpdateTimeoutRef = React142__default.useRef(null);
+  React142__default.useEffect(() => {
     if (stateUpdateTimeoutRef.current) {
       clearTimeout(stateUpdateTimeoutRef.current);
     }
@@ -33285,7 +33575,7 @@ var HourlyOutputChartComponent = ({
       }
     };
   }, [showIdleTime]);
-  const animateToNewData = React141__default.useCallback((targetData) => {
+  const animateToNewData = React142__default.useCallback((targetData) => {
     const startData = [...prevDataRef.current];
     const startTime = performance.now();
     const duration = 1200;
@@ -33315,7 +33605,7 @@ var HourlyOutputChartComponent = ({
     }
     animationFrameRef.current = requestAnimationFrame(animate);
   }, []);
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     if (JSON.stringify(data) !== JSON.stringify(prevDataRef.current)) {
       const shiftData = data.slice(0, SHIFT_DURATION);
       animateToNewData(shiftData);
@@ -33326,7 +33616,7 @@ var HourlyOutputChartComponent = ({
       }
     };
   }, [data, animateToNewData]);
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     const checkContainerDimensions = () => {
       if (containerRef.current) {
         const rect = containerRef.current.getBoundingClientRect();
@@ -33352,7 +33642,7 @@ var HourlyOutputChartComponent = ({
       clearTimeout(fallbackTimeout);
     };
   }, []);
-  const xAxisConfig = React141__default.useMemo(() => {
+  const xAxisConfig = React142__default.useMemo(() => {
     if (containerWidth >= 960) {
       return { interval: 0, angle: -45, height: 92, tickFont: 10, tickMargin: 12 };
     }
@@ -33361,122 +33651,23 @@ var HourlyOutputChartComponent = ({
     }
     return { interval: 0, angle: -30, height: 64, tickFont: 9, tickMargin: 6 };
   }, [containerWidth]);
-  const formatHour = React141__default.useCallback((hourIndex) => {
-    const isLastHour = hourIndex === SHIFT_DURATION - 1;
-    const startDecimalHour = shiftStartTime.decimalHour + hourIndex;
-    const startHour = Math.floor(startDecimalHour) % 24;
-    const startMinute = Math.round(startDecimalHour % 1 * 60);
-    let endHour, endMinute;
-    if (isLastHour && shiftEndTime) {
-      endHour = shiftEndTime.hour;
-      endMinute = shiftEndTime.minute;
-    } else {
-      const endDecimalHour = startDecimalHour + 1;
-      endHour = Math.floor(endDecimalHour) % 24;
-      endMinute = Math.round(endDecimalHour % 1 * 60);
-    }
-    const formatTime5 = (h, m) => {
-      const period = h >= 12 ? "PM" : "AM";
-      const hour12 = h === 0 ? 12 : h > 12 ? h - 12 : h;
-      if (m === 0) {
-        return `${hour12}${period}`;
-      }
-      return `${hour12}:${m.toString().padStart(2, "0")}${period}`;
-    };
-    return `${formatTime5(startHour, startMinute)}-${formatTime5(endHour, endMinute)}`;
-  }, [shiftStartTime.decimalHour, SHIFT_DURATION, shiftEndTime]);
-  const formatTimeRange2 = React141__default.useCallback((hourIndex) => {
-    const isLastHour = hourIndex === SHIFT_DURATION - 1;
-    const startDecimalHour = shiftStartTime.decimalHour + hourIndex;
-    const startHour = Math.floor(startDecimalHour) % 24;
-    const startMinute = Math.round(startDecimalHour % 1 * 60);
-    let endHour, endMinute;
-    if (isLastHour && shiftEndTime) {
-      endHour = shiftEndTime.hour;
-      endMinute = shiftEndTime.minute;
-    } else {
-      const endDecimalHour = startDecimalHour + 1;
-      endHour = Math.floor(endDecimalHour) % 24;
-      endMinute = Math.round(endDecimalHour % 1 * 60);
-    }
-    const formatTime5 = (h, m) => {
-      const period = h >= 12 ? "PM" : "AM";
-      const hour12 = h === 0 ? 12 : h > 12 ? h - 12 : h;
-      return `${hour12}:${m.toString().padStart(2, "0")} ${period}`;
-    };
-    return `${formatTime5(startHour, startMinute)} - ${formatTime5(endHour, endMinute)}`;
-  }, [shiftStartTime.decimalHour, SHIFT_DURATION, shiftEndTime]);
-  const chartData = React141__default.useMemo(() => {
+  const chartData = React142__default.useMemo(() => {
     return Array.from({ length: SHIFT_DURATION }, (_, i) => {
-      const actualHour = (shiftStartTime.hour + i) % 24;
-      const startMinute = shiftStartTime.minute;
-      let idleArray = [];
-      let idleMinutes = 0;
-      if (idleTimeHourly) {
-        if (startMinute > 0) {
-          if (i === 0) {
-            const firstHourData = idleTimeHourly[actualHour.toString()] || [];
-            const nextHour = (actualHour + 1) % 24;
-            const nextHourData = idleTimeHourly[nextHour.toString()] || [];
-            idleArray = [
-              ...firstHourData.slice(startMinute) || [],
-              ...nextHourData.slice(0, startMinute) || []
-            ];
-          } else if (i < SHIFT_DURATION - 1) {
-            const currentHourData = idleTimeHourly[actualHour.toString()] || [];
-            const nextHour = (actualHour + 1) % 24;
-            const nextHourData = idleTimeHourly[nextHour.toString()] || [];
-            idleArray = [
-              ...currentHourData.slice(startMinute) || [],
-              ...nextHourData.slice(0, startMinute) || []
-            ];
-          } else {
-            const hasPartialLastHour2 = shiftEndTime && shiftEndTime.minute > 0 && shiftEndTime.minute < 60;
-            if (hasPartialLastHour2) {
-              const currentHourData = idleTimeHourly[actualHour.toString()] || [];
-              const nextHour = (actualHour + 1) % 24;
-              const nextHourData = idleTimeHourly[nextHour.toString()] || [];
-              if (startMinute > 0) {
-                const firstPart = currentHourData.slice(startMinute) || [];
-                const secondPart = nextHourData.slice(0, shiftEndTime.minute) || [];
-                idleArray = [...firstPart, ...secondPart];
-              } else {
-                idleArray = currentHourData.slice(0, shiftEndTime.minute) || [];
-              }
-            } else {
-              const currentHourData = idleTimeHourly[actualHour.toString()] || [];
-              const nextHour = (actualHour + 1) % 24;
-              const nextHourData = idleTimeHourly[nextHour.toString()] || [];
-              idleArray = [
-                ...currentHourData.slice(startMinute) || [],
-                ...nextHourData.slice(0, startMinute) || []
-              ];
-            }
-          }
-        } else {
-          const currentHourData = idleTimeHourly[actualHour.toString()] || [];
-          if (i === SHIFT_DURATION - 1 && shiftEndTime && shiftEndTime.minute > 0 && shiftEndTime.minute < 60) {
-            idleArray = currentHourData.slice(0, shiftEndTime.minute) || [];
-          } else {
-            idleArray = currentHourData || [];
-          }
-        }
-      }
-      idleMinutes = idleArray.filter((val) => val === "1" || val === 1).length;
+      const idleSlot = idleSlots[i];
       return {
-        hourIndex: i,
-        hour: formatHour(i),
-        timeRange: formatTimeRange2(i),
+        hourIndex: idleSlot?.hourIndex ?? i,
+        hour: idleSlot?.hour || "",
+        timeRange: idleSlot?.timeRange || "",
         output: animatedData[i] || 0,
         originalOutput: data[i] || 0,
         // Keep original data for labels
         color: (animatedData[i] || 0) >= Math.round(pphThreshold) ? "#00AB45" : "#E34329",
-        idleMinutes,
-        idleArray
+        idleMinutes: idleSlot?.idleMinutes || 0,
+        idleArray: idleSlot?.idleArray || []
       };
     });
-  }, [animatedData, data, pphThreshold, idleTimeHourly, shiftStartTime.hour, shiftStartTime.minute, shiftEndTime, formatHour, formatTimeRange2, SHIFT_DURATION]);
-  const IdleBar = React141__default.useMemo(() => {
+  }, [animatedData, data, pphThreshold, idleSlots, SHIFT_DURATION]);
+  const IdleBar = React142__default.useMemo(() => {
     if (!idleBarState.visible) return null;
     return /* @__PURE__ */ jsx(
       Bar,
@@ -33637,36 +33828,11 @@ var HourlyOutputChartComponent = ({
                   content: (props) => {
                     if (!props.active || !props.payload || props.payload.length === 0) return null;
                     const data2 = props.payload[0].payload;
-                    const idleRanges = [];
-                    if (showIdleTime && data2.idleArray) {
-                      let currentRange = null;
-                      data2.idleArray.forEach((val, idx) => {
-                        if (val === "1" || val === 1) {
-                          if (!currentRange) {
-                            currentRange = { start: idx, end: idx };
-                          } else {
-                            currentRange.end = idx;
-                          }
-                        } else if (val !== "x" && currentRange) {
-                          idleRanges.push(currentRange);
-                          currentRange = null;
-                        }
-                      });
-                      if (currentRange) {
-                        idleRanges.push(currentRange);
-                      }
-                    }
-                    const formatIdleTimestamp = (minuteIdx) => {
-                      const fallbackIndex = chartData.findIndex((item) => item.timeRange === data2.timeRange);
-                      const hourOffset = Number.isFinite(data2.hourIndex) ? data2.hourIndex : fallbackIndex;
-                      const safeHourOffset = hourOffset >= 0 ? hourOffset : 0;
-                      const totalMinutes = (shiftStartTime.hour + safeHourOffset) * 60 + shiftStartTime.minute + minuteIdx;
-                      const hour = Math.floor(totalMinutes / 60) % 24;
-                      const minute = totalMinutes % 60;
-                      const period = hour >= 12 ? "PM" : "AM";
-                      const hour12 = hour === 0 ? 12 : hour > 12 ? hour - 12 : hour;
-                      return `${hour12}:${minute.toString().padStart(2, "0")} ${period}`;
-                    };
+                    const idlePeriods = showIdleTime ? getHourlyIdlePeriods({
+                      idleArray: data2.idleArray,
+                      shiftStart,
+                      hourIndex: Number.isFinite(data2.hourIndex) ? data2.hourIndex : 0
+                    }) : [];
                     return /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-xl shadow-xl border border-gray-100 p-4 min-w-[220px]", children: [
                       /* @__PURE__ */ jsx("div", { className: "flex items-center justify-between mb-3", children: /* @__PURE__ */ jsx("p", { className: "font-semibold text-gray-900 text-sm", children: data2.timeRange }) }),
                       /* @__PURE__ */ jsxs("div", { className: "space-y-2", children: [
@@ -33685,27 +33851,22 @@ var HourlyOutputChartComponent = ({
                               " minutes"
                             ] })
                           ] }) }),
-                          idleRanges.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mt-3 bg-gray-50 rounded-lg p-2.5", children: [
+                          idlePeriods.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mt-3 bg-gray-50 rounded-lg p-2.5", children: [
                             /* @__PURE__ */ jsx("p", { className: "font-medium text-gray-700 text-xs mb-2", children: "Idle periods:" }),
-                            /* @__PURE__ */ jsx("div", { className: "space-y-1 max-h-32 overflow-y-auto pr-1", children: idleRanges.map((range, index) => {
-                              const duration = range.end - range.start + 1;
-                              const startTime = formatIdleTimestamp(range.start);
-                              const endTime = formatIdleTimestamp(range.end + 1);
-                              const fallbackIndex = chartData.findIndex((item) => item.timeRange === data2.timeRange);
-                              Number.isFinite(data2.hourIndex) ? data2.hourIndex : fallbackIndex;
+                            /* @__PURE__ */ jsx("div", { className: "space-y-1 max-h-32 overflow-y-auto pr-1", children: idlePeriods.map((period, index) => {
                               return /* @__PURE__ */ jsxs("div", { className: "text-gray-600 flex items-center gap-2 text-xs", children: [
                                 /* @__PURE__ */ jsx("span", { className: "inline-block w-1.5 h-1.5 bg-orange-400 rounded-full flex-shrink-0" }),
-                                /* @__PURE__ */ jsx("span", { children: duration === 1 ? /* @__PURE__ */ jsxs(Fragment, { children: [
-                                  startTime,
+                                /* @__PURE__ */ jsx("span", { children: period.duration === 1 ? /* @__PURE__ */ jsxs(Fragment, { children: [
+                                  period.startTime,
                                   " (",
-                                  duration,
+                                  period.duration,
                                   " min)"
                                 ] }) : /* @__PURE__ */ jsxs(Fragment, { children: [
-                                  startTime,
+                                  period.startTime,
                                   " - ",
-                                  endTime,
+                                  period.endTime,
                                   " (",
-                                  duration,
+                                  period.duration,
                                   " mins)"
                                 ] }) })
                               ] }, index);
@@ -33804,7 +33965,7 @@ var HourlyOutputChartComponent = ({
     }
   );
 };
-var HourlyOutputChart = React141__default.memo(HourlyOutputChartComponent, (prevProps, nextProps) => {
+var HourlyOutputChart = React142__default.memo(HourlyOutputChartComponent, (prevProps, nextProps) => {
   if (prevProps.pphThreshold !== nextProps.pphThreshold || prevProps.shiftStart !== nextProps.shiftStart || prevProps.shiftEnd !== nextProps.shiftEnd || prevProps.shiftDate !== nextProps.shiftDate || prevProps.timezone !== nextProps.timezone || prevProps.showIdleTime !== nextProps.showIdleTime || prevProps.className !== nextProps.className) {
     return false;
   }
@@ -33860,9 +34021,8 @@ var HourlyOutputChart = React141__default.memo(HourlyOutputChartComponent, (prev
 HourlyOutputChart.displayName = "HourlyOutputChart";
 
 // src/components/dashboard/grid/videoGridMetricUtils.ts
-var VIDEO_GRID_LEGEND_LABEL = "7 Minute Efficiency";
 var MAP_GRID_LEGEND_LABEL = "Efficiency";
-var MIXED_VIDEO_GRID_LEGEND_LABEL = "Efficiency";
+var MIXED_VIDEO_GRID_LEGEND_LABEL = "Flow Efficiency";
 var isFiniteNumber = (value) => typeof value === "number" && Number.isFinite(value);
 var isVideoGridRecentFlowEnabled = (workspace) => isRecentFlowVideoGridMetricMode(
   workspace.video_grid_metric_mode,
@@ -33893,6 +34053,9 @@ var getVideoGridBaseColorState = (workspace, legend = DEFAULT_EFFICIENCY_LEGEND)
   return getEfficiencyColor(metricValue, legend);
 };
 var isLowWipGreenOverride = (workspace, legend = DEFAULT_EFFICIENCY_LEGEND) => {
+  if (workspace.scheduled_break_active === true) {
+    return false;
+  }
   if (!hasVideoGridRecentFlow(workspace) || !isVideoGridWipGated(workspace)) {
     return false;
   }
@@ -33961,8 +34124,15 @@ var getVideoGridLegendLabel = (workspaces) => {
   if (recentFlowEnabledCount === 0) {
     return MAP_GRID_LEGEND_LABEL;
   }
+  const recentFlowWindows = new Set(
+    visibleWorkspaces.filter(isVideoGridRecentFlowEnabled).map((workspace) => workspace.recent_flow_window_minutes ?? 7).filter((value) => typeof value === "number" && Number.isFinite(value))
+  );
   if (recentFlowEnabledCount === visibleWorkspaces.length) {
-    return VIDEO_GRID_LEGEND_LABEL;
+    if (recentFlowWindows.size === 1) {
+      const [windowMinutes] = Array.from(recentFlowWindows);
+      return `${windowMinutes} Minute Efficiency`;
+    }
+    return MIXED_VIDEO_GRID_LEGEND_LABEL;
   }
   return MIXED_VIDEO_GRID_LEGEND_LABEL;
 };
@@ -33975,7 +34145,7 @@ function getTrendArrowAndColor(trend) {
     return { arrow: "\u2192", color: "text-gray-400" };
   }
 }
-var VideoCard = React141__default.memo(({
+var VideoCard = React142__default.memo(({
   workspace,
   hlsUrl,
   shouldPlay,
@@ -34137,7 +34307,7 @@ var VideoCard = React141__default.memo(({
     }
   );
 }, (prevProps, nextProps) => {
-  if (prevProps.workspace.efficiency !== nextProps.workspace.efficiency || prevProps.workspace.assembly_enabled !== nextProps.workspace.assembly_enabled || prevProps.workspace.video_grid_metric_mode !== nextProps.workspace.video_grid_metric_mode || prevProps.workspace.recent_flow_percent !== nextProps.workspace.recent_flow_percent || prevProps.workspace.recent_flow_effective_end_at !== nextProps.workspace.recent_flow_effective_end_at || prevProps.workspace.incoming_wip_current !== nextProps.workspace.incoming_wip_current || prevProps.workspace.incoming_wip_buffer_name !== nextProps.workspace.incoming_wip_buffer_name || prevProps.workspace.trend !== nextProps.workspace.trend || prevProps.workspace.performance_score !== nextProps.workspace.performance_score || prevProps.workspace.pph !== nextProps.workspace.pph) {
+  if (prevProps.workspace.efficiency !== nextProps.workspace.efficiency || prevProps.workspace.assembly_enabled !== nextProps.workspace.assembly_enabled || prevProps.workspace.video_grid_metric_mode !== nextProps.workspace.video_grid_metric_mode || prevProps.workspace.recent_flow_percent !== nextProps.workspace.recent_flow_percent || prevProps.workspace.recent_flow_effective_end_at !== nextProps.workspace.recent_flow_effective_end_at || prevProps.workspace.scheduled_break_active !== nextProps.workspace.scheduled_break_active || prevProps.workspace.incoming_wip_current !== nextProps.workspace.incoming_wip_current || prevProps.workspace.incoming_wip_buffer_name !== nextProps.workspace.incoming_wip_buffer_name || prevProps.workspace.trend !== nextProps.workspace.trend || prevProps.workspace.performance_score !== nextProps.workspace.performance_score || prevProps.workspace.pph !== nextProps.workspace.pph) {
     return false;
   }
   if (prevProps.workspace.workspace_uuid !== nextProps.workspace.workspace_uuid || prevProps.workspace.workspace_name !== nextProps.workspace.workspace_name || prevProps.workspace.line_id !== nextProps.workspace.line_id) {
@@ -34173,7 +34343,7 @@ var logDebug2 = (...args) => {
   if (!DEBUG_DASHBOARD_LOGS2) return;
   console.log(...args);
 };
-var VideoGridView = React141__default.memo(({
+var VideoGridView = React142__default.memo(({
   workspaces,
   selectedLine,
   className = "",
@@ -34545,7 +34715,7 @@ var VideoGridView = React141__default.memo(({
   ) }) });
 });
 VideoGridView.displayName = "VideoGridView";
-var MapGridView = React141__default.memo(({
+var MapGridView = React142__default.memo(({
   workspaces,
   className = "",
   displayNames = {},
@@ -35384,7 +35554,7 @@ var UptimeLineChartComponent = ({ points, className = "" }) => {
     )
   ] }) }) });
 };
-var UptimeLineChart = React141__default.memo(UptimeLineChartComponent);
+var UptimeLineChart = React142__default.memo(UptimeLineChartComponent);
 var padTime = (value) => value.toString().padStart(2, "0");
 var parseTime = (timeValue) => {
   if (!timeValue) return null;
@@ -35624,10 +35794,10 @@ var HourlyUptimeChartComponent = ({
   elapsedMinutes,
   className = ""
 }) => {
-  const containerRef = React141__default.useRef(null);
-  const [containerReady, setContainerReady] = React141__default.useState(false);
-  const [containerWidth, setContainerWidth] = React141__default.useState(0);
-  const uptimeSeries = React141__default.useMemo(() => buildUptimeSeries({
+  const containerRef = React142__default.useRef(null);
+  const [containerReady, setContainerReady] = React142__default.useState(false);
+  const [containerWidth, setContainerWidth] = React142__default.useState(0);
+  const uptimeSeries = React142__default.useMemo(() => buildUptimeSeries({
     idleTimeHourly,
     shiftStart,
     shiftEnd,
@@ -35636,11 +35806,11 @@ var HourlyUptimeChartComponent = ({
     elapsedMinutes
   }), [idleTimeHourly, shiftStart, shiftEnd, shiftDate, timezone, elapsedMinutes]);
   const hasAggregateData = Boolean(hourlyAggregates && hourlyAggregates.length > 0);
-  const shiftStartTime = React141__default.useMemo(
+  const shiftStartTime = React142__default.useMemo(
     () => getTimeFromTimeString(shiftStart),
     [shiftStart]
   );
-  const { shiftDuration, shiftEndTime } = React141__default.useMemo(() => {
+  const { shiftDuration, shiftEndTime } = React142__default.useMemo(() => {
     if (!shiftEnd) {
       const fallbackHours = uptimeSeries.shiftMinutes > 0 ? Math.ceil(uptimeSeries.shiftMinutes / 60) : 0;
       return { shiftDuration: fallbackHours, shiftEndTime: null };
@@ -35654,7 +35824,7 @@ var HourlyUptimeChartComponent = ({
     const hourCount = hasPartial ? Math.ceil(duration) : Math.round(duration);
     return { shiftDuration: hourCount, shiftEndTime: endTime };
   }, [shiftEnd, shiftStartTime.decimalHour, uptimeSeries.shiftMinutes]);
-  const formatHour = React141__default.useCallback((hourIndex) => {
+  const formatHour = React142__default.useCallback((hourIndex) => {
     const isLastHour = hourIndex === shiftDuration - 1;
     const startDecimalHour = shiftStartTime.decimalHour + hourIndex;
     const startHour = Math.floor(startDecimalHour) % 24;
@@ -35679,7 +35849,7 @@ var HourlyUptimeChartComponent = ({
     };
     return `${formatTime5(startHour, startMinute)}-${formatTime5(endHour, endMinute)}`;
   }, [shiftDuration, shiftStartTime.decimalHour, shiftEndTime]);
-  const formatTimeRange2 = React141__default.useCallback((hourIndex) => {
+  const formatTimeRange2 = React142__default.useCallback((hourIndex) => {
     const isLastHour = hourIndex === shiftDuration - 1;
     const startDecimalHour = shiftStartTime.decimalHour + hourIndex;
     const startHour = Math.floor(startDecimalHour) % 24;
@@ -35701,7 +35871,7 @@ var HourlyUptimeChartComponent = ({
     };
     return `${formatTime5(startHour, startMinute)} - ${formatTime5(endHour, endMinute)}`;
   }, [shiftDuration, shiftStartTime.decimalHour, shiftEndTime]);
-  const chartData = React141__default.useMemo(() => {
+  const chartData = React142__default.useMemo(() => {
     if (shiftDuration <= 0) return [];
     if (hasAggregateData) {
       return hourlyAggregates.map((entry, hourIndex) => ({
@@ -35743,7 +35913,7 @@ var HourlyUptimeChartComponent = ({
   }, [hasAggregateData, hourlyAggregates, uptimeSeries.points, uptimeSeries.elapsedMinutes, uptimeSeries.shiftMinutes, shiftDuration, formatHour, formatTimeRange2]);
   const maxYValue = 100;
   const yAxisTicks = [0, 25, 50, 75, 100];
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     const checkContainerDimensions = () => {
       if (containerRef.current) {
         const rect = containerRef.current.getBoundingClientRect();
@@ -35769,7 +35939,7 @@ var HourlyUptimeChartComponent = ({
       clearTimeout(fallbackTimeout);
     };
   }, []);
-  const xAxisConfig = React141__default.useMemo(() => {
+  const xAxisConfig = React142__default.useMemo(() => {
     if (containerWidth >= 960) {
       return { interval: 0, angle: -45, height: 92, tickFont: 10, tickMargin: 12, labelMode: "full" };
     }
@@ -35778,7 +35948,7 @@ var HourlyUptimeChartComponent = ({
     }
     return { interval: 0, angle: -30, height: 64, tickFont: 9, tickMargin: 6, labelMode: "start" };
   }, [containerWidth]);
-  const formatXAxisTick = React141__default.useCallback((raw) => {
+  const formatXAxisTick = React142__default.useCallback((raw) => {
     const label = typeof raw === "string" ? raw : String(raw);
     if (xAxisConfig.labelMode === "full") return label;
     const parts = label.split("-");
@@ -35909,7 +36079,7 @@ var HourlyUptimeChartComponent = ({
                         idleRanges.push(currentRange);
                       }
                     }
-                    const formatIdleTimestamp = (minuteIdx) => {
+                    const formatIdleTimestamp2 = (minuteIdx) => {
                       const totalMinutes = (shiftStartTime.hour + data.hourIndex) * 60 + shiftStartTime.minute + minuteIdx;
                       const hour = Math.floor(totalMinutes / 60) % 24;
                       const minute = totalMinutes % 60;
@@ -35939,8 +36109,8 @@ var HourlyUptimeChartComponent = ({
                             /* @__PURE__ */ jsx("p", { className: "font-medium text-gray-700 text-xs mb-2", children: "Idle periods:" }),
                             /* @__PURE__ */ jsx("div", { className: "space-y-1 max-h-32 overflow-y-auto pr-1", children: idleRanges.map((range, index) => {
                               const duration = range.end - range.start + 1;
-                              const startTime = formatIdleTimestamp(range.start);
-                              const endTime = formatIdleTimestamp(range.end + 1);
+                              const startTime = formatIdleTimestamp2(range.start);
+                              const endTime = formatIdleTimestamp2(range.end + 1);
                               return /* @__PURE__ */ jsxs("div", { className: "text-gray-600 flex items-center gap-2 text-xs", children: [
                                 /* @__PURE__ */ jsx("span", { className: "inline-block w-1.5 h-1.5 bg-orange-400 rounded-full flex-shrink-0" }),
                                 /* @__PURE__ */ jsx("span", { children: duration === 1 ? `${startTime} (${duration} min)` : `${startTime} - ${endTime} (${duration} mins)` })
@@ -35984,7 +36154,7 @@ var HourlyUptimeChartComponent = ({
     }
   );
 };
-var HourlyUptimeChart = React141__default.memo(HourlyUptimeChartComponent);
+var HourlyUptimeChart = React142__default.memo(HourlyUptimeChartComponent);
 var DEFAULT_COLORS2 = ["#00AB45", "#ef4444"];
 var UptimeDonutChartComponent = ({
   data,
@@ -36054,7 +36224,7 @@ var UptimeDonutChartComponent = ({
     ] }) })
   ] }) });
 };
-var UptimeDonutChart = React141__default.memo(UptimeDonutChartComponent);
+var UptimeDonutChart = React142__default.memo(UptimeDonutChartComponent);
 UptimeDonutChart.displayName = "UptimeDonutChart";
 var TrendIcon = ({ trend }) => {
   if (trend === "up") {
@@ -36173,7 +36343,7 @@ var EmptyStateMessage = ({
   iconClassName
 }) => {
   let IconContent = null;
-  if (React141__default.isValidElement(iconType)) {
+  if (React142__default.isValidElement(iconType)) {
     IconContent = iconType;
   } else if (typeof iconType === "string") {
     const MappedIcon = IconMap[iconType];
@@ -36826,6 +36996,7 @@ var VideoControls = ({
   return /* @__PURE__ */ jsxs(
     "div",
     {
+      onClick: (e) => e.stopPropagation(),
       className: `absolute bottom-0 left-0 right-0 px-3 pb-3 pt-12 bg-gradient-to-t from-black/80 via-black/40 to-transparent transition-opacity duration-300 ${controlsVisible ? "opacity-100" : "opacity-0 pointer-events-none"} ${className}`,
       style: { touchAction: "none" },
       children: [
@@ -37869,13 +38040,11 @@ var HlsVideoPlayer = forwardRef(({
     player: playerLikeObject()
   }), [play, pause, currentTimeProp, durationProp, paused, mute, volumeProp, playbackRateProp, dispose, isReady, playerLikeObject]);
   const handleContainerClick = useCallback(() => {
-    if (!onClick && !controls) {
-      handleTogglePlay();
-    }
+    handleTogglePlay();
     if (onClick) {
       onClick();
     }
-  }, [onClick, controls, handleTogglePlay]);
+  }, [onClick, handleTogglePlay]);
   return /* @__PURE__ */ jsxs(
     "div",
     {
@@ -38300,9 +38469,7 @@ var CroppedHlsVideoPlayer = forwardRef(({
     return /* @__PURE__ */ jsx(HlsVideoPlayer, { ref, ...videoProps, onClick, controls });
   }
   const handleClick = () => {
-    if (!onClick && !controls) {
-      handleTogglePlay();
-    }
+    handleTogglePlay();
     if (onClick) onClick();
   };
   return /* @__PURE__ */ jsxs(
@@ -38458,7 +38625,7 @@ function Skeleton({ className, ...props }) {
 var Select = SelectPrimitive.Root;
 var SelectGroup = SelectPrimitive.Group;
 var SelectValue = SelectPrimitive.Value;
-var SelectTrigger = React141.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+var SelectTrigger = React142.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
   SelectPrimitive.Trigger,
   {
     ref,
@@ -38474,7 +38641,7 @@ var SelectTrigger = React141.forwardRef(({ className, children, ...props }, ref)
   }
 ));
 SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-var SelectScrollUpButton = React141.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var SelectScrollUpButton = React142.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   SelectPrimitive.ScrollUpButton,
   {
     ref,
@@ -38484,7 +38651,7 @@ var SelectScrollUpButton = React141.forwardRef(({ className, ...props }, ref) =>
   }
 ));
 SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
-var SelectScrollDownButton = React141.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var SelectScrollDownButton = React142.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   SelectPrimitive.ScrollDownButton,
   {
     ref,
@@ -38494,7 +38661,7 @@ var SelectScrollDownButton = React141.forwardRef(({ className, ...props }, ref)
   }
 ));
 SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
-var SelectContent = React141.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
+var SelectContent = React142.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(
   SelectPrimitive.Content,
   {
     ref,
@@ -38522,7 +38689,7 @@ var SelectContent = React141.forwardRef(({ className, children, position = "popp
   }
 ) }));
 SelectContent.displayName = SelectPrimitive.Content.displayName;
-var SelectLabel = React141.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var SelectLabel = React142.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   SelectPrimitive.Label,
   {
     ref,
@@ -38531,7 +38698,7 @@ var SelectLabel = React141.forwardRef(({ className, ...props }, ref) => /* @__PU
   }
 ));
 SelectLabel.displayName = SelectPrimitive.Label.displayName;
-var SelectItem = React141.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
+var SelectItem = React142.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ jsxs(
   SelectPrimitive.Item,
   {
     ref,
@@ -38547,7 +38714,7 @@ var SelectItem = React141.forwardRef(({ className, children, ...props }, ref) =>
   }
 ));
 SelectItem.displayName = SelectPrimitive.Item.displayName;
-var SelectSeparator = React141.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
+var SelectSeparator = React142.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
   SelectPrimitive.Separator,
   {
     ref,
@@ -38846,7 +39013,7 @@ var TimePickerDropdown = ({
     ] })
   ] });
 };
-var SilentErrorBoundary = class extends React141__default.Component {
+var SilentErrorBoundary = class extends React142__default.Component {
   constructor(props) {
     super(props);
     this.handleClearAndReload = () => {
@@ -42805,17 +42972,6 @@ var BottlenecksContent = ({
     window.addEventListener("keydown", handleKeyDown);
     return () => window.removeEventListener("keydown", handleKeyDown);
   }, [handlePrevious, handleNext]);
-  const togglePlayback = () => {
-    const player = videoRef.current?.player;
-    if (!player) return;
-    if (player.paused()) {
-      player.play()?.catch((err) => {
-        console.error("Error playing video:", err);
-      });
-    } else {
-      player.pause();
-    }
-  };
   const handlePlaybackSpeedChange = useCallback((speed) => {
     setPlaybackSpeed(speed);
     if (videoRef.current?.playbackRate) {
@@ -42985,7 +43141,6 @@ var BottlenecksContent = ({
                 poster: "",
                 className: "w-full h-full",
                 crop: workspaceCrop?.crop,
-                onClick: togglePlayback,
                 autoplay: true,
                 playsInline: true,
                 loop: false,
@@ -43410,7 +43565,6 @@ var BottlenecksContent = ({
                     poster: "",
                     className: "w-full h-full",
                     crop: workspaceCrop?.crop,
-                    onClick: togglePlayback,
                     autoplay: true,
                     playsInline: true,
                     loop: false,
@@ -43929,7 +44083,7 @@ function DiagnosisVideoModal({
                 src: playlistUrl,
                 className: "w-full h-full",
                 crop: null,
-                onClick: togglePlayback,
+                controls: false,
                 autoplay: false,
                 playsInline: true,
                 loop: false,
@@ -45448,8 +45602,8 @@ var IdleTimeReasonChartComponent = ({
   updateAnimation = "replay",
   variant = "pie"
 }) => {
-  const [activeData, setActiveData] = React141__default.useState([]);
-  React141__default.useEffect(() => {
+  const [activeData, setActiveData] = React142__default.useState([]);
+  React142__default.useEffect(() => {
     if (updateAnimation === "smooth") {
       setActiveData(data && data.length > 0 ? data : []);
       return;
@@ -45468,7 +45622,7 @@ var IdleTimeReasonChartComponent = ({
       setActiveData([]);
     }
   }, [data, updateAnimation]);
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     if (!data || data.length === 0) return;
     data.forEach((entry, index) => {
       if (entry.name.toLowerCase().includes("other")) {
@@ -45476,7 +45630,7 @@ var IdleTimeReasonChartComponent = ({
       }
     });
   }, [data]);
-  const pieKey = React141__default.useMemo(() => {
+  const pieKey = React142__default.useMemo(() => {
     if (updateAnimation === "smooth") {
       return "smooth";
     }
@@ -45646,7 +45800,7 @@ var IdleTimeReasonChartComponent = ({
     )
   ] });
 };
-var IdleTimeReasonChart = React141__default.memo(IdleTimeReasonChartComponent);
+var IdleTimeReasonChart = React142__default.memo(IdleTimeReasonChartComponent);
 IdleTimeReasonChart.displayName = "IdleTimeReasonChart";
 var IdleTimeReasonChart_default = IdleTimeReasonChart;
 var DEFAULT_PERFORMANCE_DATA = {
@@ -46921,10 +47075,17 @@ Underperforming Workspaces: ${lineInfo.metrics.underperforming_workspaces} / ${l
 var LinePdfGenerator = ({
   lineInfo,
   workspaceData,
+  issueResolutionSummary,
   shiftName,
   className
 }) => {
   const [isGenerating, setIsGenerating] = useState(false);
+  const formatResolutionDuration2 = (seconds) => {
+    if (seconds === null || seconds === void 0 || seconds <= 0) {
+      return "-";
+    }
+    return formatIdleTime(Math.max(0, Math.floor(seconds)));
+  };
   const generatePDF = async () => {
     setIsGenerating(true);
     try {
@@ -47264,9 +47425,11 @@ var LinePdfGenerator = ({
       doc.text(`${lineInfo.metrics.current_output} / ${lineInfo.metrics.line_threshold}`, 120, kpiStartY);
       createKPIBox(kpiStartY + kpiSpacing);
       doc.setFont("helvetica", "normal");
-      doc.text("Underperforming Workspaces:", 25, kpiStartY + kpiSpacing);
+      doc.text("Average Issue Resolution Time:", 25, kpiStartY + kpiSpacing);
       doc.setFont("helvetica", "bold");
-      doc.text(`${lineInfo.metrics.underperforming_workspaces} / ${lineInfo.metrics.total_workspaces}`, 120, kpiStartY + kpiSpacing);
+      const resolutionSeconds = issueResolutionSummary ? issueResolutionSummary.mean_resolution_seconds ?? issueResolutionSummary.median_resolution_seconds : null;
+      const displayValue = resolutionSeconds !== null ? formatResolutionDuration2(resolutionSeconds) : "-";
+      doc.text(displayValue, 120, kpiStartY + kpiSpacing);
       createKPIBox(kpiStartY + kpiSpacing * 2);
       doc.setFont("helvetica", "normal");
       doc.text("Average Efficiency:", 25, kpiStartY + kpiSpacing * 2);
@@ -50004,7 +50167,7 @@ var arePropsEqual = (prevProps, nextProps) => {
   return prevProps.data.efficiency === nextProps.data.efficiency && prevProps.data.trend_score === nextProps.data.trend_score && prevProps.data.workspace_id === nextProps.data.workspace_id && prevProps.data.workspace_name === nextProps.data.workspace_name && prevProps.isBottleneck === nextProps.isBottleneck && prevProps.isLowEfficiency === nextProps.isLowEfficiency && prevProps.isVeryLowEfficiency === nextProps.isVeryLowEfficiency && prevLegend.green_min === nextLegend.green_min && prevLegend.green_max === nextLegend.green_max && prevLegend.yellow_min === nextLegend.yellow_min && prevLegend.yellow_max === nextLegend.yellow_max && prevLegend.red_min === nextLegend.red_min && prevLegend.red_max === nextLegend.red_max && prevLegend.critical_threshold === nextLegend.critical_threshold && // Position doesn't need deep equality check as it's generally static
   prevProps.position.id === nextProps.position.id;
 };
-var WorkspaceGridItem = React141__default.memo(({
+var WorkspaceGridItem = React142__default.memo(({
   data,
   position,
   isBottleneck = false,
@@ -50099,7 +50262,7 @@ var WorkspaceGridItem = React141__default.memo(({
   );
 }, arePropsEqual);
 WorkspaceGridItem.displayName = "WorkspaceGridItem";
-var WorkspaceGrid = React141__default.memo(({
+var WorkspaceGrid = React142__default.memo(({
   workspaces,
   isPdfMode = false,
   customWorkspacePositions,
@@ -50358,7 +50521,7 @@ var KPICard = ({
 }) => {
   useThemeConfig();
   const { formatNumber } = useFormatNumber();
-  const trendInfo = React141__default.useMemo(() => {
+  const trendInfo = React142__default.useMemo(() => {
     let trendValue = trend || "neutral";
     if (change !== void 0 && trend === void 0) {
       trendValue = change > 0 ? "up" : change < 0 ? "down" : "neutral";
@@ -50385,7 +50548,7 @@ var KPICard = ({
     const shouldShowTrend = !(change === 0 && trend === void 0);
     return { trendValue, Icon: Icon2, colorClass, bgClass, shouldShowTrend };
   }, [trend, change]);
-  const formattedValue = React141__default.useMemo(() => {
+  const formattedValue = React142__default.useMemo(() => {
     if (title === "Quality Compliance" && typeof value === "number") {
       return value.toFixed(1);
     }
@@ -50399,7 +50562,7 @@ var KPICard = ({
     }
     return value;
   }, [value, title]);
-  const formattedChange = React141__default.useMemo(() => {
+  const formattedChange = React142__default.useMemo(() => {
     if (change === void 0 || change === 0 && !showZeroChange) return null;
     const absChange = Math.abs(change);
     return formatNumber(absChange, { minimumFractionDigits: 0, maximumFractionDigits: 1 });
@@ -50773,6 +50936,7 @@ var WorkspaceHealthCard = ({
   className = "",
   onViewDetails
 }) => {
+  const [copiedIp, setCopiedIp] = useState(false);
   const getStatusConfig = () => {
     switch (workspace.status) {
       case "healthy":
@@ -50947,6 +51111,34 @@ var WorkspaceHealthCard = ({
               /* @__PURE__ */ jsx("span", { className: "font-medium", children: formatTimeAgo(workspace.timeSinceLastUpdate) })
             ] })
           ] }),
+          workspace.cameraIp ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between p-2 mt-1.5 -mx-2 rounded-md bg-slate-50/50 dark:bg-slate-900/50 border border-slate-100 dark:border-slate-800/60 group/ip transition-colors hover:bg-slate-100/50 dark:hover:bg-slate-800/50", children: [
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsx(Video, { className: "h-3.5 w-3.5 text-slate-400" }),
+              /* @__PURE__ */ jsx("span", { className: "text-xs font-medium uppercase tracking-wide text-slate-500", children: "Camera IP" })
+            ] }),
+            /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
+              /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold text-slate-700 dark:text-slate-300 select-all", children: workspace.cameraIp }),
+              /* @__PURE__ */ jsx(
+                "button",
+                {
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    e.preventDefault();
+                    navigator.clipboard.writeText(workspace.cameraIp);
+                    setCopiedIp(true);
+                    setTimeout(() => setCopiedIp(false), 2e3);
+                  },
+                  className: "p-1 rounded-md text-slate-400 hover:text-slate-600 hover:bg-slate-200 dark:hover:bg-slate-700 dark:hover:text-slate-300 transition-all opacity-0 group-hover/ip:opacity-100 focus:opacity-100",
+                  title: "Copy IP address",
+                  "aria-label": "Copy IP address",
+                  children: copiedIp ? /* @__PURE__ */ jsx(Check, { className: "h-3.5 w-3.5 text-emerald-500" }) : /* @__PURE__ */ jsx(Copy, { className: "h-3.5 w-3.5" })
+                }
+              )
+            ] })
+          ] }) : /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 min-h-[1rem]", children: [
+            /* @__PURE__ */ jsx("span", { className: "text-xs font-medium uppercase tracking-wide text-slate-500", children: "Camera IP:" }),
+            /* @__PURE__ */ jsx("span", { className: "text-sm font-medium text-gray-700 dark:text-gray-300", children: "N/A" })
+          ] }),
           /* @__PURE__ */ jsx("div", { className: "mt-3 pt-3 border-t border-slate-100 dark:border-slate-800", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
             /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-slate-500 uppercase tracking-wide", children: downtimeConfig.label }),
             /* @__PURE__ */ jsx("span", { className: clsx("text-sm font-semibold", downtimeConfig.className), children: downtimeConfig.text })
@@ -51877,7 +52069,7 @@ var Breadcrumbs = ({ items }) => {
       }
     }
   };
-  return /* @__PURE__ */ jsx("nav", { "aria-label": "Breadcrumb", className: "mb-1 flex items-center space-x-1 text-xs font-medium text-gray-500 dark:text-gray-400", children: items.map((item, index) => /* @__PURE__ */ jsxs(React141__default.Fragment, { children: [
+  return /* @__PURE__ */ jsx("nav", { "aria-label": "Breadcrumb", className: "mb-1 flex items-center space-x-1 text-xs font-medium text-gray-500 dark:text-gray-400", children: items.map((item, index) => /* @__PURE__ */ jsxs(React142__default.Fragment, { children: [
     index > 0 && /* @__PURE__ */ jsx(ChevronRight, { className: "h-3 w-3 text-gray-400 dark:text-gray-500" }),
     /* @__PURE__ */ jsxs(
       "span",
@@ -52438,7 +52630,11 @@ var SideNavBar = memo$1(({
   dashboardConfig?.supervisorConfig?.enabled || false;
   const showSupervisorManagement = false;
   const ticketsEnabled = dashboardConfig?.ticketsConfig?.enabled ?? true;
-  const showBillingLink = canRoleViewClipsCost(role);
+  const canViewBillingByRole = canRoleViewClipsCost(role);
+  const { hasVlmEnabledLine } = useCompanyHasVlmEnabledLine({
+    enabled: canViewBillingByRole
+  });
+  const showBillingLink = canViewBillingByRole && hasVlmEnabledLine;
   console.log("\u{1F50D} [SideNavBar] dashboardConfig:", dashboardConfig);
   console.log("\u{1F50D} [SideNavBar] ticketsConfig:", dashboardConfig?.ticketsConfig);
   console.log("\u{1F50D} [SideNavBar] ticketsEnabled:", ticketsEnabled);
@@ -52637,7 +52833,6 @@ var SideNavBar = memo$1(({
       return prev;
     });
   }, [alertsCount, isAlertsOpen]);
-  const unreadCount = alertsCount !== null ? Math.max(0, alertsCount - lastViewedCount) : 0;
   const alertsTriggerRef = useRef(null);
   const alertsCompanyId = entityConfig.companyId || user?.company_id;
   const showAlertsButton = (role === "supervisor" || role === "optifye") && !!alertsCompanyId && !!supabase;
@@ -52777,7 +52972,7 @@ var SideNavBar = memo$1(({
       ${isActive ? "bg-blue-50/80 text-blue-600 font-medium" : "hover:bg-gray-50 text-gray-500 hover:text-gray-700 font-medium active:bg-gray-100"}
       transition-all duration-200 ease-out focus:outline-none focus-visible:ring-2 focus-visible:ring-blue-500 focus-visible:ring-offset-2`;
   }, [isSettingsOpen, settingsItems]);
-  const alertsButtonClasses = useMemo(() => {
+  useMemo(() => {
     const isActive = isAlertsOpen;
     return `w-full flex flex-col items-center justify-center py-4 sm:py-3 px-2 sm:px-1 rounded-lg relative group min-h-[44px] sm:min-h-0
       ${isActive ? "bg-blue-50/80 text-blue-600 font-medium" : "hover:bg-gray-50 text-gray-500 hover:text-gray-700 font-medium active:bg-gray-100"}
@@ -52905,54 +53100,25 @@ var SideNavBar = memo$1(({
         )
       ] })
     ] }),
-    /* @__PURE__ */ jsxs("div", { className: "w-full py-4 px-4 border-t border-gray-100 flex-shrink-0 flex flex-col gap-2", children: [
-      showAlertsButton && /* @__PURE__ */ jsxs(
-        "button",
-        {
-          ref: alertsTriggerRef,
-          onClick: () => {
-            const willOpen = !isAlertsOpen;
-            setIsAlertsOpen(willOpen);
-            setIsSettingsOpen(false);
-            if (willOpen) {
-              trackCoreEvent("Alerts page clicked", { source: "side_nav" });
-              void refreshAlertsSummary();
-            }
-          },
-          className: alertsButtonClasses,
-          "aria-label": "Alerts",
-          tabIndex: 0,
-          role: "tab",
-          "aria-selected": isAlertsOpen,
-          children: [
-            /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-              /* @__PURE__ */ jsx(BellIcon, { className: "w-5 h-5 mb-1" }),
-              unreadCount > 0 && /* @__PURE__ */ jsx("span", { className: "absolute -top-1.5 -right-1.5 flex h-4 min-w-[16px] items-center justify-center rounded-full bg-red-500 px-1 text-[9px] font-bold text-white shadow-sm ring-2 ring-white", children: unreadCount > 99 ? "99+" : unreadCount })
-            ] }),
-            /* @__PURE__ */ jsx("span", { className: "text-xs sm:text-[10px] font-medium leading-tight mt-1", children: "Alerts" })
-          ]
-        }
-      ),
-      settingsItems.length > 0 && /* @__PURE__ */ jsxs(
-        "button",
-        {
-          ref: settingsTriggerRef,
-          onClick: () => {
-            setIsSettingsOpen(!isSettingsOpen);
-            setIsAlertsOpen(false);
-          },
-          className: settingsButtonClasses,
-          "aria-label": "Settings",
-          tabIndex: 0,
-          role: "tab",
-          "aria-selected": isSettingsOpen || settingsItems.some((item) => item.isActive),
-          children: [
-            /* @__PURE__ */ jsx(Cog6ToothIcon, { className: "w-5 h-5 mb-1" }),
-            /* @__PURE__ */ jsx("span", { className: "text-xs sm:text-[10px] font-medium leading-tight", children: "Settings" })
-          ]
-        }
-      )
-    ] })
+    /* @__PURE__ */ jsx("div", { className: "w-full py-4 px-4 border-t border-gray-100 flex-shrink-0 flex flex-col gap-2", children: settingsItems.length > 0 && /* @__PURE__ */ jsxs(
+      "button",
+      {
+        ref: settingsTriggerRef,
+        onClick: () => {
+          setIsSettingsOpen(!isSettingsOpen);
+          setIsAlertsOpen(false);
+        },
+        className: settingsButtonClasses,
+        "aria-label": "Settings",
+        tabIndex: 0,
+        role: "tab",
+        "aria-selected": isSettingsOpen || settingsItems.some((item) => item.isActive),
+        children: [
+          /* @__PURE__ */ jsx(Cog6ToothIcon, { className: "w-5 h-5 mb-1" }),
+          /* @__PURE__ */ jsx("span", { className: "text-xs sm:text-[10px] font-medium leading-tight", children: "Settings" })
+        ]
+      }
+    ) })
   ] });
   const MobileNavigationContent = () => {
     const isActive = (path) => {
@@ -53065,26 +53231,6 @@ var SideNavBar = memo$1(({
       /* @__PURE__ */ jsxs("div", { className: "mt-8 pt-6 border-t border-gray-100", children: [
         /* @__PURE__ */ jsx("h3", { className: "px-5 mb-3 text-[10px] font-bold text-gray-400 uppercase tracking-widest", children: "Settings & Support" }),
         /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
-          showAlertsButton && /* @__PURE__ */ jsxs(
-            "button",
-            {
-              onClick: () => {
-                setIsAlertsOpen(true);
-                trackCoreEvent("Alerts page clicked", { source: "side_nav_mobile" });
-                void refreshAlertsSummary();
-                onMobileMenuClose?.();
-              },
-              className: getMobileButtonClass("/alerts"),
-              "aria-label": "Alerts",
-              children: [
-                /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-                  /* @__PURE__ */ jsx(BellIcon, { className: getIconClass("/alerts") }),
-                  unreadCount > 0 && /* @__PURE__ */ jsx("span", { className: "absolute -top-1.5 -right-1.5 flex h-4 min-w-[16px] items-center justify-center rounded-full bg-red-500 px-1 text-[9px] font-bold text-white shadow-sm ring-2 ring-white", children: unreadCount > 99 ? "99+" : unreadCount })
-                ] }),
-                /* @__PURE__ */ jsx("span", { className: "text-base font-medium ml-3", children: "Alerts" })
-              ]
-            }
-          ),
           canAccessPath("/targets") && /* @__PURE__ */ jsxs(
             "button",
             {
@@ -53399,7 +53545,7 @@ var AwardBadge = ({
 }) => {
   const styles2 = getBadgeStyles(type);
   const Icon2 = CustomIcon || getDefaultIcon(type);
-  const randomDelay = React141__default.useMemo(() => Math.random() * 2, []);
+  const randomDelay = React142__default.useMemo(() => Math.random() * 2, []);
   const floatingAnimation = {
     animate: {
       y: [0, -10, 0],
@@ -59314,6 +59460,17 @@ function HomeView({
     }
     return allActiveBreaks.filter((breakItem) => breakItem.lineId === selectedLineId);
   }, [allActiveBreaks, selectedLineId, factoryViewId]);
+  const activeBreakLineIds = useMemo(
+    () => new Set(activeBreaks.map((breakItem) => breakItem.lineId)),
+    [activeBreaks]
+  );
+  const workspaceMetricsWithBreakState = useMemo(
+    () => workspaceMetrics.map((workspace) => ({
+      ...workspace,
+      scheduled_break_active: activeBreakLineIds.has(workspace.line_id)
+    })),
+    [workspaceMetrics, activeBreakLineIds]
+  );
   const [breakNotificationsDismissed, setBreakNotificationsDismissed] = useState(false);
   useEffect(() => {
     if (activeBreaks.length > 0) {
@@ -59788,15 +59945,15 @@ function HomeView({
           ) }) }),
           /* @__PURE__ */ jsxs("div", { className: "flex-1 overflow-y-auto sm:overflow-hidden relative", children: [
             /* @__PURE__ */ jsx("div", { className: "absolute right-2 top-1 sm:right-6 sm:top-3 z-30 flex items-center space-x-2", children: lineSelectorComponent && lineSelectorComponent }),
-            /* @__PURE__ */ jsx("div", { className: "h-full sm:h-full min-h-[calc(100vh-100px)] sm:min-h-0", children: workspaceMetrics.length > 0 ? /* @__PURE__ */ jsx(
+            /* @__PURE__ */ jsx("div", { className: "h-full sm:h-full min-h-[calc(100vh-100px)] sm:min-h-0", children: workspaceMetricsWithBreakState.length > 0 ? /* @__PURE__ */ jsx(
               motion.div,
               {
                 initial: { opacity: 0, scale: 0.98 },
                 animate: { opacity: 1, scale: 1 },
                 transition: { duration: 0.3 },
                 className: "h-full",
-                children: React141__default.createElement(WorkspaceGrid, {
-                  workspaces: workspaceMetrics,
+                children: React142__default.createElement(WorkspaceGrid, {
+                  workspaces: workspaceMetricsWithBreakState,
                   lineNames,
                   factoryView: factoryViewId,
                   legend: efficiencyLegend,
@@ -59826,7 +59983,7 @@ function HomeView({
                 animate: { opacity: 1, scale: 1 },
                 transition: { duration: 0.3 },
                 className: "h-full",
-                children: React141__default.createElement(WorkspaceGrid, {
+                children: React142__default.createElement(WorkspaceGrid, {
                   workspaces: [],
                   // Show empty grid while loading
                   lineNames,
@@ -59893,7 +60050,7 @@ function HomeView({
     }
   );
 }
-var AuthenticatedHomeView = withAuth(React141__default.memo(HomeView));
+var AuthenticatedHomeView = withAuth(React142__default.memo(HomeView));
 var HomeView_default = HomeView;
 function withWorkspaceDisplayNames(Component3, options = {}) {
   const {
@@ -60076,6 +60233,295 @@ var lineDetailStore = {
   }
 };
 
+// src/lib/hooks/useLineDetailPageData.ts
+var buildLineInfoSnapshot = (lineDetails, metrics2) => {
+  if (!lineDetails || !metrics2) {
+    return null;
+  }
+  return {
+    line_id: lineDetails.id,
+    line_name: lineDetails.line_name,
+    company_id: "",
+    company_name: "",
+    factory_id: lineDetails.factory_id,
+    factory_name: lineDetails.factory.factory_name,
+    shift_id: metrics2.shift_id ?? 0,
+    date: metrics2.date || "",
+    monitoring_mode: lineDetails.monitoring_mode ?? void 0,
+    metrics: {
+      avg_efficiency: metrics2.avg_efficiency ?? 0,
+      avg_cycle_time: metrics2.avg_cycle_time ?? 0,
+      current_output: metrics2.current_output ?? 0,
+      ideal_output: metrics2.ideal_output ?? 0,
+      total_workspaces: metrics2.total_workspaces ?? 0,
+      underperforming_workspaces: metrics2.underperforming_workspaces ?? 0,
+      underperforming_workspace_names: metrics2.underperforming_workspace_names || [],
+      underperforming_workspace_uuids: metrics2.underperforming_workspace_uuids || [],
+      output_array: metrics2.output_array || [],
+      output_hourly: metrics2.output_hourly,
+      line_threshold: metrics2.line_threshold ?? 0,
+      threshold_pph: metrics2.threshold_pph ?? 0,
+      shift_start: metrics2.shift_start || "06:00",
+      shift_end: metrics2.shift_end || "14:00",
+      last_updated: metrics2.last_updated || (/* @__PURE__ */ new Date()).toISOString(),
+      poorest_performing_workspaces: metrics2.poorest_performing_workspaces || [],
+      idle_time_hourly: metrics2.idle_time_hourly || null
+    }
+  };
+};
+var transformWorkspaceMetrics = (workspaceData, lineId, companyId, queryDate, queryShiftId) => (workspaceData || []).map((item) => ({
+  company_id: item.company_id || companyId,
+  line_id: item.line_id || lineId,
+  shift_id: item.shift_id ?? queryShiftId,
+  date: item.date || queryDate,
+  workspace_uuid: item.workspace_id,
+  workspace_name: item.workspace_name,
+  action_count: item.total_output || 0,
+  pph: item.avg_pph || 0,
+  performance_score: item.performance_score || 0,
+  avg_cycle_time: item.avg_cycle_time || 0,
+  trend: item.trend_score === 1 ? 2 : 0,
+  predicted_output: item.ideal_output || 0,
+  efficiency: item.efficiency || 0,
+  action_threshold: item.total_day_output || 0,
+  idle_time: item.idle_time ?? void 0,
+  idle_time_hourly: item.idle_time_hourly || null,
+  shift_start: item.shift_start || void 0,
+  shift_end: item.shift_end || void 0,
+  monitoring_mode: item.monitoring_mode ?? void 0,
+  assembly_enabled: item.assembly_enabled ?? false,
+  video_grid_metric_mode: item.video_grid_metric_mode ?? void 0,
+  action_type: item.action_type ?? void 0,
+  action_family: item.action_family ?? void 0,
+  action_display_name: item.action_display_name ?? void 0,
+  recent_flow_percent: item.recent_flow_percent ?? null,
+  recent_flow_window_minutes: item.recent_flow_window_minutes ?? null,
+  recent_flow_effective_end_at: item.recent_flow_effective_end_at ?? null,
+  recent_flow_computed_at: item.recent_flow_computed_at ?? null,
+  incoming_wip_current: item.incoming_wip_current ?? null,
+  incoming_wip_effective_at: item.incoming_wip_effective_at ?? null,
+  incoming_wip_buffer_name: item.incoming_wip_buffer_name ?? null,
+  show_exclamation: item.show_exclamation ?? void 0
+})).sort((a, b) => a.workspace_name.localeCompare(b.workspace_name));
+var transformLineDetails = (lineId, detailResponse) => {
+  if (!detailResponse.line_details) {
+    return null;
+  }
+  return {
+    id: lineId,
+    line_name: detailResponse.line_details.line_name || "Line",
+    factory_id: detailResponse.line_details.factory_id || "",
+    factory: {
+      id: detailResponse.line_details.factory_id || "",
+      factory_name: detailResponse.line_details.factory_name || ""
+    },
+    monitoring_mode: detailResponse.line_details.monitoring_mode ?? void 0
+  };
+};
+var transformLineMetrics = (lineId, detailResponse, queryDate, queryShiftId) => {
+  const poorestPerformingWorkspaces = detailResponse.poorest_performing_workspaces || [];
+  const baseMetrics = detailResponse.line_metrics;
+  if (!baseMetrics) {
+    return {
+      line_id: lineId,
+      shift_id: queryShiftId,
+      date: queryDate,
+      factory_id: detailResponse.line_details?.factory_id || "",
+      avg_efficiency: 0,
+      avg_cycle_time: 0,
+      current_output: 0,
+      ideal_output: 0,
+      total_workspaces: 0,
+      underperforming_workspaces: 0,
+      underperforming_workspace_names: [],
+      underperforming_workspace_uuids: [],
+      output_array: [],
+      line_threshold: 0,
+      threshold_pph: 0,
+      shift_start: "06:00",
+      shift_end: "14:00",
+      last_updated: (/* @__PURE__ */ new Date()).toISOString(),
+      poorest_performing_workspaces: poorestPerformingWorkspaces,
+      idle_time_hourly: {}
+    };
+  }
+  return {
+    ...baseMetrics,
+    line_id: lineId,
+    shift_id: baseMetrics.shift_id ?? queryShiftId,
+    date: baseMetrics.date ?? queryDate,
+    factory_id: baseMetrics.factory_id ?? detailResponse.line_details?.factory_id ?? "",
+    poorest_performing_workspaces: poorestPerformingWorkspaces
+  };
+};
+var useLineDetailPageData = ({
+  lineId,
+  companyId,
+  timezone,
+  shiftConfig,
+  date: urlDate,
+  shiftId: urlShiftId,
+  enabled = true
+}) => {
+  const supabase = useSupabase();
+  const { hydrateFromBackend } = useIdleTimeVlmConfig();
+  const realtimeEnabled = enabled && urlDate === void 0 && urlShiftId === void 0;
+  const { shiftKey: operationalShiftKey } = useOperationalShiftKey({
+    enabled: realtimeEnabled,
+    timezone,
+    shiftConfig: shiftConfig || void 0
+  });
+  const currentShift = useMemo(
+    () => shiftConfig ? getCurrentShift(timezone, shiftConfig) : null,
+    [timezone, shiftConfig, operationalShiftKey]
+  );
+  const queryShiftId = useMemo(
+    () => urlShiftId !== void 0 ? urlShiftId : currentShift?.shiftId ?? 0,
+    [urlShiftId, currentShift]
+  );
+  const queryDate = useMemo(
+    () => urlDate || getOperationalDate(timezone),
+    [urlDate, timezone]
+  );
+  const [detailResponse, setDetailResponse] = useState(null);
+  const [loading, setLoading] = useState(true);
+  const [error, setError] = useState(null);
+  const channelsRef = useRef([]);
+  const requestIdRef = useRef(0);
+  const fetchTimeoutRef = useRef(null);
+  const fetchDetail = useCallback(async () => {
+    if (!enabled || !supabase || !lineId || !companyId) {
+      setLoading(false);
+      if (!companyId) {
+        setError({ message: "Company ID is not configured", code: "CONFIG_ERROR" });
+      }
+      return;
+    }
+    const requestId = requestIdRef.current + 1;
+    requestIdRef.current = requestId;
+    setLoading(true);
+    setError(null);
+    try {
+      const nextDetail = await fetchLineDetail(supabase, {
+        lineId,
+        date: queryDate,
+        shiftId: queryShiftId,
+        companyId
+      });
+      if (requestId !== requestIdRef.current) {
+        return;
+      }
+      hydrateFromBackend(nextDetail?.idle_time_vlm_by_line);
+      setDetailResponse(nextDetail);
+      const metrics3 = transformLineMetrics(lineId, nextDetail, queryDate, queryShiftId);
+      const lineDetails2 = transformLineDetails(lineId, nextDetail);
+      const workspaces2 = transformWorkspaceMetrics(
+        nextDetail.workspace_metrics || [],
+        lineId,
+        companyId,
+        queryDate,
+        queryShiftId
+      );
+      const lineInfo2 = buildLineInfoSnapshot(lineDetails2, metrics3);
+      if (lineInfo2) {
+        lineDetailStore.setSnapshot(lineId, lineInfo2.date, lineInfo2.shift_id, {
+          lineInfo: lineInfo2,
+          workspaces: workspaces2
+        });
+      }
+    } catch (err) {
+      if (requestId !== requestIdRef.current) {
+        return;
+      }
+      setError({ message: err.message, code: err.code || "FETCH_ERROR" });
+    } finally {
+      if (requestId === requestIdRef.current) {
+        setLoading(false);
+      }
+    }
+  }, [enabled, supabase, lineId, companyId, queryDate, queryShiftId, hydrateFromBackend]);
+  const queueUpdate = useCallback(() => {
+    if (fetchTimeoutRef.current) {
+      clearTimeout(fetchTimeoutRef.current);
+    }
+    fetchTimeoutRef.current = setTimeout(() => {
+      fetchDetail();
+      fetchTimeoutRef.current = null;
+    }, 300);
+  }, [fetchDetail]);
+  useEffect(() => {
+    if (!enabled) {
+      setLoading(false);
+      return;
+    }
+    fetchDetail();
+  }, [enabled, fetchDetail]);
+  useEffect(() => {
+    channelsRef.current.forEach((channel) => {
+      supabase.removeChannel(channel);
+    });
+    channelsRef.current = [];
+    if (!supabase || !companyId || !lineId || !realtimeEnabled) {
+      return;
+    }
+    const metricsTable = `${getMetricsTablePrefix()}_${companyId.replace(/-/g, "_")}`;
+    const timestamp = Date.now();
+    const currentDate = queryDate;
+    const currentShiftId = queryShiftId;
+    const lineFilter = `line_id=eq.${lineId}`;
+    const createChannel = (name, table, filter2) => supabase.channel(`${name}-${timestamp}`).on(
+      "postgres_changes",
+      { event: "*", schema: "public", table, filter: filter2 },
+      (payload) => {
+        const payloadData = payload.new || payload.old;
+        if (payloadData?.date !== currentDate || payloadData?.shift_id !== currentShiftId) {
+          return;
+        }
+        queueUpdate();
+      }
+    ).subscribe();
+    channelsRef.current = [
+      createChannel("line-detail-line-metrics", "line_metrics", lineFilter),
+      createChannel("line-detail-performance-metrics", metricsTable, lineFilter),
+      createChannel("line-detail-wip-buffer-metrics", "wip_buffer_metrics", lineFilter)
+    ];
+    return () => {
+      if (fetchTimeoutRef.current) {
+        clearTimeout(fetchTimeoutRef.current);
+        fetchTimeoutRef.current = null;
+      }
+      channelsRef.current.forEach((channel) => {
+        supabase.removeChannel(channel);
+      });
+      channelsRef.current = [];
+    };
+  }, [supabase, companyId, lineId, realtimeEnabled, queryDate, queryShiftId, queueUpdate]);
+  const metrics2 = useMemo(
+    () => detailResponse ? transformLineMetrics(lineId, detailResponse, queryDate, queryShiftId) : null,
+    [detailResponse, lineId, queryDate, queryShiftId]
+  );
+  const lineDetails = useMemo(
+    () => detailResponse ? transformLineDetails(lineId, detailResponse) : null,
+    [detailResponse, lineId]
+  );
+  const workspaces = useMemo(
+    () => detailResponse && companyId ? transformWorkspaceMetrics(detailResponse.workspace_metrics || [], lineId, companyId, queryDate, queryShiftId) : [],
+    [detailResponse, companyId, lineId, queryDate, queryShiftId]
+  );
+  const lineInfo = useMemo(() => buildLineInfoSnapshot(lineDetails, metrics2), [lineDetails, metrics2]);
+  return {
+    detailResponse,
+    lineDetails,
+    metrics: metrics2,
+    workspaces,
+    lineInfo,
+    issueResolutionSummary: detailResponse?.issue_resolution_summary ?? null,
+    loading,
+    error,
+    refresh: () => fetchDetail()
+  };
+};
+
 // src/lib/services/efficiencyLegendService.ts
 var EfficiencyLegendService = class {
   // 5 minutes
@@ -60670,21 +61116,45 @@ var formatLocalDate = (date) => {
   };
   return date.toLocaleDateString("en-US", options);
 };
+var formatResolutionDuration = (seconds) => {
+  if (seconds === null || seconds === void 0 || seconds <= 0) {
+    return "-";
+  }
+  return formatIdleTime(Math.max(0, Math.floor(seconds)));
+};
+var getIssueResolutionSecondaryText = (summary) => {
+  if (!summary) {
+    return "No issue data";
+  }
+  const parts = [`${summary.resolved_issue_count} resolved`];
+  if ((summary.open_issue_count || 0) > 0) {
+    parts.push(`oldest open ${formatResolutionDuration(summary.oldest_open_issue_age_seconds)}`);
+  }
+  return parts.join(" \u2022 ");
+};
 var MetricCards = memo$1(({
   lineInfo,
+  issueResolutionSummary,
   idleTimeData,
   showIdleTime,
   efficiencyLegend
 }) => {
   const efficiency = lineInfo?.metrics.avg_efficiency || 0;
   const efficiencyColorClass = getEfficiencyTextColorClasses(efficiency, efficiencyLegend);
+  const showIssueResolutionCard = Boolean(issueResolutionSummary);
+  const largeGridColumns = showIdleTime ? showIssueResolutionCard ? "lg:grid-cols-5" : "lg:grid-cols-4" : showIssueResolutionCard ? "lg:grid-cols-4" : "lg:grid-cols-3";
+  const shouldMaskIssueResolution = efficiency < 5;
+  const issueResolutionValue = shouldMaskIssueResolution ? "-" : formatResolutionDuration(
+    issueResolutionSummary?.mean_resolution_seconds ?? issueResolutionSummary?.median_resolution_seconds
+  );
+  getIssueResolutionSecondaryText(issueResolutionSummary);
   return /* @__PURE__ */ jsxs(
     motion.div,
     {
       variants: containerVariants,
       initial: "initial",
       animate: "animate",
-      className: `grid grid-cols-1 sm:grid-cols-2 ${showIdleTime ? "lg:grid-cols-4" : "lg:grid-cols-3"} gap-3 sm:gap-4 mb-2 h-auto lg:flex-[2] lg:min-h-[250px]`,
+      className: `grid grid-cols-1 sm:grid-cols-2 ${largeGridColumns} gap-3 sm:gap-4 mb-2 h-auto lg:flex-[2] lg:min-h-[250px]`,
       children: [
         /* @__PURE__ */ jsxs(motion.div, { variants: itemVariants, className: "bg-white rounded-xl shadow-sm p-3 sm:p-4 overflow-hidden h-[240px] sm:h-[260px] md:h-auto", children: [
           /* @__PURE__ */ jsx("h2", { className: "text-sm sm:text-base font-bold text-gray-700 mb-2 text-center", children: "Line Output" }),
@@ -60713,6 +61183,28 @@ var MetricCards = memo$1(({
             "%"
           ] }) })
         ] }),
+        showIssueResolutionCard && /* @__PURE__ */ jsxs(
+          motion.div,
+          {
+            variants: itemVariants,
+            className: "bg-white rounded-xl shadow-sm p-3 sm:p-4 h-[240px] sm:h-[260px] md:h-auto",
+            children: [
+              /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-1.5 mb-2 relative group z-10", children: [
+                /* @__PURE__ */ jsx("h2", { className: "text-sm sm:text-base font-bold text-gray-700", children: "Average Issue Resolution Time" }),
+                /* @__PURE__ */ jsx(InformationCircleIcon, { className: "w-4 h-4 text-gray-400 cursor-help" }),
+                /* @__PURE__ */ jsxs("div", { className: "absolute top-full left-1/2 transform -translate-x-1/2 mt-2.5 w-[260px] p-3 bg-white rounded-lg shadow-xl border border-gray-200 opacity-0 invisible group-hover:opacity-100 group-hover:visible transition-all duration-200 pointer-events-none z-50", children: [
+                  /* @__PURE__ */ jsx("p", { className: "text-center text-xs text-gray-600 leading-relaxed mb-2.5 px-1", children: "The average time a supervisor takes to resolve a workstation in red." }),
+                  /* @__PURE__ */ jsx("div", { className: "bg-gray-50 rounded-md py-1.5 border border-gray-100/80", children: /* @__PURE__ */ jsxs("p", { className: "text-center font-medium text-[11px] text-gray-500", children: [
+                    ((issueResolutionSummary?.resolved_issue_count || 0) + (issueResolutionSummary?.open_issue_count || 0)).toLocaleString(),
+                    " recorded issues"
+                  ] }) }),
+                  /* @__PURE__ */ jsx("div", { className: "absolute -top-1.5 left-1/2 transform -translate-x-1/2 w-3 h-3 bg-white border-l border-t border-gray-200 rotate-45" })
+                ] })
+              ] }),
+              /* @__PURE__ */ jsx("div", { className: "h-[calc(100%-2.5rem)] flex flex-col items-center justify-center gap-3", children: /* @__PURE__ */ jsx("span", { className: `text-4xl sm:text-5xl md:text-6xl lg:text-7xl font-bold ${shouldMaskIssueResolution ? "text-gray-400" : "text-gray-900"}`, children: issueResolutionValue }) })
+            ]
+          }
+        ),
         showIdleTime && /* @__PURE__ */ jsxs(motion.div, { variants: itemVariants, className: "bg-white rounded-xl shadow-sm p-3 sm:p-4 overflow-hidden h-[240px] sm:h-[260px] md:h-auto", children: [
           /* @__PURE__ */ jsx("h2", { className: "text-sm sm:text-base font-bold text-gray-700 text-center mb-2", children: "Idle Time Breakdown" }),
           /* @__PURE__ */ jsx("div", { className: "h-[calc(100%-2.5rem)]", children: /* @__PURE__ */ jsx(
@@ -60733,6 +61225,8 @@ var MetricCards = memo$1(({
   if (prevProps.efficiencyLegend !== nextProps.efficiencyLegend) return false;
   const prevMetrics = prevProps.lineInfo.metrics;
   const nextMetrics = nextProps.lineInfo.metrics;
+  const prevIssueSummary = prevProps.issueResolutionSummary;
+  const nextIssueSummary = nextProps.issueResolutionSummary;
   const prevIdleChartSignature = JSON.stringify(
     (prevProps.idleTimeData?.chartData || []).map((entry) => ({
       name: entry.name,
@@ -60751,6 +61245,9 @@ var MetricCards = memo$1(({
   );
   const idleTimeChanged = prevProps.idleTimeData?.isLoading !== nextProps.idleTimeData?.isLoading || prevProps.idleTimeData?.error !== nextProps.idleTimeData?.error || prevIdleChartSignature !== nextIdleChartSignature || prevProps.idleTimeData?.data?.total_idle_time_seconds !== nextProps.idleTimeData?.data?.total_idle_time_seconds || prevProps.idleTimeData?.data?.scope_work_seconds !== nextProps.idleTimeData?.data?.scope_work_seconds;
   if (idleTimeChanged) return false;
+  if (prevIssueSummary?.mean_resolution_seconds !== nextIssueSummary?.mean_resolution_seconds || prevIssueSummary?.median_resolution_seconds !== nextIssueSummary?.median_resolution_seconds || prevIssueSummary?.resolved_issue_count !== nextIssueSummary?.resolved_issue_count || prevIssueSummary?.open_issue_count !== nextIssueSummary?.open_issue_count || prevIssueSummary?.oldest_open_issue_age_seconds !== nextIssueSummary?.oldest_open_issue_age_seconds || prevIssueSummary?.total_issue_seconds !== nextIssueSummary?.total_issue_seconds) {
+    return false;
+  }
   return prevMetrics.current_output === nextMetrics.current_output && prevMetrics.line_threshold === nextMetrics.line_threshold && prevMetrics.underperforming_workspaces === nextMetrics.underperforming_workspaces && prevMetrics.total_workspaces === nextMetrics.total_workspaces && prevMetrics.avg_efficiency === nextMetrics.avg_efficiency;
 });
 MetricCards.displayName = "MetricCards";
@@ -61257,11 +61754,16 @@ var KPIDetailView = ({
   const {
     metrics: metrics2,
     lineDetails,
-    loading: lineMetricsLoading,
-    error: lineMetricsError,
-    refreshMetrics
-  } = useRealtimeLineMetrics({
+    workspaces,
+    issueResolutionSummary,
+    loading: lineDetailLoading,
+    error: lineDetailError,
+    refresh: refreshLineDetail
+  } = useLineDetailPageData({
     lineId,
+    companyId: resolvedCompanyId,
+    timezone: configuredTimezone,
+    shiftConfig,
     date: typeof urlDate === "string" ? urlDate : void 0,
     shiftId: parsedShiftId,
     enabled: !isShiftConfigLoading && (!historicalRouteRequested || historicalParamsReady)
@@ -61269,16 +61771,11 @@ var KPIDetailView = ({
   const resolvedMonitoringMode = lineDetails?.monitoring_mode ?? "output";
   const isUptimeMode = resolvedMonitoringMode === "uptime";
   const overviewTabLabel = isUptimeMode ? "Utilization" : "Efficiency";
-  const {
-    workspaces,
-    loading: workspacesLoading,
-    error: workspacesError,
-    refreshWorkspaces
-  } = useLineWorkspaceMetrics(lineId, {
-    initialDate: typeof urlDate === "string" ? urlDate : void 0,
-    initialShiftId: parsedShiftId,
-    enabled: !isShiftConfigLoading && (!historicalRouteRequested || historicalParamsReady)
-  });
+  const lineMetricsLoading = lineDetailLoading;
+  const workspacesLoading = lineDetailLoading;
+  const lineMetricsError = lineDetailError;
+  const workspacesError = lineDetailError;
+  const refreshMetrics = refreshLineDetail;
   const idleTimeDate = historicalRouteRequested ? historicalParamsReady ? urlDate : void 0 : typeof urlDate === "string" ? urlDate : metrics2?.date || cachedLineInfo?.date;
   const idleTimeShiftId = historicalRouteRequested ? historicalParamsReady ? parsedShiftId : void 0 : parsedShiftId ?? metrics2?.shift_id ?? cachedLineInfo?.shift_id;
   const idleTimeEnabled = activeTab === "overview" && !!lineId && idleTimeVlmEnabled && !!idleTimeDate && idleTimeShiftId !== void 0 && (!historicalRouteRequested || historicalParamsReady);
@@ -61994,7 +62491,6 @@ var KPIDetailView = ({
         {
           onClick: () => {
             refreshMetrics();
-            refreshWorkspaces();
           },
           className: "mt-4 px-4 py-2 bg-blue-600 text-white rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2",
           children: "Try Again"
@@ -62021,7 +62517,7 @@ var KPIDetailView = ({
     return /* @__PURE__ */ jsx(LoadingPage, { message: "Processing line data..." });
   }
   return /* @__PURE__ */ jsxs("div", { className: "min-h-screen bg-gray-50 flex flex-col", children: [
-    /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-10 bg-white border-b flex-shrink-0 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-4 md:px-6 py-2 sm:py-3", children: [
+    /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-40 bg-white border-b flex-shrink-0 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-4 md:px-6 py-2 sm:py-3", children: [
       /* @__PURE__ */ jsx("div", { className: "sm:hidden", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
         /* @__PURE__ */ jsx(
           "button",
@@ -62197,7 +62693,7 @@ var KPIDetailView = ({
             )
           ] }),
           /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 ml-auto", children: [
-            resolvedLineInfo && activeTab === "overview" && /* @__PURE__ */ jsx(LinePdfGenerator, { lineInfo: resolvedLineInfo, workspaceData: resolvedWorkspaces || [], shiftName: getShiftName(resolvedLineInfo.shift_id) }),
+            resolvedLineInfo && activeTab === "overview" && /* @__PURE__ */ jsx(LinePdfGenerator, { lineInfo: resolvedLineInfo, workspaceData: resolvedWorkspaces || [], issueResolutionSummary, shiftName: getShiftName(resolvedLineInfo.shift_id) }),
             activeTab === "monthly_history" && !urlDate && !urlShift && /* @__PURE__ */ jsxs(Fragment, { children: [
               /* @__PURE__ */ jsx(
                 MonthlyRangeFilter_default,
@@ -62256,6 +62752,7 @@ var KPIDetailView = ({
             MetricCards,
             {
               lineInfo: resolvedLineInfo,
+              issueResolutionSummary,
               idleTimeData,
               showIdleTime: idleTimeVlmEnabled,
               efficiencyLegend
@@ -62353,6 +62850,7 @@ var KPIDetailView = ({
             MetricCards,
             {
               lineInfo: resolvedLineInfo,
+              issueResolutionSummary,
               idleTimeData,
               showIdleTime: idleTimeVlmEnabled,
               efficiencyLegend
@@ -62522,18 +63020,18 @@ var LinesLeaderboard = ({
   isHistoricalDaily
 }) => {
   const formatEfficiency = (value) => typeof value === "number" && Number.isFinite(value) ? `${value.toFixed(1)}%` : "--";
-  const assignedLineIdSet = React141__default.useMemo(
+  const assignedLineIdSet = React142__default.useMemo(
     () => new Set(assignedLineIds || []),
     [assignedLineIds]
   );
-  const canClickLine = React141__default.useCallback(
+  const canClickLine = React142__default.useCallback(
     (lineId) => {
       if (!assignedLineIds) return true;
       return assignedLineIdSet.has(lineId);
     },
     [assignedLineIds, assignedLineIdSet]
   );
-  const handleTimeRangeChange = React141__default.useCallback((newRange) => {
+  const handleTimeRangeChange = React142__default.useCallback((newRange) => {
     if (newRange === timeRange) return;
     trackCoreEvent("Leaderboard Time Range Changed", {
       from_range: timeRange,
@@ -62544,7 +63042,7 @@ var LinesLeaderboard = ({
     });
     setTimeRange(newRange);
   }, [timeRange, lines.length, monthlyEfficiencyByLineId, setTimeRange]);
-  const handleLeaderboardLineClick = React141__default.useCallback((item, clickSource) => {
+  const handleLeaderboardLineClick = React142__default.useCallback((item, clickSource) => {
     if (!canClickLine(item.line.id)) return;
     trackCoreEvent("Leaderboard Line Clicked", {
       line_id: item.line.id,
@@ -62558,8 +63056,8 @@ var LinesLeaderboard = ({
     });
     onLineClick(item.line);
   }, [canClickLine, onLineClick, timeRange]);
-  const viewLoadedTrackedRef = React141__default.useRef(null);
-  const leaderboardData = React141__default.useMemo(() => {
+  const viewLoadedTrackedRef = React142__default.useRef(null);
+  const leaderboardData = React142__default.useMemo(() => {
     const loading = timeRange === "today" ? isLoadingToday : isLoadingMonthly;
     const efficiencyMap = timeRange === "today" ? todayEfficiencyByLineId : monthlyEfficiencyByLineId;
     return lines.map((line) => {
@@ -62590,7 +63088,7 @@ var LinesLeaderboard = ({
     isLoadingToday,
     isLoadingMonthly
   ]);
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     const isLoading = timeRange === "today" ? isLoadingToday : isLoadingMonthly;
     const trackingKey = `${timeRange}-${leaderboardData.length}`;
     if (leaderboardData.length > 0 && !isLoading && viewLoadedTrackedRef.current !== trackingKey) {
@@ -62616,7 +63114,7 @@ var LinesLeaderboard = ({
   const countdownFormat = timeRange === "monthly" ? "days" : "clock";
   const countdownFinishedLabel = timeRange === "monthly" ? "Finished" : "Shift Ended";
   const showCountdown = timeRange === "monthly" || !isHistoricalDaily;
-  const handleCountdownFinished = React141__default.useCallback(() => {
+  const handleCountdownFinished = React142__default.useCallback(() => {
     trackCoreEvent("Leaderboard Countdown Finished", {
       countdown_type: timeRange === "monthly" ? "month_end" : "shift_end",
       time_range: timeRange,
@@ -62643,7 +63141,7 @@ var LinesLeaderboard = ({
         return "bg-white border-gray-100";
     }
   };
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     const style = document.createElement("style");
     style.innerHTML = `
       @keyframes float {
@@ -62830,7 +63328,7 @@ var LineCard = ({
   supervisors
 }) => {
   const isUptimeLine = (line.monitoring_mode ?? "output") === "uptime";
-  const isOnTrack = React141__default.useMemo(() => {
+  const isOnTrack = React142__default.useMemo(() => {
     if (!kpis) return null;
     return isEfficiencyOnTrack(kpis.efficiency.value);
   }, [kpis]);
@@ -62988,6 +63486,9 @@ var KPIsOverviewView = ({
   const [selectedLeaderboardShiftId, setSelectedLeaderboardShiftId] = useState(0);
   const [hasHydratedLeaderboardRouteState, setHasHydratedLeaderboardRouteState] = useState(false);
   const [loading, setLoading] = useState(true);
+  const [isFilterOpen, setIsFilterOpen] = useState(false);
+  const filterRef = useRef(null);
+  const filterButtonRef = useRef(null);
   const [error, setError] = useState(null);
   const [topPerformer, setTopPerformer] = useState({
     name: "Top Performer",
@@ -63025,46 +63526,46 @@ var KPIsOverviewView = ({
   const configuredTimezone = dbTimezone || dateTimeConfig.defaultTimezone || "UTC";
   const { startDate: monthStartDate, endDate: monthEndDateKey, monthEndDate } = getMonthDateInfo(configuredTimezone);
   const isSuperAdmin = user?.scope_mode === "SUPER_ADMIN" || !!user?.access_scope?.is_super_admin;
-  const scopedLineIds = React141__default.useMemo(
+  const scopedLineIds = React142__default.useMemo(
     () => Array.isArray(user?.access_scope?.line_ids) ? user.access_scope.line_ids.filter((lineId) => typeof lineId === "string" && lineId.length > 0) : [],
     [user?.access_scope?.line_ids]
   );
   const hasCanonicalScope = !!user?.scope_mode || !!user?.access_scope;
   const scopeRole = (user?.role_level || user?.role || "").toLowerCase();
   const isStrictLineScopedRole = scopeRole === "supervisor" || isFactoryScopedRole(scopeRole);
-  const resolvedAssignedLineIds = React141__default.useMemo(() => {
+  const resolvedAssignedLineIds = React142__default.useMemo(() => {
     if (isSuperAdmin) return [];
     if (scopedLineIds.length > 0) return scopedLineIds;
     if (lineIds && lineIds.length > 0) return lineIds;
     if (isStrictLineScopedRole && hasCanonicalScope) return [];
     return [];
   }, [isSuperAdmin, scopedLineIds, lineIds, isStrictLineScopedRole, hasCanonicalScope]);
-  const assignedLineIdSet = React141__default.useMemo(
+  const assignedLineIdSet = React142__default.useMemo(
     () => new Set(resolvedAssignedLineIds),
     [resolvedAssignedLineIds]
   );
-  const metricsLineIds = React141__default.useMemo(() => {
+  const metricsLineIds = React142__default.useMemo(() => {
     if (isSuperAdmin) {
       return lineIds ?? [];
     }
     return resolvedAssignedLineIds;
   }, [isSuperAdmin, lineIds, resolvedAssignedLineIds]);
   const assignedLineIdsForLeaderboard = isSuperAdmin ? void 0 : resolvedAssignedLineIds;
-  const leaderboardLinesForView = React141__default.useMemo(() => {
+  const leaderboardLinesForView = React142__default.useMemo(() => {
     const targetMode = viewType === "machine" ? "uptime" : "output";
     return leaderboardLines.filter((line) => (line.monitoring_mode ?? "output") === targetMode);
   }, [leaderboardLines, viewType]);
-  const linesForView = React141__default.useMemo(() => {
+  const linesForView = React142__default.useMemo(() => {
     const targetMode = viewType === "machine" ? "uptime" : "output";
     return lines.filter((line) => (line.monitoring_mode ?? "output") === targetMode);
   }, [lines, viewType]);
-  const relevantLinesForMode = React141__default.useMemo(() => {
+  const relevantLinesForMode = React142__default.useMemo(() => {
     if (activeTab === "leaderboard") {
       return leaderboardLines.length > 0 ? leaderboardLines : lines;
     }
     return lines;
   }, [activeTab, leaderboardLines, lines]);
-  const { hasUptime, hasOutput } = React141__default.useMemo(() => {
+  const { hasUptime, hasOutput } = React142__default.useMemo(() => {
     let uptime = false;
     let output = false;
     for (const line of relevantLinesForMode) {
@@ -63089,11 +63590,32 @@ var KPIsOverviewView = ({
   const currentShiftDetails = getCurrentShift(configuredTimezone, shiftConfig);
   const currentShiftDate = currentShiftDetails.date;
   const currentShiftId = currentShiftDetails.shiftId;
-  const shiftEndDate = React141__default.useMemo(
+  const activeFiltersCount = React142__default.useMemo(() => {
+    let count = 0;
+    if (selectedLeaderboardShiftId !== currentShiftId) {
+      count++;
+    }
+    return count;
+  }, [selectedLeaderboardShiftId, currentShiftId]);
+  const clearFilters = React142__default.useCallback(() => {
+    setSelectedLeaderboardShiftId(currentShiftId);
+  }, [currentShiftId]);
+  useEffect(() => {
+    const handleClickOutside = (event) => {
+      const target = event.target;
+      if (filterButtonRef.current?.contains(target)) return;
+      if (filterRef.current && !filterRef.current.contains(target)) {
+        setIsFilterOpen(false);
+      }
+    };
+    document.addEventListener("mousedown", handleClickOutside);
+    return () => document.removeEventListener("mousedown", handleClickOutside);
+  }, []);
+  const shiftEndDate = React142__default.useMemo(
     () => getShiftEndDate(currentShiftDetails, configuredTimezone),
     [currentShiftDetails, configuredTimezone]
   );
-  const leaderboardShiftOptions = React141__default.useMemo(() => {
+  const leaderboardShiftOptions = React142__default.useMemo(() => {
     if (shiftConfig?.shifts && shiftConfig.shifts.length > 0) {
       return shiftConfig.shifts.map((shift) => ({
         id: shift.shiftId,
@@ -63173,15 +63695,15 @@ var KPIsOverviewView = ({
     lineId: factoryViewId,
     userAccessibleLineIds: metricsLineIds
   });
-  const defaultKPIs = React141__default.useMemo(() => createDefaultKPIs(), []);
-  const kpisByLineId = React141__default.useMemo(() => {
+  const defaultKPIs = React142__default.useMemo(() => createDefaultKPIs(), []);
+  const kpisByLineId = React142__default.useMemo(() => {
     const map = /* @__PURE__ */ new Map();
     lineMetrics.forEach((row) => {
       if (row?.line_id) map.set(row.line_id, buildKPIsFromLineMetricsRow(row));
     });
     return map;
   }, [lineMetrics]);
-  const supervisorLineIds = React141__default.useMemo(
+  const supervisorLineIds = React142__default.useMemo(
     () => (leaderboardLines.length > 0 ? leaderboardLines : lines).map((l) => l.id),
     [leaderboardLines, lines]
   );
@@ -63544,7 +64066,7 @@ var KPIsOverviewView = ({
   }
   if (error) {
     return /* @__PURE__ */ jsxs("div", { className: "min-h-screen bg-gray-50 flex flex-col", children: [
-      /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-10 bg-white border-b flex-shrink-0 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-4 md:px-6 py-2 sm:py-3", children: [
+      /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-40 bg-white border-b flex-shrink-0 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-4 md:px-6 py-2 sm:py-3", children: [
         /* @__PURE__ */ jsx("div", { className: "sm:hidden", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
           mobileMenuContext && /* @__PURE__ */ jsx(
             HamburgerButton,
@@ -63580,7 +64102,7 @@ var KPIsOverviewView = ({
   }
   if (lines.length === 0) {
     return /* @__PURE__ */ jsxs("div", { className: "min-h-screen bg-gray-50 flex flex-col", children: [
-      /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-10 bg-white border-b flex-shrink-0 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-4 md:px-6 py-2 sm:py-3", children: [
+      /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-40 bg-white border-b flex-shrink-0 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-4 md:px-6 py-2 sm:py-3", children: [
         /* @__PURE__ */ jsx("div", { className: "sm:hidden", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
           mobileMenuContext && /* @__PURE__ */ jsx(
             HamburgerButton,
@@ -63618,7 +64140,7 @@ var KPIsOverviewView = ({
     ] });
   }
   return /* @__PURE__ */ jsxs("div", { className: "min-h-screen bg-gray-50 flex flex-col", children: [
-    /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-10 bg-white border-b flex-shrink-0", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-4 md:px-6 py-2 sm:py-3", children: [
+    /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-40 bg-white border-b flex-shrink-0", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-4 md:px-6 py-2 sm:py-3", children: [
       /* @__PURE__ */ jsxs("div", { className: "sm:hidden", children: [
         /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
           mobileMenuContext && /* @__PURE__ */ jsx(
@@ -63630,12 +64152,7 @@ var KPIsOverviewView = ({
           ),
           /* @__PURE__ */ jsx("div", { className: "flex-1 flex items-center justify-center", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
             /* @__PURE__ */ jsx("h1", { className: "text-lg font-semibold text-gray-900", children: activeTab === "leaderboard" ? "Leaderboard" : "Overview" }),
-            /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: `h-2 w-2 rounded-full ring-2 ${showHistoricalLeaderboardHeader ? "bg-amber-500 ring-amber-500/20" : "bg-emerald-500 animate-pulse ring-emerald-500/20"}`
-              }
-            )
+            !showHistoricalLeaderboardHeader && /* @__PURE__ */ jsx("div", { className: "h-2 w-2 rounded-full bg-emerald-500 animate-pulse ring-2 ring-emerald-500/20" })
           ] }) }),
           /* @__PURE__ */ jsx("div", { className: "w-12" })
         ] }),
@@ -63646,9 +64163,23 @@ var KPIsOverviewView = ({
               /* @__PURE__ */ jsx("div", { className: "text-gray-700 scale-90", children: getShiftIcon2(headerShiftId) }),
               /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-gray-700", children: headerShiftName })
             ] }),
-            showHistoricalLeaderboardHeader ? /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center gap-1 px-2.5 py-1 bg-amber-50 text-amber-700 rounded-full", children: [
-              /* @__PURE__ */ jsx(Clock, { className: "w-3 h-3" }),
-              /* @__PURE__ */ jsx("span", { className: "text-xs font-medium", children: "Historical" })
+            showHistoricalLeaderboardHeader ? /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+              /* @__PURE__ */ jsxs("div", { className: "inline-flex items-center gap-1 px-2.5 py-1 bg-amber-50 text-amber-700 rounded-full", children: [
+                /* @__PURE__ */ jsx(Clock, { className: "w-3 h-3" }),
+                /* @__PURE__ */ jsx("span", { className: "text-xs font-medium", children: "Historical" })
+              ] }),
+              activeTab === "leaderboard" && isHistoricalLeaderboardDaily && /* @__PURE__ */ jsx(
+                "button",
+                {
+                  type: "button",
+                  onClick: () => {
+                    setSelectedLeaderboardDate(currentShiftDate);
+                    setSelectedLeaderboardShiftId(currentShiftId);
+                  },
+                  className: "text-[10px] font-medium text-blue-600 hover:text-blue-700 hover:underline bg-blue-50 px-2 py-1 rounded-md",
+                  children: "Return to Live"
+                }
+              )
             ] }) : /* @__PURE__ */ jsx("div", { className: "inline-flex items-center px-2.5 py-1 bg-green-100 rounded-full", children: /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-green-700", children: /* @__PURE__ */ jsx(ISTTimer_default, {}) }) })
           ] })
         ] }),
@@ -63750,79 +64281,88 @@ var KPIsOverviewView = ({
           ) }),
           /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
             /* @__PURE__ */ jsx("h1", { className: "text-2xl md:text-3xl lg:text-4xl font-semibold text-gray-900 tracking-tight", children: activeTab === "leaderboard" ? "Leaderboard" : "Overview" }),
-            /* @__PURE__ */ jsx(
-              "div",
-              {
-                className: `h-2.5 w-2.5 rounded-full ring-4 flex-shrink-0 ${showHistoricalLeaderboardHeader ? "bg-amber-500 ring-amber-500/10" : "bg-emerald-500 animate-pulse ring-emerald-500/10"}`
-              }
-            )
+            !showHistoricalLeaderboardHeader && /* @__PURE__ */ jsx("div", { className: "h-2.5 w-2.5 rounded-full ring-4 flex-shrink-0 bg-emerald-500 animate-pulse ring-emerald-500/10" })
           ] }),
-          !topPerformerLoading && activeTab !== "leaderboard" && /* @__PURE__ */ jsx("div", { className: "absolute right-0 top-1/2 -translate-y-1/2 z-10", children: /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-2xl border border-amber-200 shadow-md pl-1.5 pr-4 py-1.5 flex items-center gap-4 transition-all hover:shadow-lg hover:border-amber-300 group", children: [
-            /* @__PURE__ */ jsxs("div", { className: "relative", children: [
-              (!topPerformer.supervisors || topPerformer.supervisors.length <= 1) && /* @__PURE__ */ jsx("div", { className: "w-10 h-10 rounded-full ring-2 ring-amber-100 overflow-hidden bg-amber-50 shadow-inner flex-shrink-0 transition-transform group-hover:scale-105", children: showTopPerformerImage ? /* @__PURE__ */ jsx(
-                "img",
-                {
-                  src: topPerformer.imageUrl || "",
-                  alt: topPerformer.name,
-                  className: "w-full h-full object-cover",
-                  onError: () => setTopPerformerImageError(true)
-                }
-              ) : /* @__PURE__ */ jsx("div", { className: "w-full h-full flex items-center justify-center text-sm font-bold text-amber-600 uppercase", children: topPerformer.initials }) }),
-              topPerformer.supervisors && topPerformer.supervisors.length > 1 && /* @__PURE__ */ jsxs("div", { className: "flex -space-x-2", children: [
-                topPerformer.supervisors.slice(0, 3).map((supervisor, idx) => /* @__PURE__ */ jsxs(
-                  "div",
+          /* @__PURE__ */ jsxs("div", { className: "absolute right-0 top-1/2 -translate-y-1/2 z-10 flex items-center", children: [
+            !topPerformerLoading && activeTab !== "leaderboard" && /* @__PURE__ */ jsxs("div", { className: "bg-white rounded-2xl border border-amber-200 shadow-md pl-1.5 pr-4 py-1.5 flex items-center gap-4 transition-all hover:shadow-lg hover:border-amber-300 group", children: [
+              /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+                (!topPerformer.supervisors || topPerformer.supervisors.length <= 1) && /* @__PURE__ */ jsx("div", { className: "w-10 h-10 rounded-full ring-2 ring-amber-100 overflow-hidden bg-amber-50 shadow-inner flex-shrink-0 transition-transform group-hover:scale-105", children: showTopPerformerImage ? /* @__PURE__ */ jsx(
+                  "img",
                   {
-                    className: "relative inline-block w-10 h-10 rounded-full ring-2 ring-white bg-amber-50 shadow-sm z-0 hover:z-10 transition-all hover:scale-110 group/avatar",
-                    style: { zIndex: 3 - idx },
-                    children: [
-                      supervisor.imageUrl ? /* @__PURE__ */ jsx(
-                        "img",
-                        {
-                          src: supervisor.imageUrl,
-                          alt: supervisor.name,
-                          className: "w-full h-full object-cover rounded-full"
-                        }
-                      ) : /* @__PURE__ */ jsx("div", { className: "w-full h-full flex items-center justify-center text-sm font-bold text-amber-600 uppercase rounded-full", children: supervisor.initials }),
-                      /* @__PURE__ */ jsxs("div", { className: "absolute bottom-full left-1/2 -translate-x-1/2 mb-2 px-2 py-1 bg-gray-900 text-white text-[10px] font-medium rounded shadow-lg opacity-0 group-hover/avatar:opacity-100 transition-opacity whitespace-nowrap pointer-events-none z-20", children: [
-                        supervisor.name,
-                        /* @__PURE__ */ jsx("div", { className: "absolute top-full left-1/2 -translate-x-1/2 -mt-[1px] border-4 border-transparent border-t-gray-900" })
-                      ] })
-                    ]
-                  },
-                  supervisor.userId
-                )),
-                topPerformer.supervisors.length > 3 && /* @__PURE__ */ jsxs("div", { className: "inline-flex w-10 h-10 rounded-full ring-2 ring-white bg-amber-100 items-center justify-center text-sm font-medium text-amber-700 z-0", children: [
-                  "+",
-                  topPerformer.supervisors.length - 3
+                    src: topPerformer.imageUrl || "",
+                    alt: topPerformer.name,
+                    className: "w-full h-full object-cover",
+                    onError: () => setTopPerformerImageError(true)
+                  }
+                ) : /* @__PURE__ */ jsx("div", { className: "w-full h-full flex items-center justify-center text-sm font-bold text-amber-600 uppercase", children: topPerformer.initials }) }),
+                topPerformer.supervisors && topPerformer.supervisors.length > 1 && /* @__PURE__ */ jsxs("div", { className: "flex -space-x-2", children: [
+                  topPerformer.supervisors.slice(0, 3).map((supervisor, idx) => /* @__PURE__ */ jsxs(
+                    "div",
+                    {
+                      className: "relative inline-block w-10 h-10 rounded-full ring-2 ring-white bg-amber-50 shadow-sm z-0 hover:z-10 transition-all hover:scale-110 group/avatar",
+                      style: { zIndex: 3 - idx },
+                      children: [
+                        supervisor.imageUrl ? /* @__PURE__ */ jsx(
+                          "img",
+                          {
+                            src: supervisor.imageUrl,
+                            alt: supervisor.name,
+                            className: "w-full h-full object-cover rounded-full"
+                          }
+                        ) : /* @__PURE__ */ jsx("div", { className: "w-full h-full flex items-center justify-center text-sm font-bold text-amber-600 uppercase rounded-full", children: supervisor.initials }),
+                        /* @__PURE__ */ jsxs("div", { className: "absolute bottom-full left-1/2 -translate-x-1/2 mb-2 px-2 py-1 bg-gray-900 text-white text-[10px] font-medium rounded shadow-lg opacity-0 group-hover/avatar:opacity-100 transition-opacity whitespace-nowrap pointer-events-none z-20", children: [
+                          supervisor.name,
+                          /* @__PURE__ */ jsx("div", { className: "absolute top-full left-1/2 -translate-x-1/2 -mt-[1px] border-4 border-transparent border-t-gray-900" })
+                        ] })
+                      ]
+                    },
+                    supervisor.userId
+                  )),
+                  topPerformer.supervisors.length > 3 && /* @__PURE__ */ jsxs("div", { className: "inline-flex w-10 h-10 rounded-full ring-2 ring-white bg-amber-100 items-center justify-center text-sm font-medium text-amber-700 z-0", children: [
+                    "+",
+                    topPerformer.supervisors.length - 3
+                  ] })
                 ] })
-              ] })
-            ] }),
-            /* @__PURE__ */ jsxs("div", { className: "flex flex-col min-w-0", children: [
-              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-[10px] leading-tight mb-1", children: [
-                /* @__PURE__ */ jsx("span", { className: "font-bold text-amber-600 uppercase tracking-widest", children: "Performer of the month" }),
-                /* @__PURE__ */ jsx("span", { className: "text-amber-200 opacity-50", children: "\u2022" }),
-                /* @__PURE__ */ jsx("span", { className: "font-semibold text-gray-400", children: topPerformer.periodLabel })
               ] }),
-              /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 leading-tight", children: [
-                /* @__PURE__ */ jsx("div", { className: "max-w-[140px]", children: /* @__PURE__ */ jsx(
-                  FittingTitle,
-                  {
-                    title: topPerformer.name,
-                    as: "span",
-                    className: "text-sm text-gray-900 font-bold"
-                  }
-                ) }),
-                /* @__PURE__ */ jsx("span", { className: "w-px h-3.5 bg-gray-200 flex-shrink-0" }),
-                /* @__PURE__ */ jsx("div", { className: "max-w-[150px]", children: /* @__PURE__ */ jsx(
-                  FittingTitle,
-                  {
-                    title: topPerformer.unit,
-                    className: "text-xs font-medium text-gray-500"
-                  }
-                ) })
+              /* @__PURE__ */ jsxs("div", { className: "flex flex-col min-w-0", children: [
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2 text-[10px] leading-tight mb-1", children: [
+                  /* @__PURE__ */ jsx("span", { className: "font-bold text-amber-600 uppercase tracking-widest", children: "Performer of the month" }),
+                  /* @__PURE__ */ jsx("span", { className: "text-amber-200 opacity-50", children: "\u2022" }),
+                  /* @__PURE__ */ jsx("span", { className: "font-semibold text-gray-400", children: topPerformer.periodLabel })
+                ] }),
+                /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 leading-tight", children: [
+                  /* @__PURE__ */ jsx("div", { className: "max-w-[140px]", children: /* @__PURE__ */ jsx(
+                    FittingTitle,
+                    {
+                      title: topPerformer.name,
+                      as: "span",
+                      className: "text-sm text-gray-900 font-bold"
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx("span", { className: "w-px h-3.5 bg-gray-200 flex-shrink-0" }),
+                  /* @__PURE__ */ jsx("div", { className: "max-w-[150px]", children: /* @__PURE__ */ jsx(
+                    FittingTitle,
+                    {
+                      title: topPerformer.unit,
+                      className: "text-xs font-medium text-gray-500"
+                    }
+                  ) })
+                ] })
               ] })
-            ] })
-          ] }) })
+            ] }),
+            activeTab === "leaderboard" && isHistoricalLeaderboardDaily && /* @__PURE__ */ jsx(
+              "button",
+              {
+                type: "button",
+                onClick: () => {
+                  setSelectedLeaderboardDate(currentShiftDate);
+                  setSelectedLeaderboardShiftId(currentShiftId);
+                },
+                className: "text-xs sm:text-sm font-medium text-blue-600 bg-blue-50 border border-blue-100 hover:bg-blue-100 hover:text-blue-700 px-3 py-1.5 rounded-lg transition-colors shadow-sm ml-4 whitespace-nowrap",
+                children: "Return to Live"
+              }
+            )
+          ] })
         ] }),
         /* @__PURE__ */ jsx("div", { className: "bg-blue-50/50 px-4 py-2 rounded-xl border border-blue-100/50 backdrop-blur-sm", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-center gap-6", children: [
           !isMonthlyMode && !showHistoricalLeaderboardHeader && /* @__PURE__ */ jsxs(Fragment, { children: [
@@ -63892,29 +64432,49 @@ var KPIsOverviewView = ({
                   singleDateOnly: true
                 }
               ),
-              /* @__PURE__ */ jsx("div", { className: "relative", children: /* @__PURE__ */ jsx(
-                "select",
-                {
-                  "aria-label": "Leaderboard shift",
-                  value: effectiveLeaderboardShiftId,
-                  onChange: (e) => setSelectedLeaderboardShiftId(Number(e.target.value)),
-                  className: "appearance-none pl-3 pr-8 py-1.5 text-sm font-medium bg-white border border-gray-200 hover:border-gray-300 rounded-lg text-gray-700 focus:outline-none focus:ring-2 focus:ring-blue-500 transition-all cursor-pointer shadow-sm min-w-[170px]",
-                  style: { backgroundImage: `url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e")`, backgroundPosition: `right 0.5rem center`, backgroundRepeat: `no-repeat`, backgroundSize: `1.2em 1.2em` },
-                  children: leaderboardShiftOptions.map((shiftOption) => /* @__PURE__ */ jsx("option", { value: shiftOption.id, children: shiftOption.label }, shiftOption.id))
-                }
-              ) }),
-              isHistoricalLeaderboardDaily && /* @__PURE__ */ jsx(
-                "button",
-                {
-                  type: "button",
-                  onClick: () => {
-                    setSelectedLeaderboardDate(currentShiftDate);
-                    setSelectedLeaderboardShiftId(currentShiftId);
-                  },
-                  className: "text-xs font-medium text-blue-600 hover:text-blue-700 whitespace-nowrap",
-                  children: "Return to Live"
-                }
-              )
+              /* @__PURE__ */ jsxs("div", { className: "relative", children: [
+                /* @__PURE__ */ jsxs(
+                  "button",
+                  {
+                    ref: filterButtonRef,
+                    onClick: () => setIsFilterOpen(!isFilterOpen),
+                    className: `flex items-center gap-2 px-3 py-1.5 rounded-lg border text-sm font-medium transition-all shadow-sm ${isFilterOpen || activeFiltersCount > 0 ? "bg-blue-50 border-blue-200 text-blue-700" : "bg-white border-gray-200 text-gray-700 hover:bg-gray-50"}`,
+                    children: [
+                      /* @__PURE__ */ jsx(Filter, { className: "w-4 h-4" }),
+                      /* @__PURE__ */ jsx("span", { children: "Filters" }),
+                      activeFiltersCount > 0 && /* @__PURE__ */ jsx("span", { className: "flex items-center justify-center w-5 h-5 bg-blue-100 text-blue-700 text-xs rounded-full font-bold ml-1", children: activeFiltersCount }),
+                      /* @__PURE__ */ jsx(ChevronDown, { className: `w-3 h-3 ml-1 transition-transform ${isFilterOpen ? "rotate-180" : ""}` })
+                    ]
+                  }
+                ),
+                isFilterOpen && /* @__PURE__ */ jsxs("div", { ref: filterRef, className: "absolute right-0 top-full mt-2 w-72 bg-white rounded-xl shadow-xl border border-gray-100 p-4 z-50", children: [
+                  /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-3", children: [
+                    /* @__PURE__ */ jsx("h3", { className: "text-sm font-semibold text-gray-900", children: "Filter View" }),
+                    activeFiltersCount > 0 && /* @__PURE__ */ jsx(
+                      "button",
+                      {
+                        onClick: clearFilters,
+                        className: "text-xs text-red-600 hover:text-red-700 font-medium",
+                        children: "Clear all"
+                      }
+                    )
+                  ] }),
+                  /* @__PURE__ */ jsx("div", { className: "space-y-3", children: /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
+                    /* @__PURE__ */ jsx("label", { className: "text-xs font-medium text-gray-500 uppercase tracking-wide ml-1", children: "Shift" }),
+                    /* @__PURE__ */ jsx("div", { className: "relative", children: /* @__PURE__ */ jsx(
+                      "select",
+                      {
+                        "aria-label": "Leaderboard shift",
+                        value: effectiveLeaderboardShiftId,
+                        onChange: (e) => setSelectedLeaderboardShiftId(Number(e.target.value)),
+                        className: "w-full appearance-none pl-3 pr-8 py-2 text-sm bg-gray-50 border border-gray-200 hover:border-gray-300 rounded-lg text-gray-900 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:bg-white transition-all cursor-pointer",
+                        style: { backgroundImage: `url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e")`, backgroundPosition: `right 0.75rem center`, backgroundRepeat: `no-repeat`, backgroundSize: `1.2em 1.2em` },
+                        children: leaderboardShiftOptions.map((shiftOption) => /* @__PURE__ */ jsx("option", { value: shiftOption.id, children: shiftOption.label }, shiftOption.id))
+                      }
+                    ) })
+                  ] }) })
+                ] })
+              ] })
             ] }),
             (activeTab === "leaderboard" || activeTab === "today") && showViewTypeDropdown && /* @__PURE__ */ jsx("div", { className: "relative", children: /* @__PURE__ */ jsxs(
               "select",
@@ -64005,29 +64565,16 @@ var formatCycleTimeValue = (value) => {
   return `${numericValue.toFixed(1)}s`;
 };
 var CycleTimeComparison = memo$1(({
-  workspace,
-  variant = "table"
+  workspace
 }) => {
   const averageValue = formatCycleTimeValue(workspace.avg_cycle_time);
   const standardValue = formatCycleTimeValue(workspace.ideal_cycle_time);
-  if (variant === "mobile") {
-    return /* @__PURE__ */ jsxs("div", { className: "mt-2 flex items-center justify-between py-2 border-t border-gray-100", children: [
-      /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-gray-500 uppercase tracking-wider", children: "Standard Cycle Time" }),
-      /* @__PURE__ */ jsx("span", { className: "text-sm font-medium tabular-nums text-gray-500", children: standardValue })
-    ] });
-  }
-  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
-      /* @__PURE__ */ jsx("span", { className: "text-[10px] font-medium uppercase tracking-wider text-gray-500", children: "Average" }),
-      /* @__PURE__ */ jsx("span", { className: "text-sm font-semibold tabular-nums text-gray-900", children: averageValue })
-    ] }),
-    /* @__PURE__ */ jsx("div", { className: "h-6 w-px bg-gray-200" }),
-    /* @__PURE__ */ jsxs("div", { className: "flex flex-col", children: [
-      /* @__PURE__ */ jsx("span", { className: "text-[10px] font-medium uppercase tracking-wider text-gray-500", children: "Standard" }),
-      /* @__PURE__ */ jsx("span", { className: "text-sm font-medium tabular-nums text-gray-500", children: standardValue })
-    ] })
+  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 tabular-nums", children: [
+    /* @__PURE__ */ jsx("span", { className: "font-semibold text-gray-900", children: averageValue }),
+    /* @__PURE__ */ jsx("span", { className: "text-gray-400 font-normal", children: "/" }),
+    /* @__PURE__ */ jsx("span", { className: "font-medium text-gray-500", children: standardValue })
   ] });
-}, (prevProps, nextProps) => prevProps.variant === nextProps.variant && prevProps.workspace.avg_cycle_time === nextProps.workspace.avg_cycle_time && prevProps.workspace.ideal_cycle_time === nextProps.workspace.ideal_cycle_time);
+}, (prevProps, nextProps) => prevProps.workspace.avg_cycle_time === nextProps.workspace.avg_cycle_time && prevProps.workspace.ideal_cycle_time === nextProps.workspace.ideal_cycle_time);
 CycleTimeComparison.displayName = "CycleTimeComparison";
 var IsolatedTimer = memo$1(() => {
   return /* @__PURE__ */ jsx(ISTTimer_default, {});
@@ -64094,7 +64641,7 @@ var MobileWorkspaceCard = memo$1(({
   getMedalIcon,
   metricLabel,
   isAssemblyMode
-}) => /* @__PURE__ */ jsxs(
+}) => /* @__PURE__ */ jsx(
   motion.div,
   {
     layout: true,
@@ -64105,28 +64652,25 @@ var MobileWorkspaceCard = memo$1(({
     },
     onClick: isClickable ? () => onWorkspaceClick(workspace, rank) : void 0,
     className: `${cardClass} p-3 rounded-lg border shadow-sm active:scale-[0.98] ${isClickable ? "cursor-pointer" : "cursor-not-allowed opacity-75"}`,
-    children: [
-      /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-2 gap-3", children: [
-        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
-          /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
-            /* @__PURE__ */ jsxs("div", { className: "text-2xl font-bold text-gray-700", children: [
-              "#",
-              rank
-            ] }),
-            getMedalIcon(rank)
+    children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between mb-2 gap-3", children: [
+      /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
+        /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
+          /* @__PURE__ */ jsxs("div", { className: "text-2xl font-bold text-gray-700", children: [
+            "#",
+            rank
           ] }),
-          /* @__PURE__ */ jsxs("div", { children: [
-            /* @__PURE__ */ jsx("div", { className: "font-semibold text-gray-900", children: workspace.displayName }),
-            /* @__PURE__ */ jsx("div", { className: "text-xs text-gray-500", children: workspace.lineName })
-          ] })
+          getMedalIcon(rank)
         ] }),
-        /* @__PURE__ */ jsxs("div", { className: "text-right", children: [
-          /* @__PURE__ */ jsx("div", { className: "font-bold text-gray-900 text-lg", children: isAssemblyMode ? /* @__PURE__ */ jsx("span", { className: "tabular-nums", children: formatCycleTimeValue(workspace.avg_cycle_time) }) : /* @__PURE__ */ jsx(AnimatedEfficiency, { value: workspace.efficiency || 0 }) }),
-          /* @__PURE__ */ jsx("div", { className: "text-xs text-gray-500", children: metricLabel })
+        /* @__PURE__ */ jsxs("div", { children: [
+          /* @__PURE__ */ jsx("div", { className: "font-semibold text-gray-900", children: workspace.displayName }),
+          /* @__PURE__ */ jsx("div", { className: "text-xs text-gray-500", children: workspace.lineName })
         ] })
       ] }),
-      isAssemblyMode && /* @__PURE__ */ jsx(CycleTimeComparison, { workspace, variant: "mobile" })
-    ]
+      /* @__PURE__ */ jsxs("div", { className: "text-right", children: [
+        /* @__PURE__ */ jsx("div", { className: "font-bold text-gray-900 text-lg flex justify-end", children: isAssemblyMode ? /* @__PURE__ */ jsx(CycleTimeComparison, { workspace }) : /* @__PURE__ */ jsx(AnimatedEfficiency, { value: workspace.efficiency || 0 }) }),
+        /* @__PURE__ */ jsx("div", { className: "text-xs text-gray-500", children: metricLabel })
+      ] })
+    ] })
   }
 ), (prevProps, nextProps) => {
   return prevProps.metricLabel === nextProps.metricLabel && prevProps.isAssemblyMode === nextProps.isAssemblyMode && prevProps.rank === nextProps.rank && prevProps.cardClass === nextProps.cardClass && prevProps.isClickable === nextProps.isClickable && prevProps.workspace.workspace_uuid === nextProps.workspace.workspace_uuid && prevProps.workspace.efficiency === nextProps.workspace.efficiency && prevProps.workspace.ideal_cycle_time === nextProps.workspace.ideal_cycle_time && prevProps.workspace.action_count === nextProps.workspace.action_count && prevProps.workspace.action_threshold === nextProps.workspace.action_threshold && prevProps.workspace.avg_cycle_time === nextProps.workspace.avg_cycle_time && prevProps.workspace.displayName === nextProps.workspace.displayName && prevProps.workspace.lineName === nextProps.workspace.lineName;
@@ -64156,7 +64700,7 @@ var DesktopWorkspaceRow = memo$1(({
       ] }) }),
       /* @__PURE__ */ jsx("td", { className: "px-3 py-2.5 sm:p-4 text-sm sm:text-base whitespace-nowrap", children: /* @__PURE__ */ jsx("div", { className: "font-medium", children: workspace.displayName }) }),
       /* @__PURE__ */ jsx("td", { className: "px-3 py-2.5 sm:p-4 text-sm sm:text-base whitespace-nowrap", children: /* @__PURE__ */ jsx("div", { className: "font-medium", children: workspace.lineName }) }),
-      /* @__PURE__ */ jsx("td", { className: `px-3 py-2.5 sm:p-4 text-sm sm:text-base font-medium ${isAssemblyMode ? "" : "whitespace-nowrap"}`, children: isAssemblyMode ? /* @__PURE__ */ jsx(CycleTimeComparison, { workspace, variant: "table" }) : /* @__PURE__ */ jsx(AnimatedEfficiency, { value: workspace.efficiency || 0 }) })
+      /* @__PURE__ */ jsx("td", { className: `px-3 py-2.5 sm:p-4 text-sm sm:text-base font-medium ${isAssemblyMode ? "" : "whitespace-nowrap"}`, children: isAssemblyMode ? /* @__PURE__ */ jsx(CycleTimeComparison, { workspace }) : /* @__PURE__ */ jsx(AnimatedEfficiency, { value: workspace.efficiency || 0 }) })
     ]
   }
 ), (prevProps, nextProps) => {
@@ -64283,7 +64827,7 @@ var LeaderboardDetailView = memo$1(({
     return () => document.removeEventListener("mousedown", handleClickOutside);
   }, []);
   const [isMobile, setIsMobile] = useState(false);
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     const checkMobile = () => setIsMobile(window.innerWidth < 640);
     checkMobile();
     window.addEventListener("resize", checkMobile);
@@ -64929,7 +65473,7 @@ var LeaderboardDetailView = memo$1(({
   const descendingSortLabel = "Highest to Lowest";
   const ascendingSortLabel = "Lowest to Highest";
   return /* @__PURE__ */ jsxs("div", { className: `min-h-screen bg-slate-50 flex flex-col ${className}`, style: { willChange: "contents" }, children: [
-    /* @__PURE__ */ jsx("div", { className: "sticky top-0 z-20 bg-white shadow-sm border-b border-gray-200/80", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-6 md:px-8 py-2 sm:py-2.5", children: [
+    /* @__PURE__ */ jsx("div", { className: "sticky top-0 z-40 bg-white shadow-sm border-b border-gray-200/80", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-6 md:px-8 py-2 sm:py-2.5", children: [
       /* @__PURE__ */ jsx("div", { className: "sm:hidden", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
         mobileMenuContext && /* @__PURE__ */ jsx(
           HamburgerButton,
@@ -64940,7 +65484,7 @@ var LeaderboardDetailView = memo$1(({
         ),
         /* @__PURE__ */ jsx("div", { className: "flex-1 flex items-center justify-center", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
           /* @__PURE__ */ jsx("h1", { className: "text-lg font-semibold text-gray-900", children: "Leaderboard" }),
-          /* @__PURE__ */ jsx("div", { className: "h-2 w-2 rounded-full bg-emerald-500 animate-pulse ring-2 ring-emerald-500/20" })
+          realtimeEnabled && /* @__PURE__ */ jsx("div", { className: "h-2 w-2 rounded-full bg-emerald-500 animate-pulse ring-2 ring-emerald-500/20" })
         ] }) }),
         /* @__PURE__ */ jsx("div", { className: "w-9" })
       ] }) }),
@@ -64956,7 +65500,7 @@ var LeaderboardDetailView = memo$1(({
         ) }),
         /* @__PURE__ */ jsx("div", { className: "absolute left-1/2 transform -translate-x-1/2 max-w-[calc(100%-200px)]", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3", children: [
           /* @__PURE__ */ jsx("h1", { className: "text-lg md:text-xl lg:text-2xl xl:text-3xl font-semibold text-gray-900 truncate", children: "Leaderboard" }),
-          /* @__PURE__ */ jsxs("div", { className: "relative flex h-2.5 w-2.5", children: [
+          realtimeEnabled && /* @__PURE__ */ jsxs("div", { className: "relative flex h-2.5 w-2.5", children: [
             /* @__PURE__ */ jsx("span", { className: "animate-ping absolute inline-flex h-full w-full rounded-full bg-green-400 opacity-75" }),
             /* @__PURE__ */ jsx("span", { className: "relative inline-flex rounded-full h-2.5 w-2.5 bg-green-500" })
           ] })
@@ -65454,7 +65998,7 @@ var ProfileView = () => {
     ] }) });
   }
   return /* @__PURE__ */ jsxs("div", { className: "min-h-screen bg-gray-50 flex flex-col", children: [
-    /* @__PURE__ */ jsxs("header", { className: "sticky top-0 z-10 bg-white border-b flex-shrink-0", children: [
+    /* @__PURE__ */ jsxs("header", { className: "sticky top-0 z-40 bg-white border-b flex-shrink-0", children: [
       /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-4 md:px-6 py-2 sm:py-3", children: [
         /* @__PURE__ */ jsxs("div", { className: "sm:hidden flex items-center justify-between", children: [
           /* @__PURE__ */ jsx("div", { className: "flex items-center", children: mobileMenuContext && /* @__PURE__ */ jsx(
@@ -65678,7 +66222,7 @@ var ClipsCostView = () => {
     return /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center min-h-screen bg-gray-50", children: /* @__PURE__ */ jsx(OptifyeLogoLoader_default, { size: "lg", message: "Loading usage data..." }) });
   }
   return /* @__PURE__ */ jsxs("div", { className: "min-h-screen bg-gray-50 flex flex-col", children: [
-    /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-10 bg-white border-b border-gray-200 shadow-sm flex-shrink-0", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-6 lg:px-8 py-3 sm:py-4 w-full", children: [
+    /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-40 bg-white border-b border-gray-200 shadow-sm flex-shrink-0", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-6 lg:px-8 py-3 sm:py-4 w-full", children: [
       /* @__PURE__ */ jsx("div", { className: "sm:hidden", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
         /* @__PURE__ */ jsx("div", { className: "flex items-center", children: mobileMenuContext && /* @__PURE__ */ jsx(
           HamburgerButton,
@@ -66565,7 +67109,7 @@ var ShiftsView = ({
     }
   }, [lineConfigs, recalculateTargetsForShiftHourChanges, supabase, showToast]);
   return /* @__PURE__ */ jsxs("div", { className: `min-h-screen bg-slate-50 ${className}`, children: [
-    /* @__PURE__ */ jsx("div", { className: "sticky top-0 z-10 bg-white border-b border-gray-200/80 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-4 md:px-6 lg:px-8 py-3 sm:py-4", children: [
+    /* @__PURE__ */ jsx("div", { className: "sticky top-0 z-40 bg-white border-b border-gray-200/80 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-4 md:px-6 lg:px-8 py-3 sm:py-4", children: [
       /* @__PURE__ */ jsx("div", { className: "sm:hidden", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
         mobileMenuContext && /* @__PURE__ */ jsx(
           HamburgerButton,
@@ -66679,7 +67223,7 @@ var ShiftsView = ({
     ] })
   ] });
 };
-var AuthenticatedShiftsView = withAuth(React141__default.memo(ShiftsView));
+var AuthenticatedShiftsView = withAuth(React142__default.memo(ShiftsView));
 var ShiftsView_default = ShiftsView;
 
 // src/views/TargetsView.utils.ts
@@ -68381,7 +68925,7 @@ var TargetsView = ({
 };
 var TargetsViewWithDisplayNames = withAllWorkspaceDisplayNames(TargetsView);
 var TargetsView_default = TargetsViewWithDisplayNames;
-var AuthenticatedTargetsView = withAuth(React141__default.memo(TargetsViewWithDisplayNames));
+var AuthenticatedTargetsView = withAuth(React142__default.memo(TargetsViewWithDisplayNames));
 function useTimezone(options = {}) {
   const dashboardConfig = useDashboardConfig();
   const workspaceConfig = useWorkspaceConfig();
@@ -69187,56 +69731,43 @@ var WorkspaceDetailView = ({
   const canToggleChartIdleTime = !isUptimeMode && !shouldShowCycleTimeLoadingState && !shouldShowCycleTimeUnavailableState;
   const idleClipDate = date || workspace?.date || calculatedOperationalDate || getOperationalDate(timezone);
   const idleClipShiftId = parsedShiftId ?? workspace?.shift_id;
-  const rawHourlyIdleMinutes = useMemo(() => {
-    if (!shouldShowCycleTimeChart || !workspace?.idle_time_hourly || !workspace?.shift_start) return [];
-    const parseTimeToMinutes4 = (time2) => {
-      const [h, m] = time2.split(":").map(Number);
-      if (!Number.isFinite(h) || !Number.isFinite(m)) return 0;
-      return h * 60 + m;
-    };
-    const startTotal = parseTimeToMinutes4(workspace.shift_start);
-    const endTotalRaw = workspace.shift_end ? parseTimeToMinutes4(workspace.shift_end) : startTotal + 11 * 60;
-    const endTotal = endTotalRaw <= startTotal ? endTotalRaw + 24 * 60 : endTotalRaw;
-    const shiftDuration = Math.max(60, endTotal - startTotal);
-    const totalHourSlots = Math.max(1, Math.ceil(shiftDuration / 60));
-    const idleTimeHourlyObj = workspace.idle_time_hourly || {};
-    const result = Array(totalHourSlots).fill(0);
-    for (let i = 0; i < totalHourSlots; i++) {
-      const startSlotMins = startTotal + i * 60;
-      let endSlotMins = startSlotMins + 60;
-      if (endSlotMins > endTotal) endSlotMins = endTotal;
-      let idleCount = 0;
-      for (let m = startSlotMins; m < endSlotMins; m++) {
-        const hourKey = Math.floor(m / 60) % 24;
-        const minuteKey = m % 60;
-        const hourData = idleTimeHourlyObj[hourKey.toString()] || [];
-        if (Array.isArray(hourData)) {
-          const val = hourData[minuteKey];
-          if (val === 1 || val === "1") {
-            idleCount++;
-          }
-        }
-      }
-      result[i] = idleCount;
-    }
-    return result;
-  }, [shouldShowCycleTimeChart, workspace?.idle_time_hourly, workspace?.shift_start, workspace?.shift_end]);
+  const rawHourlyIdleSlots = useMemo(
+    () => !shouldShowCycleTimeChart || !authoritativeCycleMetrics?.shift_start ? [] : buildHourlyIdleSlots({
+      idleTimeHourly: authoritativeCycleMetrics.idle_time_hourly,
+      shiftStart: authoritativeCycleMetrics.shift_start,
+      shiftEnd: authoritativeCycleMetrics.shift_end
+    }),
+    [
+      shouldShowCycleTimeChart,
+      authoritativeCycleMetrics?.idle_time_hourly,
+      authoritativeCycleMetrics?.shift_start,
+      authoritativeCycleMetrics?.shift_end
+    ]
+  );
+  const rawHourlyIdleMinutes = useMemo(
+    () => rawHourlyIdleSlots.map((slot) => slot.idleMinutes),
+    [rawHourlyIdleSlots]
+  );
   const hourlyIdleMinutes = useMemo(
     () => maskFutureHourlySeries({
       data: rawHourlyIdleMinutes,
-      shiftStart: workspace?.shift_start,
-      shiftEnd: workspace?.shift_end,
+      shiftStart: authoritativeCycleMetrics?.shift_start,
+      shiftEnd: authoritativeCycleMetrics?.shift_end,
       shiftDate: idleClipDate,
       timezone: effectiveCycleTimeTimezone
     }),
     [
       rawHourlyIdleMinutes,
-      workspace?.shift_start,
-      workspace?.shift_end,
+      authoritativeCycleMetrics?.shift_start,
+      authoritativeCycleMetrics?.shift_end,
       idleClipDate,
       effectiveCycleTimeTimezone
     ]
   );
+  const hourlyIdleSlots = useMemo(
+    () => rawHourlyIdleSlots.map((slot, index) => hourlyIdleMinutes[index] === null ? null : slot),
+    [rawHourlyIdleSlots, hourlyIdleMinutes]
+  );
   const cycleTimeUnavailableView = useMemo(() => /* @__PURE__ */ jsxs("div", { className: "w-full h-full rounded-lg border border-amber-200 bg-amber-50/70 px-6 py-5 text-center flex flex-col items-center justify-center", children: [
     /* @__PURE__ */ jsx("h4", { className: "text-base font-semibold text-amber-900", children: "Cycle data unavailable" }),
     /* @__PURE__ */ jsx("p", { className: "mt-2 max-w-md text-sm text-amber-800", children: "This workstation has cycle-time metrics for the selected shift, but no matching `cycle_completion` clips were found for the chart." }),
@@ -69403,7 +69934,7 @@ var WorkspaceDetailView = ({
         animate: { opacity: 1 },
         transition: { duration: 0.3 },
         children: /* @__PURE__ */ jsxs("div", { className: "min-h-screen w-full flex flex-col bg-slate-50", children: [
-          /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-10 px-3 sm:px-4 md:px-5 lg:px-6 py-2 sm:py-2.5 lg:py-3 flex flex-col shadow-sm bg-white", children: /* @__PURE__ */ jsxs("div", { className: "relative flex items-center", children: [
+          /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-40 px-3 sm:px-4 md:px-5 lg:px-6 py-2 sm:py-2.5 lg:py-3 flex flex-col shadow-sm bg-white", children: /* @__PURE__ */ jsxs("div", { className: "relative flex items-center", children: [
             /* @__PURE__ */ jsx("div", { className: "absolute left-0 animate-pulse", children: /* @__PURE__ */ jsx("div", { className: "h-6 sm:h-7 md:h-8 w-16 sm:w-20 bg-gray-200 rounded" }) }),
             /* @__PURE__ */ jsx("div", { className: "absolute left-1/2 transform -translate-x-1/2 animate-pulse max-w-[calc(100%-160px)] sm:max-w-[calc(100%-200px)]", children: /* @__PURE__ */ jsx("div", { className: "h-5 sm:h-6 md:h-7 w-28 sm:w-36 md:w-40 bg-gray-200 rounded" }) }),
             /* @__PURE__ */ jsx("div", { className: "w-full h-8" })
@@ -69465,7 +69996,7 @@ var WorkspaceDetailView = ({
       initial: { opacity: 1 },
       animate: { opacity: 1 },
       children: /* @__PURE__ */ jsxs("div", { className: "min-h-screen w-full flex flex-col bg-slate-50", children: [
-        /* @__PURE__ */ jsxs("header", { className: "sticky top-0 z-10 px-3 sm:px-4 md:px-5 lg:px-6 py-3 sm:py-3 lg:py-3.5 flex flex-col shadow-sm bg-white", children: [
+        /* @__PURE__ */ jsxs("header", { className: "sticky top-0 z-40 px-3 sm:px-4 md:px-5 lg:px-6 py-3 sm:py-3 lg:py-3.5 flex flex-col shadow-sm bg-white", children: [
           /* @__PURE__ */ jsx("div", { className: "sm:hidden", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
             /* @__PURE__ */ jsx(
               "button",
@@ -69792,7 +70323,8 @@ var WorkspaceDetailView = ({
                             xAxisMode: "hourly",
                             datasetKey: cycleTimeDatasetKey,
                             showIdleTime: showChartIdleTime,
-                            idleTimeData: hourlyIdleMinutes
+                            idleTimeData: hourlyIdleMinutes,
+                            idleTimeSlots: hourlyIdleSlots
                           }
                         ) : null : /* @__PURE__ */ jsx(
                           HourlyOutputChart2,
@@ -69921,7 +70453,8 @@ var WorkspaceDetailView = ({
                               xAxisMode: "hourly",
                               datasetKey: cycleTimeDatasetKey,
                               showIdleTime: showChartIdleTime,
-                              idleTimeData: hourlyIdleMinutes
+                              idleTimeData: hourlyIdleMinutes,
+                              idleTimeSlots: hourlyIdleSlots
                             }
                           ) : null : /* @__PURE__ */ jsx(
                             HourlyOutputChart2,
@@ -70141,7 +70674,7 @@ var SKUManagementView = () => {
     ] }) });
   }
   return /* @__PURE__ */ jsxs("div", { className: "min-h-screen bg-slate-50", children: [
-    /* @__PURE__ */ jsx("div", { className: "sticky top-0 z-10 bg-white border-b border-gray-200/80 shadow-sm", children: /* @__PURE__ */ jsx("div", { className: "px-3 sm:px-4 md:px-6 lg:px-8 py-3 sm:py-4", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col sm:flex-row items-start sm:items-center justify-between gap-3 sm:gap-4 relative", children: [
+    /* @__PURE__ */ jsx("div", { className: "sticky top-0 z-40 bg-white border-b border-gray-200/80 shadow-sm", children: /* @__PURE__ */ jsx("div", { className: "px-3 sm:px-4 md:px-6 lg:px-8 py-3 sm:py-4", children: /* @__PURE__ */ jsxs("div", { className: "flex flex-col sm:flex-row items-start sm:items-center justify-between gap-3 sm:gap-4 relative", children: [
       /* @__PURE__ */ jsx("div", { className: "sm:absolute sm:left-0", children: /* @__PURE__ */ jsx(
         BackButtonMinimal,
         {
@@ -70279,8 +70812,29 @@ var useWorkspaceHealth = (options) => {
         date: options.date,
         shiftId: options.shiftId
       });
-      setWorkspaces(workspacesWithStatus);
-      setSummary(computeSummary(workspacesWithStatus));
+      let cameraIpMap = {};
+      const workspaceIds = workspacesWithStatus.map((workspace) => workspace.workspace_id).filter(Boolean);
+      if (workspaceIds.length > 0) {
+        try {
+          cameraIpMap = await workspaceService.getWorkspaceCameraIps({ workspaceIds });
+        } catch (cameraError) {
+          console.error("[useWorkspaceHealth] Error fetching camera IPs:", cameraError);
+        }
+      }
+      const workspacesWithCameraIps = workspacesWithStatus.map((workspace) => {
+        const cameraInfo = cameraIpMap[workspace.workspace_id];
+        if (!cameraInfo) {
+          return workspace;
+        }
+        return {
+          ...workspace,
+          cameraIp: cameraInfo.camera_ip ?? null,
+          cameraResolutionMode: cameraInfo.resolution_mode ?? null,
+          effectiveCameraUuid: cameraInfo.effective_camera_uuid ?? null
+        };
+      });
+      setWorkspaces(workspacesWithCameraIps);
+      setSummary(computeSummary(workspacesWithCameraIps));
     } catch (err) {
       console.error("[useWorkspaceHealth] Error fetching workspace health:", err);
       setError({ message: err.message, code: err.code || "FETCH_ERROR" });
@@ -70646,7 +71200,7 @@ var WorkspaceUptimeDetailModal = ({
           role: "document",
           "aria-labelledby": "uptime-detail-title",
           children: [
-            /* @__PURE__ */ jsxs("header", { className: "flex items-start justify-between border-b border-gray-100 px-8 py-6 sticky top-0 z-10 bg-white rounded-t-2xl", children: [
+            /* @__PURE__ */ jsxs("header", { className: "flex items-start justify-between border-b border-gray-100 px-8 py-6 sticky top-0 z-40 bg-white rounded-t-2xl", children: [
               /* @__PURE__ */ jsxs("div", { className: "flex-1 min-w-0 mr-4", children: [
                 /* @__PURE__ */ jsx("h2", { id: "uptime-detail-title", className: "text-2xl font-semibold text-gray-900 truncate mb-3", children: workspace.workspace_display_name || `Workspace ${workspace.workspace_id.slice(0, 6)}` }),
                 /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2.5 text-sm text-gray-600", children: [
@@ -70656,7 +71210,7 @@ var WorkspaceUptimeDetailModal = ({
                     /* @__PURE__ */ jsx("span", { className: "text-gray-600", children: formatTimeRange(shiftStart, shiftEnd, timezone) })
                   ] })
                 ] }),
-                /* @__PURE__ */ jsxs("div", { className: "mt-2 flex items-center gap-2", children: [
+                /* @__PURE__ */ jsxs("div", { className: "mt-2 flex flex-wrap items-center gap-2", children: [
                   /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5", children: [
                     /* @__PURE__ */ jsx("div", { className: `w-2 h-2 rounded-full ${workspace.status === "healthy" ? "bg-emerald-500 animate-pulse" : workspace.status === "warning" ? "bg-amber-500" : "bg-rose-500"}` }),
                     /* @__PURE__ */ jsx("span", { className: `text-xs font-medium ${workspace.status === "healthy" ? "text-emerald-700" : workspace.status === "warning" ? "text-amber-700" : "text-rose-700"}`, children: workspace.status === "healthy" ? "Operational" : workspace.status === "warning" ? "Intermittent" : "Down" })
@@ -70665,6 +71219,13 @@ var WorkspaceUptimeDetailModal = ({
                   /* @__PURE__ */ jsxs("p", { className: "text-xs text-gray-500", children: [
                     "Last heartbeat ",
                     workspace.timeSinceLastUpdate
+                  ] }),
+                  workspace.cameraIp && /* @__PURE__ */ jsxs(Fragment, { children: [
+                    /* @__PURE__ */ jsx("span", { className: "text-gray-300 hidden sm:inline", children: "\u2022" }),
+                    /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1.5 bg-slate-50 dark:bg-slate-800/50 px-2 py-0.5 rounded border border-slate-100 dark:border-slate-700/50 group", title: "Camera IP", children: [
+                      /* @__PURE__ */ jsx(Video, { className: "h-3 w-3 text-slate-400" }),
+                      /* @__PURE__ */ jsx("span", { className: "text-xs font-medium text-slate-600 dark:text-slate-300 select-all", children: workspace.cameraIp })
+                    ] })
                   ] })
                 ] })
               ] }),
@@ -70866,7 +71427,7 @@ var WorkspaceHealthView = ({
   }
   return /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsxs("div", { className: clsx("min-h-screen bg-slate-50", className), children: [
-      /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-10 bg-white border-b border-gray-200 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-6 lg:px-8 py-3 sm:py-4", children: [
+      /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-40 bg-white border-b border-gray-200 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-6 lg:px-8 py-3 sm:py-4", children: [
         /* @__PURE__ */ jsx("div", { className: "sm:hidden", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
           mobileMenuContext && /* @__PURE__ */ jsx(
             HamburgerButton,
@@ -71200,7 +71761,7 @@ var SupervisorManagementView = ({
     ) }) });
   }
   return /* @__PURE__ */ jsxs("div", { className: clsx("min-h-screen bg-slate-50", className), children: [
-    /* @__PURE__ */ jsx("div", { className: "sticky top-0 z-10 bg-white border-b border-gray-200/80 shadow-sm", children: /* @__PURE__ */ jsx("div", { className: "px-3 sm:px-4 md:px-6 lg:px-8 py-3 sm:py-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center relative", children: [
+    /* @__PURE__ */ jsx("div", { className: "sticky top-0 z-40 bg-white border-b border-gray-200/80 shadow-sm", children: /* @__PURE__ */ jsx("div", { className: "px-3 sm:px-4 md:px-6 lg:px-8 py-3 sm:py-4", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center relative", children: [
       /* @__PURE__ */ jsx("div", { className: "sm:absolute sm:left-0", children: /* @__PURE__ */ jsx(
         BackButtonMinimal,
         {
@@ -71622,7 +72183,7 @@ var TeamManagementView = ({
     ) }) });
   }
   return /* @__PURE__ */ jsxs("div", { className: cn("min-h-screen bg-slate-50", className), children: [
-    /* @__PURE__ */ jsx("div", { className: "sticky top-0 z-10 bg-white border-b border-gray-200 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-6 lg:px-8 py-3 sm:py-4", children: [
+    /* @__PURE__ */ jsx("div", { className: "sticky top-0 z-40 bg-white border-b border-gray-200 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-6 lg:px-8 py-3 sm:py-4", children: [
       /* @__PURE__ */ jsx("div", { className: "sm:hidden", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
         mobileMenuContext && /* @__PURE__ */ jsx(
           HamburgerButton,
@@ -71766,7 +72327,7 @@ function BottleneckClipsView({
     ) })
   ] }) });
 }
-var AuthenticatedBottleneckClipsView = withAuth(React141__default.memo(BottleneckClipsView));
+var AuthenticatedBottleneckClipsView = withAuth(React142__default.memo(BottleneckClipsView));
 var BottleneckClipsView_default = BottleneckClipsView;
 
 // src/lib/services/ticketService.ts
@@ -72597,7 +73158,7 @@ Please ensure:
     )
   ] });
 }
-var AuthenticatedTicketsView = withAuth(React141__default.memo(TicketsView));
+var AuthenticatedTicketsView = withAuth(React142__default.memo(TicketsView));
 var TicketsView_default = TicketsView;
 
 // src/lib/utils/improvementDisplay.ts
@@ -72927,6 +73488,18 @@ var buildInitials = (name) => {
   const second = parts.length > 1 ? parts[1]?.[0] || "" : "";
   return `${first}${second}`.toUpperCase();
 };
+var getRecommendationAssignedUserIds = (recommendation) => {
+  if (Array.isArray(recommendation.assigned_user_ids) && recommendation.assigned_user_ids.length > 0) {
+    return recommendation.assigned_user_ids.filter(
+      (userId) => typeof userId === "string" && userId.trim().length > 0
+    );
+  }
+  return recommendation.assigned_to_user_id ? [recommendation.assigned_to_user_id] : [];
+};
+var recommendationMatchesMember = (recommendation, memberId) => {
+  if (memberId === "all") return true;
+  return getRecommendationAssignedUserIds(recommendation).includes(memberId);
+};
 var getQueryParam = (value) => {
   if (typeof value === "string") {
     const trimmed = value.trim();
@@ -73021,7 +73594,6 @@ var ClipVideoCarousel = ({ clips, clipsService }) => {
       currentVideo.cycle_time_seconds.toFixed(1),
       "s"
     ] }),
-    !loading && !error && /* @__PURE__ */ jsx("div", { className: "absolute inset-0 flex items-center justify-center pointer-events-none group-hover:opacity-0 transition-opacity", children: /* @__PURE__ */ jsx(PlayCircleIcon, { className: "w-16 h-16 text-white opacity-80" }) }),
     videos.length > 1 && /* @__PURE__ */ jsxs(Fragment, { children: [
       /* @__PURE__ */ jsx(
         "button",
@@ -73418,10 +73990,7 @@ var ImprovementCenterView = () => {
       if (!supabase || !companyId) return;
       try {
         const userService2 = createUserManagementService(supabase);
-        const users = await userService2.getCompanyUsers(
-          companyId,
-          "supervisor,owner,industrial_engineer"
-        );
+        const users = await userService2.getCompanyUsers(companyId);
         if (cancelled) return;
         const membersById = /* @__PURE__ */ new Map();
         users.forEach((user2) => {
@@ -73525,18 +74094,8 @@ var ImprovementCenterView = () => {
   const teamMembersById = useMemo(() => {
     return new Map(teamMembers.map((member) => [member.id, member]));
   }, [teamMembers]);
-  const getRecommendationDisplayMetadata = React141__default.useCallback((rec) => {
-    const supervisors = rec.line_id ? supervisorsByLineId.get(rec.line_id) || [] : [];
-    return getImprovementDisplayMetadata({
-      location: rec.location,
-      line: rec.line,
-      workspaceId: rec.workspace_id,
-      supervisors
-    });
-  }, [supervisorsByLineId]);
-  const filteredRecommendations = useMemo(() => {
-    const hasActiveFilters = selectedLineId !== "all" || selectedStatus !== "all" || selectedShift !== "all" || selectedWeeksRange !== "all" || selectedMemberId !== "all" || selectedSortBy !== "all";
-    const sortedRecommendations = recommendations.filter((rec) => {
+  const recommendationsMatchingViewFilters = useMemo(() => {
+    return recommendations.filter((rec) => {
       if (selectedLineId !== "all" && rec.line_id !== selectedLineId) return false;
       if (selectedStatus === "resolved" && rec.ticket_status !== "solved") return false;
       if (selectedStatus === "unresolved" && rec.ticket_status === "solved") return false;
@@ -73547,9 +74106,41 @@ var ImprovementCenterView = () => {
         if (selectedWeeksRange === "2" && weeks !== 2) return false;
         if (selectedWeeksRange === "3+" && weeks < 3) return false;
       }
-      if (selectedMemberId !== "all" && !(rec.assigned_user_ids?.includes(selectedMemberId) || rec.assigned_to_user_id === selectedMemberId)) return false;
       return true;
-    }).sort((a, b) => {
+    });
+  }, [recommendations, selectedLineId, selectedShift, selectedStatus, selectedWeeksRange]);
+  const memberOptions = useMemo(() => {
+    const uniqueAssigneeIds = /* @__PURE__ */ new Set();
+    recommendationsMatchingViewFilters.forEach((recommendation) => {
+      getRecommendationAssignedUserIds(recommendation).forEach((userId) => {
+        uniqueAssigneeIds.add(userId);
+      });
+    });
+    const options = Array.from(uniqueAssigneeIds).map((userId) => ({
+      id: userId,
+      label: teamMembersById.get(userId)?.name || userId
+    })).sort((left, right) => left.label.localeCompare(right.label));
+    return [{ id: "all", label: "All Members" }, ...options];
+  }, [recommendationsMatchingViewFilters, teamMembersById]);
+  useEffect(() => {
+    if (selectedMemberId === "all") return;
+    const memberStillAvailable = memberOptions.some((option) => option.id === selectedMemberId);
+    if (!memberStillAvailable) {
+      setSelectedMemberId("all");
+    }
+  }, [memberOptions, selectedMemberId]);
+  const getRecommendationDisplayMetadata = React142__default.useCallback((rec) => {
+    const supervisors = rec.line_id ? supervisorsByLineId.get(rec.line_id) || [] : [];
+    return getImprovementDisplayMetadata({
+      location: rec.location,
+      line: rec.line,
+      workspaceId: rec.workspace_id,
+      supervisors
+    });
+  }, [supervisorsByLineId]);
+  const filteredRecommendations = useMemo(() => {
+    const hasActiveFilters = selectedLineId !== "all" || selectedStatus !== "all" || selectedShift !== "all" || selectedWeeksRange !== "all" || selectedMemberId !== "all" || selectedSortBy !== "all";
+    const sortedRecommendations = recommendationsMatchingViewFilters.filter((rec) => recommendationMatchesMember(rec, selectedMemberId)).sort((a, b) => {
       if (selectedSortBy === "highest_to_lowest" || selectedSortBy === "lowest_to_highest") {
         const gainA = getImprovementPcsGainSortValue(a);
         const gainB = getImprovementPcsGainSortValue(b);
@@ -73580,12 +74171,8 @@ var ImprovementCenterView = () => {
     ];
   }, [
     focusIssueId,
-    recommendations,
-    selectedLineId,
+    recommendationsMatchingViewFilters,
     selectedMemberId,
-    selectedShift,
-    selectedStatus,
-    selectedWeeksRange,
     selectedSortBy
   ]);
   const stats = useMemo(() => {
@@ -73598,7 +74185,7 @@ var ImprovementCenterView = () => {
         if (selectedWeeksRange === "2" && weeks !== 2) return false;
         if (selectedWeeksRange === "3+" && weeks < 3) return false;
       }
-      if (selectedMemberId !== "all" && !(rec.assigned_user_ids?.includes(selectedMemberId) || rec.assigned_to_user_id === selectedMemberId)) return false;
+      if (!recommendationMatchesMember(rec, selectedMemberId)) return false;
       return true;
     });
     const total = baseFiltered.length;
@@ -73777,7 +74364,7 @@ var ImprovementCenterView = () => {
               { value: selectedSortBy, onChange: handleSortByChange, options: [{ id: "all", label: "All" }, { id: "highest_to_lowest", label: "Highest to Lowest" }, { id: "lowest_to_highest", label: "Lowest to Highest" }], label: "Priority" },
               { value: selectedShift, onChange: handleShiftFilterChange, options: shiftOptions, label: "Shift" },
               { value: selectedWeeksRange, onChange: handleWeeksFilterChange, options: weekOptions.map((o) => o.id), labels: weekOptions, label: "Duration" },
-              { value: selectedMemberId, onChange: handleMemberFilterChange, options: ["all", ...teamMembers.map((m) => m.id)], labels: teamMembers, label: "Member" },
+              { value: selectedMemberId, onChange: handleMemberFilterChange, options: memberOptions, label: "Member" },
               { value: selectedLineId, onChange: handleLineFilterChange, options: lineOptions.map((o) => o.id), labels: lineOptions, label: "Line" }
             ].map((filter2, idx) => /* @__PURE__ */ jsxs("div", { className: "space-y-1", children: [
               /* @__PURE__ */ jsx("label", { className: "text-xs font-medium text-gray-500 uppercase tracking-wide ml-1", children: filter2.label }),
@@ -73786,6 +74373,7 @@ var ImprovementCenterView = () => {
                 {
                   value: filter2.value,
                   onChange: (e) => filter2.onChange(e.target.value),
+                  "aria-label": `${filter2.label} filter`,
                   className: "w-full appearance-none pl-3 pr-8 py-2 text-sm bg-gray-50 border border-gray-200 hover:border-gray-300 rounded-lg text-gray-900 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:bg-white transition-all cursor-pointer",
                   style: { backgroundImage: `url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e")`, backgroundPosition: `right 0.75rem center`, backgroundRepeat: `no-repeat`, backgroundSize: `1.2em 1.2em` },
                   children: filter2.options.map((opt) => {
@@ -74015,7 +74603,7 @@ var ThreadSidebar = ({
     ] }) })
   ] });
 };
-var ProfilePicture = React141__default.memo(({
+var ProfilePicture = React142__default.memo(({
   alt = "Axel",
   className = "",
   size = "md",
@@ -75628,7 +76216,7 @@ var AIAgentView = () => {
         `
     } }),
     /* @__PURE__ */ jsxs("div", { className: `flex-1 flex flex-col h-screen transition-all duration-300 ${isSidebarOpen ? "lg:mr-80 mr-0" : "mr-0"}`, children: [
-      /* @__PURE__ */ jsxs("header", { className: "flex-shrink-0 bg-white px-3 sm:px-6 md:px-8 py-2 sm:py-5 md:py-6 shadow-sm border-b border-gray-200/80 sticky top-0 z-10", children: [
+      /* @__PURE__ */ jsxs("header", { className: "flex-shrink-0 bg-white px-3 sm:px-6 md:px-8 py-2 sm:py-5 md:py-6 shadow-sm border-b border-gray-200/80 sticky top-0 z-40", children: [
         /* @__PURE__ */ jsx("div", { className: "sm:hidden", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-between", children: [
           mobileMenuContext && /* @__PURE__ */ jsx(
             HamburgerButton,
@@ -76540,7 +77128,7 @@ var OverviewImprovementsSkeleton = () => /* @__PURE__ */ jsx("div", { className:
   ] }),
   /* @__PURE__ */ jsx("div", { className: "flex items-center justify-end flex-shrink-0 ml-4", children: /* @__PURE__ */ jsx(SectionPulse, { className: "h-6 w-20 rounded-full" }) })
 ] }, index)) });
-var OperationsOverviewHeader = React141__default.memo(({
+var OperationsOverviewHeader = React142__default.memo(({
   dateRange,
   displayDateRange,
   trendMode,
@@ -76560,65 +77148,65 @@ var OperationsOverviewHeader = React141__default.memo(({
   bumpRenderCounter();
   const subtitleRange = displayDateRange || dateRange;
   const showLiveShiftMeta = isLiveScope && trendMode !== "all";
-  const liveShiftLabel = React141__default.useMemo(
+  const liveShiftLabel = React142__default.useMemo(
     () => normalizeShiftLabel(liveShiftName, trendMode),
     [liveShiftName, trendMode]
   );
-  const liveShiftIcon = React141__default.useMemo(
+  const liveShiftIcon = React142__default.useMemo(
     () => getShiftIcon(liveShiftName, trendMode),
     [liveShiftName, trendMode]
   );
-  const [isFilterOpen, setIsFilterOpen] = React141__default.useState(false);
-  const [isLinesDropdownOpen, setIsLinesDropdownOpen] = React141__default.useState(false);
-  const filterRef = React141__default.useRef(null);
-  const filterButtonRef = React141__default.useRef(null);
-  const mobileFilterButtonRef = React141__default.useRef(null);
-  const linesDropdownRef = React141__default.useRef(null);
-  const mobileSubtitle = React141__default.useMemo(() => {
+  const [isFilterOpen, setIsFilterOpen] = React142__default.useState(false);
+  const [isLinesDropdownOpen, setIsLinesDropdownOpen] = React142__default.useState(false);
+  const filterRef = React142__default.useRef(null);
+  const filterButtonRef = React142__default.useRef(null);
+  const mobileFilterButtonRef = React142__default.useRef(null);
+  const linesDropdownRef = React142__default.useRef(null);
+  const mobileSubtitle = React142__default.useMemo(() => {
     if (subtitleRange.startKey === subtitleRange.endKey) {
       return format(parseDateKeyToDate(subtitleRange.startKey), "do MMM, yyyy");
     }
     return `${format(parseDateKeyToDate(subtitleRange.startKey), "do MMM")} - ${format(parseDateKeyToDate(subtitleRange.endKey), "do MMM, yyyy")}`;
   }, [subtitleRange.endKey, subtitleRange.startKey]);
-  const desktopSubtitle = React141__default.useMemo(() => {
+  const desktopSubtitle = React142__default.useMemo(() => {
     if (subtitleRange.startKey === subtitleRange.endKey) {
       return format(parseDateKeyToDate(subtitleRange.startKey), "do MMMM, yyyy");
     }
     return `${format(parseDateKeyToDate(subtitleRange.startKey), "do MMMM, yyyy")} - ${format(parseDateKeyToDate(subtitleRange.endKey), "do MMMM, yyyy")}`;
   }, [subtitleRange.endKey, subtitleRange.startKey]);
-  const availableLineIds = React141__default.useMemo(
+  const availableLineIds = React142__default.useMemo(
     () => lineOptions.map((line) => line.id),
     [lineOptions]
   );
-  const selectedLineIdSet = React141__default.useMemo(
+  const selectedLineIdSet = React142__default.useMemo(
     () => new Set(selectedLineIds),
     [selectedLineIds]
   );
-  const isAllLinesSelected = React141__default.useMemo(() => {
+  const isAllLinesSelected = React142__default.useMemo(() => {
     if (availableLineIds.length === 0) return true;
     return availableLineIds.every((lineId) => selectedLineIdSet.has(lineId));
   }, [availableLineIds, selectedLineIdSet]);
-  const activeFilterCount = React141__default.useMemo(() => {
+  const activeFilterCount = React142__default.useMemo(() => {
     let count = 0;
     if (trendMode !== "all") count += 1;
     if (selectedSupervisorId !== "all") count += 1;
     if (!isAllLinesSelected) count += 1;
     return count;
   }, [isAllLinesSelected, selectedSupervisorId, trendMode]);
-  const handleFilterToggle = React141__default.useCallback(() => {
+  const handleFilterToggle = React142__default.useCallback(() => {
     trackCoreEvent("Operations Overview Filter Toggled", {
       action: !isFilterOpen ? "open" : "close"
     });
     setIsFilterOpen((previous) => !previous);
   }, [isFilterOpen]);
-  const handleTrendModeChange = React141__default.useCallback((event) => {
+  const handleTrendModeChange = React142__default.useCallback((event) => {
     const nextMode = event.target.value;
     trackCoreEvent("Operations Overview Shift Filter Changed", {
       shift_mode: nextMode
     });
     onTrendModeChange(nextMode);
   }, [onTrendModeChange]);
-  const handleAllLinesToggle = React141__default.useCallback(() => {
+  const handleAllLinesToggle = React142__default.useCallback(() => {
     trackCoreEvent("Operations Overview Line Filter Changed", {
       selected_line_ids: availableLineIds,
       selected_line_count: availableLineIds.length,
@@ -76626,7 +77214,7 @@ var OperationsOverviewHeader = React141__default.memo(({
     });
     onSelectedLineIdsChange(availableLineIds);
   }, [availableLineIds, onSelectedLineIdsChange]);
-  const handleSupervisorChange = React141__default.useCallback((event) => {
+  const handleSupervisorChange = React142__default.useCallback((event) => {
     const supervisorId = event.target.value;
     const selectedSupervisor = supervisorOptions.find((option) => option.id === supervisorId);
     trackCoreEvent("Operations Overview Supervisor Filter Changed", {
@@ -76637,7 +77225,7 @@ var OperationsOverviewHeader = React141__default.memo(({
     });
     onSelectedSupervisorIdChange(supervisorId);
   }, [availableLineIds, onSelectedSupervisorIdChange, supervisorOptions]);
-  const handleLineToggle = React141__default.useCallback((lineId) => {
+  const handleLineToggle = React142__default.useCallback((lineId) => {
     const current = new Set(selectedLineIds);
     if (current.has(lineId)) {
       if (current.size <= 1) return;
@@ -76653,13 +77241,13 @@ var OperationsOverviewHeader = React141__default.memo(({
     });
     onSelectedLineIdsChange(next);
   }, [availableLineIds, onSelectedLineIdsChange, selectedLineIds]);
-  const handleClearAllFilters = React141__default.useCallback(() => {
+  const handleClearAllFilters = React142__default.useCallback(() => {
     onTrendModeChange("all");
     onSelectedSupervisorIdChange("all");
     onSelectedLineIdsChange(availableLineIds);
     setIsFilterOpen(false);
   }, [availableLineIds, onSelectedLineIdsChange, onSelectedSupervisorIdChange, onTrendModeChange]);
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     const handleClickOutside = (event) => {
       const target = event.target;
       if (filterRef.current && !filterRef.current.contains(target) && filterButtonRef.current && !filterButtonRef.current.contains(target) && mobileFilterButtonRef.current && !mobileFilterButtonRef.current.contains(target)) {
@@ -76674,7 +77262,7 @@ var OperationsOverviewHeader = React141__default.memo(({
       document.removeEventListener("mousedown", handleClickOutside);
     };
   }, []);
-  return /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-10 bg-white border-b flex-shrink-0 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-4 md:px-6 py-2 sm:py-3 relative", children: [
+  return /* @__PURE__ */ jsx("header", { className: "sticky top-0 z-40 bg-white border-b flex-shrink-0 shadow-sm", children: /* @__PURE__ */ jsxs("div", { className: "px-3 sm:px-4 md:px-6 py-2 sm:py-3 relative", children: [
     /* @__PURE__ */ jsx("div", { className: "sm:hidden", children: /* @__PURE__ */ jsxs("div", { className: "flex items-center", children: [
       mobileMenuContext ? /* @__PURE__ */ jsx(
         HamburgerButton,
@@ -76898,12 +77486,12 @@ var OperationsOverviewHeader = React141__default.memo(({
   ] }) });
 });
 OperationsOverviewHeader.displayName = "OperationsOverviewHeader";
-var OverviewSummaryCards = React141__default.memo(({ store }) => {
+var OverviewSummaryCards = React142__default.memo(({ store }) => {
   bumpRenderCounter();
   const scope = useOperationsOverviewScope(store);
   const snapshot = useOperationsOverviewSnapshot(store);
   const showSnapshotSkeleton = snapshot.loading && !snapshot.hasLoadedOnce;
-  const comparisonLabel = React141__default.useMemo(() => {
+  const comparisonLabel = React142__default.useMemo(() => {
     return formatComparisonWindow({
       currentDayCount: scope.current_range?.day_count ?? null,
       previousDayCount: scope.previous_range?.day_count ?? null,
@@ -76916,27 +77504,27 @@ var OverviewSummaryCards = React141__default.memo(({ store }) => {
     scope.previous_range?.day_count,
     scope.shift_mode
   ]);
-  const [isIdleContributorsOpen, setIsIdleContributorsOpen] = React141__default.useState(false);
-  const [isIdleContributorsPinned, setIsIdleContributorsPinned] = React141__default.useState(false);
-  const idleContributorsRef = React141__default.useRef(null);
-  const plantEfficiencyBadge = React141__default.useMemo(() => {
+  const [isIdleContributorsOpen, setIsIdleContributorsOpen] = React142__default.useState(false);
+  const [isIdleContributorsPinned, setIsIdleContributorsPinned] = React142__default.useState(false);
+  const idleContributorsRef = React142__default.useRef(null);
+  const plantEfficiencyBadge = React142__default.useMemo(() => {
     return buildDeltaBadge(snapshot.data.summary.plant_efficiency?.delta_pp, {
       positiveIsGood: true,
       formatter: (value) => `${value >= 0 ? "+" : ""}${roundOne(value)}%`,
       comparisonLabel
     });
   }, [comparisonLabel, snapshot.data.summary.plant_efficiency?.delta_pp]);
-  const idleBadge = React141__default.useMemo(() => {
+  const idleBadge = React142__default.useMemo(() => {
     return buildDeltaBadge(snapshot.data.summary.avg_idle_per_workstation?.delta_seconds, {
       positiveIsGood: false,
       formatter: (value) => formatSignedIdleDuration(value),
       comparisonLabel
     });
   }, [comparisonLabel, snapshot.data.summary.avg_idle_per_workstation?.delta_seconds]);
-  const canInspectIdleContributors = React141__default.useMemo(() => {
+  const canInspectIdleContributors = React142__default.useMemo(() => {
     return !showSnapshotSkeleton && snapshot.data.summary.avg_idle_per_workstation?.current_seconds !== null && snapshot.data.summary.avg_idle_per_workstation?.current_seconds !== void 0;
   }, [showSnapshotSkeleton, snapshot.data.summary.avg_idle_per_workstation?.current_seconds]);
-  const idleTopContributors = React141__default.useMemo(() => {
+  const idleTopContributors = React142__default.useMemo(() => {
     return (snapshot.data.summary.avg_idle_per_workstation?.top_contributors || []).map((item) => ({
       workspaceId: item.workspace_id || "",
       workspaceName: item.workspace_name?.trim() || item.workspace_id || "Unknown",
@@ -76944,14 +77532,14 @@ var OverviewSummaryCards = React141__default.memo(({ store }) => {
       avgIdleSeconds: toNumber3(item.avg_idle_seconds)
     })).slice(0, 5);
   }, [snapshot.data.summary.avg_idle_per_workstation?.top_contributors]);
-  const showIdleContributorLineNames = React141__default.useMemo(() => {
+  const showIdleContributorLineNames = React142__default.useMemo(() => {
     return (scope.line_count ?? 0) > 1;
   }, [scope.line_count]);
-  const closeIdleContributors = React141__default.useCallback(() => {
+  const closeIdleContributors = React142__default.useCallback(() => {
     setIsIdleContributorsOpen(false);
     setIsIdleContributorsPinned(false);
   }, []);
-  const handleIdleContributorsToggle = React141__default.useCallback(() => {
+  const handleIdleContributorsToggle = React142__default.useCallback(() => {
     if (!canInspectIdleContributors) return;
     setIsIdleContributorsPinned((previous) => {
       const next = !previous;
@@ -76959,7 +77547,7 @@ var OverviewSummaryCards = React141__default.memo(({ store }) => {
       return next;
     });
   }, [canInspectIdleContributors]);
-  const handleIdleContributorsKeyDown = React141__default.useCallback((event) => {
+  const handleIdleContributorsKeyDown = React142__default.useCallback((event) => {
     if (!canInspectIdleContributors) return;
     if (event.key === "Enter" || event.key === " ") {
       event.preventDefault();
@@ -76971,11 +77559,11 @@ var OverviewSummaryCards = React141__default.memo(({ store }) => {
       closeIdleContributors();
     }
   }, [canInspectIdleContributors, closeIdleContributors, handleIdleContributorsToggle]);
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     setIsIdleContributorsOpen(false);
     setIsIdleContributorsPinned(false);
   }, [scope.comparison_strategy, scope.current_range?.start_date, scope.current_range?.end_date, scope.line_count, scope.shift_mode]);
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     if (!isIdleContributorsOpen) return void 0;
     const handleClickOutside = (event) => {
       if (!isIdleContributorsPinned) return;
@@ -77113,7 +77701,7 @@ var OverviewSummaryCards = React141__default.memo(({ store }) => {
   ] });
 });
 OverviewSummaryCards.displayName = "OverviewSummaryCards";
-var PoorestPerformersCard = React141__default.memo(({
+var PoorestPerformersCard = React142__default.memo(({
   store,
   supervisorsByLineId,
   onViewAll,
@@ -77122,9 +77710,9 @@ var PoorestPerformersCard = React141__default.memo(({
   bumpRenderCounter();
   const scope = useOperationsOverviewScope(store);
   const snapshot = useOperationsOverviewSnapshot(store);
-  const [poorestLineMode, setPoorestLineMode] = React141__default.useState("output");
+  const [poorestLineMode, setPoorestLineMode] = React142__default.useState("output");
   const availableLineModes = scope.available_line_modes;
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     const hasOutput = !!availableLineModes?.has_output;
     const hasUptime = !!availableLineModes?.has_uptime;
     if (hasOutput && !hasUptime && poorestLineMode !== "output") {
@@ -77133,7 +77721,7 @@ var PoorestPerformersCard = React141__default.memo(({
       setPoorestLineMode("uptime");
     }
   }, [availableLineModes?.has_output, availableLineModes?.has_uptime, poorestLineMode]);
-  const comparisonLabel = React141__default.useMemo(() => {
+  const comparisonLabel = React142__default.useMemo(() => {
     return formatComparisonWindow({
       currentDayCount: scope.current_range?.day_count ?? null,
       previousDayCount: scope.previous_range?.day_count ?? null,
@@ -77147,7 +77735,7 @@ var PoorestPerformersCard = React141__default.memo(({
     scope.shift_mode
   ]);
   const showSnapshotSkeleton = snapshot.loading && !snapshot.hasLoadedOnce;
-  const mergedPoorestLines = React141__default.useMemo(() => {
+  const mergedPoorestLines = React142__default.useMemo(() => {
     const rows = snapshot.data.poorest_lines?.[poorestLineMode] || [];
     return rows.slice(0, 3).map((line) => {
       const lineId = line.line_id || "";
@@ -77166,7 +77754,7 @@ var PoorestPerformersCard = React141__default.memo(({
   }, [poorestLineMode, snapshot.data.poorest_lines, supervisorsByLineId]);
   const showPoorestModeToggle = !!availableLineModes?.has_output && !!availableLineModes?.has_uptime;
   const poorestMetricLabel = poorestLineMode === "uptime" ? "Uptime" : "Efficiency";
-  const handlePoorestLineModeChange = React141__default.useCallback((mode) => {
+  const handlePoorestLineModeChange = React142__default.useCallback((mode) => {
     trackCoreEvent("Operations Overview Poorest Line Mode Changed", { mode });
     setPoorestLineMode(mode);
   }, []);
@@ -77252,14 +77840,14 @@ var PoorestPerformersCard = React141__default.memo(({
   ] });
 });
 PoorestPerformersCard.displayName = "PoorestPerformersCard";
-var IdleBreakdownCard = React141__default.memo(({
+var IdleBreakdownCard = React142__default.memo(({
   store,
   scopedLineCount
 }) => {
   bumpRenderCounter();
   const idle = useOperationsOverviewIdle(store);
   const showInitialSkeleton = idle.loading && idle.lastUpdated === null;
-  const idleBreakdown = React141__default.useMemo(() => {
+  const idleBreakdown = React142__default.useMemo(() => {
     return idle.data.map((item) => ({
       name: item.display_name?.trim() || item.reason?.trim() || "Unknown",
       reasonKey: item.reason_key?.trim() || item.reason?.trim() || "unknown",
@@ -77278,7 +77866,7 @@ var IdleBreakdownCard = React141__default.memo(({
       }))
     })).filter((item) => item.value > 0);
   }, [idle.data]);
-  const showIdleModuleNotEnabledState = React141__default.useMemo(() => {
+  const showIdleModuleNotEnabledState = React142__default.useMemo(() => {
     const enabledLineCount = idle.scope.idle_time_vlm_enabled_line_count;
     return !showInitialSkeleton && scopedLineCount > 0 && typeof enabledLineCount === "number" && enabledLineCount === 0;
   }, [idle.scope.idle_time_vlm_enabled_line_count, scopedLineCount, showInitialSkeleton]);
@@ -77299,7 +77887,7 @@ var IdleBreakdownCard = React141__default.memo(({
   ] });
 });
 IdleBreakdownCard.displayName = "IdleBreakdownCard";
-var EfficiencyTrendCard = React141__default.memo(({
+var EfficiencyTrendCard = React142__default.memo(({
   store,
   dateRange,
   appTimezone,
@@ -77307,14 +77895,14 @@ var EfficiencyTrendCard = React141__default.memo(({
 }) => {
   bumpRenderCounter();
   const trend = useOperationsOverviewTrend(store);
-  const currentWeekRange = React141__default.useMemo(
+  const currentWeekRange = React142__default.useMemo(
     () => getCurrentWeekToDateRange(appTimezone),
     [appTimezone]
   );
   const isCurrentWeekToDateRange = dateRange.startKey === currentWeekRange.startKey && dateRange.endKey === currentWeekRange.endKey;
   const showInitialSkeleton = trend.loading && trend.lastUpdated === null;
   const isHourlyTrend = trend.data.granularity === "hour";
-  const trendData = React141__default.useMemo(() => {
+  const trendData = React142__default.useMemo(() => {
     if (isHourlyTrend) {
       return (trend.data.points || []).map((point, index) => ({
         name: (() => {
@@ -77386,13 +77974,13 @@ var EfficiencyTrendCard = React141__default.memo(({
       };
     });
   }, [currentWeekRange.startKey, hourlyLabelStartTime, isCurrentWeekToDateRange, isHourlyTrend, trend.data.points]);
-  const trendTooltipLabelFormatter = React141__default.useCallback((label, payload) => {
+  const trendTooltipLabelFormatter = React142__default.useCallback((label, payload) => {
     if (isHourlyTrend) return label;
     const dayOfWeek = payload?.[0]?.payload?.dayOfWeek;
     if (!dayOfWeek || typeof label !== "string") return label;
     return `${label} (${dayOfWeek})`;
   }, [isHourlyTrend]);
-  const trendXAxisTickFormatter = React141__default.useCallback((value, index) => {
+  const trendXAxisTickFormatter = React142__default.useCallback((value, index) => {
     if (!isHourlyTrend) {
       return typeof value === "string" ? value : String(value ?? "");
     }
@@ -77419,7 +78007,7 @@ var EfficiencyTrendCard = React141__default.memo(({
   ] });
 });
 EfficiencyTrendCard.displayName = "EfficiencyTrendCard";
-var TopImprovementsCard = React141__default.memo(({
+var TopImprovementsCard = React142__default.memo(({
   store,
   supervisorsByLineId,
   onViewAll,
@@ -77428,7 +78016,7 @@ var TopImprovementsCard = React141__default.memo(({
   bumpRenderCounter();
   const improvements = useOperationsOverviewImprovements(store);
   const showInitialSkeleton = improvements.loading && improvements.lastUpdated === null;
-  const displayImprovements = React141__default.useMemo(() => {
+  const displayImprovements = React142__default.useMemo(() => {
     return improvements.data.map((item) => {
       const supervisors = item.lineId ? supervisorsByLineId.get(item.lineId) || [] : [];
       return {
@@ -77465,7 +78053,7 @@ var TopImprovementsCard = React141__default.memo(({
         className: "flex items-center justify-between py-3 border-b border-slate-50 last:border-0 group cursor-pointer",
         children: [
           /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-3 flex-1 min-w-0 pr-4", children: [
-            item.ticketLabel ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-center flex-shrink-0", children: /* @__PURE__ */ jsx("span", { className: "inline-flex items-center rounded-full border border-indigo-100 bg-indigo-50 px-2 py-0.5 text-[10px] font-semibold text-indigo-600", children: item.ticketLabel }) }) : null,
+            item.ticketLabel ? /* @__PURE__ */ jsx("div", { className: "flex items-center justify-start flex-shrink-0 w-16", children: /* @__PURE__ */ jsx("span", { className: "inline-flex items-center justify-center min-w-[48px] max-w-[64px] truncate rounded-full border border-indigo-100 bg-indigo-50 px-2 py-0.5 text-[10px] font-semibold text-indigo-600", children: item.ticketLabel }) }) : null,
             /* @__PURE__ */ jsxs("div", { className: "min-w-0 flex-1", children: [
               /* @__PURE__ */ jsx("div", { className: "flex items-center gap-2 min-w-0 mb-0.5", children: /* @__PURE__ */ jsx("h4", { className: "text-[13px] font-semibold text-slate-800 truncate transition-colors group-hover:text-indigo-600", children: item.title }) }),
               /* @__PURE__ */ jsx(
@@ -77556,33 +78144,33 @@ var useOperationsOverviewRefresh = ({
   isLiveScope,
   enabled = true
 }) => {
-  const lineIdsKey = React141__default.useMemo(() => lineIds.join(","), [lineIds]);
-  const scopeSignature = React141__default.useMemo(
+  const lineIdsKey = React142__default.useMemo(() => lineIds.join(","), [lineIds]);
+  const scopeSignature = React142__default.useMemo(
     () => [companyId || "", startKey, endKey, trendMode, comparisonStrategy || "", lineIdsKey].join("::"),
     [companyId, comparisonStrategy, endKey, lineIdsKey, startKey, trendMode]
   );
-  const controllersRef = React141__default.useRef({});
-  const requestIdsRef = React141__default.useRef({
+  const controllersRef = React142__default.useRef({});
+  const requestIdsRef = React142__default.useRef({
     snapshot: 0,
     trend: 0,
     idle: 0,
     improvements: 0
   });
-  const intervalRef = React141__default.useRef(null);
-  const isPageActiveRef = React141__default.useRef(true);
-  const lastResumeRefreshAtRef = React141__default.useRef(0);
-  const abortAll = React141__default.useCallback(() => {
+  const intervalRef = React142__default.useRef(null);
+  const isPageActiveRef = React142__default.useRef(true);
+  const lastResumeRefreshAtRef = React142__default.useRef(0);
+  const abortAll = React142__default.useCallback(() => {
     Object.values(controllersRef.current).forEach((controller) => {
       controller?.abort();
     });
     controllersRef.current = {};
   }, []);
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     return () => {
       abortAll();
     };
   }, [abortAll]);
-  const getIsPageActive = React141__default.useCallback(() => {
+  const getIsPageActive = React142__default.useCallback(() => {
     if (typeof document === "undefined") {
       return true;
     }
@@ -77590,7 +78178,7 @@ var useOperationsOverviewRefresh = ({
     const hasFocus = typeof document.hasFocus === "function" ? document.hasFocus() : true;
     return isVisible && hasFocus;
   }, []);
-  const stopPolling = React141__default.useCallback((reason) => {
+  const stopPolling = React142__default.useCallback((reason) => {
     if (intervalRef.current === null) {
       return;
     }
@@ -77598,7 +78186,7 @@ var useOperationsOverviewRefresh = ({
     intervalRef.current = null;
     debugRefreshLog("poll stopped", { reason });
   }, []);
-  const runRefresh = React141__default.useCallback(
+  const runRefresh = React142__default.useCallback(
     async (section, begin, onSuccess, onError, request, reason) => {
       if (!enabled || !supabase || !companyId || lineIds.length === 0) return;
       const requestId = requestIdsRef.current[section] + 1;
@@ -77622,7 +78210,7 @@ var useOperationsOverviewRefresh = ({
     },
     [companyId, enabled, lineIds.length, supabase]
   );
-  const refreshSnapshot = React141__default.useCallback(
+  const refreshSnapshot = React142__default.useCallback(
     async (reason) => {
       await runRefresh(
         "snapshot",
@@ -77654,7 +78242,7 @@ var useOperationsOverviewRefresh = ({
     },
     [companyId, comparisonStrategy, endKey, lineIdsKey, runRefresh, scopeSignature, startKey, store, supabase, trendMode]
   );
-  const refreshTrend = React141__default.useCallback(
+  const refreshTrend = React142__default.useCallback(
     async (reason) => {
       await runRefresh(
         "trend",
@@ -77683,7 +78271,7 @@ var useOperationsOverviewRefresh = ({
     },
     [companyId, endKey, lineIdsKey, runRefresh, scopeSignature, startKey, store, supabase, trendMode]
   );
-  const refreshIdle = React141__default.useCallback(
+  const refreshIdle = React142__default.useCallback(
     async (reason) => {
       await runRefresh(
         "idle",
@@ -77712,7 +78300,7 @@ var useOperationsOverviewRefresh = ({
     },
     [companyId, endKey, lineIdsKey, runRefresh, scopeSignature, startKey, store, supabase, trendMode]
   );
-  const refreshImprovements = React141__default.useCallback(
+  const refreshImprovements = React142__default.useCallback(
     async (reason) => {
       await runRefresh(
         "improvements",
@@ -77742,7 +78330,7 @@ var useOperationsOverviewRefresh = ({
     },
     [companyId, lineIds, lineIdsKey, runRefresh, scopeSignature, store, supabase]
   );
-  const refreshAll = React141__default.useCallback(
+  const refreshAll = React142__default.useCallback(
     async (reason) => {
       await Promise.allSettled([
         refreshSnapshot(reason),
@@ -77753,7 +78341,7 @@ var useOperationsOverviewRefresh = ({
     },
     [refreshIdle, refreshImprovements, refreshSnapshot, refreshTrend]
   );
-  const startPolling = React141__default.useCallback((reason) => {
+  const startPolling = React142__default.useCallback((reason) => {
     if (!isLiveScope || !supabase || !companyId || lineIds.length === 0) {
       return;
     }
@@ -77774,7 +78362,7 @@ var useOperationsOverviewRefresh = ({
     }, LIVE_REFRESH_INTERVAL_MS);
     debugRefreshLog("poll started", { reason, intervalMs: LIVE_REFRESH_INTERVAL_MS });
   }, [companyId, isLiveScope, lineIds.length, refreshAll, stopPolling, supabase]);
-  const refreshFromResume = React141__default.useCallback((reason) => {
+  const refreshFromResume = React142__default.useCallback((reason) => {
     const now4 = Date.now();
     if (now4 - lastResumeRefreshAtRef.current < 1e3) {
       debugRefreshLog("resume refresh suppressed", { reason });
@@ -77789,7 +78377,7 @@ var useOperationsOverviewRefresh = ({
       }
     });
   }, [refreshAll, startPolling, stopPolling]);
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     if (!enabled) {
       stopPolling("disabled");
       abortAll();
@@ -77804,7 +78392,7 @@ var useOperationsOverviewRefresh = ({
     }
     void refreshAll("scope_change");
   }, [abortAll, companyId, enabled, lineIds.length, refreshAll, scopeSignature, stopPolling, store, supabase]);
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     if (!enabled || !isLiveScope || !supabase || !companyId || lineIds.length === 0) {
       isPageActiveRef.current = false;
       stopPolling("live_scope_disabled");
@@ -77979,55 +78567,55 @@ var PlantHeadView = () => {
   const { accessibleLineIds } = useUserLineAccess();
   const mobileMenuContext = useMobileMenu();
   useHideMobileHeader(!!mobileMenuContext);
-  const storeRef = React141__default.useRef(createOperationsOverviewStore());
+  const storeRef = React142__default.useRef(createOperationsOverviewStore());
   const store = storeRef.current;
-  const fallbackOperationalDate = React141__default.useMemo(
+  const fallbackOperationalDate = React142__default.useMemo(
     () => getOperationalDate(appTimezone),
     [appTimezone]
   );
-  const [dateRange, setDateRange] = React141__default.useState(() => ({
+  const [dateRange, setDateRange] = React142__default.useState(() => ({
     startKey: fallbackOperationalDate,
     endKey: fallbackOperationalDate
   }));
-  const [usesThisWeekComparison, setUsesThisWeekComparison] = React141__default.useState(false);
-  const [trendMode, setTrendMode] = React141__default.useState("all");
-  const [selectedSupervisorId, setSelectedSupervisorId] = React141__default.useState("all");
-  const [selectedLineIds, setSelectedLineIds] = React141__default.useState([]);
-  const [isInitialScopeReady, setIsInitialScopeReady] = React141__default.useState(false);
-  const [shiftResolutionTick, setShiftResolutionTick] = React141__default.useState(0);
-  const hasAutoInitializedScopeRef = React141__default.useRef(false);
-  const hasUserAdjustedScopeRef = React141__default.useRef(false);
-  React141__default.useEffect(() => {
+  const [usesThisWeekComparison, setUsesThisWeekComparison] = React142__default.useState(false);
+  const [trendMode, setTrendMode] = React142__default.useState("all");
+  const [selectedSupervisorId, setSelectedSupervisorId] = React142__default.useState("all");
+  const [selectedLineIds, setSelectedLineIds] = React142__default.useState([]);
+  const [isInitialScopeReady, setIsInitialScopeReady] = React142__default.useState(false);
+  const [shiftResolutionTick, setShiftResolutionTick] = React142__default.useState(0);
+  const hasAutoInitializedScopeRef = React142__default.useRef(false);
+  const hasUserAdjustedScopeRef = React142__default.useRef(false);
+  React142__default.useEffect(() => {
     trackCorePageView("Operations Overview", {
       dashboard_surface: "operations_overview"
     });
   }, []);
-  const currentWeekRange = React141__default.useMemo(
+  const currentWeekRange = React142__default.useMemo(
     () => getCurrentWeekToDateRange(appTimezone),
     [appTimezone]
   );
-  const currentWeekDisplayRange = React141__default.useMemo(
+  const currentWeekDisplayRange = React142__default.useMemo(
     () => getCurrentWeekFullRange(appTimezone),
     [appTimezone]
   );
   const isCurrentWeekToDateRange = dateRange.startKey === currentWeekRange.startKey && dateRange.endKey === currentWeekRange.endKey;
-  const headerDateRange = React141__default.useMemo(() => {
+  const headerDateRange = React142__default.useMemo(() => {
     if (usesThisWeekComparison && isCurrentWeekToDateRange) {
       return currentWeekDisplayRange;
     }
     return dateRange;
   }, [currentWeekDisplayRange, dateRange, isCurrentWeekToDateRange, usesThisWeekComparison]);
-  const normalizedLineIds = React141__default.useMemo(
+  const normalizedLineIds = React142__default.useMemo(
     () => Array.from(new Set(
       (accessibleLineIds || []).filter(Boolean).filter((lineId) => lineId !== factoryViewId)
     )).sort(),
     [accessibleLineIds, factoryViewId]
   );
-  const lineIdsKey = React141__default.useMemo(
+  const lineIdsKey = React142__default.useMemo(
     () => normalizedLineIds.join(","),
     [normalizedLineIds]
   );
-  const lineOptions = React141__default.useMemo(
+  const lineOptions = React142__default.useMemo(
     () => normalizedLineIds.map((lineId) => ({
       id: lineId,
       name: getLineDisplayName(entityConfig, lineId)
@@ -78039,7 +78627,7 @@ var PlantHeadView = () => {
     companyId: entityConfig.companyId,
     useBackend: true
   });
-  const supervisorOptions = React141__default.useMemo(
+  const supervisorOptions = React142__default.useMemo(
     () => {
       const optionsById = /* @__PURE__ */ new Map();
       normalizedLineIds.forEach((lineId) => {
@@ -78065,7 +78653,7 @@ var PlantHeadView = () => {
     },
     [normalizedLineIds, supervisorsByLineId]
   );
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     if (selectedSupervisorId === "all") {
       setSelectedLineIds((previous) => {
         if (normalizedLineIds.length === 0) {
@@ -78091,7 +78679,7 @@ var PlantHeadView = () => {
     const scopedSupervisorLineIds = normalizedLineIds.filter((lineId) => supervisorLineIdSet.has(lineId));
     setSelectedLineIds((previous) => previous.length === scopedSupervisorLineIds.length && previous.every((lineId, index) => lineId === scopedSupervisorLineIds[index]) ? previous : scopedSupervisorLineIds);
   }, [lineIdsKey, normalizedLineIds, selectedSupervisorId, supervisorOptions]);
-  const scopedLineIds = React141__default.useMemo(
+  const scopedLineIds = React142__default.useMemo(
     () => selectedLineIds.length > 0 ? selectedLineIds : normalizedLineIds,
     [normalizedLineIds, selectedLineIds]
   );
@@ -78099,7 +78687,7 @@ var PlantHeadView = () => {
     shiftConfigMap,
     isLoading: isShiftConfigLoading
   } = useMultiLineShiftConfigs(scopedLineIds, staticShiftConfig);
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     if (scopedLineIds.length === 0 || isShiftConfigLoading) {
       return;
     }
@@ -78110,11 +78698,11 @@ var PlantHeadView = () => {
       clearInterval(intervalId);
     };
   }, [isShiftConfigLoading, scopedLineIds.length]);
-  const shiftResolutionNow = React141__default.useMemo(
+  const shiftResolutionNow = React142__default.useMemo(
     () => /* @__PURE__ */ new Date(),
     [shiftResolutionTick]
   );
-  const earliestDayShiftStartTime = React141__default.useMemo(() => {
+  const earliestDayShiftStartTime = React142__default.useMemo(() => {
     const candidateStarts = [];
     scopedLineIds.forEach((lineId) => {
       const shiftConfig = shiftConfigMap.get(lineId) || staticShiftConfig;
@@ -78150,11 +78738,11 @@ var PlantHeadView = () => {
     const minutes = earliestMinutes % 60;
     return `${hours.toString().padStart(2, "0")}:${minutes.toString().padStart(2, "0")}`;
   }, [appTimezone, scopedLineIds, shiftConfigMap, staticShiftConfig]);
-  const resolvedOperationalToday = React141__default.useMemo(
+  const resolvedOperationalToday = React142__default.useMemo(
     () => getOperationalDate(appTimezone, shiftResolutionNow, earliestDayShiftStartTime),
     [appTimezone, earliestDayShiftStartTime, shiftResolutionNow]
   );
-  const activeLineShiftStates = React141__default.useMemo(() => {
+  const activeLineShiftStates = React142__default.useMemo(() => {
     return scopedLineIds.flatMap((lineId) => {
       const shiftConfig = shiftConfigMap.get(lineId) || staticShiftConfig;
       const activeShift = getActiveShift(appTimezone, shiftConfig, shiftResolutionNow);
@@ -78181,16 +78769,16 @@ var PlantHeadView = () => {
       }];
     });
   }, [appTimezone, scopedLineIds, shiftConfigMap, shiftResolutionNow, staticShiftConfig]);
-  const hasActiveDayShiftLine = React141__default.useMemo(
+  const hasActiveDayShiftLine = React142__default.useMemo(
     () => activeLineShiftStates.some((shift) => shift.trendMode === "day" && shift.date === resolvedOperationalToday),
     [activeLineShiftStates, resolvedOperationalToday]
   );
-  const hasActiveNightShiftLine = React141__default.useMemo(
+  const hasActiveNightShiftLine = React142__default.useMemo(
     () => activeLineShiftStates.some((shift) => shift.trendMode === "night" && shift.date === resolvedOperationalToday),
     [activeLineShiftStates, resolvedOperationalToday]
   );
   const resolvedTrendMode = isInitialScopeReady ? trendMode : "all";
-  const hourlyWindowStartTime = React141__default.useMemo(() => {
+  const hourlyWindowStartTime = React142__default.useMemo(() => {
     if (scopedLineIds.length === 0) {
       return null;
     }
@@ -78241,12 +78829,12 @@ var PlantHeadView = () => {
     const minutes = earliestMinutes % 60;
     return `${hours.toString().padStart(2, "0")}:${minutes.toString().padStart(2, "0")}`;
   }, [appTimezone, resolvedTrendMode, scopedLineIds, shiftConfigMap, staticShiftConfig]);
-  const isShiftScopeResolved = React141__default.useMemo(
+  const isShiftScopeResolved = React142__default.useMemo(
     () => !isShiftConfigLoading,
     [isShiftConfigLoading]
   );
-  const initializedTimezoneRef = React141__default.useRef(appTimezone);
-  React141__default.useEffect(() => {
+  const initializedTimezoneRef = React142__default.useRef(appTimezone);
+  React142__default.useEffect(() => {
     if (initializedTimezoneRef.current === appTimezone) return;
     hasAutoInitializedScopeRef.current = false;
     hasUserAdjustedScopeRef.current = false;
@@ -78259,7 +78847,7 @@ var PlantHeadView = () => {
     setIsInitialScopeReady(false);
     initializedTimezoneRef.current = appTimezone;
   }, [appTimezone, fallbackOperationalDate]);
-  React141__default.useEffect(() => {
+  React142__default.useEffect(() => {
     if (hasAutoInitializedScopeRef.current || hasUserAdjustedScopeRef.current) {
       return;
     }
@@ -78284,7 +78872,7 @@ var PlantHeadView = () => {
     hasAutoInitializedScopeRef.current = true;
     setIsInitialScopeReady(true);
   }, [fallbackOperationalDate, isShiftScopeResolved, resolvedOperationalToday, scopedLineIds.length]);
-  const handleDateRangeChange = React141__default.useCallback((range, meta) => {
+  const handleDateRangeChange = React142__default.useCallback((range, meta) => {
     hasUserAdjustedScopeRef.current = true;
     setIsInitialScopeReady(true);
     trackCoreEvent("Operations Overview Date Range Changed", {
@@ -78302,12 +78890,12 @@ var PlantHeadView = () => {
       return previous;
     });
   }, []);
-  const handleTrendModeChange = React141__default.useCallback((mode) => {
+  const handleTrendModeChange = React142__default.useCallback((mode) => {
     hasUserAdjustedScopeRef.current = true;
     setIsInitialScopeReady(true);
     setTrendMode(mode);
   }, []);
-  const handleSelectedLineIdsChange = React141__default.useCallback((lineIds) => {
+  const handleSelectedLineIdsChange = React142__default.useCallback((lineIds) => {
     setSelectedSupervisorId("all");
     if (normalizedLineIds.length === 0) {
       setSelectedLineIds([]);
@@ -78318,10 +78906,10 @@ var PlantHeadView = () => {
     const next = normalizedLineIds.filter((lineId) => selectedSet.has(lineId));
     setSelectedLineIds(next.length > 0 ? next : normalizedLineIds);
   }, [normalizedLineIds]);
-  const handleSelectedSupervisorIdChange = React141__default.useCallback((supervisorId) => {
+  const handleSelectedSupervisorIdChange = React142__default.useCallback((supervisorId) => {
     setSelectedSupervisorId(supervisorId);
   }, []);
-  const buildLineMonthlyHistoryUrl = React141__default.useCallback((lineId) => {
+  const buildLineMonthlyHistoryUrl = React142__default.useCallback((lineId) => {
     const rangeStartDate = parseDateKeyToDate(dateRange.startKey);
     const params = new URLSearchParams();
     params.set("tab", "monthly_history");
@@ -78331,15 +78919,15 @@ var PlantHeadView = () => {
     params.set("rangeEnd", dateRange.endKey);
     return `/kpis/${lineId}?${params.toString()}`;
   }, [dateRange.endKey, dateRange.startKey]);
-  const handleViewAllPoorestPerformers = React141__default.useCallback(() => {
+  const handleViewAllPoorestPerformers = React142__default.useCallback(() => {
     trackCoreEvent("Operations Overview View All Clicked", { section: "poorest_performers" });
     navigate("/kpis?tab=leaderboard");
   }, [navigate]);
-  const handleViewAllImprovements = React141__default.useCallback(() => {
+  const handleViewAllImprovements = React142__default.useCallback(() => {
     trackCoreEvent("Operations Overview View All Clicked", { section: "improvements" });
     navigate("/improvement-center");
   }, [navigate]);
-  const handleOpenImprovement = React141__default.useCallback((item) => {
+  const handleOpenImprovement = React142__default.useCallback((item) => {
     trackCoreEvent("Operations Overview Improvement Clicked", {
       issue_id: item.issueId,
       issue_number: item.issueNumber,
@@ -78350,13 +78938,13 @@ var PlantHeadView = () => {
     });
     navigate(`/improvement-center?${params.toString()}`);
   }, [navigate]);
-  const comparisonStrategy = React141__default.useMemo(() => {
+  const comparisonStrategy = React142__default.useMemo(() => {
     if (usesThisWeekComparison && isCurrentWeekToDateRange) {
       return "previous_full_week";
     }
     return void 0;
   }, [isCurrentWeekToDateRange, usesThisWeekComparison]);
-  const effectiveDateRange = React141__default.useMemo(() => {
+  const effectiveDateRange = React142__default.useMemo(() => {
     if (isInitialScopeReady) {
       return dateRange;
     }
@@ -78366,21 +78954,21 @@ var PlantHeadView = () => {
       endKey: nextStartKey
     };
   }, [dateRange, fallbackOperationalDate, isInitialScopeReady, resolvedOperationalToday]);
-  const effectiveTrendMode = React141__default.useMemo(
+  const effectiveTrendMode = React142__default.useMemo(
     () => resolvedTrendMode,
     [resolvedTrendMode]
   );
-  const hourlyLabelStartTime = React141__default.useMemo(() => {
+  const hourlyLabelStartTime = React142__default.useMemo(() => {
     if (scopedLineIds.length === 0) {
       return null;
     }
     return hourlyWindowStartTime;
   }, [hourlyWindowStartTime, scopedLineIds.length]);
-  const isSingleDayScope = React141__default.useMemo(
+  const isSingleDayScope = React142__default.useMemo(
     () => effectiveDateRange.startKey === effectiveDateRange.endKey,
     [effectiveDateRange.endKey, effectiveDateRange.startKey]
   );
-  const isLiveScope = React141__default.useMemo(
+  const isLiveScope = React142__default.useMemo(
     () => isSingleDayScope && effectiveDateRange.startKey === resolvedOperationalToday && (effectiveTrendMode === "all" || effectiveTrendMode === "day" && hasActiveDayShiftLine || effectiveTrendMode === "night" && hasActiveNightShiftLine),
     [
       effectiveDateRange.startKey,
@@ -78391,7 +78979,7 @@ var PlantHeadView = () => {
       resolvedOperationalToday
     ]
   );
-  const handleOpenLineDetails = React141__default.useCallback((lineId, lineName) => {
+  const handleOpenLineDetails = React142__default.useCallback((lineId, lineName) => {
     trackCoreEvent("Operations Overview Line Clicked", {
       line_id: lineId,
       line_name: lineName,
@@ -78959,4 +79547,4 @@ var streamProxyConfig = {
   }
 };
 
-export { ACTION_FAMILIES, ACTION_NAMES, AIAgentView_default as AIAgentView, AcceptInvite, AcceptInviteView_default as AcceptInviteView, AdvancedFilterDialog, AdvancedFilterPanel, AudioService, AuthCallback, AuthCallbackView_default as AuthCallbackView, AuthProvider, AuthService, AuthenticatedBottleneckClipsView, AuthenticatedFactoryView, AuthenticatedHelpView, AuthenticatedHomeView, AuthenticatedShiftsView, AuthenticatedTargetsView, AuthenticatedTicketsView, AuthenticatedWorkspaceHealthView, AvatarUpload, AxelNotificationPopup, AxelOrb, BackButton, BackButtonMinimal, BarChart, BaseHistoryCalendar, BottleneckClipsModal, BottleneckClipsView_default as BottleneckClipsView, BottlenecksContent, BreakNotificationPopup, CachePrefetchStatus, Card2 as Card, CardContent2 as CardContent, CardDescription2 as CardDescription, CardFooter2 as CardFooter, CardHeader2 as CardHeader, CardTitle2 as CardTitle, ChangeRoleDialog, ClipFilterProvider, ClipsCostView_default as ClipsCostView, CompactWorkspaceHealthCard, ConfirmRemoveUserDialog, CongratulationsOverlay, CroppedHlsVideoPlayer, CroppedVideoPlayer, CycleTimeChart, CycleTimeOverTimeChart, DEFAULT_ANALYTICS_CONFIG, DEFAULT_AUTH_CONFIG, DEFAULT_CONFIG, DEFAULT_DATABASE_CONFIG, DEFAULT_DATE_TIME_CONFIG, DEFAULT_ENDPOINTS_CONFIG, DEFAULT_ENTITY_CONFIG, DEFAULT_HOME_VIEW_CONFIG, DEFAULT_MAP_VIEW_CONFIG, DEFAULT_SHIFT_CONFIG, DEFAULT_SHIFT_DATA, DEFAULT_THEME_CONFIG, DEFAULT_VIDEO_CONFIG, DEFAULT_WORKSPACE_CONFIG, DEFAULT_WORKSPACE_POSITIONS, DashboardHeader, DashboardLayout, DashboardOverridesProvider, DashboardProvider, DateDisplay_default as DateDisplay, DateTimeDisplay, DebugAuth, DebugAuthView_default as DebugAuthView, DetailedHealthStatus, DiagnosisVideoModal, EFFICIENCY_ON_TRACK_THRESHOLD, EmptyStateMessage, EncouragementOverlay, FactoryAssignmentDropdown, FactoryView_default as FactoryView, FileManagerFilters, FilterDialogTrigger, FirstTimeLoginDebug, FirstTimeLoginHandler, FittingTitle, GaugeChart, GridComponentsPlaceholder, HamburgerButton, Header, HealthDateShiftSelector, HealthStatusGrid, HealthStatusIndicator, HelpView_default as HelpView, HlsVideoPlayer, HomeView_default as HomeView, HourlyOutputChart2 as HourlyOutputChart, HourlyUptimeChart, ISTTimer_default as ISTTimer, IdleTimeVlmConfigProvider, ImprovementCenterView_default as ImprovementCenterView, InlineEditableText, InteractiveOnboardingTour, InvitationService, InvitationsTable, InviteUserDialog, KPICard, KPIDetailView_default as KPIDetailView, KPIGrid, KPIHeader, KPISection, KPIsOverviewView_default as KPIsOverviewView, LINE_1_UUID, LINE_2_UUID, LargeOutputProgressChart, LeaderboardDetailView_default as LeaderboardDetailView, Legend5 as Legend, LineAssignmentDropdown, LineChart, LineHistoryCalendar, LineMonthlyHistory, LineMonthlyPdfGenerator, LinePdfExportButton, LinePdfGenerator, LineWhatsAppShareButton, LinesService, LiveTimer, LoadingInline, LoadingOverlay_default as LoadingOverlay, LoadingPage_default as LoadingPage, LoadingSkeleton, LoadingState, LoginPage, LoginView_default as LoginView, Logo, MainLayout, MapGridView, MetricCard_default as MetricCard, MinimalOnboardingPopup, MobileMenuProvider, NewClipsNotification, NoWorkspaceData, OnboardingDemo, OnboardingTour, OptifyeAgentClient, OptifyeLogoLoader_default as OptifyeLogoLoader, OutputProgressChart, PageHeader, PieChart4 as PieChart, PlantHeadView_default as PlantHeadView, PlayPauseIndicator, PrefetchConfigurationError, PrefetchError, PrefetchEvents, PrefetchStatus, PrefetchTimeoutError, ProfileView_default as ProfileView, RegistryProvider, RoleBadge, S3ClipsSupabaseService as S3ClipsService, S3Service, SKUManagementView, SOPComplianceChart, SSEChatClient, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, SessionTracker, SessionTrackingContext, SessionTrackingProvider, SettingsPopup, ShiftDisplay_default as ShiftDisplay, ShiftsView_default as ShiftsView, SideNavBar, SignupWithInvitation, SilentErrorBoundary, SimpleOnboardingPopup, SingleVideoStream_default as SingleVideoStream, Skeleton, SubscriptionManager, SubscriptionManagerProvider, SupabaseProvider, SupervisorDropdown_default as SupervisorDropdown, SupervisorManagementView_default as SupervisorManagementView, SupervisorService, TargetWorkspaceGrid, TargetsView_default as TargetsView, TeamManagementView_default as TeamManagementView, ThreadSidebar, TicketHistory_default as TicketHistory, TicketHistoryService, TicketsView_default as TicketsView, TimeDisplay_default as TimeDisplay, TimePickerDropdown, Timer_default as Timer, TimezoneProvider, TimezoneService, UptimeDonutChart, UptimeLineChart, UptimeMetricCards, UserAvatar, UserManagementService, UserManagementTable, UserService, UserUsageDetailModal, UserUsageStats, VideoCard, VideoGridView, VideoPlayer, VideoPreloader, WORKSPACE_POSITIONS, WhatsAppShareButton, WorkspaceCard, WorkspaceCycleTimeMetricCards, WorkspaceDetailView_default as WorkspaceDetailView, WorkspaceDisplayNameExample, WorkspaceGrid, WorkspaceGridItem, WorkspaceHealthCard, WorkspaceHealthView_default as WorkspaceHealthView, WorkspaceHistoryCalendar, WorkspaceMetricCards, WorkspaceMetricCardsImpl, WorkspaceMonthlyDataFetcher, WorkspaceMonthlyHistory, WorkspaceMonthlyPdfGenerator, WorkspacePdfExportButton, WorkspacePdfGenerator, WorkspaceWhatsAppShareButton, actionService, aggregateKPIsFromLineMetricsRows, alertsService, apiUtils, areAllLinesOnSameShift, authCoreService, authOTPService, authRateLimitService, awardsService, buildDateKey, buildKPIsFromLineMetricsRow, buildShiftGroupsKey, canRoleAccessDashboardPath, canRoleAccessTeamManagement, canRoleAssignFactories, canRoleAssignLines, canRoleChangeRole, canRoleInviteRole, canRoleManageCompany, canRoleManageTargets, canRoleManageUsers, canRoleRemoveUser, canRoleViewClipsCost, canRoleViewUsageStats, captureSentryException, captureSentryMessage, checkRateLimit2 as checkRateLimit, clearAllRateLimits2 as clearAllRateLimits, clearRateLimit2 as clearRateLimit, clearS3VideoCache, clearS3VideoFromCache, clearSentryContext, clearWorkspaceDisplayNamesCache, cn, createDefaultKPIs, createInvitationService, createLinesService, createSessionTracker, createStorageService, createStreamProxyHandler, createSupabaseClient, createSupervisorService, createThrottledReload, createUserManagementService, createUserService, dashboardService, deleteThread, fetchIdleTimeReasons, filterDataByDateKeyRange, forceRefreshWorkspaceDisplayNames, formatAwardMonth, formatDateInZone, formatDateKeyForDisplay, formatDateTimeInZone, formatDuration2 as formatDuration, formatISTDate, formatIdleTime, formatRangeLabel, formatReasonLabel, formatRelativeTime, formatTimeInZone, fromUrlFriendlyName, getActionDisplayName, getActiveShift, getAllLineDisplayNames, getAllThreadMessages, getAllWorkspaceDisplayNamesAsync, getAllWorkspaceDisplayNamesSnapshot, getAnonClient, getAssignableRoles, getAssignmentColumnLabel, getAvailableShiftIds, getAwardBadgeType, getAwardDescription, getAwardTitle, getBrowserName, getCameraNumber, getCompanyMetricsTableName, getConfigurableShortWorkspaceDisplayName, getConfigurableWorkspaceDisplayName, getConfiguredLineIds, getCoreSessionRecordingProperties, getCoreSessionReplayUrl, getCurrentShift, getCurrentShiftForLine, getCurrentTimeInZone, getCurrentWeekFullRange, getCurrentWeekToDateRange, getDashboardHeaderTimeInZone, getDateKeyFromDate, getDaysDifferenceInZone, getDefaultCameraStreamUrl, getDefaultLineId, getDefaultTabForWorkspace, getInitials, getLineDisplayName, getManufacturingInsights, getMetricsTablePrefix, getMonthKeyBounds, getMonthWeekRanges, getNextUpdateInterval, getOperationalDate, getRoleAssignmentKind, getRoleDescription, getRoleLabel, getRoleMetadata, getRoleNavPaths, getS3SignedUrl, getS3VideoSrc, getShiftData, getShiftNameById, getShiftWorkDurationSeconds, getShortShiftName, getShortWorkspaceDisplayName, getShortWorkspaceDisplayNameAsync, getStoredWorkspaceMappings, getSubscriptionManager, getThreadMessages, getUniformShiftGroup, getUserThreads, getUserThreadsPaginated, getVisibleRolesForCurrentUser, getWorkspaceDisplayName, getWorkspaceDisplayNameAsync, getWorkspaceDisplayNamesMap, getWorkspaceFromUrl, getWorkspaceNavigationParams, groupLinesByShift, hasAnyShiftData, identifyCoreUser, initializeCoreMixpanel, isEfficiencyOnTrack, isFactoryScopedRole, isFullMonthRange, isLegacyConfiguration, isLoopbackHostname, isPrefetchError, isRecentFlowVideoGridMetricMode, isSafari, isSupervisorRole, isTransitionPeriod, isUrlPermanentlyFailed, isValidFactoryViewConfiguration, isValidLineInfoPayload, isValidPrefetchParams, isValidPrefetchStatus, isValidWorkspaceDetailedMetricsPayload, isValidWorkspaceMetricsPayload, isWipGatedVideoGridMetricMode, isWorkspaceDisplayNamesLoaded, isWorkspaceDisplayNamesLoading, lineLeaderboardService, linesService, mergeWithDefaultConfig, migrateLegacyConfiguration, normalizeActionFamily, normalizeDateKeyRange, normalizeRoleLevel, normalizeVideoGridMetricMode, optifyeAgentClient, parseDateKeyToDate, parseS3Uri, preInitializeWorkspaceDisplayNames, preloadS3Video, preloadS3VideoUrl, preloadS3VideosUrl, preloadVideoUrl, preloadVideosUrl, qualityService, realtimeService, refreshWorkspaceDisplayNames, resetCoreMixpanel, resetFailedUrl, resetSubscriptionManager, s3VideoPreloader, setSentryUserContext, setSentryWorkspaceContext, shouldEnableLocalDevTestLogin, shuffleArray, simulateApiDelay, skuService, startCoreSessionRecording, stopCoreSessionRecording, storeWorkspaceMapping, streamProxyConfig, subscribeWorkspaceDisplayNames, throttledReloadDashboard, toUrlFriendlyName, trackCoreEvent, trackCorePageView, transformToChartData, updateThreadTitle, upsertWorkspaceDisplayNameInCache, useAccessControl, useActiveBreaks, useActiveLineId, useAllWorkspaceMetrics, useAnalyticsConfig, useAppTimezone, useAudioService, useAuth, useAuthConfig, useAxelNotifications, useCanSaveTargets, useClipFilter, useClipTypes, useClipTypesWithCounts, useClipsInit, useCompanyClipsCost, useCompanyUsersUsage, useComponentOverride, useCustomConfig, useDashboardConfig, useDashboardMetrics, useDatabaseConfig, useDateFormatter, useDateTimeConfig, useDynamicShiftConfig, useEndpointsConfig, useEntityConfig, useFactoryOverviewMetrics, useFeatureFlags, useFormatNumber, useHasLineAccess, useHideMobileHeader, useHistoricWorkspaceMetrics, useHlsStream, useHlsStreamWithCropping, useHookOverride, useHourEndTimer, useHourlyTargetAchievements, useHourlyTargetMisses, useIdleTimeClipClassifications, useIdleTimeReasons, useIdleTimeVlmConfig, useKpiTrends, useLeaderboardMetrics, useLineDetailedMetrics, useLineKPIs, useLineMetrics, useLineShiftConfig, useLineSupervisor, useLineWorkspaceMetrics, useLines, useMessages, useMetrics, useMobileMenu, useMonthlyTrend, useMultiLineShiftConfigs, useNavigation, useOperationalShiftKey, useOptionalSupabase, useOverrides, usePageOverride, usePrefetchClipCounts, useRealtimeLineMetrics, useRegistry, useSKUs, useSessionKeepAlive, useSessionTracking, useSessionTrackingContext, useShiftConfig, useShiftGroups, useShifts, useSubscriptionManager, useSubscriptionManagerSafe, useSupabase, useSupabaseClient, useSupervisorsByLineIds, useTargets, useTeamManagementPermissions, useTheme, useThemeConfig, useThreads, useTicketHistory, useTimezoneContext, useUserLineAccess, useUserUsage, useVideoConfig, useWorkspaceConfig, useWorkspaceDetailedMetrics, useWorkspaceDisplayName, useWorkspaceDisplayNames, useWorkspaceDisplayNamesMap, useWorkspaceHealthById, useWorkspaceHealthLastSeen, useWorkspaceHealthStatus, useWorkspaceMetrics, useWorkspaceNavigation, useWorkspaceOperators, useWorkspaceUptimeTimeline, useWorkspaceVideoStreams, userService, videoPrefetchManager, videoPreloader, weeklyTopPerformerService, whatsappService, withAccessControl, withAuth, withRegistry, withTimezone, workspaceHealthService, workspaceService };
+export { ACTION_FAMILIES, ACTION_NAMES, AIAgentView_default as AIAgentView, AcceptInvite, AcceptInviteView_default as AcceptInviteView, AdvancedFilterDialog, AdvancedFilterPanel, AudioService, AuthCallback, AuthCallbackView_default as AuthCallbackView, AuthProvider, AuthService, AuthenticatedBottleneckClipsView, AuthenticatedFactoryView, AuthenticatedHelpView, AuthenticatedHomeView, AuthenticatedShiftsView, AuthenticatedTargetsView, AuthenticatedTicketsView, AuthenticatedWorkspaceHealthView, AvatarUpload, AxelNotificationPopup, AxelOrb, BackButton, BackButtonMinimal, BarChart, BaseHistoryCalendar, BottleneckClipsModal, BottleneckClipsView_default as BottleneckClipsView, BottlenecksContent, BreakNotificationPopup, CachePrefetchStatus, Card2 as Card, CardContent2 as CardContent, CardDescription2 as CardDescription, CardFooter2 as CardFooter, CardHeader2 as CardHeader, CardTitle2 as CardTitle, ChangeRoleDialog, ClipFilterProvider, ClipsCostView_default as ClipsCostView, CompactWorkspaceHealthCard, ConfirmRemoveUserDialog, CongratulationsOverlay, CroppedHlsVideoPlayer, CroppedVideoPlayer, CycleTimeChart, CycleTimeOverTimeChart, DEFAULT_ANALYTICS_CONFIG, DEFAULT_AUTH_CONFIG, DEFAULT_CONFIG, DEFAULT_DATABASE_CONFIG, DEFAULT_DATE_TIME_CONFIG, DEFAULT_ENDPOINTS_CONFIG, DEFAULT_ENTITY_CONFIG, DEFAULT_HOME_VIEW_CONFIG, DEFAULT_MAP_VIEW_CONFIG, DEFAULT_SHIFT_CONFIG, DEFAULT_SHIFT_DATA, DEFAULT_THEME_CONFIG, DEFAULT_VIDEO_CONFIG, DEFAULT_WORKSPACE_CONFIG, DEFAULT_WORKSPACE_POSITIONS, DashboardHeader, DashboardLayout, DashboardOverridesProvider, DashboardProvider, DateDisplay_default as DateDisplay, DateTimeDisplay, DebugAuth, DebugAuthView_default as DebugAuthView, DetailedHealthStatus, DiagnosisVideoModal, EFFICIENCY_ON_TRACK_THRESHOLD, EmptyStateMessage, EncouragementOverlay, FactoryAssignmentDropdown, FactoryView_default as FactoryView, FileManagerFilters, FilterDialogTrigger, FirstTimeLoginDebug, FirstTimeLoginHandler, FittingTitle, GaugeChart, GridComponentsPlaceholder, HamburgerButton, Header, HealthDateShiftSelector, HealthStatusGrid, HealthStatusIndicator, HelpView_default as HelpView, HlsVideoPlayer, HomeView_default as HomeView, HourlyOutputChart2 as HourlyOutputChart, HourlyUptimeChart, ISTTimer_default as ISTTimer, IdleTimeVlmConfigProvider, ImprovementCenterView_default as ImprovementCenterView, InlineEditableText, InteractiveOnboardingTour, InvitationService, InvitationsTable, InviteUserDialog, KPICard, KPIDetailView_default as KPIDetailView, KPIGrid, KPIHeader, KPISection, KPIsOverviewView_default as KPIsOverviewView, LINE_1_UUID, LINE_2_UUID, LargeOutputProgressChart, LeaderboardDetailView_default as LeaderboardDetailView, Legend5 as Legend, LineAssignmentDropdown, LineChart, LineHistoryCalendar, LineMonthlyHistory, LineMonthlyPdfGenerator, LinePdfExportButton, LinePdfGenerator, LineWhatsAppShareButton, LinesService, LiveTimer, LoadingInline, LoadingOverlay_default as LoadingOverlay, LoadingPage_default as LoadingPage, LoadingSkeleton, LoadingState, LoginPage, LoginView_default as LoginView, Logo, MainLayout, MapGridView, MetricCard_default as MetricCard, MinimalOnboardingPopup, MobileMenuProvider, NewClipsNotification, NoWorkspaceData, OnboardingDemo, OnboardingTour, OptifyeAgentClient, OptifyeLogoLoader_default as OptifyeLogoLoader, OutputProgressChart, PageHeader, PieChart4 as PieChart, PlantHeadView_default as PlantHeadView, PlayPauseIndicator, PrefetchConfigurationError, PrefetchError, PrefetchEvents, PrefetchStatus, PrefetchTimeoutError, ProfileView_default as ProfileView, RegistryProvider, RoleBadge, S3ClipsSupabaseService as S3ClipsService, S3Service, SKUManagementView, SOPComplianceChart, SSEChatClient, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, SessionTracker, SessionTrackingContext, SessionTrackingProvider, SettingsPopup, ShiftDisplay_default as ShiftDisplay, ShiftsView_default as ShiftsView, SideNavBar, SignupWithInvitation, SilentErrorBoundary, SimpleOnboardingPopup, SingleVideoStream_default as SingleVideoStream, Skeleton, SubscriptionManager, SubscriptionManagerProvider, SupabaseProvider, SupervisorDropdown_default as SupervisorDropdown, SupervisorManagementView_default as SupervisorManagementView, SupervisorService, TargetWorkspaceGrid, TargetsView_default as TargetsView, TeamManagementView_default as TeamManagementView, ThreadSidebar, TicketHistory_default as TicketHistory, TicketHistoryService, TicketsView_default as TicketsView, TimeDisplay_default as TimeDisplay, TimePickerDropdown, Timer_default as Timer, TimezoneProvider, TimezoneService, UptimeDonutChart, UptimeLineChart, UptimeMetricCards, UserAvatar, UserManagementService, UserManagementTable, UserService, UserUsageDetailModal, UserUsageStats, VideoCard, VideoGridView, VideoPlayer, VideoPreloader, WORKSPACE_POSITIONS, WhatsAppShareButton, WorkspaceCard, WorkspaceCycleTimeMetricCards, WorkspaceDetailView_default as WorkspaceDetailView, WorkspaceDisplayNameExample, WorkspaceGrid, WorkspaceGridItem, WorkspaceHealthCard, WorkspaceHealthView_default as WorkspaceHealthView, WorkspaceHistoryCalendar, WorkspaceMetricCards, WorkspaceMetricCardsImpl, WorkspaceMonthlyDataFetcher, WorkspaceMonthlyHistory, WorkspaceMonthlyPdfGenerator, WorkspacePdfExportButton, WorkspacePdfGenerator, WorkspaceWhatsAppShareButton, actionService, aggregateKPIsFromLineMetricsRows, alertsService, apiUtils, areAllLinesOnSameShift, authCoreService, authOTPService, authRateLimitService, awardsService, buildDateKey, buildKPIsFromLineMetricsRow, buildShiftGroupsKey, canRoleAccessDashboardPath, canRoleAccessTeamManagement, canRoleAssignFactories, canRoleAssignLines, canRoleChangeRole, canRoleInviteRole, canRoleManageCompany, canRoleManageTargets, canRoleManageUsers, canRoleRemoveUser, canRoleViewClipsCost, canRoleViewUsageStats, captureSentryException, captureSentryMessage, checkRateLimit2 as checkRateLimit, clearAllRateLimits2 as clearAllRateLimits, clearRateLimit2 as clearRateLimit, clearS3VideoCache, clearS3VideoFromCache, clearSentryContext, clearWorkspaceDisplayNamesCache, cn, createDefaultKPIs, createInvitationService, createLinesService, createSessionTracker, createStorageService, createStreamProxyHandler, createSupabaseClient, createSupervisorService, createThrottledReload, createUserManagementService, createUserService, dashboardService, deleteThread, fetchIdleTimeReasons, filterDataByDateKeyRange, forceRefreshWorkspaceDisplayNames, formatAwardMonth, formatDateInZone, formatDateKeyForDisplay, formatDateTimeInZone, formatDuration2 as formatDuration, formatISTDate, formatIdleTime, formatRangeLabel, formatReasonLabel, formatRelativeTime, formatTimeInZone, fromUrlFriendlyName, getActionDisplayName, getActiveShift, getAllLineDisplayNames, getAllThreadMessages, getAllWorkspaceDisplayNamesAsync, getAllWorkspaceDisplayNamesSnapshot, getAnonClient, getAssignableRoles, getAssignmentColumnLabel, getAvailableShiftIds, getAwardBadgeType, getAwardDescription, getAwardTitle, getBrowserName, getCameraNumber, getCompanyMetricsTableName, getConfigurableShortWorkspaceDisplayName, getConfigurableWorkspaceDisplayName, getConfiguredLineIds, getCoreSessionRecordingProperties, getCoreSessionReplayUrl, getCurrentShift, getCurrentShiftForLine, getCurrentTimeInZone, getCurrentWeekFullRange, getCurrentWeekToDateRange, getDashboardHeaderTimeInZone, getDateKeyFromDate, getDaysDifferenceInZone, getDefaultCameraStreamUrl, getDefaultLineId, getDefaultTabForWorkspace, getInitials, getLineDisplayName, getManufacturingInsights, getMetricsTablePrefix, getMonthKeyBounds, getMonthWeekRanges, getNextUpdateInterval, getOperationalDate, getRoleAssignmentKind, getRoleDescription, getRoleLabel, getRoleMetadata, getRoleNavPaths, getS3SignedUrl, getS3VideoSrc, getShiftData, getShiftNameById, getShiftWorkDurationSeconds, getShortShiftName, getShortWorkspaceDisplayName, getShortWorkspaceDisplayNameAsync, getStoredWorkspaceMappings, getSubscriptionManager, getThreadMessages, getUniformShiftGroup, getUserThreads, getUserThreadsPaginated, getVisibleRolesForCurrentUser, getWorkspaceDisplayName, getWorkspaceDisplayNameAsync, getWorkspaceDisplayNamesMap, getWorkspaceFromUrl, getWorkspaceNavigationParams, groupLinesByShift, hasAnyShiftData, identifyCoreUser, initializeCoreMixpanel, isEfficiencyOnTrack, isFactoryScopedRole, isFullMonthRange, isLegacyConfiguration, isLoopbackHostname, isPrefetchError, isRecentFlowVideoGridMetricMode, isSafari, isSupervisorRole, isTransitionPeriod, isUrlPermanentlyFailed, isValidFactoryViewConfiguration, isValidLineInfoPayload, isValidPrefetchParams, isValidPrefetchStatus, isValidWorkspaceDetailedMetricsPayload, isValidWorkspaceMetricsPayload, isWipGatedVideoGridMetricMode, isWorkspaceDisplayNamesLoaded, isWorkspaceDisplayNamesLoading, lineLeaderboardService, linesService, mergeWithDefaultConfig, migrateLegacyConfiguration, normalizeActionFamily, normalizeDateKeyRange, normalizeRoleLevel, normalizeVideoGridMetricMode, optifyeAgentClient, parseDateKeyToDate, parseS3Uri, preInitializeWorkspaceDisplayNames, preloadS3Video, preloadS3VideoUrl, preloadS3VideosUrl, preloadVideoUrl, preloadVideosUrl, qualityService, realtimeService, refreshWorkspaceDisplayNames, resetCoreMixpanel, resetFailedUrl, resetSubscriptionManager, s3VideoPreloader, setSentryUserContext, setSentryWorkspaceContext, shouldEnableLocalDevTestLogin, shuffleArray, simulateApiDelay, skuService, startCoreSessionRecording, stopCoreSessionRecording, storeWorkspaceMapping, streamProxyConfig, subscribeWorkspaceDisplayNames, throttledReloadDashboard, toUrlFriendlyName, trackCoreEvent, trackCorePageView, transformToChartData, updateThreadTitle, upsertWorkspaceDisplayNameInCache, useAccessControl, useActiveBreaks, useActiveLineId, useAllWorkspaceMetrics, useAnalyticsConfig, useAppTimezone, useAudioService, useAuth, useAuthConfig, useAxelNotifications, useCanSaveTargets, useClipFilter, useClipTypes, useClipTypesWithCounts, useClipsInit, useCompanyClipsCost, useCompanyHasVlmEnabledLine, useCompanyUsersUsage, useComponentOverride, useCustomConfig, useDashboardConfig, useDashboardMetrics, useDatabaseConfig, useDateFormatter, useDateTimeConfig, useDynamicShiftConfig, useEndpointsConfig, useEntityConfig, useFactoryOverviewMetrics, useFeatureFlags, useFormatNumber, useHasLineAccess, useHideMobileHeader, useHistoricWorkspaceMetrics, useHlsStream, useHlsStreamWithCropping, useHookOverride, useHourEndTimer, useHourlyTargetAchievements, useHourlyTargetMisses, useIdleTimeClipClassifications, useIdleTimeReasons, useIdleTimeVlmConfig, useKpiTrends, useLeaderboardMetrics, useLineDetailedMetrics, useLineKPIs, useLineMetrics, useLineShiftConfig, useLineSupervisor, useLineWorkspaceMetrics, useLines, useMessages, useMetrics, useMobileMenu, useMonthlyTrend, useMultiLineShiftConfigs, useNavigation, useOperationalShiftKey, useOptionalSupabase, useOverrides, usePageOverride, usePrefetchClipCounts, useRealtimeLineMetrics, useRegistry, useSKUs, useSessionKeepAlive, useSessionTracking, useSessionTrackingContext, useShiftConfig, useShiftGroups, useShifts, useSubscriptionManager, useSubscriptionManagerSafe, useSupabase, useSupabaseClient, useSupervisorsByLineIds, useTargets, useTeamManagementPermissions, useTheme, useThemeConfig, useThreads, useTicketHistory, useTimezoneContext, useUserLineAccess, useUserUsage, useVideoConfig, useWorkspaceConfig, useWorkspaceDetailedMetrics, useWorkspaceDisplayName, useWorkspaceDisplayNames, useWorkspaceDisplayNamesMap, useWorkspaceHealthById, useWorkspaceHealthLastSeen, useWorkspaceHealthStatus, useWorkspaceMetrics, useWorkspaceNavigation, useWorkspaceOperators, useWorkspaceUptimeTimeline, useWorkspaceVideoStreams, userService, videoPrefetchManager, videoPreloader, weeklyTopPerformerService, whatsappService, withAccessControl, withAuth, withRegistry, withTimezone, workspaceHealthService, workspaceService };