/* Nexcod Assistant — see assets/js/assistant.js
   Everything here is position:fixed and scoped to .nxa-*, so no page layout can be
   disturbed by it. The panel scrolls inside itself and never pushes the body. */

/* The panel opens from the "?" in the header. This only marks that button while
   the panel is open, so it reads as pressed. */
#nxHelpBtn.nxa-open{ background:#0f6b60 !important; color:#fff !important; border-color:#0f6b60 !important; }

/*
 * The page-tour used to have its own "?" in the same corner. Two help buttons side
 * by side is a puzzle, not help — so the tour is reachable from inside the assistant
 * ("Show me around this page") and its own button is hidden. The button still exists
 * in the DOM because the assistant clicks it to start the tour.
 */
#nxgHelp{ position:absolute !important; left:-9999px !important; width:1px !important;
          height:1px !important; opacity:0 !important; pointer-events:none !important; }

.nxa-panel{
  position:fixed; right:16px; top:64px; z-index:9210;
  width:410px; max-width:calc(100vw - 24px);
  height:min(650px, calc(100vh - 96px));
  background:#fff; border:1px solid #e4e9f0; border-radius:3px;
  display:none; flex-direction:column; overflow:hidden;
  box-shadow:0 20px 56px -16px rgba(15,23,42,.28), 0 2px 8px rgba(15,23,42,.06);
  /* slides up from the button rather than appearing on top of the page */
  opacity:0; transform:translateY(-10px) scale(.985); transform-origin:top right;
  transition:opacity .22s ease, transform .26s cubic-bezier(.22,1,.36,1);
  will-change:opacity, transform;
}
.nxa-panel.on{ opacity:1; transform:none; }
@media (max-width:640px){
  .nxa-panel{ right:0; left:0; top:auto; bottom:0; width:100%; max-width:none;
              height:min(88vh, 100vh - 40px);
              border-radius:3px 3px 0 0; border-width:1px 0 0;
              transform:translateY(24px); transform-origin:bottom center; }
}

