/* bot.css — Bot API wizard */
.bot-steps-bar { display: flex; align-items: center; justify-content: center; margin-bottom: 32px; }
.bot-dot {
  width: 36px; height: 36px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 700;
  background: var(--bg3); color: var(--muted); border: 2px solid var(--border);
  transition: all .3s;
}
.bot-dot.active { background: var(--gold); color: #0a0e1a; border-color: var(--gold); }
.bot-dot.done { background: var(--success); color: #0a0e1a; border-color: var(--success); }
.bot-line { width: 60px; height: 2px; background: var(--border); transition: background .3s; }
.bot-line.done { background: var(--success); }

.bot-panel { display: none; }
.bot-panel.active { display: block; }

.bot-apikey-box {
  background: var(--bg3); border: 1px solid var(--gold-line);
  border-radius: var(--r-md); padding: 20px; text-align: center;
}
.bot-apikey-value {
  font-size: 17px; color: var(--gold); word-break: break-all;
  margin: 0 0 12px; line-height: 1.4;
}

.bot-code {
  background: var(--bg3); border: 1px solid var(--border);
  border-radius: var(--r-md); padding: 16px 20px; overflow-x: auto;
}
.bot-code code {
  font-family: 'JetBrains Mono', 'Consolas', monospace;
  font-size: 13px; color: var(--gold); line-height: 1.6; white-space: pre;
}

.bot-btn-spinner {
  display: inline-block; width: 14px; height: 14px;
  border: 2px solid transparent; border-top-color: currentColor;
  border-radius: 50%; animation: bot-spin .6s linear infinite;
  vertical-align: middle; margin-inline-end: 6px;
}
@keyframes bot-spin { to { transform: rotate(360deg); } }
