Move “Add To Cart” button next to quantity on product pages

Here is a code snippet showing how to move the button next to the quantity to save some space.

Add this code to Pages › Website Tools › Custom CSS:

.ProductItem-quantity-add-to-cart {
  display: flex !important;
  align-items: flex-end;
}

.ProductItem-quantity-add-to-cart .product-quantity-input {
  margin-bottom: 0 !important;
  flex: 0 0 auto !important;
  margin-right: 1rem;
}

.ProductItem-quantity-add-to-cart .sqs-add-to-cart-button-wrapper {
  margin-bottom: 0 !important;
  width: auto !important; 
  flex: 1 0 auto;
}

Bonus: this will make quantity field itself a bit smaller as it’s huge by default.

/* Optional: decrease input padding */
.ProductItem-quantity-add-to-cart .product-quantity-input input {
  padding: 1rem !important;
}

Result