diff --git a/src/assets/locals/ar.json b/src/assets/locals/ar.json
index b942b4d..2371950 100644
--- a/src/assets/locals/ar.json
+++ b/src/assets/locals/ar.json
@@ -377,7 +377,9 @@
     "gotIt": "فهمت",
     "howItWorksDescription": "يمكنك إرسال هدية إلى أي شخص عبر التطبيق. يمكنك إرسال هدية إلى أي شخص عبر التطبيق. يمكنك إرسال هدية إلى أي شخص عبر التطبيق. يمكنك إرسال هدية إلى أي شخص عبر التطبيق. يمكنك إرسال هدية إلى أي شخص عبر التطبيق.",
     "senderEmail": "البريد الإلكتروني المرسل",
-    "save": "حفظ"
+    "save": "حفظ",
+    "pleaseEnterRoomNumber": "يرجى إدخال رقم الغرفة",
+    "pleaseEnterOfficeNumber": "يرجى إدخال رقم المكتب"
   },
   "login": {
     "singup/Login": "الدخول / التسجيل",
diff --git a/src/assets/locals/en.json b/src/assets/locals/en.json
index 4df99b4..d6215fb 100644
--- a/src/assets/locals/en.json
+++ b/src/assets/locals/en.json
@@ -397,7 +397,9 @@
     "gotIt": "Got It",
     "howItWorksDescription": "The gifted amount will be credited directly to your friend's wallet in the app. The recipient can use the amount to book a session of their choice within the app. The gifted amount is non-refundable and can only be used for booking sessions.",
     "senderEmail": "Sender Email",
-    "save": "Save"
+    "save": "Save",
+    "pleaseEnterRoomNumber": "Please enter room number",
+    "pleaseEnterOfficeNumber": "Please enter office number"
   },
   "login": {
     "singup/Login": "Sing up / Login",
diff --git a/src/components/InputCard.tsx b/src/components/InputCard.tsx
index 007f091..c06f538 100644
--- a/src/components/InputCard.tsx
+++ b/src/components/InputCard.tsx
@@ -9,6 +9,7 @@ interface InputCardProps {
   placeholder: string;
   value: string;
   required?: boolean;
+  reuireqMessage?: string;
 }
 
 export default function InputCard({
@@ -17,6 +18,7 @@ export default function InputCard({
   placeholder,
   value,
   required = false,
+  reuireqMessage = "",
 }: InputCardProps) {
   const dispatch = useAppDispatch();
   const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {
@@ -27,7 +29,7 @@ export default function InputCard({
       <ProInputCard title={title} dividerStyle={{ margin: "5px 0 0 0" }}>
         <Form.Item
           name={name}
-          rules={[{ required }]}
+          rules={[{ required, message: reuireqMessage }]}
         >
           <Input
             placeholder={placeholder}
diff --git a/src/pages/cart/components/CouponCard.tsx b/src/pages/cart/components/CouponCard.tsx
index 48d0056..b3b18a5 100644
--- a/src/pages/cart/components/CouponCard.tsx
+++ b/src/pages/cart/components/CouponCard.tsx
@@ -1,4 +1,5 @@
 import { Button, Form, Input, message } from "antd";
+import { CloseCircleOutlined } from "@ant-design/icons";
 import { CouponBottomSheet } from "components/CustomBottomSheet/CouponBottomSheet";
 import { CouponDialog } from "components/CustomBottomSheet/CouponDialog";
 import CouponHeartIcon from "components/Icons/cart/CouponHeart.tsx";
@@ -21,12 +22,14 @@ import { colors } from "ThemeConstants";
 export default function CouponCard() {
   const { t } = useTranslation();
   const dispatch = useAppDispatch();
-  const { restaurant } = useAppSelector((state) => state.order);
+  const { restaurant, discount } = useAppSelector((state) => state.order);
   const { coupon } = useAppSelector(selectCart);
   const { isDesktop } = useBreakPoint();
   const [getDiscount] = useGetDiscountMutation();
   const [isCouponOpen, setIsCouponOpen] = useState(false);
 
+  const isDiscountApplied = discount.value > 0 || discount.isDiscount || discount.isGift;
+
   const handleCouponSave = (value: string) => {
     getDiscount({
       discountCode: value,
@@ -52,6 +55,18 @@ export default function CouponCard() {
     setIsCouponOpen(false);
   };
 
+  const handleClearDiscount = () => {
+    dispatch(updateCoupon(""));
+    dispatch(
+      updateDiscount({
+        value: 0,
+        isGift: false,
+        isDiscount: false,
+      }),
+    );
+    message.success(t("cart.couponRemoved") || "Coupon removed");
+  };
+
   return (
     <>
       <ProInputCard
@@ -85,33 +100,45 @@ export default function CouponCard() {
             size="large"
             autoFocus={false}
             style={{ padding: "7px 11px", height: 48 }}
+            value={coupon}
             onChange={(e) => {
               dispatch(updateCoupon(e.target.value));
             }}
             suffix={
-              <Button
-                style={{
-                  width: 100,
-                  height: 32,
-                  borderRadius: 100,
-                  backgroundColor: "#333333",
-                  color: "white",
-                  fontWeight: 500,
-                  fontStyle: "Medium",
-                  fontSize: 14,
-                  lineHeight: "140%",
-                  letterSpacing: "0%"
-                }}
-                onClick={() => handleCouponSave(coupon)}
-                icon={<CouponHeartIcon className={styles.couponApplyIcon} />}
-                iconPlacement="end"
-              >
-                <ProText
-                  style={{ position: "relative", top: -1, color: "white" }}
+              isDiscountApplied ? (
+                <CloseCircleOutlined
+                  onClick={handleClearDiscount}
+                  style={{
+                    fontSize: 18,
+                    color: "#999",
+                    cursor: "pointer",
+                  }}
+                />
+              ) : (
+                <Button
+                  style={{
+                    width: 100,
+                    height: 32,
+                    borderRadius: 100,
+                    backgroundColor: "#333333",
+                    color: "white",
+                    fontWeight: 500,
+                    fontStyle: "Medium",
+                    fontSize: 14,
+                    lineHeight: "140%",
+                    letterSpacing: "0%"
+                  }}
+                  onClick={() => handleCouponSave(coupon)}
+                  icon={<CouponHeartIcon className={styles.couponApplyIcon} />}
+                  iconPlacement="end"
                 >
-                  {t("cart.apply")}
-                </ProText>
-              </Button>
+                  <ProText
+                    style={{ position: "relative", top: -1, color: "white" }}
+                  >
+                    {t("cart.apply")}
+                  </ProText>
+                </Button>
+              )
             }
           />
         </Form.Item>
diff --git a/src/pages/checkout/page.tsx b/src/pages/checkout/page.tsx
index d38fc92..bb9d5f4 100644
--- a/src/pages/checkout/page.tsx
+++ b/src/pages/checkout/page.tsx
@@ -74,6 +74,7 @@ export default function CheckoutPage() {
                 placeholder={t("address.roomNo")}
                 value={order?.roomNumber}
                 required
+                reuireqMessage={t("address.pleaseEnterRoomNumber")}
               />
             )}
             {orderType === OrderType.ToOffice && (
@@ -83,6 +84,7 @@ export default function CheckoutPage() {
                 placeholder={t("address.officeNo")}
                 value={order?.officeNumber}
                 required
+                reuireqMessage={t("address.pleaseEnterOfficeNumber")}
               />
             )}
             {orderType === OrderType.Redeem && <VoucherSummary />}