#ub-sofia{--sf-yellow:#f7c62d;--sf-ink:#262a30;font:14px/1.45 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--sf-ink);position:fixed;right:22px;bottom:22px;z-index:1055;text-align:left}#ub-sofia *{box-sizing:border-box}#ub-sofia [hidden]{display:none!important}#ub-sofia button{font:inherit;cursor:pointer;border:0}#ub-sofia .sf-launch{position:relative;display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #e7e4d9;border-radius:40px;padding:5px 18px 5px 5px;color:#292b2e;box-shadow:0 5px 25px #24201726;font-weight:600}#ub-sofia .sf-launch img{width:54px;height:54px;object-fit:cover;object-position:center 23%;border-radius:50%;border:2px solid var(--sf-yellow)}#ub-sofia .sf-unread{position:absolute;right:0;top:-4px;border-radius:12px;background:#d53f3f;color:white;padding:1px 7px}#ub-sofia .sf-panel{position:absolute;right:0;bottom:76px;width:378px;height:min(630px,calc(100dvh - 120px));border:1px solid #e5e2da;border-radius:20px;box-shadow:0 12px 55px #13171435;background:#fff;display:flex;flex-direction:column;overflow:hidden}#ub-sofia .sf-head{display:flex;gap:12px;align-items:center;background:var(--sf-yellow);padding:14px 16px}#ub-sofia .sf-head img{width:48px;height:48px;object-fit:cover;object-position:center 23%;border-radius:50%;border:2px solid #ffffffad}#ub-sofia .sf-head strong{font-size:17px;display:block}#ub-sofia .sf-head span{display:block;font-size:12px}#ub-sofia .sf-close{margin-left:auto;background:transparent;font-size:28px;line-height:1;padding:6px;color:#34322a}#ub-sofia .sf-preview{background:#fff5ca;padding:5px 12px;font-size:11px;text-align:center}#ub-sofia .sf-messages{flex:1;overflow:auto;overscroll-behavior:contain;padding:18px 14px;background:#f8f8f5;min-height:80px}#ub-sofia .sf-msg{margin:0 28px 12px 0;background:white;padding:11px 13px;border-radius:14px 14px 14px 3px;box-shadow:0 1px 3px #0000000a;white-space:pre-wrap;overflow-wrap:anywhere}#ub-sofia .sf-msg.customer{margin:0 0 12px 28px;background:#e7f2fd;border-radius:14px 14px 3px 14px}#ub-sofia .sf-msg a{color:#755507;text-decoration:underline}#ub-sofia .sf-msg img{max-width:100%;max-height:200px;border-radius:8px;display:block;margin-top:8px}#ub-sofia .sf-typing{padding:5px 16px;font-size:12px;color:#777}#ub-sofia .sf-typing span{animation:sf-pulse 1s infinite}@keyframes sf-pulse{50%{opacity:.2}}#ub-sofia .sf-compose{display:flex;align-items:flex-end;gap:7px;padding:12px 12px 6px;margin:0;border-top:1px solid #efeee8}#ub-sofia .sf-compose textarea{font:inherit;min-height:40px;max-height:100px;resize:none;flex:1;border:1px solid #deded9;border-radius:10px;padding:9px;min-width:0;background:#fff;color:#262a30}#ub-sofia .sf-compose button{width:40px;height:40px;border-radius:10px;background:var(--sf-yellow);color:#282820}#ub-sofia .sf-attach{padding:9px 0;font-size:20px;cursor:pointer;margin:0}#ub-sofia .sf-actions{display:flex;align-items:center;gap:10px;padding:6px 13px 12px;font-size:11px}#ub-sofia .sf-actions button{padding:0;background:transparent;text-decoration:underline;color:#655328;font-size:11px}#ub-sofia .sf-actions span{margin-left:auto;color:#888;font-size:10px}#ub-sofia .sf-error{background:#fff0ed;color:#a23523;padding:8px 12px;font-size:12px}#ub-sofia .sf-files{padding:0 14px;font-size:12px}#ub-sofia .sf-files button{background:transparent;color:#a23a27}#ub-sofia .sf-contact{padding:10px 14px;background:#fff9e6;font-size:12px}#ub-sofia .sf-contact button,#ub-sofia .sf-auth button{border-radius:7px;padding:6px 9px;background:#f3cb45;margin:5px 5px 0 0;font-size:12px}#ub-sofia .sf-auth{padding:12px 15px;background:#fff9e6;margin:0}#ub-sofia .sf-auth label{font-size:12px;display:block;margin:6px 0}#ub-sofia .sf-auth input{display:block;width:100%;padding:8px;border:1px solid #d8d3bf;border-radius:6px;font:inherit}#ub-sofia .sf-auth-status{display:block;font-size:11px;margin-top:5px}#ub-sofia button:disabled{opacity:.5;cursor:wait}#ub-sofia button:focus-visible,#ub-sofia textarea:focus-visible{outline:2px solid #8e6e00;outline-offset:2px}@media(max-width:520px){#ub-sofia{right:12px;bottom:12px}#ub-sofia .sf-launch>.sf-launch-label{display:none}#ub-sofia .sf-launch{padding:3px}#ub-sofia .sf-panel{right:0;bottom:70px;width:min(378px,calc(100vw - 24px));height:min(610px,calc(100dvh - 100px))}}@media(prefers-reduced-motion:reduce){#ub-sofia .sf-typing span{animation:none}}

