product: change actions button postions and general fixes

src/pages/product/page.tsx

@@ -1,4 +1,3 @@
-import ActionsButtons from "components/ActionsButtons/ActionsButtons";
 import ImageWithFallback from "components/ImageWithFallback";
 import { ItemDescriptionIcons } from "components/ItemDescriptionIcons/ItemDescriptionIcons";
 import ProText from "components/ProText";
@@ -177,7 +176,7 @@ export default function ProductDetailPage({
   return (
     <div
       style={{
-        height: "80vh",
+        height: "75vh",
         overflow: "auto",
         scrollbarWidth: "none",
       }}
@@ -221,12 +220,16 @@ export default function ProductDetailPage({
               <div className={styles.productHeader}>
                 <div className={styles.productDetails}>
                   <ProText
-                    strong
-                    style={{ fontSize: isDesktop ? "1.5rem" : "1.25rem" }}
+                    style={{
+                      fontWeight: 400,
+                      fontStyle: "Regular",
+                      fontSize: "14px",
+                      lineHeight: "140%",
+                      letterSpacing: "0%",
+                    }}
                   >
                     {isRTL ? product?.nameOther : product?.name}
                   </ProText>
-                  <br />
                   {product?.description && (
                     <ProText
                       type="secondary"
@@ -239,24 +242,19 @@ export default function ProductDetailPage({
                         textOverflow: "ellipsis",
                         wordWrap: "break-word",
                         overflowWrap: "break-word",
-                        lineHeight: "1.4",
                         maxHeight: "2.8em",
-                        fontWeight: "500",
-                        letterSpacing: "0.01em",
-                        fontSize: "1rem",
+                        fontWeight: 400,
+                        fontStyle: "Regular",
+                        fontSize: "12px",
+                        lineHeight: "140%",
+                        letterSpacing: "0%",
+                        marginTop: 10,
                       }}
                     >
                       {isRTL ? product?.descriptionAR : product?.description}
                     </ProText>
                   )}
-                  <ArabicPrice
-                    price={product?.price}
-                    style={{
-                      fontSize: isDesktop ? "1.2rem" : "1rem",
-                      color: colors.primary,
-                      marginTop: "12px",
-                    }}
-                  />
+
                   <div
                     style={{
                       display: "flex",
@@ -271,14 +269,13 @@ export default function ProductDetailPage({
                       className={styles.itemDescriptionIcons}
                     />
                   </div>
-                </div>
-
-                <div className={styles.quantitySection}>
-                  <ActionsButtons
-                    quantity={quantity}
-                    setQuantity={(quantity) => setQuantity(quantity)}
-                    max={100}
-                    min={1}
+                  <ArabicPrice
+                    price={product?.price}
+                    style={{
+                      fontSize: isDesktop ? "1.2rem" : "1rem",
+                      color: colors.primary,
+                      marginTop: "12px",
+                    }}
                   />
                 </div>
               </div>
@@ -293,6 +290,7 @@ export default function ProductDetailPage({
                 selectedGroups={selectedExtrasByGroup}
                 quantity={quantity}
                 onClose={onClose}
+                setQuantity={(quantity: number) => setQuantity(quantity)}
               />
             )}
           </div>
@@ -301,7 +299,7 @@ export default function ProductDetailPage({
           {hasCustomizationOptions && (
             <div className={isDesktop ? styles.rightColumn : styles.fullWidth}>
               <Space
-                direction="vertical"
+                orientation="vertical"
                 size="middle"
                 style={{ width: "100%", padding: "0 1rem" }}
               >
@@ -341,6 +339,7 @@ export default function ProductDetailPage({
             selectedExtras={selectedExtras}
             selectedGroups={selectedExtrasByGroup}
             quantity={quantity}
+            setQuantity={(quantity: number) => setQuantity(quantity)}
           />
         )}
       </div>