export function updateBackground(): void { const hour = new Date().getHours(); const background = document.getElementById('bg') as HTMLElement | null; if (!background) { console.warn("Background element not found, will retry later."); setTimeout(updateBackground, 500); // Retry after a delay return; } let color1, color2, color3; // Colors for the radial gradients and background if (hour >= 6 && hour < 8) { // Early morning color1 = 'rgba(173, 216, 230, 0.3)'; color2 = 'rgba(135, 206, 250, 0.3)'; color3 = '#B0E0E6'; // Powder blue } else if (hour >= 8 && hour < 10) { // Mid-morning color1 = 'rgba(240, 230, 140, 0.3)'; color2 = 'rgba(238, 232, 170, 0.3)'; color3 = '#F0E68C'; // Khaki } else if (hour >= 10 && hour < 12) { // Late morning color1 = 'rgba(250, 250, 210, 0.3)'; color2 = 'rgba(255, 255, 224, 0.3)'; color3 = '#FFFACD'; // Lemon chiffon } else if (hour >= 12 && hour < 14) { // Early afternoon color1 = 'rgba(255, 182, 193, 0.3)'; color2 = 'rgba(255, 192, 203, 0.3)'; color3 = '#FFB6C1'; // Light pink } else if (hour >= 14 && hour < 16) { // Mid-afternoon color1 = 'rgba(255, 160, 122, 0.3)'; color2 = 'rgba(255, 127, 80, 0.3)'; color3 = '#FFA07A'; // Light salmon } else if (hour >= 16 && hour < 18) { // Late afternoon to early evening color1 = 'rgba(255, 99, 71, 0.3)'; color2 = 'rgba(255, 69, 0, 0.3)'; color3 = '#FF4500'; // Orange red } else { // Night color1 = 'black'; color2 = 'black'; color3 = '#000080'; // Navy blue for a slightly softer night effect } // Set the background image and color background.style.backgroundImage = `radial-gradient(circle at 20% 20%, ${color1}, transparent 70%), radial-gradient(circle at 80% 80%, ${color2}, transparent 70%)`; background.style.backgroundColor = color3; }