/* ScreenedTalent Assistant Widget — styles only, no demo scaffold */

/* Design tokens scoped to the widget container (avoids polluting :root) */
#st-chat {
  --bg-base:#F7F9FF; --bg-soft:#EEF2FE;
  --ink-900:#0B1437; --ink-700:#263057; --ink-500:#5C6891; --ink-300:#A4ADCB;
  --line:rgba(30,41,90,.08);
  --indigo:#5B5BF5; --violet:#8B5CF6; --teal:#14B8A6; --cyan:#22D3EE; --emerald:#10B981; --rose:#F472B6;
  --grad-primary:linear-gradient(135deg,#5B5BF5 0%,#8B5CF6 55%,#22D3EE 120%);
  --grad-primary-hover:linear-gradient(135deg,#4A4AE8 0%,#7B4DE8 55%,#18C3DD 120%);
  --shadow-sm:0 1px 2px rgba(11,20,55,.06),0 1px 1px rgba(11,20,55,.04);
  --shadow-md:0 6px 20px -6px rgba(11,20,55,.12),0 2px 4px rgba(11,20,55,.04);
  --shadow-lg:0 24px 48px -20px rgba(91,91,245,.28),0 8px 20px -10px rgba(139,92,246,.2);
  --shadow-glow:0 0 0 1px rgba(91,91,245,.12),0 20px 40px -12px rgba(91,91,245,.25);
  font-family:'Plus Jakarta Sans',-apple-system,BlinkMacSystemFont,sans-serif;
}

#st-chat, #st-chat * { box-sizing:border-box; }

#st-chat .stc-launcher{ position:fixed; right:24px; bottom:24px; z-index:9998;
  width:62px; height:62px; padding:0; border:none; cursor:pointer; border-radius:20px;
  background:var(--grad-primary); color:#fff; display:grid; place-items:center; isolation:isolate;
  box-shadow:0 16px 34px -10px rgba(91,91,245,.6), 0 6px 14px -6px rgba(139,92,246,.45), inset 0 1px 0 rgba(255,255,255,.3);
  transition:transform .4s cubic-bezier(.22,1,.36,1), box-shadow .3s ease, opacity .3s ease; }
#st-chat .stc-launcher:hover{ transform:translateY(-3px) scale(1.04); box-shadow:0 22px 44px -10px rgba(91,91,245,.7), 0 8px 18px -6px rgba(139,92,246,.5); }
#st-chat .stc-launcher:active{ transform:translateY(-1px) scale(.99); }
#st-chat .stc-launcher svg{ width:26px; height:26px; animation:stc-float 4s ease-in-out infinite; }
#st-chat .stc-launcher::after{ content:""; position:absolute; inset:-2px; z-index:-1; border-radius:22px;
  background:conic-gradient(from 0deg,#5B5BF5,#8B5CF6,#22D3EE,#14B8A6,#5B5BF5); filter:blur(9px); opacity:.45; animation:stc-spin 7s linear infinite; }
#st-chat .stc-launcher::before{ content:""; position:absolute; inset:0; border-radius:20px; border:2px solid rgba(91,91,245,.5); animation:stc-pulse-ring 2.6s ease-out infinite; }
#st-chat .stc-badge{ position:absolute; top:-4px; right:-4px; min-width:20px; height:20px; padding:0 5px; border-radius:10px;
  background:var(--rose); color:#fff; border:2.5px solid #F7F9FF; font-size:11px; font-weight:700; display:grid; place-items:center; z-index:1; box-shadow:0 4px 10px -3px rgba(244,114,182,.6); }
#st-chat.stc-open .stc-launcher{ opacity:0; transform:scale(.55) translateY(14px); pointer-events:none; }

#st-chat .stc-panel{ position:fixed; right:24px; bottom:24px; z-index:9999; width:392px; max-width:calc(100vw - 32px);
  height:min(640px, calc(100vh - 48px)); display:flex; flex-direction:column; overflow:hidden; isolation:isolate;
  background:rgba(255,255,255,.82); backdrop-filter:blur(28px) saturate(150%); -webkit-backdrop-filter:blur(28px) saturate(150%);
  border:1px solid rgba(255,255,255,.65); border-radius:24px; box-shadow:var(--shadow-lg), 0 0 0 1px rgba(91,91,245,.05);
  transform-origin:bottom right; opacity:0; transform:translateY(20px) scale(.96); pointer-events:none;
  transition:opacity .35s cubic-bezier(.22,1,.36,1), transform .42s cubic-bezier(.22,1,.36,1); }
