checkout: add card deyails & card amount BT

src/components/Icons/CardAmountIcon.tsx

@@ -0,0 +1,55 @@
+interface CardAmountIconType {
+  className?: string;
+  onClick?: () => void;
+}
+
+const CardAmountIcon = ({ className, onClick }: CardAmountIconType) => {
+  return (
+    <svg
+      width="64"
+      height="42"
+      viewBox="0 0 64 42"
+      fill="none"
+      xmlns="http://www.w3.org/2000/svg"
+      className={className}
+      onClick={onClick}
+    >
+      <rect width="64" height="42" rx="4" fill="#FAFAFA" />
+      <path
+        opacity="0.5"
+        d="M26 18H30"
+        stroke="#E8B400"
+        stroke-width="1.5"
+        stroke-linecap="round"
+        stroke-linejoin="round"
+      />
+      <path
+        d="M40.833 19H38.231C36.446 19 35 20.343 35 22C35 23.657 36.447 25 38.23 25H40.833C40.917 25 40.958 25 40.993 24.998C41.533 24.965 41.963 24.566 41.998 24.065C42 24.033 42 23.994 42 23.917V20.083C42 20.006 42 19.967 41.998 19.935C41.962 19.434 41.533 19.035 40.993 19.002C40.958 19 40.917 19 40.833 19Z"
+        stroke="#4C4A58"
+        stroke-width="1.5"
+      />
+      <path
+        d="M40.965 19C40.887 17.128 40.637 15.98 39.828 15.172C38.657 14 36.771 14 33 14H30C26.229 14 24.343 14 23.172 15.172C22.001 16.344 22 18.229 22 22C22 25.771 22 27.657 23.172 28.828C24.344 29.999 26.229 30 30 30H33C36.771 30 38.657 30 39.828 28.828C40.637 28.02 40.888 26.872 40.965 25"
+        stroke="#4C4A58"
+        stroke-width="1.5"
+      />
+      <path
+        opacity="0.5"
+        d="M26 13.9999L29.735 11.5229C30.2604 11.1816 30.8735 11 31.5 11C32.1265 11 32.7396 11.1816 33.265 11.5229L37 13.9999"
+        stroke="#E8B400"
+        stroke-width="1.5"
+        stroke-linecap="round"
+      />
+      <path
+        opacity="0.5"
+        d="M37.9922 22H38.0012"
+        stroke="#E8B400"
+        stroke-width="2"
+        stroke-linecap="round"
+        stroke-linejoin="round"
+      />
+    </svg>
+  );
+};
+
+export default CardAmountIcon;