/* Adapted motion: Aaron Iker / CodeMyUI add-to-cart-animation (CodePen MIT).
   https://gist.github.com/CodeMyUI/503d44d011c0aa8c05c48261b8b52129 */
.woocommerce .button.hn-cart-animated { position:relative; overflow:hidden; vertical-align:middle; opacity:1; box-sizing:border-box; }
.hn-product-cart-notices { flex:1 0 100%; }
.woocommerce a.button.hn-cart-animated::after { display:none!important; }
.woocommerce .button.hn-cart-animated + .added_to_cart { display:none!important; }
.single-product form.cart .added_to_cart.wc-forward { display:none!important; }
.hn-cart-animated .hn-cart-label { display:inline-block; transition:transform .35s ease,opacity .2s ease; }
.hn-cart-animated.hn-cart-busy .hn-cart-label { transform:translateY(-35px); opacity:0; }
.hn-cart-motion { position:absolute; top:50%; left:50%; width:36px; height:26px; margin:-13px 0 0 -18px; color:inherit; transform:translateX(-150px) rotate(-18deg); opacity:0; pointer-events:none; }
.hn-cart-motion svg { width:36px; height:26px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; position:relative; z-index:1; }
.hn-cart-motion::before { content:''; position:absolute; width:6px; height:6px; border-radius:50%; box-shadow:inset 0 0 0 2px currentColor; bottom:0; left:9px; filter:drop-shadow(11px 0 0 currentColor); }
.hn-cart-motion::after { content:''; position:absolute; width:16px; height:9px; background:currentColor; left:9px; bottom:7px; transform-origin:50% 100%; transform:scaleY(0); transition:transform .35s ease; }
.hn-cart-motion .hn-cart-tick { stroke:#fff; stroke-dasharray:12; stroke-dashoffset:12; transition:stroke-dashoffset .3s ease .3s; }
.hn-cart-busy .hn-cart-motion { animation:hn-cart-arrive .65s ease forwards; }
.hn-cart-busy.hn-cart-confirmed .hn-cart-motion { animation:hn-cart-depart 1.1s ease forwards; }
.hn-cart-confirmed .hn-cart-motion::after { transform:scaleY(1); }
.hn-cart-confirmed .hn-cart-tick { stroke-dashoffset:0; }
@keyframes hn-cart-arrive { from { opacity:0;transform:translateX(-100px) rotate(-18deg); } to { opacity:1;transform:translateX(0) rotate(0); } }
@keyframes hn-cart-depart { 0%,55% { opacity:1;transform:translateX(0); } 65% { opacity:1;transform:translateX(0) rotate(-12deg); } 100% { opacity:0;transform:translateX(150px) rotate(-12deg); } }
.hn-cart-feedback { position:fixed; z-index:99990; bottom:24px; left:50%; transform:translateX(-50%); width:max-content; max-width:calc(100% - 32px); padding:14px 44px 14px 18px; border:1px solid #e5e5e5; border-radius:12px; background:#fff; color:#171717; box-shadow:0 6px 24px #0002; font:14px/1.5 'Oplynt Header Inter',Arial,sans-serif; }
.hn-cart-feedback[hidden] { display:none; }
.hn-cart-feedback a { color:inherit; font-weight:600; text-decoration:underline; margin-left:8px; }
.hn-cart-feedback button { position:absolute; right:8px; top:8px; width:30px; height:30px; border:0; padding:0; background:transparent; color:inherit; font-size:22px; }
@media(max-width:767px) { .hn-cart-feedback { bottom:calc(85px + env(safe-area-inset-bottom)); } }
@media(prefers-reduced-motion:reduce) {
 .hn-cart-animated .hn-cart-label,.hn-cart-motion::after,.hn-cart-motion .hn-cart-tick { transition:none; }
 .hn-cart-busy .hn-cart-motion,.hn-cart-busy.hn-cart-confirmed .hn-cart-motion { animation:none; transform:none; opacity:1; }
}
