{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "pricing-2",
  "type": "registry:block",
  "description": "Modular pricing card UI kit with reusable glass-style components and typography helpers.",
  "files": [
    {
      "path": "components/pricing-card.tsx",
      "content": "import type React from \"react\";\nimport { cn } from \"@/lib/utils\";\n\nfunction Card({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      className={cn(\n        \"relative w-full max-w-xs rounded-xl border bg-card dark:bg-transparent\",\n        \"p-1.5 shadow-sm backdrop-blur-xl\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Header({\n  className,\n  children,\n  glassEffect = true,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  glassEffect?: boolean;\n}) {\n  return (\n    <div\n      className={cn(\n        \"relative mb-4 rounded-xl border bg-muted/50 p-4 shadow\",\n        className\n      )}\n      {...props}\n    >\n      {/* Top glass gradient */}\n      {glassEffect && (\n        <div\n          aria-hidden=\"true\"\n          className=\"-z-10 absolute inset-x-0 top-0 h-48 rounded-[inherit]\"\n          style={{\n            background:\n              \"linear-gradient(180deg, rgba(255,255,255,0.07) 0%, rgba(255,255,255,0.03) 40%, rgba(0,0,0,0) 100%)\",\n          }}\n        />\n      )}\n      {children}\n    </div>\n  );\n}\n\nfunction Plan({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      className={cn(\"mb-8 flex items-center justify-between\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Description({ className, ...props }: React.ComponentProps<\"p\">) {\n  return (\n    <p className={cn(\"text-muted-foreground text-xs\", className)} {...props} />\n  );\n}\n\nfunction PlanName({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      className={cn(\n        \"flex items-center gap-2 font-medium text-muted-foreground text-sm [&_svg:not([class*='size-'])]:size-4\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Badge({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      className={cn(\n        \"rounded-full border border-foreground/20 px-2 py-0.5 text-foreground/80 text-xs\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Price({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div className={cn(\"mb-3 flex items-end gap-1\", className)} {...props} />\n  );\n}\n\nfunction MainPrice({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      className={cn(\"font-extrabold text-3xl tracking-tight\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction Period({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      className={cn(\"pb-1 text-foreground/80 text-sm\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction OriginalPrice({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      className={cn(\n        \"mr-1 ml-auto text-lg text-muted-foreground line-through\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Body({ className, ...props }: React.ComponentProps<\"div\">) {\n  return <div className={cn(\"space-y-6 p-3\", className)} {...props} />;\n}\n\nfunction List({ className, ...props }: React.ComponentProps<\"ul\">) {\n  return <ul className={cn(\"space-y-3\", className)} {...props} />;\n}\n\nfunction ListItem({ className, ...props }: React.ComponentProps<\"li\">) {\n  return (\n    <li\n      className={cn(\n        \"flex items-start gap-3 text-muted-foreground text-sm\",\n        className\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction Separator({\n  children = \"Upgrade to access\",\n  className,\n  ...props\n}: React.ComponentProps<\"div\"> & {\n  children?: string;\n  className?: string;\n}) {\n  return (\n    <div\n      className={cn(\n        \"flex items-center gap-3 text-muted-foreground text-sm\",\n        className\n      )}\n      {...props}\n    >\n      <span className=\"h-[1px] flex-1 bg-muted-foreground/40\" />\n      <span className=\"shrink-0 text-muted-foreground\">{children}</span>\n      <span className=\"h-[1px] flex-1 bg-muted-foreground/40\" />\n    </div>\n  );\n}\n\nexport {\n  Card,\n  Header,\n  Description,\n  Plan,\n  PlanName,\n  Badge,\n  Price,\n  MainPrice,\n  Period,\n  OriginalPrice,\n  Body,\n  List,\n  ListItem,\n  Separator,\n};\n",
      "type": "registry:component"
    }
  ],
  "meta": {
    "height": "80vh"
  },
  "categories": [
    "pricing"
  ]
}