.add,.subtract{opacity:1;align-items:center;transition:opacity .2s;display:flex}.add:hover,.subtract:hover{opacity:.3}.addToCart{justify-content:flex-end;align-items:stretch;gap:var(--spacer-default);width:100%;height:60px;display:flex}.addToCart__wrapper{flex-flow:column;flex:1;align-items:stretch;display:flex}.addToCart__amount{border-radius:var(--border-radius-primary);border:1px solid var(--c-gray);gap:0 var(--spacer-sm);padding:0 var(--spacer-sm);flex:3;justify-content:space-between;display:flex}.addToCart__amount .input-wrapper{text-align:center;flex-direction:column;justify-content:center;align-items:center;max-width:100px;display:flex}.addToCart__amount .input-wrapper button{font-size:18px}.addToCart__amount .input-wrapper input{text-align:center;appearance:textfield;background-color:#0000;border:none;outline:0;width:100%;height:100%;font-size:16px}.addToCart__amount .input-wrapper input::-webkit-outer-spin-button,.addToCart__amount .input-wrapper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.addToCart__amount .input-wrapper .unit{white-space:nowrap;font-style:italic;font-weight:100}.addToCart.dense{background-color:var(--c-light);gap:0;height:40px}.addToCart.dense .addToCart__wrapper{flex:1;font-size:0}.addToCart.dense .addToCart__wrapper .addToCart__amount{border-width:0;border-radius:0;gap:0;padding:0;font-size:14px}.addToCart.dense .addToCart__button{border-radius:0;width:30%;font-size:14px}.addToCart.dense .addToCart__button .button__cart{font-size:24px}.addToCart.dense .addToCart__button .button__rope{font-size:14px}.addToCart__button{white-space:nowrap;flex:1;width:50%;max-width:500px;font-size:24px;position:relative;overflow:hidden}.addToCart__button span{width:100%;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.addToCart__button .addToCart_text{opacity:1;justify-content:center;align-items:center;transition:opacity .5s ease-in-out;display:flex}.addToCart__button .addedToCart_text{opacity:0;justify-content:center;transition:opacity .5s ease-in-out;display:flex}.addToCart__button .button__cart{font-size:36px;position:absolute;top:50%;left:-20%;transform:translate(-50%,-50%)}.addToCart__button .button__rope{font-size:18px;position:absolute;top:-20%;left:52%;transform:translate(-50%,-50%)}.addToCart__button.loading-anim,.addToCart__button.done{--cart-anim:1s ease-in-out forwards}.addToCart__button.loading-anim .button__cart,.addToCart__button.done .button__cart{animation:cart var(--cart-anim)}.addToCart__button.loading-anim .button__rope,.addToCart__button.done .button__rope{animation:rope var(--cart-anim)}.addToCart__button.loading-anim .addToCart_text,.addToCart__button.done .addToCart_text{animation:addText var(--cart-anim)}.addToCart__button.done .addedToCart_text{opacity:1}.addToCart.disabled .addToCart__button{background:var(--c-gray);border-color:var(--c-gray);cursor:not-allowed}.addToCart.disabled .addToCart__button:hover{background:var(--c-gray)}@keyframes cart{0%{left:-20%}40%,60%{left:50%}to{left:125%}}@keyframes rope{0%,40%{top:-20%}60%{top:38%;left:52%}to{top:38%;left:125%}}@keyframes addText{0%{opacity:1}20%,to{opacity:0}}
