/* ========== AI ASSISTANT ========== */

/* Chat messages */
.signal-messages{padding:12px;display:flex;flex-direction:column;gap:10px;
  overflow-y:auto;flex:1;min-height:0}
.signal-msg{max-width:90%;padding:10px 12px;border-radius:6px;font-size:11px;line-height:1.6}
.signal-msg.assistant{background:rgba(0,255,136,0.06);border:1px solid rgba(0,255,136,0.15);
  align-self:flex-start;color:var(--text)}
.signal-msg.user{background:rgba(0,212,255,0.06);border:1px solid rgba(0,212,255,0.15);
  align-self:flex-end;color:var(--text)}
.signal-msg .msg-role{font-family:var(--font-display);font-size:8px;letter-spacing:1.5px;
  color:var(--text-dim);margin-bottom:4px}
.signal-msg.assistant .msg-role{color:var(--green)}
.signal-msg.user .msg-role{color:var(--cyan)}

/* Markdown in messages */
.signal-msg strong{color:var(--text-bright)}
.signal-msg code{background:rgba(255,255,255,0.06);padding:1px 4px;border-radius:2px;font-size:10px}
.signal-msg ul,.signal-msg ol{margin:4px 0;padding-left:16px}
.signal-msg li{margin:2px 0}

/* Investigation log — each tool call is an instrument line */
.signal-tool{display:flex;align-items:baseline;gap:7px;padding:3px 8px;margin:3px 0;
  background:rgba(170,68,255,0.05);border:1px solid rgba(170,68,255,0.12);
  border-radius:3px;font-size:9px;color:var(--purple);font-variant-numeric:tabular-nums}
.signal-tool.done{border-color:rgba(0,255,136,0.12);color:var(--green);background:rgba(0,255,136,0.03)}
.signal-tool.done.err{border-color:rgba(255,51,102,0.2);color:var(--pink);background:rgba(255,51,102,0.04)}
.signal-tool-icon{font-size:10px;animation:tool-spin 1s linear infinite;flex-shrink:0}
.signal-tool.done .signal-tool-icon{animation:none}
.signal-tool-name{font-family:'Orbitron',monospace;letter-spacing:1.2px;font-size:8px;flex-shrink:0}
.signal-tool-args{color:var(--text-dim);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  min-width:0;flex:1}
.signal-tool-time{margin-left:auto;color:var(--text-dim);font-size:8px;flex-shrink:0}
@keyframes tool-spin{to{transform:rotate(360deg)}}

/* Evidence capture chips */
.signal-evidence{margin:6px 0;border:1px solid rgba(0,255,136,0.2);border-radius:4px;
  overflow:hidden;background:rgba(0,0,0,0.3)}
.signal-evidence img{width:100%;display:block;opacity:0.9}
.signal-evidence-cap{font-family:'Orbitron',monospace;font-size:7px;letter-spacing:1.2px;
  color:var(--green);padding:5px 8px;border-top:1px solid rgba(0,255,136,0.15)}

/* Input bar */
/* Links in transcript messages. Without this they render as default browser
   blue, which is unreadable on the dark panel. */
.signal-messages a{color:var(--cyan);text-decoration:underline;text-underline-offset:2px}
.signal-messages a:hover{color:var(--green)}

/* Free-allowance readout — sits between the transcript and the input bar,
   visible only while the shared analyst is actually serving this visitor. */
.signal-quota{flex-shrink:0;padding:4px 12px 0;font-family:var(--font-mono);font-size:9px;
  letter-spacing:1px;color:var(--text-dim);text-transform:uppercase;
  font-variant-numeric:tabular-nums;text-align:right}
.signal-quota[hidden]{display:none}
.signal-quota--low{color:var(--fireball)}

.signal-input-bar{display:flex;gap:6px;padding:8px 12px;border-top:1px solid var(--border);flex-shrink:0}
.signal-input{flex:1;background:rgba(255,255,255,0.04);border:1px solid var(--border);
  border-radius:4px;color:var(--text);padding:8px 10px;outline:none;resize:none;
  font-family:var(--font-mono);font-size:11px;min-height:36px;max-height:120px}
.signal-input:focus{border-color:var(--green)}
.signal-input::placeholder{color:var(--text-dim)}
.signal-send{padding:8px 14px;background:rgba(0,255,136,0.1);border:1px solid var(--green);
  border-radius:4px;color:var(--green);cursor:pointer;font-family:var(--font-display);
  font-size:10px;letter-spacing:1px;transition:background-color .15s,color .15s;flex-shrink:0}
.signal-send:hover{background:var(--green);color:var(--bg)}
.signal-send:disabled{opacity:0.4;cursor:not-allowed}

/* Settings */
.signal-settings{padding:12px;display:flex;flex-direction:column;gap:8px}
.signal-settings label{font-family:var(--font-display);font-size:9px;letter-spacing:1px;color:var(--text-dim)}
.signal-settings input,.signal-settings select{width:100%;background:rgba(255,255,255,0.04);
  border:1px solid var(--border);border-radius:3px;color:var(--text);padding:6px 8px;outline:none}
.signal-settings input:focus,.signal-settings select:focus{border-color:var(--green)}
.signal-settings-actions{display:flex;gap:6px;margin-top:4px}

