import SineWavesCanvas from '@/components/animation/sine-wave'
import React from 'react'

export default function StartLayout({
    children,
}: {
    children: React.ReactNode
}) {
    return (
        <div className="min-h-screen bg-gradient-to-br from-blue-50 via-blue-100 to-blue-200 flex">
            {/* 左侧插图区域 */}
            <div className="flex-1 flex items-center justify-end pr-16">
                <div className="max-w-lg text-center">
                    {/* 插图SVG */}
                    <div className="mb-12">
                        <SineWavesCanvas width={500} height={300} />
                    </div>

                    {/* 标题文字 */}
                    <h1 className="text-4xl font-bold text-slate-800 mb-6">
                        智慧门户，尽在烽火
                    </h1>
                    <p className="text-slate-600 text-xl">
                        览新闻，看公告，查信息，用服务
                    </p>
                </div>
            </div>

            {/* 右侧表单区域 - 卡片样式 */}
            <div className="flex-1 flex items-center justify-start pl-16">
                <div className="w-full max-w-lg">
                    <div className="bg-white rounded-2xl shadow-2xl px-12 py-16">
                        {children}
                    </div>
                </div>
            </div>
        </div>
    )
}