"use client";

import React from "react";
import { cn } from "@/lib/utils";

export function Card({
  className,
  children,
  ...rest
}: React.HTMLAttributes<HTMLDivElement>) {
  return <div className={cn("asf-card", className)} {...rest}>{children}</div>;
}

export function CardHeader({
  className,
  children,
  ...rest
}: React.HTMLAttributes<HTMLDivElement>) {
  return <div className={cn("asf-card-header", className)} {...rest}>{children}</div>;
}

export function CardTitle({
  className,
  children,
  ...rest
}: React.HTMLAttributes<HTMLDivElement>) {
  return <div className={cn("asf-card-title", className)} {...rest}>{children}</div>;
}

export function CardBody({
  className,
  children,
  ...rest
}: React.HTMLAttributes<HTMLDivElement>) {
  return <div className={cn("asf-card-body", className)} {...rest}>{children}</div>;
}

export function CardFooter({
  className,
  children,
  ...rest
}: React.HTMLAttributes<HTMLDivElement>) {
  return (
    <div className={cn("px-5 py-3 border-t border-slate-100 text-xs text-slate-500 flex items-center justify-between", className)} {...rest}>
      {children}
    </div>
  );
}