/* Assistant widget — floating chat (blue, mirrors .btn-run aesthetic) */

:root {
  --asst-blue:        #5FB0E8;
  --asst-blue-bright: #8FCFFF;
  --asst-blue-deep:   #2C7CB8;
  --asst-blue-glow:   rgba(95,176,232,0.45);
  --asst-blue-line:   rgba(95,176,232,0.32);
  --asst-blue-soft:   rgba(95,176,232,0.10);
  --asst-blue-faint:  rgba(95,176,232,0.05);
}

body:not(.auth-ok) .assistant-fab,
body:not(.auth-ok) .assistant-panel { display: none !important; }

/* ─── Floating button ────────────────────────────────────── */
.assistant-fab {
  position: fixed;
  right: 24px;
  bottom: 24px;
  z-index: 99999;
  padding: 12px 20px;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: rgba(95,176,232,0.10);
  color: var(--asst-blue-bright);
  font-family: 'IBM Plex Mono', monospace;
  font-weight: 600;
  font-size: 12px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  cursor: pointer;
  border: 1px solid var(--asst-blue-line);
  box-shadow:
    0 0 0 1px var(--asst-blue-faint),
    inset 0 0 24px rgba(95,176,232,0.06),
    0 6px 20px rgba(0,0,0,0.45);
  transition: all 0.25s ease;
}
.assistant-fab::before,
.assistant-fab::after {
  content: '';
  position: absolute;
  width: 12px; height: 12px;
  border: 1px solid var(--asst-blue-bright);
  pointer-events: none;
  filter: drop-shadow(0 0 3px var(--asst-blue-glow));
  transition: all 0.25s ease;
}
.assistant-fab::before { top: 0; left: 0; border-right: none; border-bottom: none; }
.assistant-fab::after  { bottom: 0; right: 0; border-left: none; border-top: none; }
.assistant-fab:hover {
  background: rgba(95,176,232,0.18);
  letter-spacing: 0.28em;
  color: #C5E5FF;
}
.assistant-fab .asst-icon { font-size: 16px; letter-spacing: 0; }

