/* Scoped callback surface. Text and click target never move or disappear. */
#bingc-phone-button.dt-callback-drop,#dt-callback-preview.dt-callback-drop{position:fixed!important;left:18px!important;right:auto!important;bottom:28px!important;width:228px!important;height:58px!important;min-height:58px!important;padding:0!important;border:1px solid #ffffff35!important;border-radius:999px!important;background:linear-gradient(140deg,#a34054,#923345 55%,#78283d)!important;color:#fff!important;box-shadow:0 5px 18px #35101c30,inset 0 1px 0 #ffffff25!important;z-index:1040!important;display:block!important;text-decoration:none!important;cursor:pointer;transform:none!important;animation:none!important;overflow:visible!important}
#bingc-phone-button.dt-callback-drop>*:not(.dt-callback-face){display:none!important}
.dt-callback-drop .dt-callback-face{position:absolute;inset:0;display:flex;align-items:center;gap:12px;padding:8px 16px;pointer-events:none;color:#fff}
.dt-callback-drop .dt-callback-label{font:600 14px/1.25 Arial,sans-serif;white-space:nowrap;color:#fff!important;position:relative;z-index:2}
.dt-callback-drop .dt-callback-symbol{width:38px;height:38px;flex:0 0 38px;border-radius:50%;background:#ffffff16;position:relative;display:grid;place-items:center;transform-origin:center;animation:dt-callback-morph 12s 4s infinite}
.dt-callback-drop .dt-callback-symbol svg{width:24px;height:24px;animation:dt-callback-handset 12s 4s infinite}
.dt-callback-drop .dt-callback-splash{position:absolute;left:35px;top:29px;width:0;height:0;pointer-events:none}
.dt-callback-drop .dt-callback-splash i{position:absolute;width:6px;height:8px;border-radius:70% 40% 60% 60%;background:#ffffffb0;opacity:0;--dx:-24px;--dy:-17px;animation:dt-callback-splash 12s 4s infinite}
.dt-callback-drop .dt-callback-splash i:nth-child(2){--dx:0px;--dy:-25px}.dt-callback-drop .dt-callback-splash i:nth-child(3){--dx:23px;--dy:-17px}.dt-callback-drop .dt-callback-splash i:nth-child(4){--dx:25px;--dy:17px}.dt-callback-drop .dt-callback-splash i:nth-child(5){--dx:0px;--dy:24px}.dt-callback-drop .dt-callback-splash i:nth-child(6){--dx:-25px;--dy:16px}
@keyframes dt-callback-morph{0%,67%,100%{border-radius:50%;transform:rotate(0) scale(1);opacity:1}74%,80%{border-radius:4px 65% 65% 65%;transform:rotate(45deg) scale(.94);background:#ffffff45;opacity:1}83%{border-radius:4px 65% 65% 65%;transform:rotate(45deg) scale(1.08);opacity:1}86%,89%{transform:rotate(45deg) scale(.15);opacity:0}95%{transform:rotate(0) scale(1);opacity:1}}
@keyframes dt-callback-handset{0%,67%,100%{opacity:1}74%,90%{opacity:0}95%{opacity:1}}
@keyframes dt-callback-splash{0%,82%,94%,100%{opacity:0;transform:translate(0,0) scale(.2)}84%{opacity:.9;transform:translate(0,0) scale(1)}91%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.3)}}
.dt-callback-drop:hover .dt-callback-symbol,.dt-callback-drop:focus-visible .dt-callback-symbol{animation:none!important;border-radius:50%!important;transform:none!important;opacity:1!important}.dt-callback-drop:hover svg,.dt-callback-drop:focus-visible svg{animation:none!important;opacity:1!important}.dt-callback-drop:hover i,.dt-callback-drop:focus-visible i{animation:none!important;opacity:0!important}
.dt-callback-drop:focus-visible{outline:3px solid #923345;outline-offset:4px}
.dt-callback-paused .dt-callback-drop *{animation-play-state:paused!important}
@media(max-width:767px){#bingc-phone-button.dt-callback-drop,#dt-callback-preview.dt-callback-drop{width:190px!important;height:52px!important;min-height:52px!important;left:12px!important;bottom:calc(var(--dt-mobile-overlay-floor,74px) + 14px + env(safe-area-inset-bottom,0px))!important}.dt-callback-drop .dt-callback-face{padding:7px 10px;gap:8px}.dt-callback-drop .dt-callback-label{font-size:12px}.dt-callback-drop .dt-callback-symbol{width:32px;height:32px;flex-basis:32px}.dt-callback-drop .dt-callback-splash{left:26px;top:26px}}
@media(prefers-reduced-motion:reduce){.dt-callback-drop *{animation:none!important}.dt-callback-drop .dt-callback-splash{display:none}}

/* Vendor applies important resets to all descendants; isolate the added face. */
#bingc-phone-button.dt-callback-drop .dt-callback-face{position:absolute!important;inset:0!important;display:flex!important;align-items:center!important;gap:12px!important;padding:8px 16px!important;margin:0!important;width:auto!important;height:auto!important;box-sizing:border-box!important;transform:none!important;pointer-events:none!important}
#bingc-phone-button.dt-callback-drop .dt-callback-symbol{position:relative!important;display:grid!important;place-items:center!important;flex:0 0 38px!important;width:38px!important;height:38px!important;padding:0!important;margin:0!important;overflow:visible!important;background:#ffffff26!important}
#bingc-phone-button.dt-callback-drop .dt-callback-symbol svg{position:static!important;width:24px!important;height:24px!important;padding:0!important;margin:0!important;fill:none!important;stroke:#fff!important;stroke-width:1.8!important}
#bingc-phone-button.dt-callback-drop .dt-callback-label{position:relative!important;display:block!important;inset:auto!important;flex:0 0 auto!important;width:auto!important;height:auto!important;padding:0!important;margin:0!important;font:600 14px/1.25 Arial,sans-serif!important;text-align:left!important;white-space:nowrap!important;transform:none!important}
#bingc-phone-button.dt-callback-drop .dt-callback-splash{position:absolute!important;left:35px!important;top:29px!important;right:auto!important;bottom:auto!important;width:0!important;height:0!important;padding:0!important;margin:0!important;overflow:visible!important;pointer-events:none!important}
#bingc-phone-button.dt-callback-drop .dt-callback-splash i{position:absolute!important;left:0!important;top:0!important;width:6px!important;height:8px!important;display:block!important;padding:0!important;margin:0!important;background:#ffffffd9!important;pointer-events:none!important}
@media(max-width:767px){#bingc-phone-button.dt-callback-drop .dt-callback-face{padding:7px 10px!important;gap:8px!important}#bingc-phone-button.dt-callback-drop .dt-callback-symbol{width:32px!important;height:32px!important;flex-basis:32px!important}#bingc-phone-button.dt-callback-drop .dt-callback-label{font-size:12px!important}#bingc-phone-button.dt-callback-drop .dt-callback-splash{left:26px!important;top:26px!important}}

/* Separate circle and vector drop: no square backing during interpolation. */
#bingc-phone-button.dt-callback-drop .dt-callback-symbol,#dt-callback-preview.dt-callback-drop .dt-callback-symbol{background:transparent!important;border:0!important;box-shadow:none!important;isolation:isolate;animation:dt-callback-pop 12s 4s infinite}
.dt-callback-drop .dt-callback-symbol::before,.dt-callback-drop .dt-callback-symbol::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1}
.dt-callback-drop .dt-callback-symbol::before{border-radius:50%;background:#ffffff26;animation:dt-callback-handset 12s 4s infinite}
.dt-callback-drop .dt-callback-symbol::after{background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 44'%3E%3Cpath d='M20 1C17 8 4 20 4 28a16 15 0 0 0 32 0C36 20 23 8 20 1Z' fill='white' fill-opacity='.35'/%3E%3Cpath d='M11 26c-2 5 0 10 5 12' fill='none' stroke='white' stroke-opacity='.6' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;opacity:0;animation:dt-callback-vector 12s 4s infinite}
#bingc-phone-button.dt-callback-drop .dt-callback-symbol svg,#dt-callback-preview.dt-callback-drop .dt-callback-symbol svg{background:transparent!important;border:0!important;box-shadow:none!important;border-radius:0!important}
@keyframes dt-callback-pop{0%,80%,100%{opacity:1;transform:scale(1)}83%{opacity:1;transform:scale(1.08)}86%,89%{opacity:0;transform:scale(.15)}95%{opacity:1;transform:scale(1)}}
@keyframes dt-callback-vector{0%,67%,86%,100%{opacity:0}74%,83%{opacity:1}}
.dt-callback-drop:hover .dt-callback-symbol::before,.dt-callback-drop:focus-visible .dt-callback-symbol::before{animation:none!important;opacity:1!important}
.dt-callback-drop:hover .dt-callback-symbol::after,.dt-callback-drop:focus-visible .dt-callback-symbol::after{animation:none!important;opacity:0!important}
@media(prefers-reduced-motion:reduce){.dt-callback-drop .dt-callback-symbol::before{animation:none!important;opacity:1!important}.dt-callback-drop .dt-callback-symbol::after{animation:none!important;opacity:0!important}}
.dt-callback-paused .dt-callback-symbol::before,.dt-callback-paused .dt-callback-symbol::after{animation-play-state:paused!important}

/* Vendor reset makes unanimated particles opaque during the 4s delay. */
#bingc-phone-button.dt-callback-drop .dt-callback-splash i,#dt-callback-preview.dt-callback-drop .dt-callback-splash i{opacity:0;animation-fill-mode:both;border-radius:70% 40% 60% 60%!important}
#bingc-phone-button.dt-callback-drop .dt-callback-symbol,#bingc-phone-button.dt-callback-drop .dt-callback-symbol svg,#dt-callback-preview.dt-callback-drop .dt-callback-symbol,#dt-callback-preview.dt-callback-drop .dt-callback-symbol svg{animation-fill-mode:both}
/* Restore only our two pseudo-elements suppressed by the vendor reset. */
#bingc-phone-button.dt-callback-drop .dt-callback-symbol::before,#bingc-phone-button.dt-callback-drop .dt-callback-symbol::after{content:""!important;position:absolute!important;inset:0!important;width:auto!important;height:auto!important;display:block!important;pointer-events:none!important;animation-fill-mode:both}
#bingc-phone-button.dt-callback-drop .dt-callback-symbol::before,#bingc-phone-button.dt-callback-drop .dt-callback-symbol::after{z-index:-1!important;background-size:contain!important}

/* The open catalogue owns the viewport; restore callback when it closes. */
html.dt27-catalog-open body :is(#bingc-phone-button,#dt-callback-preview,#dt-binotel-original-preview){display:none!important;visibility:hidden!important;pointer-events:none!important}

/* Intrinsic face width survives the native Binotel font reset and browser font scaling. */
html body.dt-design26 :is(#bingc-phone-button,#dt-callback-preview).dt-callback-drop{width:max-content!important;min-width:228px!important;max-width:calc(100vw - 36px)!important;height:54px!important;min-height:54px!important;box-sizing:border-box!important}
html body.dt-design26 :is(#bingc-phone-button,#dt-callback-preview).dt-callback-drop .dt-callback-face{position:relative!important;inset:auto!important;width:auto!important;height:100%!important;box-sizing:border-box!important}
@media(max-width:767px){html body.dt-design26 :is(#bingc-phone-button,#dt-callback-preview).dt-callback-drop{min-width:190px!important;max-width:calc(100vw - 24px)!important;height:52px!important;min-height:52px!important}}