/* Settings gear button */
.signal-gear{position:absolute;top:8px;right:8px;width:24px;height:24px;
  background:none;border:1px solid var(--border);border-radius:3px;color:var(--text-dim);
  cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;
  transition:color .15s,border-color .15s;z-index:1}
.signal-gear:hover{color:var(--text);border-color:var(--border-bright)}
/* Points at the gear right after the onboarding message names it. */
.signal-gear--pulse{color:var(--green);border-color:var(--green);animation:signal-gear-pulse 1.4s ease-in-out infinite}
@keyframes signal-gear-pulse{0%,100%{box-shadow:0 0 0 0 rgba(0,255,136,0.45)}50%{box-shadow:0 0 0 6px rgba(0,255,136,0)}}
@media (prefers-reduced-motion:reduce){.signal-gear--pulse{animation:none}}

/* AI toggle button in header — green because SIGNAL is the primary assistant */
#ai-toggle{padding:4px 12px;border:1px solid var(--border);border-radius:3px;
  background:rgba(255,255,255,0.03);color:var(--text-dim);cursor:pointer;
  font-family:var(--font-display);font-size:10px;letter-spacing:1px;
  transition:color .15s,border-color .15s,background-color .15s;margin-left:auto}
#ai-toggle.active{border-color:var(--green);color:var(--green);background:rgba(0,255,136,0.06)}

/* Streaming cursor */
.signal-cursor{display:inline-block;width:6px;height:14px;background:var(--green);
  animation:cursor-blink 0.8s step-end infinite;vertical-align:text-bottom;margin-left:2px}
@keyframes cursor-blink{50%{opacity:0}}

/* Chart containers */
.signal-msg.chart{padding:8px;background:rgba(0,255,136,0.02);border:1px solid var(--border);border-radius:4px;margin:6px 0;cursor:pointer;transition:border-color .15s}
.signal-msg.chart:hover{border-color:var(--green)}
.signal-msg.chart::after{content:'CLICK TO EXPAND';display:block;text-align:center;font-family:var(--font-display);
  font-size:7px;letter-spacing:1.5px;color:var(--text-dim);margin-top:4px;opacity:0;transition:opacity .15s}
.signal-msg.chart:hover::after{opacity:1}
.signal-msg.chart svg{display:block}

/* Chart modal overlay */
.signal-chart-modal{position:fixed;top:0;left:0;width:100%;height:100%;z-index:10000;
  background:rgba(5,6,15,0.92);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s;pointer-events:none}
.signal-chart-modal.open{opacity:1;pointer-events:all}
.signal-chart-modal-inner{width:90vw;max-width:900px;max-height:85vh;padding:24px;
  background:var(--surface-solid);border:1px solid var(--border-bright);border-radius:8px;
  box-shadow:0 4px 16px rgba(0,0,0,0.6);position:relative}
.signal-chart-modal-close{position:absolute;top:8px;right:12px;background:none;border:1px solid var(--border);
  border-radius:3px;color:var(--text-dim);cursor:pointer;font-size:18px;width:28px;height:28px;
  display:flex;align-items:center;justify-content:center;transition:color .15s,border-color .15s}
.signal-chart-modal-close:hover{color:var(--text);border-color:var(--border-bright)}
.signal-chart-modal-inner svg{display:block;width:100%;height:auto}

/* Typing indicator */
.signal-typing{display:flex;align-items:center;gap:6px;padding:8px 12px;color:var(--text-dim);font-size:10px;letter-spacing:0.5px}
.signal-typing-dots{display:flex;gap:3px}
.signal-typing-dots span{width:5px;height:5px;border-radius:50%;background:var(--green);animation:signal-bounce 1.4s ease-in-out infinite}
.signal-typing-dots span:nth-child(2){animation-delay:0.2s}
.signal-typing-dots span:nth-child(3){animation-delay:0.4s}
@keyframes signal-bounce{0%,80%,100%{opacity:0.2;transform:scale(0.8)}40%{opacity:1;transform:scale(1.1)}}

/* Error messages — no decorative stripe; leading glyph + tint + padding */
.signal-error{padding:8px 10px 8px 28px;color:var(--pink);font-size:11px;margin:6px 0;
  background:rgba(255,51,102,0.06);border:1px solid rgba(255,51,102,0.2);border-radius:3px;position:relative}
.signal-error::before{content:'▲';position:absolute;left:10px;top:8px;font-size:10px;line-height:1}
.signal-error-details{display:none;margin-top:6px;font-size:10px;color:var(--text-dim);word-break:break-all}
.signal-error-toggle{color:var(--pink);cursor:pointer;text-decoration:underline;font-size:10px;margin-left:4px;opacity:0.85}

/* Focus visibility — inherit green outline from main stylesheet */
.signal-input:focus-visible,.signal-send:focus-visible,.signal-gear:focus-visible,
.signal-chart-modal-close:focus-visible,#ai-toggle:focus-visible{outline:2px solid var(--green);outline-offset:2px}

/* Reduced motion — suppress decorative animation */
@media(prefers-reduced-motion:reduce){
  .signal-tool-icon,.signal-cursor,.signal-typing-dots span{animation:none!important}
  .signal-chart-modal{transition:none!important}
}
