'use client';

import Link from 'next/link';
import { CommonHeader } from '@/components/layout/CommonHeader';
import { Footer } from '@/components/layout/Footer';

export default function ComingSoonPage() {
  return (
    <div className="min-h-screen bg-white flex flex-col">
      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-6 w-full">
        <CommonHeader />
      </div>

      <main className="flex-1 flex items-center justify-center px-4">
        <div className="text-center max-w-[500px]">
          <div className="w-16 h-16 bg-[#e58625]/10 rounded-full flex items-center justify-center mx-auto mb-6">
            <span className="text-[32px]">🚧</span>
          </div>
          <h1 className="font-fractul font-bold text-[30px] text-[#00293d] mb-3">
            Coming Soon
          </h1>
          <p className="font-serif text-[14px] text-[#00293d]/70 leading-relaxed mb-8">
            This page is under development. Stay tuned for updates.
          </p>
          <Link
            href="/"
            className="inline-flex items-center justify-center px-6 h-[46px] bg-[#e58625] rounded-[15px] font-fractul font-bold text-[16px] text-[#00293d] hover:bg-[#d47720] transition-colors"
          >
            Go Back Home
          </Link>
        </div>
      </main>

      <Footer />
    </div>
  );
}
