From 743ac1c133eb4605a9f724a1aedccb8a69c35f09 Mon Sep 17 00:00:00 2001
From: Anton Sylka <antonsylka1004@gmail.com>
Date: Mon, 25 May 2026 14:21:26 +0800
Subject: [PATCH 1/8] Refs #36673: SfCollectedProduct - tweak layout

---
 .../organisms/SfCollectedProduct.scss         | 10 +++-
 .../SfCollectedProduct/SfCollectedProduct.vue | 47 +++++++++++--------
 2 files changed, 37 insertions(+), 20 deletions(-)

diff --git a/packages/shared/styles/components/organisms/SfCollectedProduct.scss b/packages/shared/styles/components/organisms/SfCollectedProduct.scss
index 6732a29b3b..12a1a5d1bb 100644
--- a/packages/shared/styles/components/organisms/SfCollectedProduct.scss
+++ b/packages/shared/styles/components/organisms/SfCollectedProduct.scss
@@ -58,9 +58,13 @@
     --quantity-selector-width: 100%;
     --quantity-selector-height: 2.5rem;
   }
-  &__main {
+  &__content {
     flex: 1;
     margin: var(--collected-product-main-margin, 0 0 0 var(--spacer-base));
+    display: flex;
+    flex-direction: column;
+  }
+  &__main {
     display: flex;
     flex-direction: var(--collected-product-main-flex-direction, column);
   }
@@ -69,6 +73,9 @@
     display: flex;
     flex-direction: column;
   }
+  &__bottom {
+    margin-top: var(--collected-product-bottom-margin, var(--spacer-sm));
+  }
   &__title {
     display: inline-block;
     margin-bottom: var(--spacer-base);
@@ -144,3 +151,4 @@
     }
   }
 }
+
diff --git a/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue b/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
index 91fc78cae9..b2f77ed124 100644
--- a/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
+++ b/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
@@ -1,25 +1,34 @@
 <template>
   <div class="sf-collected-product">
-    <div class="sf-collected-product__main">
-      <div class="sf-collected-product__details">
-        <slot name="title" v-bind="{ title }">
-          <div class="sf-collected-product__title-wraper">
-            <SfLink :link="link" class="sf-collected-product__title">
-              {{ title }}
-            </SfLink>
-          </div>
-        </slot>
-        <slot name="price" v-bind="{ specialPrice, regularPrice }">
-          <SfPrice
-            v-if="regularPrice"
-            :regular="regularPrice"
-            :special="specialPrice"
-          />
-        </slot>
-        <slot name="configuration" />
+    <div class="sf-collected-product__content">
+      <div class="sf-collected-product__main">
+        <div class="sf-collected-product__details">
+          <slot name="title" v-bind="{ title }">
+            <div class="sf-collected-product__title-wraper">
+              <SfLink :link="link" class="sf-collected-product__title">
+                {{ title }}
+              </SfLink>
+            </div>
+          </slot>
+          <slot name="price" v-bind="{ specialPrice, regularPrice }">
+            <SfPrice
+              v-if="regularPrice"
+              :regular="regularPrice"
+              :special="specialPrice"
+            />
+          </slot>
+          <slot name="configuration" />
+        </div>
+        <div class="sf-collected-product__actions">
+          <slot name="actions" />
+        </div>
       </div>
-      <div class="sf-collected-product__actions">
-        <slot name="actions" />
+
+      <div
+        v-if="$slots.bottom || $scopedSlots.bottom"
+        class="sf-collected-product__bottom"
+      >
+        <slot name="bottom" />
       </div>
     </div>
     <div class="sf-collected-product__aside">

From 2bd73dfc72435b437bb73ed5c54636f2f8ae7956 Mon Sep 17 00:00:00 2001
From: Anton Sylka <antonsylka1004@gmail.com>
Date: Mon, 25 May 2026 14:48:57 +0800
Subject: [PATCH 2/8] Refs #36673: SfCollectedProduct - tweak layout

