---
import Layout from "@/components/Layout.astro";
import { Countdown } from "@/components/Countdown";
// 恢复静态导入
import WorldHeatmap from '@/components/WorldHeatmap';

// 移除动态导入
// const WorldHeatmap = await import('@/components/WorldHeatmap').then(mod => mod.default);
---

<Layout title="退休倒计时">
    <div class="container mx-auto px-4 py-8">
        <section class="mb-16">
            <h2 class="text-3xl font-semibold text-center mb-6">距离退休还有</h2>
            <div class="max-w-3xl mx-auto bg-white dark:bg-gray-800 rounded-xl shadow-lg p-8 transition-all hover:shadow-xl">
                <Countdown client:load targetDate={"2070-04-06"} />
            </div>
        </section>
        
        <section class="mb-16">
            <h2 class="text-3xl font-semibold text-center mb-6">我的旅行足迹</h2>
            <div class="mx-auto bg-white dark:bg-gray-800 rounded-xl shadow-lg p-6 transition-all hover:shadow-xl">
                <WorldHeatmap client:only="react" />
            </div>
        </section>
    </div>
</Layout>