/* CGH Dashboard Assistant — FAB + drawer + chat surface.
 *
 * Two render targets:
 *   1. FAB + drawer, included on every page via base.html → _chat_fab.html
 *   2. Standalone /dashboard/chat page (templates/chat.html) — reuses the
 *      same .cgh-chat-log + .cgh-chat-input markup inside .cgh-chat-page
 */

:root {
  --cgh-chat-green:    #14532d;
  --cgh-chat-amber:    #b87800;
  --cgh-chat-ink:      #111827;
  --cgh-chat-ink-soft: #5e6660;
  --cgh-chat-line:     #e5e7eb;
  --cgh-chat-bg-soft:  #f5f5f4;
}

/* ----- FAB ----- */
.cgh-chat-fab {
  position: fixed; right: 16px; bottom: 16px; z-index: 60;
  width: 52px; height: 52px; border-radius: 50%;
  background: var(--cgh-chat-green); color: #fff;
  border: 0; font-size: 22px; line-height: 1;
  cursor: pointer; box-shadow: 0 6px 16px rgba(0,0,0,.18);
  display: inline-flex; align-items: center; justify-content: center;
  transition: transform .12s ease;
}
.cgh-chat-fab:hover { transform: translateY(-2px); }
.cgh-chat-fab:active { transform: translateY(0); }

/* ----- Drawer (right slide-in) ----- */
.cgh-chat-drawer {
  position: fixed; top: 0; right: 0; bottom: 0; z-index: 70;
  width: 400px; max-width: 100vw;
  background: #fff; border-left: 1px solid var(--cgh-chat-line);
  box-shadow: -8px 0 24px rgba(0,0,0,.10);
  display: flex; flex-direction: column;
  transform: translateX(100%); transition: transform .2s ease;
}
.cgh-chat-drawer:not([hidden]) { transform: translateX(0); }
.cgh-chat-drawer[hidden]      { display: flex; pointer-events: none; }
@media (max-width: 540px) {
  .cgh-chat-drawer { width: 100vw; }
}

/* ----- Header ----- */
.cgh-chat-head {
  display: flex; align-items: center; gap: .5rem;
  padding: .65rem .8rem; background: var(--cgh-chat-green); color: #fff;
  flex: 0 0 auto;
}
.cgh-chat-title { flex: 1; font-weight: 600; font-size: .95rem; }
.cgh-chat-head-actions { display: inline-flex; gap: .25rem; }
.cgh-chat-btn-icon {
  width: 28px; height: 28px; border-radius: 6px;
  background: rgba(255,255,255,.12); color: #fff; border: 0;
  font-size: 1rem; line-height: 1; cursor: pointer;
}
.cgh-chat-btn-icon:hover { background: rgba(255,255,255,.22); }

/* ----- Log ----- */
.cgh-chat-log {
  list-style: none; padding: .65rem; margin: 0;
  flex: 1 1 auto; overflow-y: auto;
  background: var(--cgh-chat-bg-soft);
  font-size: .92rem; line-height: 1.4;
}
.cgh-chat-msg {
  display: block; margin: .4rem 0;
  padding: .55rem .75rem; border-radius: 10px;
  max-width: 92%; word-wrap: break-word;
  background: #fff; color: var(--cgh-chat-ink);
  border: 1px solid var(--cgh-chat-line);
  white-space: pre-wrap;
}
.cgh-chat-msg.is-user {
  margin-left: auto; background: var(--cgh-chat-green); color: #fff;
  border-color: var(--cgh-chat-green);
}
.cgh-chat-msg.is-tool {
  font-size: .82rem; color: var(--cgh-chat-ink-soft); font-style: italic;
  background: transparent; border: 1px dashed var(--cgh-chat-line);
}
.cgh-chat-msg.is-pending {
  background: rgba(184,120,0,.10); border-color: var(--cgh-chat-amber);
  color: #7a3a07;
}
/* Bulk-write confirm: red, loud, un-missable — defeats approval fatigue. */
.cgh-chat-msg.is-pending.is-bulk-warn {
  background: rgba(200,40,40,.08); border-color: #c02828; color: #7a1010;
}
.cgh-chat-msg.is-bulk-warn .cgh-chat-bulk-banner {
  font-weight: 700; color: #fff; background: #c02828;
  padding: .4rem .6rem; border-radius: 6px; margin-bottom: .5rem;
}
.cgh-chat-msg.is-bulk-warn .cgh-chat-bulk-body {
  white-space: pre-wrap; word-break: break-word;   /* full list wraps, never clipped */
  max-height: 11rem; overflow-y: auto;              /* long lists scroll, stay in-bubble */
  font-size: .9rem;
}
.cgh-chat-msg.is-bulk-warn .cgh-chat-actions .is-primary {
  background: #c02828; border-color: #c02828;
}
.cgh-chat-msg .cgh-chat-actions {
  margin-top: .5rem; display: flex; gap: .35rem;
}
.cgh-chat-msg .cgh-chat-actions button {
  padding: .35rem .75rem; font: inherit; font-size: .85rem; font-weight: 600;
  border-radius: 6px; cursor: pointer;
  background: #fff; color: #7a3a07; border: 1px solid var(--cgh-chat-amber);
}
.cgh-chat-msg .cgh-chat-actions .is-primary {
  background: var(--cgh-chat-amber); color: #fff; border-color: var(--cgh-chat-amber);
}

