/* Shared quick actions, based on the category reference. */
.quick-contact{position:fixed;right:16px;bottom:24px;z-index:90}
.quick-contact__links{display:flex;flex-direction:column;align-items:end;gap:10px}
body.storefront-v2 .quick-contact__links a,body.storefront-v2 .quick-contact__toggle{position:relative;display:grid;place-items:center;width:44px;height:44px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;color:#0052cc;box-shadow:0 3px 12px rgb(15 23 42 / 8%);text-decoration:none;font-size:20px}
.quick-contact svg{width:28px;height:28px;display:block}
.quick-contact .quick-contact__zalo svg{width:32px;height:32px}
.quick-contact__toggle>i{font-size:26px}
.quick-contact b{font:700 12px Inter,sans-serif}
body.storefront-v2 .quick-contact__links .quick-contact__phone{background:#0052cc;border-color:#0052cc;color:#fff}
body.storefront-v2 .quick-contact__links .quick-contact__facebook{color:#0866ff}
body.storefront-v2 .quick-contact__links .quick-contact__tiktok{color:#0f172a}
.quick-contact__links a>span{position:absolute;right:calc(100% + 10px);padding:8px 12px;background:#0f172a;color:#fff;border-radius:4px;font:12px/1.5 Inter,sans-serif;white-space:nowrap;visibility:hidden;pointer-events:none}
.quick-contact__links a:is(:hover,:focus-visible)>span{visibility:visible}
body.storefront-v2 .quick-contact__toggle{display:none}
.quick-contact :focus-visible{outline:3px solid #0052cc;outline-offset:4px}
@media(max-width:760px){
.quick-contact{display:flex;flex-direction:column-reverse;align-items:end;gap:10px;bottom:max(16px,env(safe-area-inset-bottom))}
body.storefront-v2 .quick-contact__toggle{display:grid;background:#0052cc;color:#fff}
.quick-contact__links{display:none}
.quick-contact.is-open .quick-contact__links{display:flex}
.product-detail-storefront .quick-contact{bottom:calc(88px + env(safe-area-inset-bottom))}
}

/* Periodic invitation for every configured contact channel. */
@keyframes contact-invite{
0%,12%,100%{transform:translateX(0) rotate(0deg)}
2%,6%{transform:translateX(-3px) rotate(-4deg)}
4%,8%{transform:translateX(3px) rotate(4deg)}
10%{transform:translateX(-1px) rotate(-2deg)}
}
@media(prefers-reduced-motion:no-preference){
.quick-contact--animated .quick-contact__links>a,
.quick-contact--animated .quick-contact__toggle{animation:contact-invite 6s ease-in-out .4s infinite}
.quick-contact--animated .quick-contact__links>a:nth-child(2){animation-delay:.6s}
.quick-contact--animated .quick-contact__links>a:nth-child(3){animation-delay:.8s}
.quick-contact--animated .quick-contact__links>a:nth-child(4){animation-delay:1s}
.quick-contact--animated .quick-contact__links>a:nth-child(5){animation-delay:1.2s}
.quick-contact--animated .quick-contact__links>a:nth-child(6){animation-delay:1.4s}
.quick-contact__links a{transition:transform .18s ease,box-shadow .18s ease}
.quick-contact__links a:hover{transform:translateY(-3px)}
}
.quick-contact--animated:is(:hover,:focus-within) .quick-contact__links>a,
.quick-contact--animated:is(:hover,:focus-within) .quick-contact__toggle,
.quick-contact--animated.is-open .quick-contact__toggle{animation:none}
