import { Dimensions } from "react-native";

export const cardVariants = {
	defaults: {
		// margin: {
		// 	phone: "s",
		// 	tablet: "m",
		// },
		// backgroundColor: "red",
	},
	regular: {
		padding: {
			phone: "s",
			tablet: "m",
		},
	},
	elevated: {
		padding: {
			phone: "s",
			tablet: "m",
		},
		shadowColor: "black",
		shadowOpacity: 0.5,
		shadowOffset: { width: 10, height: 10 },
		shadowRadius: 10,
		elevation: 5,
	},

	modal: {
		width: 300,
		// height: 200,
		backgroundColor: "white",
		alignItems: "center",
		justifyContent: "center",
		alignSelf: "center",
		top: Dimensions.get("window").height / 2 - 150,
		position: "absolute",
		zIndex: 10,
		borderRadius: 15,
		gap: "m",
		shadowColor: "black",
		shadowOffset: { width: 0, height: 0 },
		shadowOpacity: 0.5,
		p: "m",
	},
	curvedTopContainer: {
		width: "100%",
		// height: Dimensions.get("window").height / 2,
		backgroundColor: "white",
		borderTopLeftRadius: 25,
		borderTopRightRadius: 25,
		margin: 0,
	},
};