import { clsx } from "clsx";
import { ComponentPropsWithoutRef } from "react";

export function Card({ className, ...props }: ComponentPropsWithoutRef<"div">) {
  return (
    <div
      className={clsx(
        "rounded-[var(--radius-lg)] border border-[var(--color-border)] bg-[color:var(--color-panel)/0.9] p-4 transition hover:-translate-y-0.5 hover:shadow-lg",
        className
      )}
      {...props}
    />
  );
}