type Props = {
  variant: "default" | "failure";
  className?: string;
  width?: number;
};

export function AlphaText({ variant, className = "", width = 72 }: Props) {
  const attr =
    variant === "default"
      ? { opacity: "0.6", fill: "white" }
      : { fill: "#CC6C6C" };
  return (
    <svg
      className={className}
      width={width}
      viewBox="0 0 72 11"
      fill="none"
      xmlns="http://www.w3.org/2000/svg">
      <path
        d="M67.7256 8.55733H61.5796L60.7396 10.1953H58.2336L63.2876 0.395325H65.9196L71.1276 10.1953H68.5936L67.7256 8.55733ZM66.7036 6.61132L64.6316 2.74733L62.5876 6.61132H66.7036Z"
        {...attr}
      />
      <path
        d="M56.9429 0.395325V10.1953H54.5629V6.17733H38.3229V10.1953H35.9429V0.395325H38.3229V4.13333H54.5629V0.395325H56.9429Z"
        {...attr}
      />
      <path
        d="M24.3967 10.1953V0.395325H30.2767C32.6567 0.395325 34.1267 1.80932 34.1267 3.99333C34.1267 6.26133 32.6567 7.70333 30.2767 7.70333H26.7767L26.8047 10.1953H24.3967ZM26.7767 5.67333H30.2767C31.1027 5.67333 31.6207 5.11333 31.6207 4.02133C31.6207 2.97132 31.1167 2.42533 30.2767 2.42533H26.7767V5.67333Z"
        {...attr}
      />
      <path
        d="M14.3544 10.1953V0.395325H16.7344V8.16533H22.8524V10.1953H14.3544Z"
        {...attr}
      />
      <path
        d="M9.66003 8.55733H3.51403L2.67403 10.1953H0.16803L5.22203 0.395325H7.85403L13.062 10.1953H10.528L9.66003 8.55733ZM8.63803 6.61132L6.56603 2.74733L4.52203 6.61132H8.63803Z"
        {...attr}
      />
    </svg>
  );
}