/* NEXBET chat — gold FAB (design: Nexbet.dc.html chat=1) for BOTH the Chatwoot bubble and the stub button.
   Loaded after style.css. Chatwoot injects its own <style> after ours with !important rules, so every Chatwoot override
   here uses a higher specificity (html .woot-widget-bubble.woot-elements--right) instead of source order.
   Design: 56px gold circle, right 20 / bottom 20, z-index 60 (--z-fab), same in both themes. Phone adaptation (NX-55):
   48px / 14px edge, safe-area aware, steps aside while scrolling, over modals/menu and while a form field is focused. */

:root{
  --nx-fab:56px;--nx-fab-ic:24px;--nx-fab-edge:20px;--nx-fab-gap:12px;
  --nx-fab-r:max(var(--nx-fab-edge),env(safe-area-inset-right,0px));
  --nx-fab-b:max(var(--nx-fab-edge),env(safe-area-inset-bottom,0px));
  --nx-fab-top:calc(var(--nx-fab-b) + var(--nx-fab) + var(--nx-fab-gap));
}
@media (max-width:479px){:root{--nx-fab:48px;--nx-fab-ic:22px;--nx-fab-edge:14px}}

/* ---------- stub button (no chat token on the domain) ---------- */
.nx-fab{right:var(--nx-fab-r);bottom:var(--nx-fab-b);width:var(--nx-fab);height:var(--nx-fab);padding:0;
  background:linear-gradient(180deg,#ffdc6a 0%,#efb243 100%);color:#1a1206;
  box-shadow:inset 0 1px 0 #fff6c4,0 10px 30px -8px #f5b940aa,0 4px 10px #0006;
  transition:opacity .2s ease,visibility .2s,filter .2s}
.nx-fab:hover{filter:brightness(1.07)}
.nx-fab:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}
.nx-fab .nx-ic{width:var(--nx-fab-ic);height:var(--nx-fab-ic)}
.nx-chat{right:var(--nx-fab-r);bottom:var(--nx-fab-top);max-height:calc(100dvh - var(--nx-fab-top) - 12px);overflow:auto;
  width:min(320px,calc(100vw - 2 * var(--nx-fab-edge) - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px)));
  animation:nx-fade .2s ease}
.nx-chat__head{margin:0;gap:12px}
.nx-chat__head .nx-iconbtn{width:44px;height:44px;margin:-12px -12px -12px 0;border:0;background:none}
.nx-chat p{line-height:1.5}

/* ---------- Chatwoot bubble (button.woot-widget-bubble; inline style sets its blue background) ---------- */
html .woot-widget-bubble.woot-elements--right{
  right:var(--nx-fab-r);bottom:var(--nx-fab-b);
  width:var(--nx-fab)!important;height:var(--nx-fab)!important;min-width:0;padding:0;
  z-index:var(--z-fab,60)!important;border:0!important;border-radius:50%!important;overflow:visible!important;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%231a1206' stroke-width='2' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M4 5h16v11H9l-5 4z'/%3E%3Cpath d='M8 9.5h8M8 12.5h5'/%3E%3C/svg%3E") center/var(--nx-fab-ic) var(--nx-fab-ic) no-repeat,linear-gradient(180deg,#ffdc6a 0%,#efb243 100%)!important;
  box-shadow:inset 0 1px 0 #fff6c4,0 10px 30px -8px #f5b940aa,0 4px 10px #0006!important;color:#1a1206}
html .woot-widget-bubble.woot-elements--right:hover{filter:brightness(1.07);
  box-shadow:inset 0 1px 0 #fff6c4,0 10px 30px -8px #f5b940aa,0 4px 10px #0006!important}
html .woot-widget-bubble.woot-elements--right:focus-visible{outline:2px solid var(--focus-ring);outline-offset:3px}
html .woot-widget-bubble.woot-elements--right svg{display:none!important}
/* open state: same gold disc, dark X (Chatwoot draws it with ::before/::after) */
html .woot-widget-bubble.woot-elements--right.woot--close{
  background:linear-gradient(180deg,#ffdc6a 0%,#efb243 100%)!important}
html .woot-widget-bubble.woot--close::before,html .woot-widget-bubble.woot--close::after{
  background-color:#1a1206!important;left:calc(50% - 1px)!important;top:calc(50% - 12px)!important;width:2px!important;height:24px!important}
/* unread dot stays inside the page's palette and is not clipped */
html .woot-widget-bubble.unread-notification::after{top:2px;right:2px;background:var(--error,#ff7a7a);border-color:#1a1206}

/* ---------- Chatwoot window (iframe from the chat host cannot be styled; only its frame) ---------- */
@media (min-width:668px){
  html .woot-widget-holder.woot-elements--right:not(.has-unread-view){
    right:var(--nx-fab-r);bottom:var(--nx-fab-top);
    height:min(640px,calc(100dvh - var(--nx-fab-top) - 16px))!important;max-height:640px!important;
    padding:1px;border:0!important;border-radius:14px!important;background:var(--gold-frame);box-shadow:var(--shadow)!important}
  html .woot-widget-holder.woot-elements--right:not(.has-unread-view) iframe{border-radius:13px}
}

/* ---------- keep the button off the content ---------- */
/* a modal/menu is open: bubble would sit on the cabinet corner (cabinet box is up to 1000px wide) */
@media (max-width:1199px){
  html.nx-chat-cover .nx-fab,html.nx-chat-cover .nx-chat,
  html.nx-chat-cover .woot-widget-bubble.woot-elements--right:not(.woot--close){opacity:0!important;visibility:hidden!important;pointer-events:none!important}
}
/* phones/tablets: steps aside while the page scrolls down or a form field has focus; returns at rest / on scroll up */
@media (max-width:899px){
  html.nx-chat-away .nx-fab,html.nx-chat-kbd .nx-fab,
  html.nx-chat-away .woot-widget-bubble.woot-elements--right:not(.woot--close),
  html.nx-chat-kbd .woot-widget-bubble.woot-elements--right:not(.woot--close){opacity:0!important;visibility:hidden!important;pointer-events:none!important}
}

@media (prefers-reduced-motion:reduce){
  .nx-fab,.nx-chat,html .woot-widget-bubble,html .woot-widget-bubble::before,html .woot-widget-bubble::after,
  html .woot-widget-holder{animation:none!important;transition:none!important}
  .nx-fab:hover,html .woot-widget-bubble.woot-elements--right:hover{filter:none}
}
