How to make 'sold out' text for products be on the same line as the price?

Hi, i'm trying to make the 'Sold Out' text be on the same line as the price instead of one line below it. Is there any way I can do this? Thanks

What is site url? We can check easier

this is the url for the shop: removed

On 4/25/2022 at 12:04 AM, nobody said:

this is the url for the shop: https://donkaka.com/spiritual-playgirl

Add to Design > Custom CSS

.products.collection-content-wrapper .grid-meta-status {
    position: absolute;
    right: 0;
    bottom: 0;
}
section.grid-meta-wrapper {
    position: relative;
}

awesome thanks!

also by the way, how can I make it say 'Unavailable' instead of 'Sold Out', but only for some products

5 hours ago, nobody said:

also by the way, how can I make it say 'Unavailable' instead of 'Sold Out', but only for some products

Change on both list page + individual pages?

yes

also the previous code seems to overlap text when i hide the prices on a product page

12 hours ago, nobody said:

also the previous code seems to overlap text when i hide the prices on a product page

Use this code

.product-mark.sold-out {
    font-size: 0;
}
.product-mark.sold-out:before {
    font-size: 18px;
    content: "Unavailable";
}

How did you hide price?