---
 .../organisms/SfCollectedProduct.scss         |  9 +++
 .../SfCollectedProduct/SfCollectedProduct.vue | 65 ++++++++++---------
 2 files changed, 44 insertions(+), 30 deletions(-)

diff --git a/packages/shared/styles/components/organisms/SfCollectedProduct.scss b/packages/shared/styles/components/organisms/SfCollectedProduct.scss
index 12a1a5d1bb..a236c27b12 100644
--- a/packages/shared/styles/components/organisms/SfCollectedProduct.scss
+++ b/packages/shared/styles/components/organisms/SfCollectedProduct.scss
@@ -64,7 +64,11 @@
     display: flex;
     flex-direction: column;
   }
+  &__top {
+    display: flex;
+  }
   &__main {
+    flex: 1;
     display: flex;
     flex-direction: var(--collected-product-main-flex-direction, column);
   }
@@ -73,6 +77,11 @@
     display: flex;
     flex-direction: column;
   }
+  &__remove-slot {
+    display: flex;
+    flex: 0 0 auto;
+    margin-left: var(--collected-product-remove-slot-margin-left, var(--spacer-sm));
+  }
   &__bottom {
     margin-top: var(--collected-product-bottom-margin, var(--spacer-sm));
   }
diff --git a/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue b/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
index b2f77ed124..cd81a7be42 100644
--- a/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
+++ b/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
@@ -1,26 +1,43 @@
 <template>
   <div class="sf-collected-product">
     <div class="sf-collected-product__content">
-      <div class="sf-collected-product__main">
-        <div class="sf-collected-product__details">
-          <slot name="title" v-bind="{ title }">
-            <div class="sf-collected-product__title-wraper">
-              <SfLink :link="link" class="sf-collected-product__title">
-                {{ title }}
-              </SfLink>
-            </div>
-          </slot>
-          <slot name="price" v-bind="{ specialPrice, regularPrice }">
-            <SfPrice
-              v-if="regularPrice"
-              :regular="regularPrice"
-              :special="specialPrice"
+      <div class="sf-collected-product__top">
+        <div class="sf-collected-product__main">
+          <div class="sf-collected-product__details">
+            <slot name="title" v-bind="{ title }">
+              <div class="sf-collected-product__title-wraper">
+                <SfLink :link="link" class="sf-collected-product__title">
+                  {{ title }}
+                </SfLink>
+              </div>
+            </slot>
+            <slot name="price" v-bind="{ specialPrice, regularPrice }">
+              <SfPrice
+                v-if="regularPrice"
+                :regular="regularPrice"
+                :special="specialPrice"
+              />
+            </slot>
+            <slot name="configuration" />
+          </div>
+          <div class="sf-collected-product__actions">
+            <slot name="actions" />
+          </div>
+        </div>
+
+        <div class="sf-collected-product__remove-slot">
+          <slot name="remove" v-bind="{ removeHandler }">
+            <SfCircleIcon
+              icon="cross"
+              aria-label="Remove"
+              class="sf-circle-icon--small sf-collected-product__remove sf-collected-product__remove--circle-icon"
             />
+            <SfButton
+              class="sf-button--text sf-collected-product__remove sf-collected-product__remove--text"
+              @click="removeHandler"
+              >Remove</SfButton
+            >
           </slot>
-          <slot name="configuration" />
-        </div>
-        <div class="sf-collected-product__actions">
-          <slot name="actions" />
         </div>
       </div>
 
@@ -51,18 +68,6 @@
         </div>
       </slot>
     </div>
-    <slot name="remove" v-bind="{ removeHandler }">
-      <SfCircleIcon
-        icon="cross"
-        aria-label="Remove"
-        class="sf-circle-icon--small sf-collected-product__remove sf-collected-product__remove--circle-icon"
-      />
-      <SfButton
-        class="sf-button--text sf-collected-product__remove sf-collected-product__remove--text"
-        @click="removeHandler"
-        >Remove</SfButton
-      >
-    </slot>
     <slot name="more-actions">
       <SfButton
         aria-label="More actions"

