/* Sensor Ask — floating advisor. Brand: navy #29295F, gold #D4AF6C, Assistant. */

/* The site's accessibility button sits at inset-inline-start:18px / bottom:18px
   with z-index 99998, so this used to land exactly on top of it. Live on the
   OTHER side, and stay below the a11y panel's z-index so accessibility UI
   always wins. */
.sa-launch{position:fixed;inset-inline-end:20px;bottom:20px;z-index:99990;
  display:flex;align-items:center;gap:9px;padding:12px 18px;border:0;border-radius:999px;
  background:#29295F;color:#fff;font:600 15px/1 Assistant,system-ui,sans-serif;cursor:pointer;
  box-shadow:0 6px 20px rgba(41,41,95,.28);transition:transform .18s ease,box-shadow .18s ease}
.sa-launch:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(41,41,95,.34)}
.sa-launch:focus-visible{outline:3px solid #D4AF6C;outline-offset:3px}
.sa-launch svg{width:19px;height:19px;flex:none}

.sa-panel{position:fixed;inset-inline-end:20px;bottom:20px;z-index:99991;
  width:min(390px,calc(100vw - 40px));max-height:min(620px,calc(100vh - 40px));
  display:none;flex-direction:column;overflow:hidden;border-radius:18px;background:#fff;
  box-shadow:0 18px 50px rgba(0,0,0,.22);font-family:Assistant,system-ui,sans-serif;direction:rtl}
.sa-panel[data-open="1"]{display:flex}

.sa-head{display:flex;align-items:center;gap:10px;padding:15px 17px;background:#29295F;color:#fff}
.sa-head b{font-size:16px;font-weight:700}
.sa-head small{display:block;font-size:12px;opacity:.72;font-weight:400;margin-top:1px}
.sa-x{margin-inline-start:auto;background:none;border:0;color:#fff;font-size:24px;line-height:1;
  cursor:pointer;padding:0 4px;opacity:.8}
.sa-x:hover{opacity:1}

.sa-body{flex:1;overflow-y:auto;padding:16px;background:#F8F8F8;display:flex;flex-direction:column;gap:11px}

.sa-msg{max-width:88%;padding:11px 14px;border-radius:14px;font-size:15px;line-height:1.62;
  white-space:pre-wrap;word-break:break-word}
.sa-msg.me{align-self:flex-start;background:#29295F;color:#fff;border-bottom-right-radius:5px}
.sa-msg.bot{align-self:flex-end;background:#fff;color:#2C2C2C;border-bottom-left-radius:5px;
  border:1px solid #E7E7EF}
.sa-msg.err{background:#FDF0F0;border-color:#E9C6C6;color:#8A2B2B}

.sa-seeds{display:flex;flex-wrap:wrap;gap:7px;margin-top:2px}
.sa-seed{padding:8px 13px;border:1px solid #D9D9E4;border-radius:999px;background:#fff;
  font:500 13.5px Assistant,system-ui,sans-serif;color:#29295F;cursor:pointer;text-align:start}
.sa-seed:hover{border-color:#D4AF6C;background:#FFFDF8}

.sa-dots{align-self:flex-end;display:flex;gap:4px;padding:13px 15px;background:#fff;
  border:1px solid #E7E7EF;border-radius:14px}
.sa-dots i{width:6px;height:6px;border-radius:50%;background:#B9B9C9;animation:sa-b 1.15s infinite}
.sa-dots i:nth-child(2){animation-delay:.18s}
.sa-dots i:nth-child(3){animation-delay:.36s}
@keyframes sa-b{0%,60%,100%{opacity:.35;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}

.sa-foot{border-top:1px solid #E7E7EF;background:#fff;padding:11px 12px}
.sa-row{display:flex;gap:8px;align-items:flex-end}
.sa-in{flex:1;resize:none;max-height:104px;padding:10px 12px;border:1px solid #D9D9E4;border-radius:11px;
  font:15px/1.5 Assistant,system-ui,sans-serif;color:#2C2C2C}
.sa-in:focus{outline:none;border-color:#29295F;box-shadow:0 0 0 3px rgba(41,41,95,.1)}
.sa-go{flex:none;width:42px;height:42px;border:0;border-radius:11px;background:#29295F;color:#fff;
  cursor:pointer;display:grid;place-items:center}
.sa-go:disabled{opacity:.45;cursor:default}
.sa-go svg{width:18px;height:18px}

.sa-note{margin:9px 2px 0;font-size:11.5px;line-height:1.5;color:#77778A;text-align:center}

@media (max-width:560px){
  .sa-panel{inset-inline:10px;bottom:10px;width:auto;max-height:calc(100vh - 20px);border-radius:15px}
  .sa-launch{inset-inline-end:14px;bottom:14px;padding:11px 16px;font-size:14.5px}
}
/* Under 760px the site can raise a full-width sticky CTA bar (.sn-sticky.on).
   Lift out of its way only while it is actually showing. */
body:has(.sn-sticky.on) .sa-launch{bottom:76px}
body:has(.sn-sticky.on) .sa-panel{bottom:76px;max-height:calc(100vh - 96px)}
@media (prefers-reduced-motion:reduce){
  .sa-launch{transition:none}
  .sa-dots i{animation:none;opacity:.55}
}

/* The site's accessibility button (.sn-a11y-btn, 56px, z-index 99998) sits at
   the bottom of the viewport with a higher stacking order than this panel
   (99991). Measured on a 375px viewport with the panel open, it lands on
   301-357 x 738-794 and covers 52x10px of the right edge of the text input -
   in RTL, exactly where the caret starts. Shrinking it does not clear that:
   at 48px it still overlaps by 44x2.
   While the panel is open it is unreachable anyway, since the panel covers the
   screen on mobile, so it steps aside and returns the moment the panel closes. */
/* Scoped to the same breakpoint at which .sa-panel goes full-bleed. Measured
   at 1280px the button sits at 1191-1247 and the panel at 20-410, so there is
   nothing to dodge on desktop and hiding it there would remove an
   accessibility control for no reason. */
@media (max-width:560px){
  body:has(.sa-panel[data-open="1"]) .sn-a11y-btn{display:none}
}

/* Owner asked for a smaller button on phones. 48px keeps it above the 44px
   minimum touch target - going under that would defeat the button's own
   purpose - and it intrudes less on the content when the panel is closed. */
/* The a11y widget injects its own <style> later in the document than this
   stylesheet, so a plain .sn-a11y-btn rule loses on source order even though
   the specificity matches. Qualifying with body wins without !important. */
@media (max-width:560px){
  body .sn-a11y-btn{width:48px;height:48px}
  body .sn-a11y-btn svg{width:24px;height:24px}
}
