400)">
res.json())
.then(data => {
product = data;
selectedVariantId = data.variants.find(v => v.available)?.id || data.variants[0].id;
loading = false;
})
"
@cart-updated.window="checkCart()"
class="relative z-[2000]"
x-show="open"
x-cloak
>
/
per order
Only units left
Maximum available qty are in your basket
{
if(!res.ok) throw new Error();
return res.json();
})
.then(() => {
if(window.refreshCartUI) window.refreshCartUI();
window.dispatchEvent(new CustomEvent('cart-updated'));
loading = false;
open = false;
Alpine.$data(document.querySelector('.header-wrapper')).cartDrawerOpen = true;
})
.catch(() => {
alert('Not enough individual units in stock to fulfill this order.');
loading = false;
})
"
class="w-full py-5 rounded-hb font-black uppercase text-xs tracking-[0.2em] transition-all flex items-center justify-center"
:disabled="loading || isUpcoming() || !stockLogic.canAdd || stockLogic.soldOut"
:class="{
'bg-gray-200 text-gray-400 cursor-not-allowed': (!stockLogic.canAdd || stockLogic.soldOut) && !isUpcoming(),
'bg-black text-white hover:bg-primary shadow-xl shadow-black/10': stockLogic.canAdd && !stockLogic.soldOut && !isUpcoming(),
'border-2 border-green-500 text-green-600 bg-transparent cursor-default opacity-100': isUpcoming()
}"
>
/