#st-chat.stc-open .stc-panel{ opacity:1; transform:translateY(0) scale(1); pointer-events:auto; }
#st-chat .stc-panel::before{ content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:radial-gradient(ellipse 360px 220px at 12% -4%, rgba(91,91,245,.14), transparent 60%),
            radial-gradient(ellipse 320px 200px at 95% 2%, rgba(34,211,238,.12), transparent 60%); }
#st-chat.stc-no-anim .stc-panel{ transition:none !important; }

#st-chat .stc-head{ position:relative; flex-shrink:0; display:flex; align-items:center; gap:12px; padding:16px 14px 14px 16px;
  border-bottom:1px solid var(--line); background:linear-gradient(180deg, rgba(255,255,255,.72), rgba(255,255,255,.2)); }
#st-chat .stc-head::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px; background:var(--grad-primary); }
#st-chat .stc-ava{ position:relative; flex-shrink:0; width:42px; height:42px; border-radius:13px; background:var(--grad-primary); color:#fff;
  display:grid; place-items:center; box-shadow:0 8px 18px -7px rgba(91,91,245,.65), inset 0 1px 0 rgba(255,255,255,.3); }
#st-chat .stc-ava svg{ width:21px; height:21px; }
#st-chat .stc-ava .stc-on{ position:absolute; right:-3px; bottom:-3px; width:13px; height:13px; border-radius:50%; background:var(--emerald); border:2.5px solid #fff; animation:stc-pulse-dot 2.4s ease-out infinite; }
#st-chat .stc-meta{ min-width:0; }
#st-chat .stc-meta h4{ font-size:15px; font-weight:700; letter-spacing:-.015em; color:var(--ink-900); line-height:1.2; }
#st-chat .stc-meta p{ display:flex; align-items:center; gap:6px; margin-top:2px; font-size:12px; font-weight:500; color:var(--ink-500); }
#st-chat .stc-meta p .pip{ width:6px; height:6px; border-radius:50%; background:var(--emerald); }
#st-chat .stc-actions{ margin-left:auto; display:flex; align-items:center; gap:8px; }
#st-chat .stc-ctx{ display:none; align-items:center; gap:7px; padding:5px 11px 5px 9px; border-radius:100px;
  background:rgba(91,91,245,.08); border:1px solid var(--line); font-size:11.5px; font-weight:700; color:var(--ink-700); white-space:nowrap; }
#st-chat .stc-ctx.show{ display:inline-flex; }
#st-chat .stc-ctx i{ width:7px; height:7px; border-radius:50%; background:var(--aud,#5B5BF5); }
#st-chat .stc-icon-btn{ width:34px; height:34px; border:none; border-radius:10px; cursor:pointer; background:transparent; color:var(--ink-500); display:grid; place-items:center; transition:background .2s, color .2s; flex-shrink:0; }
#st-chat .stc-icon-btn:hover{ background:rgba(91,91,245,.08); color:var(--ink-900); }
#st-chat .stc-icon-btn svg{ width:18px; height:18px; }

#st-chat .stc-confirm{ flex-shrink:0; display:none; align-items:center; gap:10px; padding:11px 14px; border-bottom:1px solid var(--line);
  background:rgba(91,91,245,.06); animation:stc-drop .3s cubic-bezier(.22,1,.36,1) both; }
#st-chat .stc-confirm.show{ display:flex; }
#st-chat .stc-confirm-txt{ flex:1; min-width:0; font-size:12.5px; font-weight:600; color:var(--ink-700); line-height:1.35; }
#st-chat .stc-confirm-btns{ display:flex; gap:7px; flex-shrink:0; }
#st-chat .stc-confirm-yes,#st-chat .stc-confirm-no{ font-family:inherit; font-size:12.5px; font-weight:700; border-radius:9px; padding:7px 12px; cursor:pointer; border:1px solid transparent; transition:all .2s; white-space:nowrap; }
#st-chat .stc-confirm-yes{ color:#fff; background:var(--grad-primary); box-shadow:0 6px 14px -6px rgba(91,91,245,.55); }
#st-chat .stc-confirm-yes:hover{ background:var(--grad-primary-hover); transform:translateY(-1px); }
#st-chat .stc-confirm-no{ color:var(--ink-700); background:rgba(255,255,255,.7); border-color:var(--line); }
#st-chat .stc-confirm-no:hover{ border-color:rgba(91,91,245,.3); color:var(--indigo); }

