diff --git a/packages/dapp/src/components/custom/Pricing.tsx b/packages/dapp/src/components/custom/Pricing.tsx
index 0cfe20a0..b04021c1 100644
--- a/packages/dapp/src/components/custom/Pricing.tsx
+++ b/packages/dapp/src/components/custom/Pricing.tsx
@@ -15,7 +15,7 @@ import {
   FormControl,
   FormErrorMessage,
   FormLabel,
-  Input,
+  Input
 } from "@chakra-ui/react";
 import { useState } from "react";
 import { useFormContext } from "react-hook-form";
@@ -31,11 +31,11 @@ function PriceWrapper(props: any) {
   const { children } = props;
 
   const { style, children: inputChild, ...input } = getInputProps();
-  const checkbox = getCheckboxProps();
+  const { style: checkboxDefaultStyle, ...checkbox} = getCheckboxProps();
 
   return (
     <Box as="label">
-      <Input {...input} />
+      <input {...input} />
       <Box
         {...checkbox}
         cursor="pointer"
@@ -75,7 +75,7 @@ export default function ThreeTierPricing() {
     onChange: selectPlan,
   });
 
-  const group = getRootProps();
+  const { style: groupStyle, ...group} = getRootProps();
   const radioSilver = getRadioProps({ value: "SILVER" });
   const radioGold = getRadioProps({ value: "GOLD" });
   const radioDiamond = getRadioProps({ value: "DIAMOND" });
diff --git a/packages/dapp/src/components/custom/quiz/CheckboxCard.tsx b/packages/dapp/src/components/custom/quiz/CheckboxCard.tsx
index abd95464..524c434d 100644
--- a/packages/dapp/src/components/custom/quiz/CheckboxCard.tsx
+++ b/packages/dapp/src/components/custom/quiz/CheckboxCard.tsx
@@ -1,4 +1,4 @@
-import { useCheckbox, Box, Text, Input } from "@chakra-ui/react";
+import { useCheckbox, Box, Text } from "@chakra-ui/react";
 import useCustomColor from "core/hooks/useCustomColor";
 
 const CheckboxCard = (props: any) => {
@@ -8,11 +8,11 @@ const CheckboxCard = (props: any) => {
     
     const { children } = props;
     const { style, children: inputChild, ...input } = getInputProps();
-  const checkbox = getCheckboxProps();
+    const { style: checkboxDefaultStyle, ...checkbox} = getCheckboxProps();
   const label = getLabelProps();
   return (
     <Box as="label" margin="5" {...htmlProps}>
-      <Input {...input} />
+      <input {...input} />
       {state.isChecked ? (
         <Box
           {...checkbox}