fix(#2404): fixed layout of the modal subscription selection window

src/features/BuyMatchPopup/components/PackagesList/styled.tsx

@@ -33,7 +33,7 @@ export const List = styled.ul`
   ${isMobileDevice
     ? css`
       padding: 0;
-      height: 176px;
+      height: 180px;
       margin-top: 19px;
       @media screen and (orientation: landscape){
         margin-top: 10px;
@@ -78,29 +78,29 @@ export const Item = styled.li.attrs(() => ({
   @media (max-width: 750px) {
     height: 100%;
   }
-    ${isMobileDevice
+  
+  ${isMobileDevice
     ? css`
       padding: 5px 10px;
-      min-height: 52.29px;
-      height: 52.29px;
 
-      :not(:last-child) {
+      @media (max-width: 750px) {
-       margin-bottom: 10px;
-       @media screen and (orientation: landscape){
-         margin-bottom: 5.24px;
-       }
-       @media (max-width: 850px) and (orientation: landscape){
         min-height: 52.29px;
-        height: 52.29px;
+        height: auto;
       }
+
+      :not(:last-child) {
+        margin-bottom: 10px;
+
+        @media screen and (orientation: landscape) {
+          margin-bottom: 5.24px;
+        }
       }
-    `
+    ` : ''};
-    : ''};
 
-    @media (max-width: 850px) and (orientation: landscape){
+  @media (max-width: 850px) and (orientation: landscape){
-      min-height: 52.29px;
+    min-height: 52.29px;
-      height: 52.29px;
+    height: auto;
-    }
+  }
 `
 
 export const InfoWrapper = styled.div`
@@ -213,6 +213,7 @@ export const ScAutoRenewal = styled(PriceDetails)`
   line-height: 21px;
   font-size: 12px;
   text-transform: none;
+  white-space: nowrap;
   margin: 0;
   color: ${({ theme: { colors } }) => colors.text70};
 `