dark theme fixes

src/components/ArabicPrice/ArabicPrice.tsx

@@ -20,8 +20,7 @@ const ArabicPrice: React.FC<ArabicPriceProps> = ({
   hideCurrency = false,
 }) => {
   const { isRTL } = useAppSelector((state) => state.locale);
-  const {restaurant} = useAppSelector(state => state.order)
-
+  const { restaurant } = useAppSelector((state) => state.order);
 
   // Format the price to ensure it has 2 decimal places
   const formattedPrice = typeof price === "number" ? price.toFixed(2) : price;
@@ -38,7 +37,6 @@ const ArabicPrice: React.FC<ArabicPriceProps> = ({
       style={{
         display: "inline-flex",
         alignItems: "baseline",
-        gap: "0.2em",
         lineHeight: 1,
         ...restStyle,
       }}
@@ -54,6 +52,7 @@ const ArabicPrice: React.FC<ArabicPriceProps> = ({
           >
             {formattedPrice}
           </span>
+          <span style={{ margin: "0 2px" }} />
           <span
             style={{
               fontSize: "0.9em",
@@ -64,7 +63,7 @@ const ArabicPrice: React.FC<ArabicPriceProps> = ({
               ...(decorationStyle ?? {}),
             }}
           >
-            {isRTL ? restaurant.local_currency : restaurant.global_currency}  
+            {isRTL ? restaurant.local_currency : restaurant.global_currency}
           </span>
         </>
       ) : !hideCurrency ? (
@@ -79,6 +78,7 @@ const ArabicPrice: React.FC<ArabicPriceProps> = ({
           >
             {formattedPrice}
           </span>
+          <span style={{ margin: "0 2px" }} />
           <span
             style={{
               fontSize: "0.9em",
@@ -89,7 +89,7 @@ const ArabicPrice: React.FC<ArabicPriceProps> = ({
             }}
           >
             {isRTL ? restaurant.local_currency : restaurant.global_currency}
-            </span>
+          </span>
         </>
       ) : (
         <span style={decorationStyle}>{formattedPrice}</span>