Checkbox

import { Checkbox } from "@/components/ui/component";

export default function Particle() {
  return (
    <div className="flex items-center justify-center w-full min-h-screen bg-background p-8">
      <label className="flex items-start gap-2 rounded-lg border p-3 hover:bg-accent/50 has-data-checked:border-primary/48 has-data-checked:bg-accent/50 cursor-pointer">
        <Checkbox defaultChecked />
        <div className="flex flex-col gap-1">
          <p className="text-sm font-medium">Enable notifications</p>
          <p className="text-muted-foreground text-xs">
            You can enable or disable notifications at any time.
          </p>
        </div>
      </label>
    </div>
  );
}