/* ==========================================================================
   Nodi — customer assistant (dtftransfers.com)
   Visual parity with the reseller Nodi on sell.dtftransfers.com:
   logo avatar + green presence dot, "New chat" / expand / collapse header
   controls, cart status strip, soft white bubbles with avatar, footer with
   quick-actions + paperclip attach + pill input + round send.
   ========================================================================== */

/* round chat bubble launcher (parity with logged-in sell Nodi); while the
   panel is open it stays put and flips to a down-chevron = minimize */
.nodi-launcher{
  position:fixed;right:20px;bottom:20px;z-index:9992;
  width:58px;height:58px;border-radius:50%;padding:0;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,#FF8A2B 0%,#FF394C 100%);color:#fff;border:0;cursor:pointer;
  box-shadow:0 10px 26px -9px rgba(255,105,40,0.6);
  transition:background .15s ease, transform .15s ease;
}
.nodi-launcher:hover{background:linear-gradient(135deg,#FF8A2B 0%,#FF394C 100%);filter:brightness(1.06);transform:translateY(-1px);}
.nodi-launcher svg{width:26px;height:26px;}
.nodi-launcher__min{display:none;}
body.nodi-open .nodi-launcher__chat{display:none;}
body.nodi-open .nodi-launcher__min{display:block;}

/* circle-cropped brand mark (left edge of the wordmark SVG) */
.nodi-ava{
  border-radius:50%;overflow:hidden;flex:0 0 auto;display:block;background:#fff;
  object-fit:cover;object-position:left center;
}

.nodi-panel{
  position:fixed;right:20px;bottom:92px;z-index:9991;
  width:min(500px, calc(100vw - 40px));height:min(680px, calc(100vh - 70px));
  display:none;flex-direction:column;overflow:hidden;
  background:#fff;border:1px solid #E9EEF4;border-radius:18px;
  box-shadow:0 24px 64px -12px rgba(13,20,34,.28);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Inter",Roboto,Helvetica,Arial,sans-serif;
  color:#0D1422;
  transition:width .18s ease;
}
body.nodi-open .nodi-panel{display:flex;}
.nodi-panel.is-max{width:min(760px, calc(100vw - 40px));height:calc(100vh - 110px);}

/* ---------- header ---------- */
.nodi-head{
  position:relative;display:flex;align-items:center;gap:12px;
  padding:14px 16px;flex:0 0 auto;background:#fff;
}
.nodi-head .nodi-ava{width:46px;height:46px;}
.nodi-head__titles{min-width:0;flex:1;}
.nodi-head__name{
  display:flex;align-items:center;gap:7px;
  font-size:19px;font-weight:800;color:#0D1422;line-height:1.1;
}
.nodi-head__dot{width:8px;height:8px;border-radius:50%;background:#22C55E;flex:0 0 auto;}
.nodi-head__sub{font-size:14px;color:#8A94A6;margin-top:2px;line-height:1.25;}
/* squared, like the sell-side header */
.nodi-head__newchat{
  display:inline-flex;align-items:center;gap:8px;flex:0 0 auto;
  background:#fff;border:1px solid #E1E7EF;border-radius:10px;cursor:pointer;
  padding:10px 15px;font-size:14px;font-weight:700;color:#0D1422;
}
.nodi-head__newchat:hover{border-color:#C9D6E4;background:#F7F9FC;}
.nodi-head__newchat svg{width:14px;height:14px;}
.nodi-icn{
  background:none;border:0;cursor:pointer;color:#5B6472;
  padding:7px;border-radius:8px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;
}
.nodi-icn:hover{color:#0D1422;background:#F1F4F8;}
.nodi-icn svg{width:19px;height:19px;}
.nodi-icn[data-nodi-close] svg{width:21px;height:21px;}

/* ---------- cart strip ---------- */
.nodi-cartbar{
  flex:0 0 auto;display:flex;align-items:center;gap:10px;
  background:#E8F1FA;color:#8A99AB;font-size:14.5px;font-weight:600;
  padding:11px 18px;
}
.nodi-cartbar.has-items{color:#0D1422;}
.nodi-cartbar__link{
  margin-left:auto;color:#D9481A !important;font-weight:700;font-size:13.5px;
  text-decoration:none !important;display:none;flex:0 0 auto;
}
.nodi-cartbar__link:hover{text-decoration:underline !important;}
.nodi-cartbar.has-items .nodi-cartbar__link{display:inline;}
.nodi-cartbar svg{width:16px;height:16px;flex:0 0 auto;}

/* ---------- body ---------- */
.nodi-body{
  flex:1 1 auto;overflow-y:auto;padding:18px 16px 10px;
  display:flex;flex-direction:column;gap:12px;background:#F7F9FC;
  scroll-behavior:smooth;
}
.nodi-row{display:flex;align-items:flex-end;gap:8px;max-width:92%;align-self:flex-start;}
.nodi-row .nodi-ava{width:28px;height:28px;margin-bottom:2px;}
.nodi-msg{font-size:15px;line-height:1.55;}
.nodi-msg--bot{
  background:#fff;border-radius:16px;padding:14px 17px;color:#0D1422;
  box-shadow:0 1px 2px rgba(13,20,34,.06);border:1px solid #EEF2F7;
}
.nodi-msg--bot b,.nodi-msg--bot strong{font-weight:700;}
.nodi-msg--bot a{color:#D9481A;font-weight:700;text-decoration:underline;}
.nodi-msg--user{
  align-self:flex-end;background:#FF394C;color:#fff;max-width:86%;
  border-radius:16px 16px 4px 16px;padding:11px 15px;font-weight:500;
}

/* reseller pitch card */
.nodi-card{
  align-self:stretch;background:#fff;border:1px solid #EEF2F7;border-radius:16px;
  box-shadow:0 1px 2px rgba(13,20,34,.06);
  padding:16px;display:flex;flex-direction:column;gap:8px;
}
.nodi-card__eyebrow{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:11.5px;font-weight:700;letter-spacing:.16em;color:#D9481A;text-transform:uppercase;
}
.nodi-card__title{font-size:16.5px;font-weight:800;color:#0D1422;line-height:1.25;}
.nodi-card__sub{font-size:13.5px;color:#8A94A6;line-height:1.5;}
.nodi-card__cta{
  display:inline-flex;align-items:center;justify-content:center;margin-top:4px;
  background:linear-gradient(135deg,#FF8A2B 0%,#FF394C 100%);color:#fff !important;border-radius:10px;padding:11px 16px;
  font-size:13.5px;font-weight:700;letter-spacing:.04em;text-decoration:none !important;
  transition:filter .15s ease, transform .15s ease;
}
.nodi-card__cta:hover{filter:brightness(1.06);transform:translateY(-1px);}

/* in-chat upload card (order flows; the paperclip attaches anytime) */
.nodi-upload{
  align-self:stretch;background:#fff;border:1.5px dashed #C7D3E0;border-radius:16px;
  padding:16px;display:flex;align-items:center;gap:12px;cursor:pointer;
  transition:border-color .15s ease, background .15s ease;
}
.nodi-upload:hover,.nodi-upload.is-drag{border-color:#D9481A;background:#F3F8FD;}
.nodi-upload__icon{
  width:36px;height:36px;border-radius:50%;background:#FFF6EF;flex:0 0 auto;
  display:flex;align-items:center;justify-content:center;
}
.nodi-upload__icon svg{width:19px;height:19px;}
.nodi-upload__text{min-width:0;flex:1;}
.nodi-upload__title{font-size:14px;font-weight:800;color:#0D1422;line-height:1.3;}
.nodi-upload__sub{font-size:12px;color:#8A94A6;margin-top:1px;}
.nodi-upload__btn{
  flex:0 0 auto;background:#FF394C;color:#fff;border-radius:10px;
  padding:9px 16px;font-size:13px;font-weight:700;
}

.nodi-chips{display:flex;flex-wrap:wrap;gap:8px;align-self:flex-start;max-width:100%;}
.nodi-chip{
  background:#fff;border:1px solid #C9D6E4;border-radius:999px;cursor:pointer;
  padding:9px 15px;font-size:13.5px;font-weight:700;color:#D9481A;
  transition:border-color .12s ease, background .12s ease;
}
.nodi-chip:hover{border-color:#D9481A;background:#F3F8FD;}

.nodi-typing{align-self:flex-start;color:#8A94A6;font-size:12.5px;padding:2px 6px;}

/* ---------- footer ---------- */
.nodi-foot{
  flex:0 0 auto;display:flex;align-items:center;gap:10px;padding:14px;
  border-top:1px solid #EEF2F7;background:#fff;
}
.nodi-foot__tool{
  flex:0 0 auto;width:48px;height:48px;border-radius:14px;cursor:pointer;
  background:#fff;border:1px solid #E1E7EF;color:#D9481A;
  display:flex;align-items:center;justify-content:center;
}
.nodi-foot__tool:hover{border-color:#D9481A;background:#F3F8FD;}
.nodi-foot__tool svg{width:20px;height:20px;}
.nodi-foot input{
  flex:1;border:1px solid #E1E7EF;border-radius:999px;padding:13px 18px;
  font:500 15px/1.3 inherit;color:#0D1422;outline:none;min-width:0;background:#fff;
}
.nodi-foot input::placeholder{color:#9AA6B5;}
.nodi-foot input:focus{border-color:#D9481A;}
.nodi-foot__send{
  flex:0 0 auto;width:50px;height:50px;border-radius:50%;border:0;cursor:pointer;
  background:linear-gradient(135deg,#FF8A2B 0%,#FF394C 100%);color:#fff;display:flex;align-items:center;justify-content:center;
  transition:filter .15s ease;
}
.nodi-foot__send:hover{filter:brightness(1.06);}
.nodi-foot__send svg{width:20px;height:20px;margin-left:-2px;}

/* highlight pulse for "show me" page actions */
.nodi-highlight{
  outline:3px solid rgba(255, 57, 76,.75) !important;outline-offset:4px;
  border-radius:6px;
  animation:nodiPulse 1.6s ease 2;
}
@keyframes nodiPulse{
  0%{outline-color:rgba(255, 57, 76,.85);}
  50%{outline-color:rgba(255, 57, 76,.15);}
  100%{outline-color:rgba(255, 57, 76,.85);}
}

@media (max-width:759px){
  .nodi-launcher{bottom:calc(16px + env(safe-area-inset-bottom,0px));right:14px;}
  body.nodi-open .nodi-launcher{display:none;}
  .nodi-panel,.nodi-panel.is-max{
    right:0;left:0;bottom:0;width:100vw;height:min(88vh, 720px);
    border-radius:18px 18px 0 0;border-left:0;border-right:0;border-bottom:0;
  }
  .nodi-head__newchat span{display:none;}
  .nodi-head__newchat{padding:9px 11px;}
}

/* pending attachment bar (file stays attached until the user sends) */
.nodi-attachbar{
  flex:0 0 auto;display:none;align-items:center;gap:10px;
  padding:10px 14px 0;background:#fff;
}
.nodi-attachbar.has-file{display:flex;}
.nodi-attach-chip{
  display:flex;align-items:center;gap:10px;max-width:100%;
  background:#F3F8FD;border:1px solid #C9DDF0;border-radius:12px;padding:8px 10px;
}
.nodi-attach-chip img{width:34px;height:34px;border-radius:8px;object-fit:cover;background:#fff;flex:0 0 auto;}
.nodi-attach-chip__icon{width:34px;height:34px;border-radius:8px;background:#FFF6EF;display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.nodi-attach-chip__icon svg{width:18px;height:18px;}
.nodi-attach-chip__name{font-size:13px;font-weight:700;color:#0D1422;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;}
.nodi-attach-chip__x{background:none;border:0;cursor:pointer;color:#8A94A6;font-size:16px;line-height:1;padding:4px;flex:0 0 auto;}
.nodi-attach-chip__x:hover{color:#0D1422;}

/* quick-actions popover (⊞) */
.nodi-quickmenu{
  position:absolute;left:14px;bottom:76px;z-index:5;display:none;
  background:#fff;border:1px solid #E6EBF2;border-radius:14px;
  box-shadow:0 16px 40px -8px rgba(13,20,34,.25);
  padding:8px;min-width:220px;flex-direction:column;gap:2px;
}
.nodi-quickmenu.is-open{display:flex;}
.nodi-quickmenu button{
  display:flex;align-items:center;gap:10px;background:none;border:0;cursor:pointer;
  padding:11px 12px;border-radius:10px;font:600 14px/1.2 inherit;color:#0D1422;text-align:left;
}
.nodi-quickmenu button:hover{background:#F3F8FD;color:#D9481A;}
.nodi-quickmenu button svg{width:16px;height:16px;color:#D9481A;flex:0 0 auto;}

/* ---------- in-chat prep/loading animation ---------- */
.nodi-prep{position:relative;display:block;border-radius:10px;overflow:hidden;}
.nodi-prep img{display:block;width:100%;border-radius:10px;
  background:repeating-conic-gradient(#eceff3 0 25%,#fff 0 50%) 0 0/16px 16px;}
.nodi-prep.is-loading{
  min-height:150px;min-width:240px;width:240px;background:#F7F9FC;
  border:1px solid #EEF2F7;
}
.nodi-prep.is-loading img{opacity:0;min-height:150px;}
.nodi-prep__veil{
  position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  background:rgba(255,255,255,.55);backdrop-filter:blur(1px);
}
.nodi-prep.is-loading .nodi-prep__veil{display:flex;}
/* 3-dot loader while the (edited) render is on its way */
.nodi-prep__dots{
  background:#fff;border-radius:999px;padding:10px 14px;
  box-shadow:0 2px 6px rgba(13,20,34,.14);
}
.nodi-prep__dots i{width:8px;height:8px;}
.nodi-prep__label{
  font-size:12.5px;font-weight:700;color:#D9481A;letter-spacing:.02em;
  background:#fff;border-radius:999px;padding:4px 12px;box-shadow:0 1px 3px rgba(13,20,34,.12);
}

/* animated "working" dots bubble (staging an upload) */
.nodi-working{
  align-self:flex-start;display:flex;align-items:center;gap:10px;
  background:#fff;border:1px solid #EEF2F7;border-radius:16px;padding:13px 16px;
  box-shadow:0 1px 2px rgba(13,20,34,.06);font-size:14.5px;color:#0D1422;font-weight:600;
}
.nodi-working__dots{display:inline-flex;gap:4px;}
.nodi-working__dots i{
  width:6px;height:6px;border-radius:50%;background:#FF394C;display:block;
  animation:nodiBounce 1s ease-in-out infinite;
}
.nodi-working__dots i:nth-child(2){animation-delay:.15s;}
.nodi-working__dots i:nth-child(3){animation-delay:.3s;}
@keyframes nodiBounce{0%,60%,100%{transform:translateY(0);opacity:.45}30%{transform:translateY(-4px);opacity:1}}

/* New-chat confirm popover (anchored under the header button) */
.nodi-newpop{
  position:absolute;top:calc(100% - 6px);right:14px;z-index:6;display:none;
  width:min(330px, calc(100% - 28px));
  background:#fff;border:1px solid #E6EBF2;border-radius:14px;
  box-shadow:0 18px 44px -10px rgba(13,20,34,.30);padding:16px;
}
.nodi-newpop.is-open{display:block;}
.nodi-newpop__title{font-size:17px;font-weight:800;color:#0D1422;margin-bottom:6px;}
.nodi-newpop__body{font-size:14px;color:#5B6472;line-height:1.45;margin-bottom:14px;}
.nodi-newpop__row{display:flex;gap:10px;}
.nodi-newpop__go,.nodi-newpop__cancel{
  flex:1;border-radius:10px;cursor:pointer;padding:12px 14px;
  font:700 14.5px/1 inherit;
}
.nodi-newpop__go{background:#FF394C;color:#fff;border:0;}
.nodi-newpop__go:hover{background:#D9481A;}
.nodi-newpop__cancel{background:#fff;color:#0D1422;border:1px solid #E1E7EF;}
.nodi-newpop__cancel:hover{border-color:#C9D6E4;background:#F7F9FC;}