From e1448f0eda561a4a758182c184ff33089e5aefcc Mon Sep 17 00:00:00 2001
From: Anton Sylka <antonsylka1004@gmail.com>
Date: Mon, 25 May 2026 15:27:58 +0800
Subject: [PATCH 3/8] Refs #36673: SfCollectedProduct - remove redundant
 changes

---
 .../organisms/SfCollectedProduct.scss         | 19 +---
 .../SfCollectedProduct/SfCollectedProduct.vue | 91 ++++++++++---------
 2 files changed, 53 insertions(+), 57 deletions(-)

diff --git a/packages/shared/styles/components/organisms/SfCollectedProduct.scss b/packages/shared/styles/components/organisms/SfCollectedProduct.scss
index a236c27b12..7f9de4d722 100644
--- a/packages/shared/styles/components/organisms/SfCollectedProduct.scss
+++ b/packages/shared/styles/components/organisms/SfCollectedProduct.scss
@@ -58,17 +58,13 @@
     --quantity-selector-width: 100%;
     --quantity-selector-height: 2.5rem;
   }
-  &__content {
+  &__main {
     flex: 1;
-    margin: var(--collected-product-main-margin, 0 0 0 var(--spacer-base));
     display: flex;
     flex-direction: column;
   }
-  &__top {
-    display: flex;
-  }
-  &__main {
-    flex: 1;
+  &__main-top {
+    margin: var(--collected-product-main-margin, 0 0 0 var(--spacer-base));
     display: flex;
     flex-direction: var(--collected-product-main-flex-direction, column);
   }
@@ -77,14 +73,6 @@
     display: flex;
     flex-direction: column;
   }
-  &__remove-slot {
-    display: flex;
-    flex: 0 0 auto;
-    margin-left: var(--collected-product-remove-slot-margin-left, var(--spacer-sm));
-  }
-  &__bottom {
-    margin-top: var(--collected-product-bottom-margin, var(--spacer-sm));
-  }
   &__title {
     display: inline-block;
     margin-bottom: var(--spacer-base);
@@ -160,4 +148,3 @@
     }
   }
 }
-
diff --git a/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue b/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
index cd81a7be42..d75f8b102e 100644
--- a/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
+++ b/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
@@ -1,53 +1,47 @@
 <template>
   <div class="sf-collected-product">
-    <div class="sf-collected-product__content">
-      <div class="sf-collected-product__top">
-        <div class="sf-collected-product__main">
-          <div class="sf-collected-product__details">
-            <slot name="title" v-bind="{ title }">
-              <div class="sf-collected-product__title-wraper">
-                <SfLink :link="link" class="sf-collected-product__title">
-                  {{ title }}
-                </SfLink>
-              </div>
-            </slot>
-            <slot name="price" v-bind="{ specialPrice, regularPrice }">
-              <SfPrice
-                v-if="regularPrice"
-                :regular="regularPrice"
-                :special="specialPrice"
-              />
-            </slot>
-            <slot name="configuration" />
-          </div>
-          <div class="sf-collected-product__actions">
-            <slot name="actions" />
-          </div>
-        </div>
+    <div class="sf-collected-product__main">
+      <div class="sf-collected-product__main-top">
+        <div class="sf-collected-product__details">
+          <slot name="title" v-bind="{ title }">
+            <div class="sf-collected-product__title-wraper">
+              <SfLink :link="link" class="sf-collected-product__title">
+                {{ title }}
+              </SfLink>
+            </div>
+          </slot>
 
-        <div class="sf-collected-product__remove-slot">
-          <slot name="remove" v-bind="{ removeHandler }">
-            <SfCircleIcon
-              icon="cross"
-              aria-label="Remove"
-              class="sf-circle-icon--small sf-collected-product__remove sf-collected-product__remove--circle-icon"
+          <slot name="price" v-bind="{ specialPrice, regularPrice }">
+            <SfPrice
+              v-if="regularPrice"
+              :regular="regularPrice"
+              :special="specialPrice"
             />
