/* Dark theme — overrides light defaults in styles.css and knowledge-agent.css */

html[data-theme="dark"] {
  /* CSG Theme dark defaults (Paint for panel; text field uses theme fallback --ka-textfield-bg). */
  --ka-panel-bg: #323232;
  --ka-textfield-bg: #232323;
  --color-bg: var(--ka-panel-bg);
  --color-surface: var(--ka-panel-bg);
  --color-surface-hover: var(--ka-textfield-bg);
  --color-border: #48484a;
  --color-text: #e5e5ea;
  --color-text-muted: #a1a1a6;
  --color-text-bright: #f5f5f7;
  --color-primary: #6ba3ff;
  --color-primary-hover: #5a92ef;
  --shadow: 0 4px 24px rgba(0, 0, 0, 0.45);
  --apple-text: #f5f5f7;
  --apple-secondary: #a1a1a6;
  --nec-blue-bright: #6ba3ff;
  --ka-bg: var(--ka-panel-bg);
  --ka-widget-surface: var(--ka-panel-bg);
  --ka-human-bubble-bg: #2d4f8f;
  --ka-human-bubble-text: #f5f5f7;
  --ka-feedback-dot: #6ba3ff;
  --ka-feedback-status: #c7c7cc;
}

html[data-theme="dark"],
html[data-theme="dark"] body {
  background: var(--ka-bg) !important;
  color: var(--apple-text) !important;
}

html[data-theme="dark"] .loading-overlay {
  background: var(--ka-bg) !important;
}

html[data-theme="dark"] .loading-overlay__text {
  color: var(--apple-secondary) !important;
}

html[data-theme="dark"] .error-banner {
  background: #3a2a2a;
  border-bottom-color: #8b3a3a;
  color: #fecaca;
}

html[data-theme="dark"] .widget-host {
  background: var(--ka-bg) !important;
}

html[data-theme="dark"] .widget-host .chat-header {
  background: var(--ka-widget-surface) !important;
  border-bottom-color: rgba(72, 72, 74, 0.9) !important;
}

html[data-theme="dark"] .widget-host .chat-header button {
  color: var(--apple-secondary) !important;
}

html[data-theme="dark"] .widget-host .chat-header button:hover {
  color: var(--apple-text) !important;
}

html[data-theme="dark"] .chat-input *,
html[data-theme="dark"] [data-highlight="chat-input"] * {
  box-shadow: none !important;
}

html[data-theme="dark"] .chat-input fieldset,
html[data-theme="dark"] [data-highlight="chat-input"] fieldset,
html[data-theme="dark"] .chat-input .MuiOutlinedInput-notchedOutline,
html[data-theme="dark"] [data-highlight="chat-input"] .MuiOutlinedInput-notchedOutline {
  border: none !important;
}

html[data-theme="dark"] .xpi-chat-widget textarea,
html[data-theme="dark"] .concierge-csg-widget textarea,
html[data-theme="dark"] .xpi-chat-widget input,
html[data-theme="dark"] .concierge-csg-widget input {
  background: transparent !important;
  color: var(--apple-text) !important;
  border: none !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .xpi-chat-widget,
html[data-theme="dark"] .concierge-csg-widget {
  color: var(--apple-text) !important;
}

/* Concierge / MUI surfaces (class names may shift on upgrade) */

html[data-theme="dark"] .xpi-chat-widget .MuiPaper-root,
html[data-theme="dark"] .concierge-csg-widget .MuiPaper-root,
html[data-theme="dark"] .xpi-chat-widget .MuiCard-root,
html[data-theme="dark"] .concierge-csg-widget .MuiCard-root {
  background-color: var(--ka-panel-bg) !important;
  color: #e5e5ea !important;
}

html[data-theme="dark"] .xpi-chat-widget .MuiButton-root,
html[data-theme="dark"] .concierge-csg-widget .MuiButton-root {
  color: #e5e5ea !important;
}

html[data-theme="dark"] .xpi-chat-widget .MuiIconButton-root,
html[data-theme="dark"] .concierge-csg-widget .MuiIconButton-root {
  color: #a1a1a6 !important;
}

html[data-theme="dark"] .chat-messages-container .ai-message-content {
  color: var(--apple-text) !important;
}

/* User / prior questions — Concierge ChatBubble (.human-message) keeps light bubble colors unless overridden */

html[data-theme="dark"] .xpi-chat-widget .human-message,
html[data-theme="dark"] .concierge-csg-widget .human-message,
html[data-theme="dark"] .chat-messages-container .human-message {
  background: var(--ka-human-bubble-bg) !important;
  background-color: var(--ka-human-bubble-bg) !important;
  border-color: var(--ka-human-bubble-bg) !important;
  color: var(--ka-human-bubble-text) !important;
}

html[data-theme="dark"] .human-message p,
html[data-theme="dark"] .human-message span,
html[data-theme="dark"] .human-message-wrapper .human-message {
  color: var(--ka-human-bubble-text) !important;
}

html[data-theme="dark"] .xpi-chat-widget .ai-disclaimer,
html[data-theme="dark"] .xpi-chat-widget [class*="disclaimer"] {
  color: var(--apple-secondary) !important;
}

/* "Thinking" / "Analyzing your request" — Concierge uses near-black feedbackBackground + text.muted */

html[data-theme="dark"] .xpi-chat-widget .is-waiting::before,
html[data-theme="dark"] .xpi-chat-widget .is-streaming::before,
html[data-theme="dark"] .concierge-csg-widget .is-waiting::before,
html[data-theme="dark"] .concierge-csg-widget .is-streaming::before {
  background-color: var(--ka-feedback-dot) !important;
}

html[data-theme="dark"] .xpi-chat-widget .is-waiting > span,
html[data-theme="dark"] .xpi-chat-widget .is-streaming > span,
html[data-theme="dark"] .concierge-csg-widget .is-waiting > span,
html[data-theme="dark"] .concierge-csg-widget .is-streaming > span {
  color: var(--ka-feedback-status) !important;
}

html[data-theme="dark"] .sub-agent-status-text,
html[data-theme="dark"] .sub-agent-name {
  color: var(--apple-text) !important;
}

html[data-theme="dark"] .sub-agent-chevron {
  color: var(--apple-secondary) !important;
  opacity: 0.85 !important;
}