import { Sidebar } from "@/components/dashboard/sidebar"
import { Header } from "@/components/dashboard/header"
import { IdeaFeed } from "@/components/dashboard/idea-feed"
import { RightSidebar } from "@/components/dashboard/right-sidebar"

export default function DashboardPage() {
  return (
    <div className="min-h-screen bg-background">
      {/* Ambient background effects */}
      <div className="fixed inset-0 overflow-hidden pointer-events-none">
        <div className="absolute -top-40 -right-40 h-[500px] w-[500px] rounded-full bg-primary/5 blur-3xl" />
        <div className="absolute top-1/2 -left-40 h-[400px] w-[400px] rounded-full bg-accent/5 blur-3xl" />
        <div className="absolute -bottom-40 right-1/3 h-[450px] w-[450px] rounded-full bg-primary/5 blur-3xl" />
      </div>

      {/* Sidebar */}
      <Sidebar />

      {/* Main Content */}
      <div className="lg:pl-72">
        <Header />
        
        <main className="flex gap-6 p-4 pt-20 lg:pt-6 lg:p-6">
          {/* Feed */}
          <div className="flex-1 max-w-2xl mx-auto lg:mx-0">
            <IdeaFeed />
          </div>

          {/* Right Sidebar */}
          <div className="hidden xl:block">
            <RightSidebar />
          </div>
        </main>
      </div>
    </div>
  )
}