-            <SfButton
-              class="sf-button--text sf-collected-product__remove sf-collected-product__remove--text"
-              @click="removeHandler"
-              >Remove</SfButton
-            >
           </slot>
+
         </div>
-      </div>
 
-      <div
-        v-if="$slots.bottom || $scopedSlots.bottom"
-        class="sf-collected-product__bottom"
-      >
-        <slot name="bottom" />
+        <div class="sf-collected-product__actions">
+          <slot name="actions" />
+        </div>
+
+        <slot name="remove" v-bind="{ removeHandler }">
+          <SfCircleIcon
+            icon="cross"
+            aria-label="Remove"
+            class="sf-circle-icon--small sf-collected-product__remove sf-collected-product__remove--circle-icon"
+          />
+          <SfButton
+            class="sf-button--text sf-collected-product__remove sf-collected-product__remove--text"
+            @click="removeHandler"
+            >Remove</SfButton
+          >
+        </slot>
       </div>
+
+      <slot name="configuration" />
     </div>
+
     <div class="sf-collected-product__aside">
       <slot name="image" v-bind="{ image, title }">
         <SfImage
@@ -58,6 +52,7 @@
           class="sf-collected-product__image"
         />
       </slot>
+
       <slot name="input">
         <div class="sf-collected-product__quantity-wrapper">
           <SfQuantitySelector
@@ -68,6 +63,20 @@
         </div>
       </slot>
     </div>
+
+    <slot name="remove" v-bind="{ removeHandler }">
+      <SfCircleIcon
+        icon="cross"
+        aria-label="Remove"
+        class="sf-circle-icon--small sf-collected-product__remove sf-collected-product__remove--circle-icon"
+      />
+      <SfButton
+        class="sf-button--text sf-collected-product__remove sf-collected-product__remove--text"
+        @click="removeHandler"
+        >Remove</SfButton
+      >
+    </slot>
+
     <slot name="more-actions">
       <SfButton
         aria-label="More actions"

From 6db5aa1d089024f85ea1303ba7c64a5de80f552e Mon Sep 17 00:00:00 2001
From: Anton Sylka <antonsylka1004@gmail.com>
Date: Mon, 25 May 2026 15:30:33 +0800
Subject: [PATCH 4/8] Refs #36673: SfCollectedProduct - fix style

---
 .../shared/styles/components/organisms/SfCollectedProduct.scss  | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/shared/styles/components/organisms/SfCollectedProduct.scss b/packages/shared/styles/components/organisms/SfCollectedProduct.scss
index 7f9de4d722..9d1446ff8a 100644
--- a/packages/shared/styles/components/organisms/SfCollectedProduct.scss
+++ b/packages/shared/styles/components/organisms/SfCollectedProduct.scss
@@ -62,9 +62,9 @@
     flex: 1;
     display: flex;
     flex-direction: column;
+    margin: var(--collected-product-main-margin, 0 0 0 var(--spacer-base));
   }
   &__main-top {
-    margin: var(--collected-product-main-margin, 0 0 0 var(--spacer-base));
     display: flex;
     flex-direction: var(--collected-product-main-flex-direction, column);
   }

From 9b193c96083a6c2fe33f9d56d4c342d618a64bfe Mon Sep 17 00:00:00 2001
From: Anton Sylka <antonsylka1004@gmail.com>
Date: Mon, 25 May 2026 15:34:17 +0800
Subject: [PATCH 5/8] Refs #36673: SfCollectedProduct - remove duplicated slot

---
 .../SfCollectedProduct/SfCollectedProduct.vue       | 13 -------------
 1 file changed, 13 deletions(-)

diff --git a/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue b/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
index d75f8b102e..f5f74480db 100644
--- a/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
+++ b/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
@@ -64,19 +64,6 @@
       </slot>
     </div>
 
