import React, { Suspense, lazy } from 'react';
import { Routes, Route, Navigate, useLocation } from 'react-router-dom';
import Header from './components/layout/Header';
import Footer from './components/layout/Footer';

const Home          = lazy(() => import('./pages/Home'));
const GuardiaDetail = lazy(() => import('./pages/GuardiaDetail'));
const SolutionPage  = lazy(() => import('./pages/SolutionPage'));
const Company       = lazy(() => import('./pages/Company'));
const Business      = lazy(() => import('./pages/Business'));
const Contact       = lazy(() => import('./pages/Contact'));
const Support       = lazy(() => import('./pages/Support'));
const NewsPage      = lazy(() => import('./pages/NewsPage'));
const Recruit       = lazy(() => import('./pages/Recruit'));
const NotFound      = lazy(() => import('./pages/NotFound'));

// Member Auth
const MemberLogin = lazy(() => import('./pages/MemberLogin'));
const Privacy     = lazy(() => import('./pages/Privacy'));
const Terms       = lazy(() => import('./pages/Terms'));
const Sitemap     = lazy(() => import('./pages/Sitemap'));

// Admin
const AdminLogin     = lazy(() => import('./pages/admin/AdminLogin'));
const AdminLayout    = lazy(() => import('./pages/admin/AdminLayout'));
const AdminDashboard = lazy(() => import('./pages/admin/AdminDashboard'));
const AdminNews      = lazy(() => import('./pages/admin/AdminNews'));
const AdminInquiry   = lazy(() => import('./pages/admin/AdminInquiry'));
const AdminRecruit   = lazy(() => import('./pages/admin/AdminRecruit'));
const AdminSettings  = lazy(() => import('./pages/admin/AdminSettings'));
const AdminMember    = lazy(() => import('./pages/admin/AdminMember'));
const AdminHistory   = lazy(() => import('./pages/admin/AdminHistory'));

function Loading() {
  return (
    <div style={{ display: 'flex', alignItems: 'center', justifyContent: 'center',
                  height: '60vh', color: 'var(--gray-400)', fontSize: '14px' }}>
      로딩 중...
    </div>
  );
}

function PublicLayout({ children }) {
  return (
    <>
      <Header />
      <Suspense fallback={<Loading />}>{children}</Suspense>
      <Footer />
    </>
  );
}

export default function App() {
  const location = useLocation();
  const isAdmin = location.pathname.startsWith('/admin');

  if (isAdmin) {
    return (
      <Suspense fallback={<Loading />}>
        <Routes>
          <Route path="/admin/login" element={<AdminLogin />} />
          <Route path="/admin" element={<AdminLayout />}>
            <Route index element={<Navigate to="/admin/dashboard" replace />} />
            <Route path="dashboard"  element={<AdminDashboard />} />
            <Route path="news"       element={<AdminNews />} />
            <Route path="inquiries"  element={<AdminInquiry />} />
            <Route path="recruit"    element={<AdminRecruit />} />
            <Route path="members"    element={<AdminMember />} />
            <Route path="history"    element={<AdminHistory />} />
            <Route path="settings"   element={<AdminSettings />} />
          </Route>
          <Route path="*" element={<Navigate to="/admin/login" replace />} />
        </Routes>
      </Suspense>
    );
  }

  return (
    <PublicLayout>
      <Routes>
        <Route path="/"                    element={<Home />} />
        <Route path="/solution/guardia"    element={<GuardiaDetail />} />
        <Route path="/solution/*"          element={<SolutionPage />} />
        <Route path="/company/*"           element={<Company />} />
        <Route path="/business/*"          element={<Business />} />
        <Route path="/support/contact"     element={<Contact />} />
        <Route path="/support/*"           element={<Support />} />
        <Route path="/recruit/*"           element={<Recruit />} />
        <Route path="/news/*"              element={<NewsPage />} />
        <Route path="/login"               element={<MemberLogin />} />
        <Route path="/register"            element={<MemberLogin />} />
        <Route path="/privacy"             element={<Privacy />} />
        <Route path="/terms"               element={<Terms />} />
        <Route path="/sitemap"             element={<Sitemap />} />
        <Route path="*"                    element={<NotFound />} />
      </Routes>
    </PublicLayout>
  );
}