/* =====================================================================
   AGIS Chat Widget (frontend-only)
   Keep every selector scoped to #agis-chat-root so the widget cannot
   affect client themes or plugin pages outside the chat container.
   ===================================================================== */

#agis-chat-root {
  --agis-bg0: #071019;
  --agis-bg1: #081827;
  --agis-panel: rgba(255, 255, 255, 0.06);
  --agis-panel2: rgba(255, 255, 255, 0.045);
  --agis-border: rgba(255, 255, 255, 0.1);
  --agis-text: rgba(255, 255, 255, 0.92);
  --agis-muted: rgba(255, 255, 255, 0.65);
  --agis-brand: #76d949;
  --agis-brandSoft: rgba(118, 217, 73, 0.2);
  --agis-shadow: 0 18px 50px rgba(0, 0, 0, 0.45);
  --agis-shadowSm: 0 10px 28px rgba(0, 0, 0, 0.35);
  --agis-rXL: 26px;
  --agis-rLG: 18px;
  --agis-rMD: 14px;
}

#agis-chat-root,
#agis-chat-root * {
  box-sizing: border-box;
}

#agis-chat-root input,
#agis-chat-root select,
#agis-chat-root textarea {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.15);
  color: var(--agis-text);
  border-radius: 12px;
}

#agis-chat-root input::placeholder,
#agis-chat-root textarea::placeholder {
  color: rgba(255, 255, 255, 0.45);
}

#agis-chat-root .agis-btn {
  background: rgba(20, 30, 45, 0.85) !important;
  color: rgba(255, 255, 255, 0.96) !important;
  border: 1px solid rgba(255, 255, 255, 0.22) !important;
  border-radius: 8px !important;
  padding: 6px 16px !important;
  font-weight: 800 !important;
  font-size: 13px !important;
  line-height: 1 !important;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35);
  transition: all 0.15s ease;
}

#agis-chat-root .agis-btn:hover {
  background: rgba(35, 50, 70, 0.95) !important;
  transform: translateY(-1px);
}

#agis-chat-root .agis-btn-primary {
  background: rgba(118, 217, 73, 0.35) !important;
  border-color: rgba(118, 217, 73, 0.65) !important;
  color: #ffffff !important;
}

#agis-chat-root .agis-btn-primary:hover {
  box-shadow: 0 0 22px rgba(118, 217, 73, 0.45);
}

#agis-chat-root .agis-btn-danger {
  background: rgba(255, 80, 80, 0.38) !important;
  border-color: rgba(255, 80, 80, 0.65) !important;
  color: #ffffff !important;
}

#agis-chat-root .agis-btn:disabled {
  opacity: 0.45 !important;
  cursor: not-allowed !important;
  box-shadow: none !important;
}

/* Chat message typography */
#agis-chat-root .agis-user-message p,
#agis-chat-root .agis-ai-message p {
  margin: 6px 0;
  line-height: 1.4;
  word-break: break-word;
  color: inherit !important;
}

#agis-chat-root #chatMessages .agis-user-message ul,
#agis-chat-root #chatMessages .agis-user-message ol,
#agis-chat-root #chatMessages .agis-ai-message ul,
#agis-chat-root #chatMessages .agis-ai-message ol {
  margin: 6px 0 6px 18px;
  padding: 0;
}

#agis-chat-root .agis-user-message li,
#agis-chat-root .agis-ai-message li {
  margin-bottom: 4px;
}

#agis-chat-root .agis-user-message code,
#agis-chat-root .agis-ai-message code {
  background: rgba(0, 0, 0, 0.08);
  padding: 2px 4px;
  border-radius: 4px;
  font-size: 0.9em;
}

#agis-chat-root select,
#agis-chat-root .agis-form-select {
  background-color: rgba(20, 30, 45, 0.85) !important;
  color: rgba(255, 255, 255, 0.95) !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  border-radius: 999px !important;
  padding: 8px 36px 8px 14px !important;
  font-weight: 600;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25);
}

#agis-chat-root select:hover,
#agis-chat-root select:focus,
#agis-chat-root .agis-form-select:hover,
#agis-chat-root .agis-form-select:focus {
  background-color: rgba(30, 45, 65, 0.95) !important;
  border-color: rgba(118, 217, 73, 0.55) !important;
  outline: none !important;
}

#agis-chat-root select option {
  background-color: rgba(20, 30, 45, 0.95) !important;
  color: rgba(255, 255, 255, 0.95) !important;
}

#agis-chat-root select option:disabled {
  color: rgba(255, 255, 255, 0.45) !important;
}

#agis-chat-root .agis-form-text {
  color: white !important;
}

#agis-chat-root .agis-card {
  background-color: #c4ddae !important;
}

#agis-chat-root .agis-card h3,
#agis-chat-root .agis-card h4,
#agis-chat-root .agis-card h5,
#agis-chat-root .fas,
#agis-chat-root .agis-card-text,
#agis-chat-root #chatStartMessage,
#agis-chat-root .agis-email-captured {
  color: #198754 !important;
}

/* Chat layout utilities */
#agis-chat-root .agis-d-flex { display: flex; }
#agis-chat-root .agis-justify-content-between { justify-content: space-between; }
#agis-chat-root .agis-justify-content-end { justify-content: flex-end; }
#agis-chat-root .agis-justify-content-start { justify-content: flex-start; }
#agis-chat-root .agis-align-items-center { align-items: center; }
#agis-chat-root .agis-my-2 { margin-top: 0.5rem; margin-bottom: 0.5rem; }
#agis-chat-root .agis-btn-group { display: inline-flex; gap: 4px; }
#agis-chat-root .agis-input-group { display: flex; gap: 8px; align-items: center; }
#agis-chat-root .agis-text-right { text-align: right; }
#agis-chat-root .agis-text-left { text-align: left; }
#agis-chat-root .agis-text-center { text-align: center; }
#agis-chat-root .agis-text-muted { color: var(--agis-muted) !important; }
#agis-chat-root .agis-card-header { padding: 12px 16px; border-bottom: 1px solid rgba(255,255,255,.1); }
#agis-chat-root .agis-card-body { padding: 16px; flex: 1; }
#agis-chat-root .agis-card-footer { padding: 12px 16px; border-top: 1px solid rgba(255,255,255,.1); }
#agis-chat-root .agis-form-control { flex: 1; padding: 8px 12px; border-radius: 8px; }
#agis-chat-root #chatInput:focus { outline: none; box-shadow: none; }
#agis-chat-root #sendMessageBtn { border: none !important; box-shadow: none !important; }
#agis-chat-root #sendMessageBtn:hover { box-shadow: none !important; }
#agis-chat-root .agis-btn-sm { padding: 4px 12px !important; font-size: 12px !important; }