//#region src/tag/theme.ts
const baseStyle = {};
const defaultProps = {
	size: "md",
	variant: "subtleBlue",
	fontWeight: "medium"
};
const parts = [
	"container",
	"button",
	"icon",
	"text"
];
const sizes = {
	xs: {
		container: {
			borderRadius: "lg",
			fontSize: "sm",
			h: 20,
			spaceX: 4
		},
		button: { size: "sm" },
		icon: { size: "xs" }
	},
	sm: {
		container: {
			fontSize: "sm",
			h: 24,
			spaceX: 4
		},
		button: { size: "sm" },
		icon: { size: "xs" }
	},
	md: {
		container: {
			fontSize: "sm",
			h: 32,
			spaceX: 6
		},
		button: { size: "sm" },
		icon: { size: "sm" }
	},
	lg: {
		container: {
			fontSize: "md",
			h: 40,
			spaceX: 8
		},
		button: { size: "md" },
		icon: { size: "md" }
	}
};
const variants = {
	subtleGrey: {
		container: {
			bg: "sandstone.90",
			hoverBg: "sandstone.85",
			borderColor: "sandstone.85",
			color: "sandstone.20",
			activeBg: "sandstone.79"
		},
		button: {
			bg: "transparent",
			hoverBg: "sandstone.85",
			hoverBorderColor: "transparent",
			color: "sandstone.20",
			activeBg: "sandstone.79"
		}
	},
	subtleBlue: {
		container: {
			bg: "skyBlue.95",
			hoverBg: "skyBlue.90",
			activeBg: "skyBlue.85",
			borderColor: "skyBlue.95",
			color: "seaBlue.main"
		},
		button: {
			bg: "transparent",
			hoverBg: "skyBlue.90",
			activeBg: "skyBlue.85",
			hoverBorderColor: "transparent",
			color: "seaBlue.main"
		}
	},
	subtleRed: {
		container: {
			bg: "energyRed.95",
			borderColor: "energyRed.95",
			hoverBg: "energyRed.90",
			activeBg: "energyRed.85",
			color: "energyRed.45"
		},
		button: {
			bg: "transparent",
			hoverBg: "energyRed.90",
			activeBg: "energyRed.85",
			hoverBorderColor: "transparent",
			color: "energyRed.45"
		}
	},
	subtleYellow: {
		container: {
			bg: "sunflower.85",
			hoverBg: "sunflower.70",
			activeBg: "sunflower.65",
			borderColor: "terracotta.30",
			color: "sunflower.20"
		},
		button: {
			bg: "transparent",
			hoverBg: "sunflower.70",
			activeBg: "sunflower.65",
			hoverBorderColor: "transparent",
			color: "sunflower.20"
		}
	},
	subtleGreen: {
		container: {
			bg: "landGreen.95",
			hoverBg: "landGreen.90",
			borderColor: "landGreen.30",
			color: "landGreen.30",
			activeBg: "landGreen.85"
		},
		button: {
			bg: "transparent",
			hoverBg: "landGreen.90",
			activeBg: "landGreen.85",
			hoverBorderColor: "transparent",
			color: "landGreen.30"
		}
	},
	solidBlue: {
		container: {
			bg: "seaBlue.main",
			hoverBg: "seaBlue.35",
			activeBg: "seaBlue.40",
			borderColor: "seaBlue.main",
			color: "white"
		},
		button: {
			bg: "transparent",
			hoverBg: "seaBlue.35",
			activeBg: "seaBlue.40",
			hoverBorderColor: "transparent",
			activeBorderColor: "transparent",
			color: "white"
		}
	},
	solidDarkBlue: {
		container: {
			bg: "darkBlue.18",
			hoverBg: "darkBlue.25",
			activeBg: "darkBlue.35",
			borderColor: "darkBlue.18",
			color: "white"
		},
		button: {
			bg: "transparent",
			hoverBg: "darkBlue.25",
			activeBg: "darkBlue.35",
			hoverBorderColor: "transparent",
			color: "white"
		}
	},
	solidRed: {
		container: {
			bg: "energyRed.45",
			hoverBg: "energyRed.54",
			activeBg: "energyRed.60",
			borderColor: "energyRed.45",
			color: "white"
		},
		button: {
			bg: "transparent",
			hoverBg: "energyRed.54",
			activeBg: "energyRed.60",
			hoverBorderColor: "transparent",
			activeBorderColor: "transparent",
			color: "white"
		}
	},
	solidYellow: {
		container: {
			bg: "sunflower.50",
			hoverBg: "sunflower.80",
			activeBg: "sunflower.85",
			borderColor: "sunflower.50",
			color: "sunflower.15"
		},
		button: {
			bg: "transparent",
			hoverBg: "sunflower.80",
			activeBg: "sunflower.85",
			hoverBorderColor: "transparent",
			color: "sunflower.15"
		}
	},
	solidGreen: {
		container: {
			bg: "landGreen.35",
			hoverBg: "landGreen.41",
			activeBg: "landGreen.45",
			borderColor: "landGreen.35",
			color: "white"
		},
		button: {
			bg: "transparent",
			hoverBg: "landGreen.41",
			activeBg: "landGreen.45",
			hoverBorderColor: "transparent",
			activeBorderColor: "transparent",
			color: "white"
		}
	}
};
var theme_default = {
	baseStyle,
	defaultProps,
	parts,
	sizes,
	variants
};

//#endregion
export { theme_default as default };
globalThis.__vuiVersion__ = "4.0.0-beta.1"
//# sourceMappingURL=theme.js.map