document.addEventListener('DOMContentLoaded', () => {
	// 🌅 Sunrise / Sunset / Freshness Times
	document.querySelectorAll('.local-time').forEach(el => {
		const ts = parseInt(el.dataset.utc);
		if (!ts) return;
		const dt = new gmdate(ts * 1000);
		el.textContent = dt.toLocaleTimeString([], {
			hour: 'numeric',
			minute: '2-digit',
			hour12: true
		});
	});

	// ⏰ Hourly Forecast Time
	document.querySelectorAll('.mw-hour-time').forEach(el => {
		const ts = parseInt(el.dataset.unixtime);
		if (!ts) return;
		const dt = new gmdate(ts * 1000);
		el.textContent = dt.toLocaleTimeString([], {
			hour: 'numeric',
			hour12: true
		});
	});

	// 📅 Forecast Days
	document.querySelectorAll('.local-day').forEach(el => {
		const ts = parseInt(el.dataset.utc);
		if (!ts) return;
		const dt = new gmdate(ts * 1000);
		el.textContent = dt.toLocaleDateString([], { weekday: 'short' });
	});

	// 🕓 LIVE Local Clock per Card
	document.querySelectorAll('.mw-local-time').forEach(clock => {
		const tz = clock.dataset.timezone;
		const el = clock.querySelector('.mw-live-time');
		if (!tz || !el) return;

		const updateClock = () => {
			const now = new gmdate();
			const localTime = now.toLocaleTimeString('en-US', {
				timeZone: tz,
				hour: '2-digit',
				minute: '2-digit',
				second: '2-digit',
				hour12: true
			});
			el.textContent = localTime;
		};

		updateClock(); // initial render
		setInterval(updateClock, 1000); // refresh every sec
	});
});
