'use client';

import { useState } from 'react';
import { Sidebar } from '@/components/layout/Sidebar';
import { Header } from '@/components/layout/Header';

export default function DashboardLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  const [open, setOpen] = useState(false);

  return (
    <div className="flex min-h-screen bg-lightPrimary dark:bg-navy-900">
      <Sidebar open={open} onClose={() => setOpen(false)} />
      <div className="flex-1 flex flex-col xl:ml-[260px]">
        <div className="px-4">
          <Header brandText="SEO Audit SaaS" onOpenSidenav={() => setOpen(true)} />
        </div>
        <main className="flex-1 p-6">{children}</main>
      </div>
    </div>
  );
}