import { t as e } from "./utils-CHlhTiFC.js";
import { t } from "./dist-C2Jrcfwk.js";
import * as n from "react";
import { jsx as r } from "react/jsx-runtime";
//#region src/components/ui/Cards/card.tsx
var i = t("flex flex-col justify-between items-stretch group", {
	variants: {
		variant: {
			"with-image": "[&_.card-tag]:pb-[26px]",
			"without-image": "[&_.card-tag]:pb-4"
		},
		backgroundColor: {
			transparent: "bg-primary-transparent text-primary-black dark:text-primary-white",
			white: "bg-primary-white dark:bg-primary-gray-700 hover:bg-primary-gray-200 dark:hover:bg-primary-gray-600 text-primary-black dark:text-primary-white",
			gray: "bg-primary-gray-200 dark:bg-primary-gray-600 hover:bg-primary-gray-400 dark:hover:bg-primary-gray-500 text-primary-black dark:text-primary-white",
			"dark-gray": "bg-primary-gray-600 dark:bg-primary-gray-300 hover:bg-primary-gray-500 dark:hover:bg-primary-gray-400 text-primary-white dark:text-primary-black",
			black: "bg-primary-gray-700 dark:bg-primary-gray-100 hover:bg-primary-gray-650 dark:hover:bg-primary-gray-300 text-primary-white dark:text-primary-black",
			blue: "bg-primary-blue-200 hover:bg-primary-blue-300 dark:bg-primary-blue-600 dark:hover:bg-primary-blue-500 text-primary-black dark:text-primary-white",
			azure: "bg-accent-light-azure hover:bg-accent-azure dark:bg-accent-dark-azure dark:hover:bg-accent-azure text-primary-black dark:text-primary-white",
			yellow: "bg-accent-light-yellow hover:bg-accent-yellow dark:bg-accent-dark-yellow dark:hover:bg-accent-yellow text-primary-black",
			red: "bg-accent-light-red hover:bg-accent-red dark:bg-accent-dark-red dark:hover:bg-accent-red text-primary-black dark:text-primary-white",
			green: "bg-accent-light-green hover:bg-accent-green dark:bg-accent-dark-green dark:hover:bg-accent-green text-primary-black dark:text-primary-white",
			custom: "bg-custom-color-200 hover:bg-custom-color-300 text-custom-foreground"
		},
		size: {
			xs: "w-1/4",
			sm: "w-1/3",
			base: "w-1/2",
			lg: "w-2/3",
			xl: "w-3/4",
			full: "w-full"
		}
	},
	defaultVariants: {
		size: "full",
		variant: "with-image",
		backgroundColor: "white"
	}
}), a = n.forwardRef(({ className: t, border: n = !0, size: a, variant: o, backgroundColor: s, ...c }, l) => /* @__PURE__ */ r("div", {
	ref: l,
	className: e(i({
		size: a,
		backgroundColor: s,
		variant: o
	}), n === !1 ? "" : "border-t-2 border-primary-black dark:border-primary-gray-100", t),
	...c
}));
a.displayName = "Card";
var o = n.forwardRef(({ ...e }, t) => /* @__PURE__ */ r("div", {
	ref: t,
	...e
}));
o.displayName = "CardHeader";
var s = n.forwardRef(({ className: t, ...n }, i) => /* @__PURE__ */ r("div", {
	ref: i,
	className: e("pl-6 pr-6 pt-4 pb-6 flex flex-wrap gap-4", t),
	...n
}));
s.displayName = "CardFooter";
var c = n.forwardRef(({ children: t, className: n, ...i }, a) => /* @__PURE__ */ r("div", {
	ref: a,
	className: e("card-tag flex gap-2 mt-0 mb-0 pt-4 pl-6 pr-6 md:mb-0 text-xs font-bold leading-[1.15] uppercase", n),
	...i,
	children: t
}));
c.displayName = "CardTag";
var l = n.forwardRef(({ children: t, className: n, ...i }, a) => /* @__PURE__ */ r("div", {
	ref: a,
	className: e("m-0 pl-6 pr-6 pt-4 pb-6 leading-[1.15] flex gap-2 font-normal text-[1.25rem] md:text-[1.563rem]", n),
	...i,
	children: t
}));
l.displayName = "CardTitle";
var u = n.forwardRef(({ children: t, className: n, ...i }, a) => /* @__PURE__ */ r("div", {
	ref: a,
	className: e("pl-6 pr-6 pt-0 pb-6 mt-0 text-base leading-[1.4] md:text-xl", n),
	...i,
	children: t
}));
u.displayName = "CardDescription";
var d = n.forwardRef(({ className: t, ...n }, i) => /* @__PURE__ */ r("img", {
	ref: i,
	alt: "card",
	...n,
	className: e("w-full h-64 object-cover", t)
}));
d.displayName = "CardImage";
//#endregion
export { a as Card, u as CardDescription, s as CardFooter, o as CardHeader, d as CardImage, c as CardTag, l as CardTitle };

//# sourceMappingURL=Card.js.map