//#region src/components/checkout/styles.ts
const checkoutStyles = {
	container: {
		display: "flex",
		flexDirection: "column",
		minHeight: 0,
		overflowY: "auto",
		maxHeight: "90%"
	},
	walletPassSearchRow: {
		display: "flex",
		gap: 8
	},
	moduleBase: {
		backgroundColor: "#ff4d4f",
		borderRadius: "8px",
		padding: "16px",
		marginBottom: "12px",
		color: "white",
		transition: "all 0.3s ease"
	},
	moduleTitle: {
		fontSize: "16px",
		fontWeight: "500",
		color: "#4096ff",
		marginBottom: "8px"
	},
	moduleDescription: {
		fontSize: "12px",
		opacity: .8,
		marginBottom: "8px"
	},
	button: {
		backgroundColor: "rgba(255,255,255,0.2)",
		border: "1px solid rgba(255,255,255,0.3)",
		borderRadius: "4px",
		color: "white",
		padding: "6px 12px",
		fontSize: "12px",
		cursor: "pointer",
		transition: "background-color 0.2s ease"
	},
	buttonHover: { backgroundColor: "rgba(255,255,255,0.3)" },
	statusButton: {
		backgroundColor: "#ff4d4f",
		color: "white",
		border: "none",
		borderRadius: "4px",
		padding: "8px 16px",
		cursor: "pointer",
		fontSize: "14px",
		transition: "background-color 0.2s ease"
	},
	amountDisplay: {
		fontSize: "24px",
		fontWeight: "bold",
		marginBottom: "8px",
		textAlign: "center"
	}
};
//#endregion
exports.checkoutStyles = checkoutStyles;