#st-chat .stc-body{ flex:1; overflow-y:auto; overscroll-behavior:contain; padding:18px 16px 14px; display:flex; flex-direction:column; gap:14px;
  scrollbar-width:thin; scrollbar-color:rgba(91,91,245,.22) transparent; }
#st-chat .stc-body::-webkit-scrollbar{ width:7px; }
#st-chat .stc-body::-webkit-scrollbar-thumb{ background:rgba(91,91,245,.22); border-radius:10px; }
#st-chat .stc-msgs{ display:flex; flex-direction:column; gap:14px; }

#st-chat .stc-msg{ display:flex; gap:9px; align-items:flex-end; animation:stc-in .45s cubic-bezier(.22,1,.36,1) both; }
#st-chat .stc-msg.stc-user{ justify-content:flex-end; }
#st-chat .stc-m-ava{ width:28px; height:28px; border-radius:9px; flex-shrink:0; display:grid; place-items:center; font-size:11px; font-weight:700; }
#st-chat .stc-m-ava.bot{ background:var(--grad-primary); color:#fff; box-shadow:0 5px 12px -5px rgba(91,91,245,.6); }
#st-chat .stc-m-ava.bot svg{ width:15px; height:15px; }
#st-chat .stc-m-ava.user{ background:var(--bg-soft); color:var(--indigo); border:1px solid rgba(91,91,245,.22); }
#st-chat .stc-col{ display:flex; flex-direction:column; max-width:80%; }
#st-chat .stc-user .stc-col{ align-items:flex-end; }
#st-chat .stc-bubble{ padding:11px 14px; font-size:14.5px; line-height:1.5; border-radius:16px; overflow-wrap:anywhere; }
#st-chat .stc-bot .stc-bubble{ background:#fff; color:var(--ink-700); border:1px solid var(--line); box-shadow:var(--shadow-sm); border-bottom-left-radius:6px; }
#st-chat .stc-bot .stc-bubble strong{ color:var(--ink-900); font-weight:700; }
#st-chat .stc-user .stc-bubble{ background:var(--grad-primary); color:#fff; border-bottom-right-radius:6px; box-shadow:0 10px 22px -10px rgba(91,91,245,.6); }
#st-chat .stc-time{ font-size:11px; color:var(--ink-300); margin-top:5px; padding:0 4px; font-weight:500; }

#st-chat .stc-sys{ align-self:center; max-width:90%; text-align:center; font-size:12px; font-weight:500; color:var(--ink-500);
  background:rgba(91,91,245,.06); border:1px solid var(--line); padding:7px 14px; border-radius:100px; animation:stc-in .45s cubic-bezier(.22,1,.36,1) both; }

#st-chat .stc-typing .stc-bubble{ display:inline-flex; gap:5px; align-items:center; padding:14px 16px; }
#st-chat .stc-typing .dot{ width:7px; height:7px; border-radius:50%; background:var(--ink-300); animation:stc-bounce 1.3s ease-in-out infinite; }
#st-chat .stc-typing .dot:nth-child(2){ animation-delay:.18s; }
#st-chat .stc-typing .dot:nth-child(3){ animation-delay:.36s; }

#st-chat .stc-zone{ display:flex; flex-direction:column; gap:10px; }
#st-chat .stc-zone:empty{ display:none; }
#st-chat .stc-zone-label{ font-size:12px; font-weight:600; color:var(--ink-500); padding-left:37px; }
#st-chat .stc-quick{ display:flex; flex-wrap:wrap; gap:8px; padding-left:37px; }
#st-chat .stc-chip{ display:inline-flex; align-items:center; gap:7px; padding:8px 13px; border-radius:100px; cursor:pointer; font-family:inherit;
  font-size:12.5px; font-weight:500; color:var(--ink-700); background:rgba(255,255,255,.7); border:1px solid var(--line);
  backdrop-filter:blur(8px); transition:all .2s ease; animation:stc-in .4s both; }
#st-chat .stc-chip:hover{ background:#fff; border-color:rgba(91,91,245,.3); color:var(--indigo); transform:translateY(-1px); box-shadow:0 5px 12px -4px rgba(91,91,245,.18); }
#st-chat .stc-chip .cd{ width:7px; height:7px; border-radius:50%; background:var(--cd,#5B5BF5); }

