Empty state

import { FolderOpen, Plus } from "lucide-react"
import { Button } from "@smaller-earth/ui"

export function EmptyState() {
  return (
    <div className="flex flex-col items-center justify-center rounded-lg border border-dashed border-border bg-card py-16 px-6 text-center">
      <div className="flex size-12 items-center justify-center rounded-full bg-muted">
        <FolderOpen className="size-6 text-muted-foreground" />
      </div>
      <h3 className="mt-4 text-lg font-medium">No projects yet</h3>
      <p className="mt-1 max-w-sm text-sm text-muted-foreground">
        Projects let you group related work. Create your first to get started.
      </p>
      <Button className="mt-6">
        <Plus className="size-4" /> New project
      </Button>
    </div>
  )
}