import { auth } from '@/lib/auth'
import { headers } from 'next/headers'
import { redirect } from 'next/navigation'
import Link from 'next/link'

export default async function SuperAdminLayout({
    children,
}: {
    children: React.ReactNode
}) {
    const session = await auth.api.getSession({ headers: await headers() })

    if (!session?.user) {
        redirect('/login')
    }

    const superAdminEmail = process.env.SUPERADMIN_EMAIL || 'superadmin@innungsapp.de'
    const isSuperAdmin = session.user.email === superAdminEmail || session.user.role === 'admin'
    if (!isSuperAdmin) {
        redirect('/dashboard') // Normal admins go back to dashboard
    }

    return (
        <div className="min-h-screen bg-gray-50 flex flex-col">
            {/* Super Admin Header */}
            <header className="bg-gray-900 text-white border-t-2 border-brand-500 border-b border-gray-800">
                <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
                    <div className="flex justify-between h-12 items-center">
                        <div className="flex items-center gap-8">
                            <span
                                className="font-bold text-base tracking-tight hover:text-gray-200 transition-colors"
                                style={{ fontFamily: "'Syne', system-ui, sans-serif" }}
                            >
                                <Link href="/superadmin">Super Admin</Link>
                            </span>
                            
                            {/* Super Admin Navigation */}
                            <nav className="hidden md:flex gap-6 text-sm font-medium text-gray-400">
                                <Link href="/superadmin" className="hover:text-white transition-colors">Übersicht</Link>
                                <Link href="/superadmin/landingpages" className="hover:text-white transition-colors">Landingpages</Link>
                            </nav>
                        </div>
                        <span className="text-xs text-gray-400">{session.user.email}</span>
                    </div>
                </div>
            </header>

            {/* Main Content */}
            <main className="flex-1 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8 w-full">
                {children}
            </main>
        </div>
    )
}