#st-chat .stc-route{ display:flex; flex-direction:column; gap:9px; padding-left:37px; animation:stc-in .4s both; }
#st-chat .stc-go{ display:inline-flex; align-items:center; justify-content:center; gap:8px; width:100%; padding:12px 16px; border-radius:12px;
  border:none; cursor:pointer; font-family:inherit; font-size:14px; font-weight:700; color:#fff; background:var(--grad-primary);
  box-shadow:0 10px 22px -8px rgba(91,91,245,.55), inset 0 1px 0 rgba(255,255,255,.25); transition:transform .2s, box-shadow .2s, background .2s; position:relative; overflow:hidden; }
#st-chat .stc-go:hover{ transform:translateY(-1px); background:var(--grad-primary-hover); box-shadow:0 14px 26px -8px rgba(91,91,245,.65); }
#st-chat .stc-go::after{ content:""; position:absolute; top:0; left:-100%; width:100%; height:100%; background:linear-gradient(90deg,transparent,rgba(255,255,255,.28),transparent); transition:left .6s; }
#st-chat .stc-go:hover::after{ left:100%; }
#st-chat .stc-go svg{ width:15px; height:15px; transition:transform .25s; }
#st-chat .stc-go:hover svg{ transform:translateX(3px); }
#st-chat .stc-alt{ align-self:flex-start; background:none; border:none; cursor:pointer; font-family:inherit; font-size:12.5px; font-weight:600; color:var(--ink-500); padding:2px 4px; transition:color .2s; }
#st-chat .stc-alt:hover{ color:var(--indigo); }

#st-chat .stc-foot{ flex-shrink:0; padding:12px 14px 10px; border-top:1px solid var(--line); background:linear-gradient(0deg, rgba(255,255,255,.7), rgba(255,255,255,.15)); }
#st-chat .stc-input{ position:relative; display:flex; align-items:flex-end; gap:8px; background:#fff; border:1px solid rgba(91,91,245,.16); border-radius:16px;
  padding:6px 6px 6px 14px; box-shadow:var(--shadow-sm); transition:border-color .25s ease, box-shadow .25s ease; }
#st-chat .stc-input::before{ content:""; position:absolute; inset:-3px; z-index:-1; border-radius:18px;
  background:linear-gradient(135deg,#5B5BF5,#8B5CF6,#22D3EE,#5B5BF5); background-size:300% 300%; filter:blur(10px); opacity:0; transition:opacity .3s ease; animation:stc-aura 6s ease-in-out infinite; }
#st-chat .stc-input:focus-within{ border-color:rgba(91,91,245,.4); box-shadow:0 0 0 4px rgba(91,91,245,.08), var(--shadow-md); }
#st-chat .stc-input:focus-within::before{ opacity:.5; }
#st-chat .stc-spark{ flex-shrink:0; color:var(--ink-300); margin-bottom:9px; display:flex; transition:color .25s ease; }
#st-chat .stc-input:focus-within .stc-spark{ color:var(--indigo); }
#st-chat .stc-spark svg{ width:17px; height:17px; }
#st-chat .stc-ta{ flex:1; border:none; outline:none; resize:none; min-width:0; font-family:inherit; font-size:14.5px; line-height:1.45; color:var(--ink-900); background:transparent; padding:9px 0; max-height:120px; }
#st-chat .stc-ta::placeholder{ color:var(--ink-300); }
#st-chat .stc-send{ flex-shrink:0; width:38px; height:38px; border:none; border-radius:12px; cursor:pointer; background:var(--grad-primary); color:#fff;
  display:grid; place-items:center; box-shadow:0 6px 14px -4px rgba(91,91,245,.5); transition:transform .2s ease, box-shadow .2s ease, opacity .2s ease, background .2s ease; }
#st-chat .stc-send:hover{ transform:translateY(-1px); background:var(--grad-primary-hover); box-shadow:0 9px 18px -5px rgba(91,91,245,.6); }
#st-chat .stc-send:disabled{ opacity:.4; cursor:default; box-shadow:none; transform:none; filter:grayscale(.3); }
#st-chat .stc-send svg{ width:16px; height:16px; }
#st-chat .stc-note{ text-align:center; margin-top:9px; font-size:11px; color:var(--ink-300); font-weight:500; display:flex; align-items:center; justify-content:center; gap:5px; }
#st-chat .stc-note svg{ width:11px; height:11px; opacity:.7; }

