import { Outlet } from 'react-router-dom'
import { ToastHost } from '../components/ui/toast'

export function AppLayout() {
  return (
    <div className="min-h-screen">
      {/* <header className="border-b border-black/10 dark:border-white/20 bg-white dark:bg-black">
        <div className="mx-auto max-w-5xl px-4 py-3 flex items-center justify-between">
          <Link to="/checkout" className="font-semibold text-brand-600">Core Midtrans CIFO</Link>
          <nav className="flex gap-4 text-sm">
            <Link to="/checkout" className="hover:underline">Checkout</Link>
            <Link to="/history" className="hover:underline">History</Link>
          </nav>
        </div>
      </header> */}
      <main className="mx-auto max-w-5xl px-4 py-6">
        <Outlet />
      </main>
      <ToastHost />
      {/* <footer className="mx-auto max-w-5xl px-4 pb-8 text-xs text-black/60 dark:text-white/60">
        Brand: Merah–Hitam–Putih • Sandbox UI skeleton
      </footer> */}
    </div>
  )
}