-    <slot name="remove" v-bind="{ removeHandler }">
-      <SfCircleIcon
-        icon="cross"
-        aria-label="Remove"
-        class="sf-circle-icon--small sf-collected-product__remove sf-collected-product__remove--circle-icon"
-      />
-      <SfButton
-        class="sf-button--text sf-collected-product__remove sf-collected-product__remove--text"
-        @click="removeHandler"
-        >Remove</SfButton
-      >
-    </slot>
-
     <slot name="more-actions">
       <SfButton
         aria-label="More actions"

From e2d6e518110195f49545e78c5727a4b0ae26cf93 Mon Sep 17 00:00:00 2001
From: Anton Sylka <antonsylka1004@gmail.com>
Date: Mon, 25 May 2026 15:58:20 +0800
Subject: [PATCH 6/8] Refs #36673: SfCollectedProduct - fix actions slot

---
 .../styles/components/organisms/SfCollectedProduct.scss     | 5 +++--
 .../organisms/SfCollectedProduct/SfCollectedProduct.vue     | 6 +++++-
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/packages/shared/styles/components/organisms/SfCollectedProduct.scss b/packages/shared/styles/components/organisms/SfCollectedProduct.scss
index 9d1446ff8a..7af45cebf4 100644
--- a/packages/shared/styles/components/organisms/SfCollectedProduct.scss
+++ b/packages/shared/styles/components/organisms/SfCollectedProduct.scss
@@ -1,5 +1,7 @@
 @import "../../helpers";
 .sf-collected-product {
+  --collected-product-main-flex-direction: row;
+
   position: relative;
   box-sizing: border-box;
   display: flex;
@@ -66,7 +68,7 @@
   }
   &__main-top {
     display: flex;
-    flex-direction: var(--collected-product-main-flex-direction, column);
+    flex-direction: var(--collected-product-main-flex-direction, row);
   }
   &__details,
   &__actions {
@@ -140,7 +142,6 @@
       --collected-product-remove-right: var(--spacer-xs);
       --collected-product-remove-text-display: inline;
       --collected-product-actions-justify-content: flex-start;
-      --collected-product-main-flex-direction: row;
       --collected-product-actions-align-items: flex-start;
       &:hover {
         --collected-product-box-shadow: none;
diff --git a/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue b/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
index f5f74480db..234cb92931 100644
--- a/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
+++ b/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
@@ -21,7 +21,7 @@
 
         </div>
 
-        <div class="sf-collected-product__actions">
+        <div class="sf-collected-product__actions desktop-only">
           <slot name="actions" />
         </div>
 
@@ -40,6 +40,10 @@
       </div>
 
       <slot name="configuration" />
+
+      <div class="sf-collected-product__actions mobile-only">
+        <slot name="actions" />
+      </div>
     </div>
 
     <div class="sf-collected-product__aside">

From 15125dbfd3f2fe1097c700d1b8a52b0312484b0b Mon Sep 17 00:00:00 2001
From: Anton Sylka <antonsylka1004@gmail.com>
Date: Mon, 25 May 2026 16:02:35 +0800
Subject: [PATCH 7/8] Refs #36673: SfCollectedProduct - fix details style

---
 .../shared/styles/components/organisms/SfCollectedProduct.scss   | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/shared/styles/components/organisms/SfCollectedProduct.scss b/packages/shared/styles/components/organisms/SfCollectedProduct.scss
index 7af45cebf4..530838590a 100644
--- a/packages/shared/styles/components/organisms/SfCollectedProduct.scss
+++ b/packages/shared/styles/components/organisms/SfCollectedProduct.scss
@@ -69,6 +69,7 @@
   &__main-top {
     display: flex;
     flex-direction: var(--collected-product-main-flex-direction, row);
+    justify-content: space-between;
   }
   &__details,
   &__actions {

From 975bba6ecf3bb786931073cf7bff23cc01850d6a Mon Sep 17 00:00:00 2001
From: Anton Sylka <antonsylka1004@gmail.com>
Date: Wed, 3 Jun 2026 16:48:28 +0800
Subject: [PATCH 8/8] Refs #36673: SfCollectedProduct - tweak component layout

---
 .../organisms/SfCollectedProduct.scss         | 32 +++++++++++++------
 .../SfCollectedProduct/SfCollectedProduct.vue | 13 +++-----
 2 files changed, 28 insertions(+), 17 deletions(-)

diff --git a/packages/shared/styles/components/organisms/SfCollectedProduct.scss b/packages/shared/styles/components/organisms/SfCollectedProduct.scss
index 530838590a..038e9be772 100644
--- a/packages/shared/styles/components/organisms/SfCollectedProduct.scss
+++ b/packages/shared/styles/components/organisms/SfCollectedProduct.scss
@@ -4,7 +4,12 @@
 
   position: relative;
   box-sizing: border-box;
-  display: flex;
+  display: grid;
+  grid-template-columns: 8.75rem 1fr;
+  grid-template-areas:
+    "aside main"
+    "configuration configuration"
+    "actions actions";
   max-width: var(--collected-product-width);
   padding: var(--collected-product-padding, var(--spacer-xs));
   background: var(--collected-product-background);
@@ -39,9 +44,8 @@
     right: var(--collected-product-remove-right, var(--spacer-xs));
   }
   &__aside {
-    order: -1;
+    grid-area: aside;
     position: relative;
-    flex: 0 0 8.75rem;
     line-height: 0;
   }
   &__image {
@@ -61,7 +65,7 @@
     --quantity-selector-height: 2.5rem;
   }
   &__main {
-    flex: 1;
+    grid-area: main;
     display: flex;
     flex-direction: column;
     margin: var(--collected-product-main-margin, 0 0 0 var(--spacer-base));
@@ -71,10 +75,19 @@
     flex-direction: var(--collected-product-main-flex-direction, row);
     justify-content: space-between;
   }
-  &__details,
+  &__configuration {
+    grid-area: configuration;
+    margin: var(--collected-product-configuration-margin, 0 0 0 var(--spacer-base));
+  }
+  &__details {
+    display: flex;
+    flex-direction: column;
+  }
   &__actions {
+    grid-area: actions;
     display: flex;
     flex-direction: column;
+    margin: var(--collected-product-actions-margin, 0 0 0 var(--spacer-base));
   }
   &__title {
     display: inline-block;
@@ -98,6 +111,11 @@
     --collected-product-remove-transition: opacity 150ms ease-in-out;
     --collected-product-remove-circle-icon-display: flex;
     --collected-product-remove-text-display: none;
+    grid-template-columns: 8.75rem 1fr;
+    grid-template-areas:
+      "aside main"
+      "aside configuration"
+      "aside actions";
     &::after {
       --collected-product-transition: box-shadow 150ms ease-in-out;
     }
@@ -118,9 +136,6 @@
         );
       }
     }
-    &__aside {
-      flex: 0 0 8.75rem;
-    }
     &__image {
       mix-blend-mode: darken;
     }
@@ -133,7 +148,6 @@
         flex-end
       );
       align-items: var(--collected-product-actions-align-items, flex-start);
-      flex: 2;
     }
     &--detailed {
       --collected-product-width: 100%;
diff --git a/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue b/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
index 234cb92931..e9fcdac099 100644
--- a/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
+++ b/packages/vue/src/components/organisms/SfCollectedProduct/SfCollectedProduct.vue
@@ -18,11 +18,6 @@
               :special="specialPrice"
             />
           </slot>
-
-        </div>
-
-        <div class="sf-collected-product__actions desktop-only">
-          <slot name="actions" />
         </div>
 
         <slot name="remove" v-bind="{ removeHandler }">
@@ -38,12 +33,14 @@
           >
         </slot>
       </div>
+    </div>
 
+    <div class="sf-collected-product__configuration">
       <slot name="configuration" />
+    </div>
 
-      <div class="sf-collected-product__actions mobile-only">
-        <slot name="actions" />
-      </div>
+    <div class="sf-collected-product__actions">
+      <slot name="actions" />
     </div>
 
     <div class="sf-collected-product__aside">