.cgh-chat-empty {
  text-align: center; color: var(--cgh-chat-ink-soft);
  font-size: .85rem; margin: 1.5rem 1rem; line-height: 1.5;
}

/* ----- Thinking indicator (shown while the bot is mid-turn) ----- */
.cgh-chat-thinking {
  display: flex; align-items: center; gap: .5rem;
  padding: .35rem .7rem; flex: 0 0 auto;
  background: var(--cgh-chat-bg-soft, #f5f5f4);
  border-top: 1px solid var(--cgh-chat-line, #e5e7eb);
  color: var(--cgh-chat-ink-soft, #5e6660);
  font-size: .8rem; font-style: italic;
}
.cgh-chat-thinking[hidden] { display: none; }
.cgh-chat-dots { display: inline-flex; gap: 3px; }
.cgh-chat-dots span {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--cgh-chat-green, #14532d);
  animation: cghChatPulse 1.4s infinite ease-in-out both;
}
.cgh-chat-dots span:nth-child(2) { animation-delay: .2s; }
.cgh-chat-dots span:nth-child(3) { animation-delay: .4s; }
@keyframes cghChatPulse {
  0%, 60%, 100% { opacity: .25; transform: scale(.85); }
  30%           { opacity: 1;   transform: scale(1.1); }
}

/* While a tool is mid-execution, the tool pill pulses gently. */
.cgh-chat-msg.is-tool.is-running {
  background: rgba(20, 83, 45, .04);
  border-color: rgba(20, 83, 45, .35);
}

/* ----- Input ----- */
.cgh-chat-input {
  display: flex; gap: .4rem; align-items: flex-end;
  padding: .55rem; border-top: 1px solid var(--cgh-chat-line);
  background: #fff; flex: 0 0 auto;
}
.cgh-chat-input textarea {
  flex: 1; font: inherit; font-size: 16px;  /* iOS no-zoom */
  border: 1px solid var(--cgh-chat-line); border-radius: 8px;
  padding: .5rem .7rem; resize: none;
  min-height: 38px; max-height: 140px;
}
.cgh-chat-input textarea:focus {
  outline: 2px solid rgba(20,83,45,.20); outline-offset: 1px;
}
.cgh-chat-send {
  background: var(--cgh-chat-green); color: #fff; border: 0;
  width: 38px; height: 38px; border-radius: 8px;
  font-size: 1.1rem; cursor: pointer; line-height: 1;
}
.cgh-chat-send:disabled { opacity: .4; cursor: not-allowed; }

/* ----- Standalone page surface ----- */
.cgh-chat-page {
  max-width: 920px; margin: 0 auto; padding: 0;
  display: flex; flex-direction: column;
  height: calc(100vh - 0px); background: #fff;
}
.cgh-chat-page .cgh-chat-head { border-radius: 0; }
.cgh-chat-page .cgh-chat-log { background: var(--cgh-chat-bg-soft); }