diff --git a/src/CardSchemeComponent.res b/src/CardSchemeComponent.res
deleted file mode 100644
index dee03adf..00000000
--- a/src/CardSchemeComponent.res
+++ /dev/null
@@ -1,51 +0,0 @@
-module CoBadgeCardSchemeDropDown = {
-  @react.component
-  let make = (~eligibleCardSchemes, ~setCardBrand) => {
-    <select
-      className="w-4"
-      onChange={ev => {
-        let target = ev->ReactEvent.Form.target
-        let value = target["value"]
-        setCardBrand(_ => value)
-      }}>
-      <option disabled=true> {"Select a card brand"->React.string} </option>
-      {eligibleCardSchemes
-      ->Array.mapWithIndex((item, i) => {
-        <option key={Int.toString(i)} value=item> {item->React.string} </option>
-      })
-      ->React.array}
-    </select>
-  }
-}
-
-@react.component
-let make = (~cardNumber, ~paymentType, ~cardBrand, ~setCardBrand) => {
-  let cardType = React.useMemo1(_ => cardBrand->CardUtils.getCardType, [cardBrand])
-  let animate = cardType == NOTFOUND ? "animate-slideLeft" : "animate-slideRight"
-  let cardBrandIcon = React.useMemo1(
-    _ => CardUtils.getCardBrandIcon(cardType, paymentType),
-    [cardBrand],
-  )
-
-  let paymentMethodListValue = Recoil.useRecoilValueFromAtom(PaymentUtils.paymentMethodListValue)
-  let enabledCardSchemes =
-    paymentMethodListValue->PaymentUtils.getSupportedCardBrands->Option.getOr([])
-
-  let matchedCardSchemes = cardNumber->CardUtils.getAllMatchedCardSchemes
-
-  let eligibleCardSchemes = CardUtils.getEligibleCoBadgedCardSchemes(
-    ~matchedCardSchemes,
-    ~enabledCardSchemes,
-  )
-
-  let isCardCoBadged = eligibleCardSchemes->Array.length > 1
-
-  let marginLeft = isCardCoBadged ? "-ml-2" : ""
-
-  <div className={`${animate} flex items-center ${marginLeft} hellow-rodl`}>
-    cardBrandIcon
-    <RenderIf condition={isCardCoBadged}>
-      <CoBadgeCardSchemeDropDown eligibleCardSchemes setCardBrand />
-    </RenderIf>
-  </div>
-}
diff --git a/src/CardUtils.res b/src/CardUtils.res
index 02a4bd55..a20967fd 100644
--- a/src/CardUtils.res
+++ b/src/CardUtils.res
@@ -26,7 +26,6 @@ type cardProps = (
   string,
   (string => string) => unit,
   int,
-  string,
 )
 
 type expiryProps = (
@@ -656,18 +655,3 @@ let getPaymentMethodBrand = (customerMethod: PaymentType.customerMethods) => {
     )
   }
 }