.nxa-head{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:15px 18px 13px; background:#fff; color:#0f172a; flex:none;
  border-bottom:1px solid #eef2f7;
}
.nxa-head .nxa-t{ font-size:16px; font-weight:700; letter-spacing:-.01em; }
.nxa-head .nxa-s{ font-size:12px; color:#7c8899; margin-top:1px; }
.nxa-x{
  background:#f1f5f9; border:none; color:#334155; font-size:20px; line-height:1;
  cursor:pointer; width:30px; height:30px; border-radius:50%; flex:none;
  display:grid; place-items:center; transition:background .16s ease, color .16s ease;
}
.nxa-x:hover{ background:#e2e8f0; color:#0f172a; }
.nxa-x:focus-visible{ outline:2px solid #0f6b60; outline-offset:2px; }

.nxa-log{
  flex:1; overflow-y:auto; padding:18px 16px 10px; background:#fbfcfd;
  scroll-behavior:auto;                 /* the script eases it itself */
  overscroll-behavior:contain;          /* stops the page behind from scrolling too */
}
.nxa-log::-webkit-scrollbar{ width:6px; }
.nxa-log::-webkit-scrollbar-track{ background:transparent; }
.nxa-log::-webkit-scrollbar-thumb{ background:#dde3ea; border-radius:3px; }
.nxa-log::-webkit-scrollbar-thumb:hover{ background:#b6c1cf; }

.nxa-msg{
  margin-bottom:13px; max-width:100%;
  transition:opacity .26s ease, transform .3s cubic-bezier(.22,1,.36,1);
}
/* the state each message starts in, removed on the next frame */
.nxa-msg.nxa-in{ opacity:0; transform:translateY(9px); }
.nxa-msg.me{
  margin-left:auto; max-width:80%; background:#0f6b60; color:#fff;
  padding:10px 15px; font-size:14px; line-height:1.5; width:fit-content;
  border-radius:3px 3px 5px 3px;
}
.nxa-msg.bot{
  background:#fff; border:1px solid #eaeff5; padding:14px 16px;
  border-radius:3px 3px 3px 5px;
  box-shadow:0 1px 3px rgba(15,23,42,.04);
}
.nxa-mt{ font-size:13.5px; font-weight:700; color:#0f172a; margin-bottom:7px;
         letter-spacing:-.01em; }
.nxa-mb{ font-size:14.5px; line-height:1.7; color:#39434f; }
.nxa-mb p{ margin:0 0 9px; }
.nxa-mb p:last-child{ margin-bottom:0; }
.nxa-mb ul,.nxa-mb ol{ margin:0 0 9px; padding-left:19px; }
.nxa-mb li{ margin-bottom:5px; padding-left:2px; }
.nxa-mb li::marker{ color:#94a3b8; }
.nxa-mb b{ color:#0f172a; font-weight:700; }
/* a blinking caret while the answer is still arriving */
.nxa-mb.typing::after{
  content:'▍'; color:#0f6b60; animation:nxaBlink 1s steps(2) infinite; margin-left:1px;
}
@keyframes nxaBlink{ 50%{ opacity:0; } }

.nxa-gh{ font-size:11px; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
         color:#9aa6b4; margin:14px 0 7px; }
.nxa-chips{ display:flex; flex-wrap:wrap; gap:7px; }
.nxa-chip{
  border:1px solid #e2e8f0; background:#fff; color:#33404f;
  padding:8px 14px; font-size:13px; font-weight:500; cursor:pointer;
  border-radius:3px;
  transition:border-color .18s ease, color .18s ease, background .18s ease, transform .16s ease;
}
.nxa-chip:hover{ border-color:#0f6b60; color:#0f6b60; background:#f2fbf9; transform:translateY(-1px);
                 box-shadow:0 2px 8px rgba(15,107,96,.12); }
.nxa-chip:active{ transform:scale(.97); }

/* chips and call buttons arrive one behind the other */
.nxa-pop{ animation:nxaPop .3s cubic-bezier(.22,1,.36,1) backwards; }
@keyframes nxaPop{ from{ opacity:0; transform:translateY(6px) scale(.97); } to{ opacity:1; transform:none; } }
.nxa-chip:focus-visible{ outline:2px solid #0f6b60; outline-offset:2px; }


.nxa-think{ padding:14px 13px; }
.nxa-dots{ display:flex; gap:5px; }
.nxa-dots span{
  width:7px; height:7px; border-radius:50%; background:#94a3b8;
  animation:nxaBounce 1.2s infinite ease-in-out;
}
.nxa-dots span:nth-child(2){ animation-delay:.18s; }
.nxa-dots span:nth-child(3){ animation-delay:.36s; }
@keyframes nxaBounce{ 0%,60%,100%{ transform:translateY(0); opacity:.5; } 30%{ transform:translateY(-5px); opacity:1; } }

/* One button, and it always does the same thing: bring the whole list back. */
.nxa-foot{ display:flex; padding:12px 14px 14px; border-top:1px solid #eef2f7;
           background:#fff; flex:none; }
.nxa-back{
  flex:1; border:1px solid #e2e8f0; background:#f8fafc; color:#33404f;
  padding:11px 16px; border-radius:3px; font-size:13.5px; font-weight:600;
  cursor:pointer; font-family:inherit;
  transition:background .18s ease, border-color .18s ease, color .18s ease, transform .16s ease;
}
.nxa-back:hover{ background:#f2fbf9; border-color:#0f6b60; color:#0f6b60; }
.nxa-back:active{ transform:scale(.985); }
.nxa-back:focus-visible{ outline:2px solid #0f6b60; outline-offset:2px; }

/* Someone who has asked their phone to stop moving things gets no motion at all,
   only the plain result. */
@media (prefers-reduced-motion: reduce){
  .nxa-panel, .nxa-msg, .nxa-chip, .nxa-back{ transition:none !important; }
  .nxa-dots span, .nxa-mb.typing::after, .nxa-pop{ animation:none !important; }
  .nxa-msg.nxa-in{ opacity:1; transform:none; }
}

@media print{ .nxa-panel, #nxgHelp{ display:none !important; } }