/* Anchor both actions together; the original Binotel form remains untouched. */
html body #ub-sofia{position:fixed!important;left:auto!important;right:max(16px,env(safe-area-inset-right,0px))!important;bottom:calc(16px + env(safe-area-inset-bottom,0px))!important;z-index:1035}
html body #ub-sofia .sf-panel{left:auto;right:0;max-width:calc(100vw - 32px)}
html body.sf-contact-unified #bingc-phone-button{display:none!important}
html body #ub-sofia .sf-contact-menu{position:absolute;left:auto;right:0;bottom:76px;width:min(320px,calc(100vw - 32px));padding:16px;background:#fff;border:1px solid #e5e2da;border-radius:18px;box-shadow:0 12px 45px #1317142b}
html body #ub-sofia .sf-contact-menu>strong{display:block;margin:0 0 12px;font-size:16px;color:#262a30}
html body #ub-sofia .sf-contact-menu>button{display:flex;align-items:center;gap:12px;width:100%;min-height:64px;text-align:left;border-radius:12px;padding:11px 12px;background:#fff8dc;color:#262a30}
html body #ub-sofia .sf-contact-menu>button+button{margin-top:8px;background:#f3f5f6}
html body #ub-sofia .sf-channel-icon{font-size:23px;line-height:1}
html body #ub-sofia .sf-contact-menu b{display:block;font-size:14px;font-weight:650}
html body #ub-sofia .sf-contact-menu small{display:block;font-size:11px;margin-top:3px;color:#727880}
html body #ub-sofia .sf-contact-menu>button:hover{filter:brightness(.97)}
html body:has(.offcanvas.show,.offcanvas.showing,.offcanvas-backdrop.show,.modal.show,.modal-backdrop,#ukrbee-phone-modal.open,#ukrbee-newsletter-modal:not([hidden]),dialog[open]) #ub-sofia{visibility:hidden}
@media(max-width:520px){html body #ub-sofia .sf-contact-menu{bottom:70px}html body #ub-sofia{left:auto!important;right:max(12px,env(safe-area-inset-right,0px))!important}html body #ub-sofia .sf-panel{max-width:calc(100vw - 24px)}}

/* Combined Sofia chat and callback portrait, including the compact mobile launcher. */
html body #ub-sofia .sf-launch-avatar{position:relative;display:inline-flex;flex:0 0 54px;width:54px;height:54px;line-height:0}
html body #ub-sofia .sf-launch-avatar img{width:54px;height:54px;object-position:center;border:0}
html body #ub-sofia .sf-launch .sf-phone-badge{position:absolute;right:-3px;bottom:-1px;width:23px;height:23px;padding:4px;border:2px solid #fff;border-radius:50%;background:#087cf0;fill:#fff;box-shadow:0 1px 4px #123b6540;pointer-events:none}
html body #ub-sofia .sf-head img{object-position:center}

/* Staff restrictions cover the native Binotel controls as well as Sofia. */
html.sf-contact-blocked #ub-sofia,html.sf-contact-blocked [id^="bingc-"]{display:none!important}
#ub-sofia .sf-compose textarea{font-size:16px;line-height:22px;min-height:62px;max-height:84px;overflow-y:hidden}
#ub-sofia .sf-head,#ub-sofia .sf-compose,#ub-sofia .sf-actions{flex-shrink:0}
@media(max-width:520px){
 html body #ub-sofia.sf-mobile-open{top:var(--sf-view-top,8px)!important;bottom:auto!important;height:var(--sf-view-height,calc(100dvh - 16px));width:calc(100vw - 24px)}
 html body #ub-sofia.sf-mobile-open>.sf-launch{display:none}
 html body #ub-sofia.sf-mobile-open .sf-panel{top:0;bottom:0;left:auto;right:0;width:100%;max-width:100%;height:100%;max-height:100%;border-radius:16px}
 #ub-sofia.sf-mobile-open .sf-messages{min-height:0;padding:12px 10px}
 #ub-sofia.sf-mobile-open .sf-head{padding:8px 12px;gap:9px}
 #ub-sofia.sf-mobile-open .sf-head img{width:36px;height:36px}
 #ub-sofia.sf-mobile-open .sf-head strong{font-size:15px}
 #ub-sofia.sf-mobile-open .sf-compose{padding:8px 10px 4px;gap:6px}
 #ub-sofia.sf-mobile-open .sf-compose textarea{padding:8px;min-height:62px;max-height:84px}
 #ub-sofia.sf-mobile-open .sf-actions{padding:4px 10px 8px;gap:12px}
 #ub-sofia.sf-keyboard-open .sf-actions>span{display:none}
 #ub-sofia.sf-mobile-open .sf-contact,#ub-sofia.sf-mobile-open .sf-auth{max-height:40%;overflow:auto;flex-shrink:1}
}

/* Match the store phone login inside the client chat. */
#ub-sofia .sf-auth input{font-size:16px;min-height:42px;letter-spacing:.3px}#ub-sofia .sf-auth input[readonly]{background:#f4f3ed}#ub-sofia .sf-auth button{min-height:40px}#ub-sofia .sf-auth-hint{display:block;font-size:11px;margin-top:6px;color:#776325}#ub-sofia .sf-auth-change{background:transparent;text-decoration:underline}

/* Footer grid styles must not stretch this floating control across the viewport. */
html body #ub-sofia{width:max-content;max-width:calc(100vw - 32px);padding:0;margin:0}
html body #ub-sofia .sf-launch{flex-direction:row-reverse;gap:0;padding:5px;min-width:0}
html body #ub-sofia .sf-launch>.sf-launch-label{display:block;max-width:0;opacity:0;overflow:hidden;white-space:nowrap;margin:0;transform:translateX(8px);transition:max-width .25s ease,margin .25s ease,opacity .2s ease,transform .25s ease}
@media(hover:hover) and (pointer:fine){html body #ub-sofia .sf-launch:hover>.sf-launch-label,html body #ub-sofia .sf-launch:focus-visible>.sf-launch-label{max-width:180px;margin:0 10px 0 12px;opacity:1;transform:translateX(0)}}
@media(max-width:520px){html body #ub-sofia{max-width:calc(100vw - 24px)}}
@media(hover:none),(pointer:coarse){html body #ub-sofia .sf-launch>.sf-launch-label{display:none}}
@media(prefers-reduced-motion:reduce){html body #ub-sofia .sf-launch>.sf-launch-label{transition:none}}

/* A bounded reply preview uses one status indicator while the next part is prepared. */
#ub-sofia .sf-typing{display:flex;align-items:center;gap:7px;flex-shrink:0;color:#65717c;background:#f8f8f5;padding:8px 16px;font-size:12px}
#ub-sofia .sf-typing span{animation:none}
#ub-sofia .sf-typing-dots{display:inline-flex;align-items:center;gap:4px;height:14px}
#ub-sofia .sf-typing-dots i{display:block;width:5px;height:5px;border-radius:50%;background:#8c9daa;animation:sf-dot 1.2s ease-in-out infinite}
#ub-sofia .sf-typing-dots i:nth-child(2){animation-delay:.15s}#ub-sofia .sf-typing-dots i:nth-child(3){animation-delay:.3s}
@keyframes sf-dot{0%,60%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-3px);opacity:1}}
@media(prefers-reduced-motion:reduce){#ub-sofia .sf-typing-dots i{animation:none;opacity:.7}}