@keyframes stc-in{ from{ opacity:0; transform:translateY(8px) scale(.98); } to{ opacity:1; transform:none; } }
@keyframes stc-drop{ from{ opacity:0; transform:translateY(-8px); } to{ opacity:1; transform:none; } }
@keyframes stc-float{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-2px); } }
@keyframes stc-spin{ to{ transform:rotate(360deg); } }
@keyframes stc-aura{ 0%,100%{ background-position:0% 50%; } 50%{ background-position:100% 50%; } }
@keyframes stc-bounce{ 0%,60%,100%{ transform:translateY(0); opacity:.45; } 30%{ transform:translateY(-5px); opacity:1; } }
@keyframes stc-pulse-ring{ 0%{ transform:scale(1); opacity:.7; } 100%{ transform:scale(1.55); opacity:0; } }
@keyframes stc-pulse-dot{ 0%{ box-shadow:0 0 0 0 rgba(16,185,129,.5); } 70%{ box-shadow:0 0 0 6px rgba(16,185,129,0); } 100%{ box-shadow:0 0 0 0 rgba(16,185,129,0); } }

@media (max-width:480px){
  #st-chat .stc-panel{ right:0; bottom:0; width:100vw; max-width:100vw; height:100dvh; max-height:100dvh; border-radius:0; }
  #st-chat .stc-launcher{ right:16px; bottom:16px; }
}
@media (prefers-reduced-motion:reduce){ #st-chat *{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; } }

/* ─── Candidate preview card in chat ─── */
#st-chat .stc-col-card{ max-width:96%; }
#st-chat .stc-col-card .stc-bubble{ padding:0; background:transparent !important; border:none !important; box-shadow:none !important; }

#st-chat .stc-cand-card{
  background:linear-gradient(135deg, rgba(91,91,245,.05) 0%, rgba(139,92,246,.04) 100%);
  border:1px solid rgba(91,91,245,.15);
  border-radius:14px;
  padding:13px 13px 11px;
  animation:stc-in .45s cubic-bezier(.22,1,.36,1) both;
}
#st-chat .stc-cand-top{ display:flex; align-items:center; gap:10px; margin-bottom:9px; }
#st-chat .stc-cand-ava{
  width:40px; height:40px; border-radius:11px; flex-shrink:0;
  background:linear-gradient(135deg,#5B5BF5,#8B5CF6); color:#fff;
  font-size:12px; font-weight:800; letter-spacing:.03em;
  display:grid; place-items:center;
  box-shadow:0 6px 14px -6px rgba(91,91,245,.5);
}
#st-chat .stc-cand-meta{ flex:1; min-width:0; }
#st-chat .stc-cand-role{ font-size:13px; font-weight:700; color:var(--ink-900); line-height:1.3; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#st-chat .stc-cand-sub{ display:flex; align-items:center; flex-wrap:wrap; gap:5px; margin-top:4px; font-size:11px; color:var(--ink-500); font-weight:500; }
#st-chat .stc-cand-tier{
  display:inline-flex; align-items:center; gap:3px;
  padding:2px 7px; border-radius:100px;
  font-size:10.5px; font-weight:700;
  background:linear-gradient(135deg,#6366F1,#8B5CF6); color:#fff;
}
#st-chat .stc-cand-match{
  flex-shrink:0; font-size:12px; font-weight:800; color:var(--indigo);
  background:rgba(91,91,245,.1); padding:3px 8px; border-radius:100px;
}
#st-chat .stc-cand-skills{ display:flex; flex-wrap:wrap; gap:4px; margin-bottom:9px; }
#st-chat .stc-cand-skills span{
  font-size:11px; font-weight:600; color:var(--ink-700);
  background:rgba(91,91,245,.07); border:1px solid rgba(91,91,245,.12);
  padding:2px 8px; border-radius:100px;
}
#st-chat .stc-cand-avail{
  display:flex; align-items:center; gap:5px;
  font-size:11.5px; font-weight:600; color:var(--emerald); margin-bottom:11px;
}
#st-chat .stc-cand-avail::before{ content:""; width:7px; height:7px; border-radius:50%; background:var(--emerald); flex-shrink:0; }
#st-chat .stc-explore-btn{
  display:flex; align-items:center; justify-content:center; gap:7px;
  width:100%; padding:10px 14px; border:none; border-radius:10px;
  cursor:pointer; font-family:inherit; font-size:13px; font-weight:700; color:#fff;
  background:linear-gradient(135deg,#5B5BF5 0%,#8B5CF6 100%);
  box-shadow:0 8px 18px -8px rgba(91,91,245,.6);
  transition:transform .2s ease, box-shadow .2s ease;
}
#st-chat .stc-explore-btn:hover{ transform:translateY(-1px); box-shadow:0 12px 24px -8px rgba(91,91,245,.7); }
