/* Quick contact / template 1. Scoped adaptation of the supplied VR buttons. */
.wmp-quick-contact{--wmp-contact-active-bottom:var(--wmp-contact-bottom,100px);--wmp-contact-active-edge:var(--wmp-contact-edge,0px);position:fixed;right:calc(var(--wmp-contact-active-edge) + env(safe-area-inset-right,0px));left:auto;bottom:calc(var(--wmp-contact-active-bottom) + env(safe-area-inset-bottom,0px));z-index:99999;pointer-events:none}
.wmp-quick-contact[data-position="left"]{right:auto;left:calc(var(--wmp-contact-active-edge) + env(safe-area-inset-left,0px))}
.wmp-quick-contact .wmp-contact-group{display:flex;flex-direction:column;max-height:calc(100dvh - var(--wmp-contact-active-bottom) - env(safe-area-inset-bottom,0px) - 8px);overflow-y:auto;overflow-x:hidden;scrollbar-width:none}
.wmp-quick-contact .wmp-contact-group::-webkit-scrollbar{display:none}
.wmp-quick-contact .button-contact{position:relative;margin-top:5px;--wmp-contact-color:#d33;flex:none;pointer-events:auto}
.wmp-quick-contact .phone-vr{position:relative;width:90px;height:90px;background:transparent;backface-visibility:hidden;transform:translateZ(0)}
/* Phone number bar: mirror its placement with the selected screen edge. */
.wmp-quick-contact[data-show-phone-number="1"] .wmp-contact-group{align-items:flex-end}
.wmp-quick-contact[data-position="left"][data-show-phone-number="1"] .wmp-contact-group{align-items:flex-start}
.wmp-quick-contact[data-show-phone-number="1"] .wmp-contact-phone{--wmp-contact-color:#1564a7}
.wmp-quick-contact[data-show-phone-number="1"] .wmp-contact-phone .phone-vr{width:240px}
.wmp-quick-contact .wmp-contact-phone-number{position:absolute;left:53px;top:25px;z-index:1;display:flex;align-items:center;box-sizing:border-box;min-height:40px;padding:0 16px 0 20px;border-radius:50px;background:#1564a7;color:#fff;font:bold 15px/1.4 Arial,sans-serif;text-decoration:none;white-space:nowrap}
.wmp-quick-contact .wmp-contact-phone-number:focus-visible{outline:3px solid #111;outline-offset:3px}
.wmp-quick-contact .wmp-contact-phone .phone-vr-img-circle{z-index:2}
.wmp-quick-contact[data-position="right"][data-show-phone-number="1"] .wmp-contact-phone .phone-vr-circle-fill{left:auto;right:12px}
.wmp-quick-contact[data-position="right"][data-show-phone-number="1"] .wmp-contact-phone .phone-vr-img-circle{left:auto;right:25px}
.wmp-quick-contact[data-position="right"] .wmp-contact-phone-number{left:auto;right:53px;padding:0 20px 0 16px}
.wmp-quick-contact .phone-vr-circle-fill{position:absolute;width:65px;height:65px;top:12px;left:12px;border-radius:50%;border:2px solid transparent;box-sizing:border-box;background:var(--wmp-contact-color);opacity:.7;box-shadow:0 0 0 0 var(--wmp-contact-color);animation:wmp-contact-zoom 1.3s infinite}
.wmp-quick-contact .phone-vr-img-circle{position:absolute;width:40px;height:40px;top:25px;left:25px;border-radius:50%;background:var(--wmp-contact-color);animation:wmp-contact-ring 1s infinite ease-in-out}
.wmp-quick-contact .phone-vr-img-circle a{display:flex;width:100%;height:100%;align-items:center;justify-content:center;border-radius:50%;color:#fff;text-decoration:none}
.wmp-quick-contact .phone-vr-img-circle a:focus-visible{outline:3px solid #111;outline-offset:4px}
.wmp-quick-contact .phone-vr-img-circle svg{display:block;width:25px;height:25px;color:#fff;fill:currentColor;flex:none}
.wmp-quick-contact .wmp-contact-zalo{--wmp-contact-color:#2196f3}
.wmp-quick-contact .wmp-contact-maps{--wmp-contact-color:#188038}
.wmp-quick-contact .wmp-contact-messenger{--wmp-contact-color:#1877f2}
.wmp-quick-contact[data-animate="0"] .phone-vr-circle-fill,.wmp-quick-contact[data-animate="0"] .phone-vr-img-circle{animation:none}
.wmp-quick-contact.wmp-quick-contact-preview{position:static;pointer-events:none}
.wmp-quick-contact-preview .wmp-contact-group{flex-direction:row;flex-wrap:wrap;max-height:none;overflow:visible}
.wmp-quick-contact-preview .button-contact{pointer-events:none}
@keyframes wmp-contact-ring{0%,50%,100%{transform:rotate(0) skew(1deg)}10%,30%{transform:rotate(-25deg) skew(1deg)}20%,40%{transform:rotate(25deg) skew(1deg)}}
@keyframes wmp-contact-zoom{0%{transform:scale(.9)}70%{transform:scale(1);box-shadow:0 0 0 15px transparent}100%{transform:scale(.9);box-shadow:0 0 0 0 transparent}}
@media(max-width:768px){.wmp-quick-contact:not(.wmp-quick-contact-preview){--wmp-contact-active-bottom:var(--wmp-contact-mobile-bottom,var(--wmp-contact-bottom,100px));--wmp-contact-active-edge:var(--wmp-contact-mobile-edge,var(--wmp-contact-edge,0px))}}
@media(prefers-reduced-motion:reduce){.wmp-quick-contact .phone-vr-circle-fill,.wmp-quick-contact .phone-vr-img-circle{animation:none}}

/* Telephone-number design, based on the supplied call and Zalo widget. */
.wmp-quick-contact[data-show-phone-number="1"] .wmp-contact-phone .phone-vr,
.wmp-quick-contact[data-show-phone-number="1"] .wmp-contact-zalo .phone-vr{height:110px}
.wmp-quick-contact[data-show-phone-number="1"] .wmp-contact-zalo .phone-vr{width:110px}
.wmp-quick-contact[data-show-phone-number="1"] .wmp-contact-zalo{--wmp-contact-color:#2fbef4}
.wmp-quick-contact[data-show-phone-number="1"] .wmp-contact-phone .phone-vr::before,
.wmp-quick-contact[data-show-phone-number="1"] .wmp-contact-zalo .phone-vr::before{content:"";position:absolute;top:0;left:0;width:110px;height:110px;box-sizing:border-box;border:2px solid var(--wmp-contact-color);border-radius:50%;opacity:.5;pointer-events:none;animation:wmp-contact-outline 1.2s infinite ease-in-out}
.wmp-quick-contact[data-show-phone-number="1"] .wmp-contact-phone .phone-vr-circle-fill,
.wmp-quick-contact[data-show-phone-number="1"] .wmp-contact-zalo .phone-vr-circle-fill{width:80px;height:80px;top:15px;left:15px}
.wmp-quick-contact[data-show-phone-number="1"] .wmp-contact-phone .phone-vr-img-circle,
.wmp-quick-contact[data-show-phone-number="1"] .wmp-contact-zalo .phone-vr-img-circle{width:50px;height:50px;top:30px;left:30px}
.wmp-quick-contact[data-show-phone-number="1"] .phone-vr-img-circle img{display:block;width:33px;height:33px;max-width:none;object-fit:contain}
.wmp-quick-contact[data-show-phone-number="1"] .wmp-contact-phone-number{top:35px;left:42px;min-width:165px;height:40px;padding:0 16px 0 52px;background:#1564a7;color:#fff!important;font-family:Arial,sans-serif!important;font-size:20px!important;font-weight:normal!important;line-height:40px!important;text-decoration:none!important}
.wmp-quick-contact[data-position="right"][data-show-phone-number="1"] .wmp-contact-phone .phone-vr::before{left:auto;right:0}
.wmp-quick-contact[data-position="right"][data-show-phone-number="1"] .wmp-contact-phone .phone-vr-circle-fill{left:auto;right:15px}
.wmp-quick-contact[data-position="right"][data-show-phone-number="1"] .wmp-contact-phone .phone-vr-img-circle{left:auto;right:30px}
.wmp-quick-contact[data-position="right"][data-show-phone-number="1"] .wmp-contact-phone-number{left:auto;right:42px;padding:0 52px 0 16px}
@keyframes wmp-contact-outline{0%{transform:scale(.5);opacity:.1}30%{transform:scale(.7);opacity:.5}100%{transform:scale(1);opacity:.1}}
.wmp-quick-contact[data-animate="0"] .phone-vr::before{animation:none}
@media(prefers-reduced-motion:reduce){.wmp-quick-contact .phone-vr::before{animation:none}}