-
-let getAllMatchedCardSchemes = cardNumber => {
-  CardPattern.cardPatterns->Array.reduce([], (acc, item) => {
-    if String.match(cardNumber, item.pattern)->Option.isSome {
-      acc->Array.push(item.issuer)
-    }
-    acc
-  })
-}
-
-let getEligibleCoBadgedCardSchemes = (~matchedCardSchemes, ~enabledCardSchemes) => {
-  matchedCardSchemes->Array.filter(ele => {
-    enabledCardSchemes->Array.includes(ele->String.toLowerCase)
-  })
-}
diff --git a/src/Components/DynamicFields.res b/src/Components/DynamicFields.res
index 54158558..f36b92d4 100644
--- a/src/Components/DynamicFields.res
+++ b/src/Components/DynamicFields.res
@@ -109,7 +109,6 @@ let make = (
     "",
     _ => (),
     0,
-    "",
   )
 
   let defaultExpiryProps = (
@@ -164,7 +163,6 @@ let make = (
     cardError,
     _,
     maxCardLength,
-    _,
   ) = switch cardProps {
   | Some(cardProps) => cardProps
   | None => defaultCardProps
diff --git a/src/Components/PaymentInputField.res b/src/Components/PaymentInputField.res
index 7c8b5540..98ba1809 100644
--- a/src/Components/PaymentInputField.res
+++ b/src/Components/PaymentInputField.res
@@ -131,7 +131,7 @@ let make = (
           </div>
         </RenderIf>
       </div>
-      <div className="relative flex -ml-10 items-center"> {rightIcon} </div>
+      <div className={`relative flex -ml-10 items-center`}> {rightIcon} </div>
     </div>
     <RenderIf condition={innerLayout === Spaced}>
       {switch errorString {
diff --git a/src/Payment.res b/src/Payment.res
index 9aa7ba63..13dd3d73 100644
--- a/src/Payment.res
+++ b/src/Payment.res
@@ -47,15 +47,13 @@ let make = (~paymentMode, ~integrateError, ~logger) => {
   let (isZipValid, setIsZipValid) = React.useState(_ => None)
   let (isCardSupported, setIsCardSupported) = React.useState(_ => None)
 
-  let maxCardLength = React.useMemo(() => {
-    getMaxLength(cardNumber)
+  let (cardBrand, maxCardLength) = React.useMemo(() => {
+    let brand = getCardBrand(cardNumber)
+    let maxLength = getMaxLength(cardNumber)
+    let isNotBancontact = selectedOption !== "bancontact_card" && brand == ""
+    !showFields && isNotBancontact ? (cardScheme, maxLength) : (brand, maxLength)
   }, (cardNumber, cardScheme, showFields))
 
-  let cardBrand = getCardBrand(cardNumber)
-  let isNotBancontact = selectedOption !== "bancontact_card" && cardBrand == ""
-  let (cardBrand, setCardBrand) = React.useState(_ =>
-    !showFields && isNotBancontact ? cardScheme : cardBrand
-  )
   let supportedCardBrands = React.useMemo(() => {
     paymentMethodListValue->PaymentUtils.getSupportedCardBrands
   }, [paymentMethodListValue])
@@ -221,7 +219,7 @@ let make = (~paymentMode, ~integrateError, ~logger) => {
     }
     let cardNetwork = {
       if cardBrand != "" {
-        [("card_network", cardBrand->JSON.Encode.string)]
+        [("card_network", cardNumber->CardUtils.getCardBrand->JSON.Encode.string)]
       } else {
         []
       }
@@ -352,14 +350,11 @@ let make = (~paymentMode, ~integrateError, ~logger) => {
     None
   }, (isExpiryValid, isExpiryComplete(cardExpiry)))
 
-  React.useEffect(() => {
-    setCardBrand(_ => cardNumber->CardUtils.getCardBrand)
-    None
-  }, [cardNumber])
-
   let icon = React.useMemo(() => {
-    <CardSchemeComponent cardNumber paymentType cardBrand setCardBrand />
-  }, (cardType, paymentType, cardBrand, cardNumber))
+    let animate = cardType == NOTFOUND ? "animate-slideLeft" : "animate-slideRight"
+    let cardBrandIcon = getCardBrandIcon(cardType, paymentType)
+    <div className=animate> cardBrandIcon </div>
+  }, (cardType, paymentType))
 
   let cardProps: CardUtils.cardProps = (
     isCardValid,
@@ -373,7 +368,6 @@ let make = (~paymentMode, ~integrateError, ~logger) => {
     cardError,
     setCardError,
     maxCardLength,
-    cardBrand,
   )
 
   let expiryProps: CardUtils.expiryProps = (
diff --git a/src/Payments/CardPayment.res b/src/Payments/CardPayment.res
index 27d76278..73edeef2 100644
--- a/src/Payments/CardPayment.res
+++ b/src/Payments/CardPayment.res
@@ -35,9 +35,12 @@ let make = (
     cardError,
     setCardError,
     maxCardLength,
-    cardBrand,
   ) = cardProps
 
+  let cardBrand = React.useMemo(() => {
+    cardNumber->CardUtils.getCardBrand
+  }, [cardNumber])
+
   let (
     isExpiryValid,
     setIsExpiryValid,
@@ -204,7 +207,6 @@ let make = (
     nickname,
     isCardBrandValid,
     isManualRetryEnabled,
-    cardProps,
   ))
   useSubmitPaymentData(submitCallback)
 
diff --git a/src/RenderPaymentMethods.res b/src/RenderPaymentMethods.res
index 368e64c5..d2def612 100644
--- a/src/RenderPaymentMethods.res
+++ b/src/RenderPaymentMethods.res
@@ -24,7 +24,6 @@ let make = (
     _,
     _,
     maxCardLength,
-    _,
   ) = cardProps
 
   let (
diff --git a/src/SingleLineCardPayment.res b/src/SingleLineCardPayment.res
index 7e4c3cc3..5a118442 100644
--- a/src/SingleLineCardPayment.res
+++ b/src/SingleLineCardPayment.res
@@ -26,7 +26,6 @@ let make = (
     _,
     _,
     maxCardLength,
-    _,
   ) = cardProps
 
   let (