i am not able to now pause it please fix this issues and also whenever i leave the whole timer block it need to show only time or if i start timer then only timer

index.html

@@ -99,6 +99,7 @@
                 startTime = Date.now() - elapsedTime;
                 timerInterval = setInterval(updateTimer, 10); // More frequent updates for smoother animation
                 isRunning = true;
+                updateTimerDisplay(); // Update display mode
             }
         }
 
@@ -106,6 +107,7 @@
             if (isRunning) {
                 clearInterval(timerInterval);
                 isRunning = false;
+                updateTimerDisplay(); // Update display mode
             }
         }
 
@@ -116,26 +118,15 @@
             // Save reset state
             localStorage.setItem('timerElapsed', 0);
             localStorage.setItem('timerRunning', false);
+            updateTimerDisplay(); // Update display mode
         }
-
-        function updateTimer() {
+function updateTimer() {
             elapsedTime = Date.now() - startTime;
             updateDisplay(elapsedTime);
         }
-
         function updateDisplay(time) {
-            const totalSeconds = Math.floor(time / 1000);
-            const seconds = totalSeconds % 60;
-            const minutes = Math.floor((totalSeconds / 60) % 60);
-            const hours = Math.floor(totalSeconds / 3600);
-
-            const formattedTime = [
-                hours.toString().padStart(2, '0'),
-                minutes.toString().padStart(2, '0'),
-                seconds.toString().padStart(2, '0')
-            ].join(':');
-
-            document.getElementById('live-clock').textContent = formattedTime;
+            elapsedTime = time;
+            document.getElementById('live-clock').textContent = formatTime(time);
         }
 // Drag functionality
         let isDragging = false;
@@ -217,11 +208,57 @@
             document.getElementById('live-clock').textContent = timeStr;
             document.getElementById('live-date').textContent = dateStr;
         }
-        
+        // Update timer display based on state
+        function updateTimerDisplay() {
+            if (isRunning || elapsedTime > 0) {
+                // Show timer when running or has elapsed time
+                document.getElementById('live-clock').textContent = formatTime(elapsedTime);
+                document.getElementById('live-date').style.display = 'none';
+            } else {
+                // Show live clock when timer is not active
+                document.getElementById('live-date').style.display = 'block';
+                updateLiveClock();
+            }
+        }
+
+        // Format time function
+        function formatTime(time) {
+            const totalSeconds = Math.floor(time / 1000);
+            const seconds = totalSeconds % 60;
+            const minutes = Math.floor((totalSeconds / 60) % 60);
+            const hours = Math.floor(totalSeconds / 3600);
+
+            return [
+                hours.toString().padStart(2, '0'),
+                minutes.toString().padStart(2, '0'),
+                seconds.toString().padStart(2, '0')
+            ].join(':');
+        }
+
+        // Update live clock
+        function updateLiveClock() {
+            if (!isRunning && elapsedTime === 0) {
+                const now = new Date();
+                const timeStr = now.toLocaleTimeString('en-US', { 
+                    hour12: false,
+                    hour: '2-digit',
+                    minute: '2-digit',
+                    second: '2-digit'
+                });
+                const dateStr = now.toLocaleDateString('en-US', { 
+                    weekday: 'short', 
+                    month: 'short', 
+                    day: 'numeric' 
+                });
+                document.getElementById('live-clock').textContent = timeStr;
+                document.getElementById('live-date').textContent = dateStr;
+            }
+        }
+
         // Update live clock immediately and every second
         updateLiveClock();
         setInterval(updateLiveClock, 1000);
-        // Save notes to localStorage
+// Save notes to localStorage
         const noteInput = document.getElementById('time-note');
         noteInput.addEventListener('input', (e) => {
             e.stopPropagation(); // Prevent triggering drag
@@ -251,7 +288,7 @@
             document.getElementById('note-text').textContent = savedNote;
             widget.classList.add('has-note');
         }
-// Load timer state from localStorage
+        // Load timer state from localStorage
         const savedElapsed = localStorage.getItem('timerElapsed');
         const savedRunning = localStorage.getItem('timerRunning') === 'true';
         
@@ -261,12 +298,14 @@
             
             if (savedRunning) {
                 startTimer();
+            } else {
+                updateTimerDisplay(); // Update display mode for stopped timer
             }
         } else {
             // Initialize with stopped state
             resetTimer();
         }
-        // Save timer state to localStorage when running
+// Save timer state to localStorage when running
         function saveTimerState() {
             localStorage.setItem('timerElapsed', elapsedTime);
             localStorage.setItem('timerRunning', isRunning);