fix: spacing issue with the pagination

Author: Haider Alshamma

src/Pagination/Pagination.tsx

@@ -61,7 +61,7 @@ function Pagination({
   };
 
   return (
-    <Flex as="nav" aria-label={ariaLabel || t("pagination navigation")} alignItems="center" {...restProps}>
+    <Flex as="nav" gap="x2" aria-label={ariaLabel || t("pagination navigation")} alignItems="center" {...restProps}>
       <PreviousButton
         disabled={currentPage === 1}
         onClick={() => {
@@ -81,7 +81,7 @@ function Pagination({
 
           if (page === SEPARATOR)
             return (
-              <Text key={`sep${index}`} py="x1" mr="x2" fontSize="small" lineHeight="smallTextBase">
+              <Text key={`sep${index}`} py="x1" fontSize="small" lineHeight="smallTextBase">
                 {SEPARATOR}
               </Text>
             );

src/Pagination/PaginationButton.tsx

@@ -26,9 +26,6 @@ const PaginationButton = styled.button<{
   border: `1px solid ${currentPage ? theme.colors.darkBlue : theme.colors.lightGrey}`,
   color: disabled ? theme.colors.grey : theme.colors.black,
   minWidth: iconOnly ? theme.space.x4 : "auto",
-  "&:not(:last-child)": {
-    marginRight: theme.space.x2,
-  },
   cursor: disabled ? "default" : "pointer",
   "&:hover": {
     background: getHoverBackground(currentPage, disabled, theme),