import { ConsoleSidebar } from "@/components/console-sidebar"

// The console shell: the one persistent sidebar plus the section's content,
// centred at lux.cloud's 1440px console width. Every /dashboard route renders
// inside this, so the console reads as one organised surface no matter which
// section is open — as opposed to each page inventing its own frame.
//
// `min-w-0` on the content column is load-bearing: without it a wide table or
// chart inside a flex child sets the column's min-content width and the whole
// page scrolls sideways instead of the table scrolling inside itself.
export function ConsoleLayout({ children }: { children: React.ReactNode }) {
  return (
    <div className="mx-auto flex max-w-[1440px] items-start max-lg:block">
      <ConsoleSidebar />
      <div className="min-w-0 flex-1">
        <main className="mx-auto w-full max-w-[1100px] px-8 pb-20 pt-7 max-lg:px-4 max-lg:pb-14 max-lg:pt-6">
          {children}
        </main>
      </div>
    </div>
  )
}