/* ── Dark theme: override all CSS variables ── */
:root:root:not([data-theme^="custom"]) {
  --bg: #09182F !important;
  --bg-accent: #0d2040;
  --bg-elevated: #0f2a45;
  --bg-hover: #1a3352;
  --bg-muted: #1a3352;
  --bg-content: #0d2040;
  --card: #0f2235;
  --card-foreground: #f4f4f5;
  --card-highlight: rgba(0, 242, 255, 0.04);
  --popover: #0f2235;
  --popover-foreground: #f4f4f5;
  --panel: #09182F;
  --panel-strong: #0d2040;
  --panel-hover: #1a3352;
  --chrome: rgba(9, 24, 47, 0.95);
  --chrome-strong: rgba(9, 24, 47, 0.98);
  --text: #e0e0e0;
  --text-strong: #fafafa;
  --chat-text: #e0e0e0;
  --muted: #7a8ba0;
  --muted-strong: #5a6b80;
  --muted-foreground: #7a8ba0;
  --border: #1a3a4a;
  --border-strong: #2d5060;
  --border-hover: #3a5a6a;
  --input: #0f2a45;
  --ring: #39D0D8 !important;
  --accent: #39D0D8 !important;
  --accent-hover: #5cdae0;
  --accent-muted: #2bb1b9;
  --accent-subtle: rgba(57, 208, 216, 0.12);
  --accent-foreground: #09182F;
  --accent-glow: rgba(57, 208, 216, 0.25);
  --primary: #39D0D8 !important;
  --primary-foreground: #09182F !important;
  --secondary: #0d2040;
  --secondary-foreground: #f4f4f5;
  --accent-2: #14b8a6;
  --accent-2-muted: rgba(20, 184, 166, 0.7);
  --accent-2-subtle: rgba(20, 184, 166, 0.15);
  --ok: #22c55e;
  --ok-muted: rgba(34, 197, 94, 0.75);
  --ok-subtle: rgba(34, 197, 94, 0.12);
  --destructive: #ef4444 !important;
  --destructive-foreground: #fafafa;
  --warn: #f59e0b;
  --warn-muted: rgba(245, 158, 11, 0.75);
  --warn-subtle: rgba(245, 158, 11, 0.12);
  --danger: #ef4444;
  --danger-muted: rgba(239, 68, 68, 0.75);
  --danger-subtle: rgba(239, 68, 68, 0.12);
  --info: #3b82f6;
  --focus: rgba(0, 242, 255, 0.25);
  --focus-ring: 0 0 0 2px var(--bg), 0 0 0 4px var(--ring);
  --focus-glow: 0 0 0 2px var(--bg), 0 0 0 4px var(--ring), 0 0 20px var(--accent-glow);
  --grid-line: rgba(57, 208, 216, 0.04);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3);
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(57, 208, 216, 0.03);
  --shadow-lg: 0 12px 28px rgba(0, 0, 0, 0.4), 0 0 0 1px rgba(57, 208, 216, 0.03);
  --shadow-xl: 0 24px 48px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(57, 208, 216, 0.03);
  --shadow-glow: 0 0 30px var(--accent-glow);
}

/* ── Light theme: softer greys, cyan accent ── */
:root:root[data-theme=light]:not([data-theme^="custom"]), :root[data-theme=light]:not([data-theme^="custom"]) {
  --bg: #e8ecf0 !important;
  --bg-accent: #dfe4e9 !important;
  --bg-elevated: #f0f2f5 !important;
  --bg-hover: #d5dbe2 !important;
  --bg-muted: #d5dbe2 !important;
  --bg-content: #e2e6eb !important;
  --card: #edf0f3 !important;
  --card-foreground: #1a2332 !important;
  --card-highlight: rgba(0, 242, 255, 0.06) !important;
  --popover: #edf0f3 !important;
  --popover-foreground: #1a2332 !important;
  --panel: #e8ecf0 !important;
  --panel-strong: #dfe4e9 !important;
  --panel-hover: #d5dbe2 !important;
  --chrome: rgba(232, 236, 240, 0.95) !important;
  --chrome-strong: rgba(228, 232, 236, 0.98) !important;
  --text: #2a3444 !important;
  --text-strong: #1a2332 !important;
  --chat-text: #2a3444 !important;
  --muted: #6b7a8d !important;
  --muted-strong: #8a95a3 !important;
  --muted-foreground: #6b7a8d !important;
  --border: #c5cdd6 !important;
  --border-strong: #b0bac5 !important;
  --border-hover: #a0aab5 !important;
  --input: #d5dbe2 !important;
  --ring: #0891b2 !important;
  --accent: #0891b2 !important;
  --accent-hover: #06b6d4 !important;
  --accent-muted: #0891b2 !important;
  --accent-subtle: rgba(8, 145, 178, 0.12) !important;
  --accent-foreground: #ffffff !important;
  --accent-glow: rgba(8, 145, 178, 0.15) !important;
  --primary: #0891b2 !important;
  --primary-foreground: #ffffff !important;
  --secondary: #dfe4e9 !important;
  --secondary-foreground: #1a2332 !important;
  --destructive: #ef4444 !important;
  --destructive-foreground: #fafafa !important;
  --ok: #16a34a !important;
  --warn: #d97706 !important;
  --danger: #dc2626 !important;
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06) !important;
  --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08) !important;
  --shadow-lg: 0 12px 28px rgba(0, 0, 0, 0.12) !important;
}

/* ── Minimal targeted overrides (let CSS vars do the work) ── */

/* Robot icon glow */
:root:not([data-theme^="custom"]) .brand-logo img,
:root:not([data-theme^="custom"]) [class*="brand-logo"] img {
  filter: drop-shadow(0 0 6px rgba(57, 208, 216, 0.6)) drop-shadow(0 0 12px rgba(57, 208, 216, 0.3)) !important;
}

/* User chat bubbles — cyan tint */
:root:not([data-theme^="custom"]) .chat-group.user .chat-bubble,
:root:not([data-theme^="custom"]) .chat-line.user .chat-bubble {
  background: rgba(57, 208, 216, 0.08) !important;
  border-color: rgba(57, 208, 216, 0.15) !important;
}

/* No element-level compose overrides — CSS variables handle it */

/* Streaming pulse */
@keyframes pulsing-border {
  0%, 100% { border-color: var(--border); }
  50% { border-color: #39D0D8; }
}
@keyframes chatStreamPulse {
  0%, 100% { border-color: var(--border); }
  50% { border-color: #39D0D8; }
}

/* Scrollbar */
::-webkit-scrollbar { width: 8px; height: 8px; }
::-webkit-scrollbar-track { background: var(--bg); }
::-webkit-scrollbar-thumb { background: var(--border-strong); border-radius: 4px; }