CheckoutForm.js

<form id="stripeForm" onSubmit={handleSubmit}>
      <div
        style={{ margin: "2rem", display: "flex", justifyContent: "center" }}
      >
        <Grid.Column>
          <Grid.Row>
            <PaymentCard
              className={styles.paymentCard}
              style={{ width: "100%!important" }}
              brand={cardType}
              number="4111111111111111"
              cvv="123"
              holderName="John Doe"
              expiration="12/22"
              flipped={false}
            />
          </Grid.Row>
          <Grid.Row>
            <Segment style={{ marginTop: "2rem", marginBottom: "-1rem" }}>
              <CardElement onChange={onChangeCard} options={options} />
            </Segment>
          </Grid.Row>
        </Grid.Column>
      </div>

      {/* <PaymentRequestButtonElement/> */}
    </form>

please add scope(component) of cardType and styles.paymentCard