// Define CSS properties
const emptyStyle: React.CSSProperties = {
  height: "100%",
  display: "flex",
  flexDirection: "column",
  alignItems: "center",
  justifyContent: "center",
  textAlign: "center",
  background: "rgba(136, 85, 255, 0.25)",
  overflow: "hidden",
  zIndex: -1
};

const titleStyle: React.CSSProperties = {
  fontWeight: 400,
  lineHeight: "1.8em",
  color: "#8855FF",
  margin: 0,
  padding: 0
};

const paragraphStyle: React.CSSProperties = {
  fontWeight: 600,
  color: "#8855FF",
  margin: 0,
  padding: 0
};

const container: React.CSSProperties = {
  margin: "0 auto",
  width: 343,
  backgroundColor: "white",
  padding: "16px 20px",
  marginBottom: "16px",
  borderRadius: 12,
  boxShadow: "0px 4px 16px rgba(0, 0,0,.2)",
  display: "flex"
};

const img: React.CSSProperties = {
  width: 50,
  height: 50,
  borderRadius: 8,
  marginRight: 20,
  backgroundColor: "grey"
};

const title: React.CSSProperties = {
  fontSize: 20,
  fontWeight: "bold"
};

const text: React.CSSProperties = {
  marginTop: 5,
  fontSize: 14,
  lineHeight: 1.5
};