/* ─── Panel ──────────────────────────────────────────────── */
.assistant-panel {
  position: fixed;
  right: 24px;
  bottom: 78px;
  z-index: 99999;
  width: 400px;
  max-width: calc(100vw - 48px);
  height: 580px;
  max-height: calc(100vh - 120px);
  background: var(--ink-2, #0E1F2C);
  border: 1px solid var(--asst-blue-line);
  box-shadow:
    0 0 0 1px var(--asst-blue-faint),
    0 14px 50px rgba(0,0,0,0.55);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  font-family: 'IBM Plex Sans', sans-serif;
}
.assistant-panel.hidden { display: none; }

.assistant-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 12px 16px;
  border-bottom: 1px solid var(--asst-blue-line);
  background: var(--ink, #0A1620);
}
.assistant-title {
  color: var(--asst-blue-bright);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.22em;
  text-transform: uppercase;
}
.assistant-close {
  font-size: 20px;
  width: 28px; height: 28px;
  display: flex; align-items: center; justify-content: center;
  color: var(--text-on-dark-soft, rgba(242,236,221,0.62));
  border: 1px solid transparent;
  cursor: pointer;
  transition: all .15s ease;
}
.assistant-close:hover {
  color: var(--asst-blue-bright);
  border-color: var(--asst-blue-line);
  background: rgba(95,176,232,0.08);
}

/* ─── Messages ───────────────────────────────────────────── */
.assistant-msgs {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-size: 13.5px;
  line-height: 1.55;
  color: var(--text-on-dark, #F2ECDD);
  background:
    linear-gradient(180deg, rgba(95,176,232,0.03), transparent 60%),
    var(--ink-2, #0E1F2C);
}
.assistant-msgs::-webkit-scrollbar { width: 8px; }
.assistant-msgs::-webkit-scrollbar-thumb { background: var(--asst-blue-line); }

.assistant-msg {
  padding: 10px 13px;
  max-width: 88%;
  word-wrap: break-word;
  border: 1px solid transparent;
}
.assistant-msg-user {
  align-self: flex-end;
  background: rgba(95,176,232,0.10);
  border-color: var(--asst-blue-line);
  color: var(--asst-blue-bright);
}
.assistant-msg-assistant {
  align-self: flex-start;
  background: var(--ink-3, #14293A);
  border-color: var(--line-dark-2, rgba(228,210,170,0.18));
}
.assistant-msg p:first-child { margin-top: 0; }
.assistant-msg p:last-child { margin-bottom: 0; }
.assistant-msg code {
  background: rgba(0,0,0,0.35);
  padding: 1px 5px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  color: var(--asst-blue-bright);
}
.assistant-msg a { color: var(--asst-blue-bright); }

.assistant-tool {
  align-self: flex-start;
  font-size: 11px;
  font-family: 'IBM Plex Mono', monospace;
  letter-spacing: 0.05em;
  color: var(--asst-blue);
  padding: 2px 6px;
  opacity: 0.85;
}

/* ─── Input ──────────────────────────────────────────────── */
.assistant-input {
  flex: 0 0 auto;
  display: flex;
  gap: 8px;
  padding: 10px;
  border-top: 1px solid var(--asst-blue-line);
  background: var(--ink, #0A1620);
}
.assistant-input textarea {
  flex: 1 1 auto;
  resize: none;
  min-height: 38px;
  max-height: 120px;
  background: var(--ink-3, #14293A);
  color: var(--text-on-dark, #F2ECDD);
  border: 1px solid var(--line-dark-2, rgba(228,210,170,0.18));
  padding: 8px 10px;
  font-family: 'IBM Plex Sans', sans-serif;
  font-size: 13px;
  outline: none;
  transition: border-color .15s ease;
}
.assistant-input textarea:focus { border-color: var(--asst-blue-line); }
.assistant-input textarea::placeholder {
  color: var(--text-on-dark-faint, rgba(242,236,221,0.36));
  font-style: italic;
}

.assistant-send {
  flex: 0 0 auto;
  padding: 0 16px;
  background: rgba(95,176,232,0.10);
  color: var(--asst-blue-bright);
  border: 1px solid var(--asst-blue-line);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  cursor: pointer;
  transition: all .2s ease;
}
.assistant-send:hover:not(:disabled) {
  background: rgba(95,176,232,0.20);
  color: #C5E5FF;
  letter-spacing: 0.22em;
}
.assistant-send:disabled { opacity: 0.5; cursor: wait; }

/* ─── Light mode ─────────────────────────────────────────── */
body.light .assistant-fab {
  background: rgba(44,124,184,0.08);
  color: var(--asst-blue-deep);
  border-color: rgba(44,124,184,0.40);
  box-shadow:
    0 0 0 1px rgba(44,124,184,0.10),
    0 6px 20px rgba(0,0,0,0.15);
}
body.light .assistant-fab::before,
body.light .assistant-fab::after { border-color: var(--asst-blue-deep); filter: none; }
body.light .assistant-fab:hover { background: rgba(44,124,184,0.16); color: #1B5C92; }

body.light .assistant-panel {
  background: #F2ECDD !important;
  border-color: rgba(44,124,184,0.40);
}
body.light .assistant-head { background: #ECE4D2 !important; border-color: rgba(44,124,184,0.30); }
body.light .assistant-title { color: var(--asst-blue-deep); }
body.light .assistant-close { color: var(--text-soft, #4A413A); }
body.light .assistant-close:hover { color: var(--asst-blue-deep); border-color: rgba(44,124,184,0.30); background: rgba(44,124,184,0.08); }

body.light .assistant-msgs {
  background: #FAF5E8 !important;
  color: #1A1410 !important;
}
body.light .assistant-msg-user {
  background: rgba(44,124,184,0.12) !important;
  border-color: rgba(44,124,184,0.30);
  color: #1B5C92 !important;
}
body.light .assistant-msg-assistant {
  background: #ECE4D2 !important;
  border-color: #D8CFB8;
  color: #1A1410 !important;
}
body.light .assistant-msg code { background: rgba(44,124,184,0.10); color: var(--asst-blue-deep); }
body.light .assistant-msg a { color: var(--asst-blue-deep); }
body.light .assistant-tool { color: var(--asst-blue-deep); }

body.light .assistant-input { background: #ECE4D2 !important; border-color: rgba(44,124,184,0.30); }
body.light .assistant-input textarea { background: #FAF5E8 !important; color: #1A1410 !important; border-color: #D8CFB8; }
body.light .assistant-input textarea:focus { border-color: rgba(44,124,184,0.50); }
body.light .assistant-send {
  background: rgba(44,124,184,0.10);
  color: var(--asst-blue-deep);
  border-color: rgba(44,124,184,0.40);
}
body.light .assistant-send:hover:not(:disabled) { background: rgba(44,124,184,0.20); color: #1B5C92; }