enhance E-Amount card

src/pages/CardDetails/components/GiftAmountBottomSheet.tsx

@@ -24,18 +24,19 @@ export function GiftAmountBottomSheet({
 }: SplitBillChoiceBottomSheetProps) {
   const { t } = useTranslation();
   const dispatch = useAppDispatch();
-  const { giftDetails, } = useAppSelector(selectCart);
+  const { giftDetails } = useAppSelector(selectCart);
   const [amount, setAmount] = useState<string>(
-    giftDetails?.amount && giftDetails?.amount > 0 ? giftDetails?.amount?.toString() : "",
+    giftDetails?.amount && giftDetails?.amount > 0
+      ? giftDetails?.amount?.toString()
+      : "",
   );
 
   const handleSave = () => {
     const numAmount = parseFloat(amount) || 0;
-    dispatch(updateGiftDetails({amount: numAmount}));
+    dispatch(updateGiftDetails({ amount: numAmount }));
     onClose();
   };
 
-
   return (
     <ProBottomSheet
       isOpen={isOpen}
@@ -51,13 +52,12 @@ export function GiftAmountBottomSheet({
     >
       <div
         style={{
-          padding: "20px",
+          padding: "20px 20px 0 20px",
           display: "flex",
           flexDirection: "column",
-          gap: 20,
         }}
       >
-        <div style={{ display: "flex", flexDirection: "column", gap: 5 }}>
+        <div style={{ display: "flex", flexDirection: "column", gap: 8 }}>
           <ProText
             style={{
               fontWeight: 400,
@@ -65,7 +65,7 @@ export function GiftAmountBottomSheet({
               fontSize: 16,
               lineHeight: "140%",
               letterSpacing: "0%",
-              color:"#333333"
+              color: "#333333",
             }}
           >
             {t("cardDetails.enterCustomOucherAmount")}
@@ -81,6 +81,18 @@ export function GiftAmountBottomSheet({
               min={0}
             />
           </Form.Item>
+          <ProText
+            style={{
+              fontWeight: 500,
+              fontStyle: "Medium",
+              fontSize: 12,
+              lineHeight: "140%",
+              letterSpacing: "0%",
+              color: "#B1B0B6",
+            }}
+          >
+            {t("cardDetails.minimumAmountShouldBe1OMR")}
+          </ProText>
         </div>
       </div>