Hey folks I scaffolded new Next app and setuped the Shadcn UI and installed the hover-card component and made some changes to it

"use client";

import * as HoverCardPrimitive from "@radix-ui/react-hover-card";
import { cn } from "~/lib/utils";
import * as React from "react";

const HoverCard = HoverCardPrimitive.Root;

const HoverCardTrigger = HoverCardPrimitive.Trigger;

const HoverCardContent = React.forwardRef<
  React.ElementRef<typeof HoverCardPrimitive.Content>,
  React.ComponentPropsWithoutRef<typeof HoverCardPrimitive.Content>
>(({ className, align = "start", ...props }, ref) => (
  <HoverCardPrimitive.Content
    ref={ref}
    align={align}
    className={cn(
      "z-50 w-64 bg-popover p-4 text-popover-foreground shadow-md outline-none duration-1000 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
      className,
    )}
    {...props}
  />
));
HoverCardContent.displayName = HoverCardPrimitive.Content.displayName;

export { HoverCard, HoverCardTrigger, HoverCardContent };

but the problem is neither the duration-1000 class is working nor the [animation-duration:1000ms] is working the card is animating for default 150ms I tried reinstalling the node_modules, deleting the .next directory before starting the dev server clearing the browser data but it also not working