/* ── Chatbot flottant StratoNetwork ── */
.chat-fab {
  position: fixed; right: 24px; bottom: 24px;
  width: 62px; height: 62px; border-radius: 50%;
  border: 0; cursor: pointer; z-index: 9998;
  background: var(--grad); color: #fff;
  display: grid; place-items: center;
  box-shadow: 0 14px 36px -10px rgba(124, 92, 255, .65);
}
.chat-fab svg { width: 26px; height: 26px; }
.chat-fab:hover { filter: brightness(1.06); }

.chat-panel {
  position: fixed; right: 24px; bottom: 98px; z-index: 9999;
  width: 384px; max-width: calc(100vw - 32px);
  height: 564px; max-height: calc(100vh - 140px);
  display: flex; flex-direction: column; overflow: hidden;
  border: 1px solid var(--border-strong); border-radius: 22px;
  background: var(--surface-2);
  backdrop-filter: blur(14px);
  box-shadow: 0 30px 80px -24px rgba(0, 0, 0, .65), var(--shadow-glow);
}
[data-theme="light"] .chat-panel { background: rgba(255, 255, 255, .92); }

.chat-head {
  display: flex; align-items: center; gap: 12px;
  padding: 16px 16px 14px; border-bottom: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(124, 92, 255, .12), transparent);
}
.chat-avatar {
  width: 42px; height: 42px; border-radius: 50%; object-fit: cover;
  background: var(--grad); border: 1px solid rgba(124, 92, 255, .4); flex-shrink: 0;
}
.chat-head-info { flex: 1; min-width: 0; }
.chat-name { font-size: 15px; font-weight: 700; color: var(--text); }
.chat-status { font-size: 11.5px; color: var(--text-mute); display: flex; align-items: center; gap: 6px; margin-top: 2px; }
.chat-status span { width: 7px; height: 7px; border-radius: 50%; background: #3DDC84; box-shadow: 0 0 8px #3DDC84; }
.chat-close {
  width: 32px; height: 32px; border-radius: 50%; border: 0; cursor: pointer;
  background: rgba(255, 255, 255, .06); color: var(--text-mute); display: grid; place-items: center;
}
.chat-close:hover { background: rgba(255, 255, 255, .12); color: var(--text); }
.chat-close svg { width: 16px; height: 16px; }

.chat-body {
  flex: 1; overflow-y: auto; padding: 18px 16px;
  display: flex; flex-direction: column; gap: 12px;
  scrollbar-width: thin;
}
.chat-msg {
  max-width: 84%; padding: 11px 14px; border-radius: 16px;
  font-size: 14px; line-height: 1.55; white-space: pre-wrap; word-wrap: break-word;
}
.chat-msg.bot {
  align-self: flex-start; background: rgba(255, 255, 255, .05);
  color: var(--text-dim); border-bottom-left-radius: 5px;
  border: 1px solid var(--border);
}
[data-theme="light"] .chat-msg.bot { background: rgba(124, 92, 255, .06); color: var(--text); }
.chat-msg.user {
  align-self: flex-end; background: var(--grad); color: #fff;
  border-bottom-right-radius: 5px;
}
.chat-cta {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 10px;
  padding: 9px 14px; border: 0; border-radius: 999px; text-decoration: none; cursor: pointer;
  background: var(--grad); color: #fff; font-size: 13px; font-weight: 600;
  font-family: var(--font); line-height: 1;
  box-shadow: 0 8px 20px -8px rgba(124, 92, 255, .7);
}
.chat-cta:hover { filter: brightness(1.06); }
.chat-cta svg { width: 14px; height: 14px; }

.chat-typing { display: inline-flex; gap: 5px; align-items: center; }
.chat-typing span { width: 7px; height: 7px; border-radius: 50%; background: var(--text-mute); display: inline-block; }

.chat-chips { display: flex; gap: 8px; flex-wrap: wrap; padding: 0 16px 10px; }
.chat-chip {
  border: 1px solid var(--border); background: rgba(255, 255, 255, .03);
  color: var(--text-dim); font-size: 12.5px; font-weight: 500;
  padding: 7px 12px; border-radius: 999px; cursor: pointer; font-family: var(--font);
  transition: border-color .2s, color .2s, background .2s;
}
.chat-chip:hover { border-color: var(--accent); color: var(--text); background: rgba(124, 92, 255, .08); }

.chat-foot {
  display: flex; gap: 8px; align-items: center;
  padding: 12px 14px; border-top: 1px solid var(--border);
}
.chat-input {
  flex: 1; background: rgba(255, 255, 255, .04); border: 1px solid var(--border);
  color: var(--text); border-radius: 999px; padding: 12px 16px;
  font-family: var(--font); font-size: 14px; outline: none;
}
[data-theme="light"] .chat-input { background: rgba(255, 255, 255, .8); }
.chat-input:focus { border-color: var(--accent); background: rgba(124, 92, 255, .06); }
.chat-send {
  width: 42px; height: 42px; flex-shrink: 0; border: 0; cursor: pointer;
  border-radius: 50%; background: var(--grad); color: #fff; display: grid; place-items: center;
}
.chat-send svg { width: 18px; height: 18px; }
.chat-send:disabled { opacity: .5; cursor: default; }

@media (max-width: 480px) {
  .chat-fab { right: 16px; bottom: 16px; width: 56px; height: 56px; }
  .chat-panel { right: 12px; left: 12px; bottom: 84px; width: auto; height: calc(100vh - 120px); }
}
