{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "feature-3",
  "dependencies": [
    "lucide-react"
  ],
  "registryDependencies": [
    "button",
    "card"
  ],
  "files": [
    {
      "path": "src/components/watermelon-ui/feature-3.tsx",
      "content": "\"use client\";\n\nimport { Card, CardContent } from \"@/components/ui/card\";\nimport { Button } from \"@/components/ui/button\";\n\nexport default function Features3() {\n  return (\n    <section className=\"theme-injected bg-background w-full py-16\">\n      <div className=\"mx-auto grid max-w-6xl items-center gap-12 px-6 lg:grid-cols-2\">\n        <div className=\"space-y-6\">\n          <div className=\"text-muted-foreground bg-muted/50 inline-flex w-fit items-center gap-2 rounded-lg px-3 py-1 text-sm\">\n            <span className=\"bg-primary h-2 w-2 rounded-full\" />\n            Smart insights\n          </div>\n\n          <h2 className=\"text-5xl leading-tight font-semibold tracking-tight\">\n            Turn raw data into clear decisions\n          </h2>\n\n          <p className=\"text-muted-foreground max-w-lg\">\n            Analyze patterns, track performance, and uncover actionable insights\n            to make faster and smarter decisions with confidence.\n          </p>\n\n          <div className=\" \">\n            <div className=\"space-y-2\">\n              {[\n                \"Monitor real-time performance across teams\",\n                \"Compare productivity trends over time\",\n                \"Identify bottlenecks and inefficiencies early\",\n                \"Encourage consistent high-quality output\",\n              ].map((item, i) => (\n                <div key={i} className=\"flex items-center gap-2\">\n                  <div className=\"bg-primary/10 mt-1 flex h-6 w-6 items-center justify-center rounded-full shadow-[inset_0_1px_2px_rgba(0,0,0,0.15)]\">\n                    <div className=\"bg-primary h-2.5 w-2.5 rounded-full\" />\n                  </div>\n\n                  <p className=\"text-muted-foreground text-sm leading-relaxed\">\n                    {item}\n                  </p>\n                </div>\n              ))}\n            </div>\n          </div>\n\n          <Button className=\"rounded-sm px-6 shadow-[inset_0_0px_2px_0px_rgba(0,0,0,0.1),inset_0_0px_4px_0px_rgba(0,0,0,0.1)]\">\n            Get started\n          </Button>\n        </div>\n\n        <div className=\"bg-muted dark:bg-card/50 relative flex justify-center rounded-xl p-8 shadow-[inset_0_0px_4px_0px_rgba(0,0,0,0.1)] dark:shadow-[inset_0_0px_4px_0px_rgba(0,0,0,1)]\">\n          <div className=\"relative h-[380px] w-full max-w-md\">\n            <Card className=\"bg-background/80 dark:bg-card/80 ring-border/50 absolute top-0 left-0 w-[260px] rounded-lg p-0 shadow-md backdrop-blur-md\">\n              <CardContent className=\"space-y-2 p-4\">\n                <div className=\"text-muted-foreground text-xs\">\n                  Performance Overview\n                </div>\n\n                <div className=\"text-2xl font-semibold\">\n                  72<span className=\"text-muted-foreground text-sm\">%</span>\n                </div>\n\n                <div className=\"flex gap-2 text-[10px]\">\n                  <span className=\"rounded-md bg-green-200 px-2 py-0.5 text-green-700\">\n                    Improving\n                  </span>\n                  <span className=\"rounded-md bg-blue-200 px-2 py-0.5 text-blue-700\">\n                    Stable\n                  </span>\n                </div>\n\n                <div className=\"text-muted-foreground space-y-1 text-xs\">\n                  <div>Tasks Completed: 124</div>\n                  <div>Avg Focus Time: 3.2h</div>\n                  <div>Efficiency: +12%</div>\n                </div>\n              </CardContent>\n            </Card>\n\n            <Card className=\"bg-background/90 dark:bg-card/80 ring-border/50 absolute top-28 right-0 z-50 w-[240px] rounded-lg p-0 shadow-lg backdrop-blur-md\">\n              <CardContent className=\"space-y-3 p-4\">\n                <div className=\"text-muted-foreground text-xs\">\n                  Activity Breakdown\n                </div>\n\n                <div className=\"text-muted-foreground text-sm\">\n                  <span className=\"text-foreground font-medium\">\n                    6h 45m tracked\n                  </span>{\" \"}\n                  today\n                </div>\n\n                <div className=\"flex h-2 w-full gap-1\">\n                  <div className=\"w-[40%] rounded-full bg-emerald-400\" />\n                  <div className=\"w-[35%] rounded-full bg-blue-400\" />\n                  <div className=\"w-[25%] rounded-full bg-orange-400\" />\n                </div>\n\n                <div className=\"text-muted-foreground flex gap-3 text-[10px]\">\n                  <span className=\"flex items-center gap-1\">\n                    <span className=\"h-2 w-2 rounded-full bg-emerald-400\" />\n                    Deep Work\n                  </span>\n                  <span className=\"flex items-center gap-1\">\n                    <span className=\"h-2 w-2 rounded-full bg-blue-400\" />\n                    Collaboration\n                  </span>\n                  <span className=\"flex items-center gap-1\">\n                    <span className=\"h-2 w-2 rounded-full bg-orange-400\" />\n                    Breaks\n                  </span>\n                </div>\n              </CardContent>\n            </Card>\n\n            <Card className=\"bg-background/90 dark:bg-card/80 ring-border/50 absolute bottom-8 left-10 w-[260px] rounded-lg p-0 shadow-lg backdrop-blur-md\">\n              <CardContent className=\"space-y-3 p-4\">\n                <div className=\"flex items-center justify-between text-sm\">\n                  <span className=\"font-medium\">Insights Summary</span>\n                  <span className=\"text-muted-foreground text-xs\">Updated</span>\n                </div>\n\n                <div className=\"text-muted-foreground text-sm\">\n                  <span className=\"text-foreground font-medium\">\n                    +18% productivity\n                  </span>{\" \"}\n                  this week\n                </div>\n\n                <div className=\"flex gap-2 text-[10px]\">\n                  <span className=\"rounded-md bg-green-200 px-2 py-0.5 text-green-700\">\n                    Growth\n                  </span>\n                  <span className=\"rounded-md bg-purple-200 px-2 py-0.5 text-purple-700\">\n                    Optimized\n                  </span>\n                </div>\n              </CardContent>\n            </Card>\n          </div>\n        </div>\n      </div>\n    </section>\n  );\n}\n",
      "type": "registry:ui",
      "target": "components/ui/feature-3.tsx"
    }
  ],
  "type": "registry:ui"
}