import React from "react";

const DestructibleAlert = ({
  text,
  extraStyles = "",
}: {
  text: string;
  extraStyles?: string;
}) => {
  return (
    <div
      className={`border bg-red-200 border-blue-200 rounded-3xl py-6 ${extraStyles}`}
      style={{
        borderWidth: 1,
        backgroundColor: "#fecaca",
        borderColor: "#c0dafc",
        paddingTop: 24,
        paddingBottom: 24,
      }}
    >
      <p
        className="text-center text-red-800"
        style={{
          fontSize: 17,
          lineHeight: "28px",
          fontFamily: "Montserrat, sans-serif",
          fontWeight: "bold",
          textAlign: "center",
          color: "#991b1b",
        }}
      >
        {text}
      </p>
    </div>
  );
};

export default DestructibleAlert;
