:root,
:host,
.uc-theme-dark {
  color-scheme: dark;

  --uc-accent-color: #818CF8;
  --uc-ap-bg: #111115;
  --uc-primary-bg: #111115;
  --uc-secondary-bg: #1C1C21;
  --uc-secondary-bg-light: #3E3052;
  --uc-text-color-grey: #B6B6B6;
  --uc-text-color-secondery: #067DC7;

  /* Text Colors */
  --uc-primary-text-color: #908F9D;
  --uc-secondary-text-color: #908F9D;
  --uc-white-text-color: #E8E6F0;
  --uc-hover-text-color: #E8E6F0;
  --uc-list-text-color: #908F9D;

  /* colors */
  --uc-primary-color: #908F9D;
  --uc-secondery-color: #908F9D;

  /* Border */
  --uc-primary-border-color: #00A3FF;
  --uc-primary-border-color-dimmed: #00A3FF90;
  --uc-border-bubble: #A2A2A2;
  --uc-main-border-color: #121212;
  --uc-hover-bg: #3a2854;
  --uc-icon : #AF6DFF;
  --uc-icon-border : #AF6DFF;
  --uc-icon-white: #ebeef2;
  --uc-chat-bg: #111115;
  --uc-chat-bubble-bg: rgba(255, 255, 255, 0.07);
  --uc-chat-bubble-own-bg: #581C8730;
  --uc-chat-bubble-own-text: #ebeef2;
  --uc-chat-bubble-own-border: #A855F720;
  --uc-sms-bubble-bg: #ffffff;
  --uc-sms-bubble-color: #000000;
  --uc-chat-divider-color: rgba(255, 255, 255, 0.08);
  --uc-chat-input-bg: #1C1C21;
  --uc-chat-input-border: #1b102a;
  --uc-chat-input-placeholder: rgba(255, 255, 255, 0.6);
  --uc-chat-bubble-other-bg: #1C1C21;
  --uc-chat-bubble-other-border: #33415530;
  --uc-chat-bubble-other-text: #ebeef2;

  /* Action Colours  */
  --uc-success-bg: #219653;
  --uc-danger-bg: #ff0000;
  --uc-notification-color: #f83e47;

  --uc-highlight-bg: #3a2854;

  /* Settings dialog */
  --uc-dialog-bg: #0E0A14;
  --uc-settings-row-bg: rgba(99, 102, 241, 0.67);
  --uc-settings-row-text: #ffffff;
  --uc-toggle-off-bg: #121212;

  /* Login page */
  --uc-toggle-bg: #1D1D1D;
  --uc-tab-bg: #111115;
  --uc-type-tab-active-bg: #615BFC;

  /* Common colors */
  --uc-solid-bg: #0A0A0A;

  /* Active call panel — neon greens for dark bg */
  --uc-call-green: #39FF3C;
  --uc-call-border: rgba(57, 255, 60, 0.22);
  --uc-call-glow-md: rgba(57, 255, 60, 0.12);
  --uc-call-glow-sm: rgba(57, 255, 60, 0.06);
  --uc-call-glow-inset: rgba(57, 255, 60, 0.1);
  --uc-call-icon-bg: #44DB3F20;
  --uc-call-icon-border: #39FF3C75;
  --uc-call-pulse-start: rgba(57, 255, 60, 0.4);
  --uc-call-pulse-end: rgba(57, 255, 60, 0);

  /* Hold/Paused state */
  --uc-call-hold: #dfc83a;
  --uc-call-hold-bg: #EAFF0020;
  --uc-call-hold-border: #DEED3875;

  /* Call panel text */
  --uc-call-text-primary: #908f9d;
  --uc-call-text-secondary: #908f9d;
  --uc-call-text-inactive: #908f9d;

  /* Presence / BLF panel — bridged to the app's dark theme so the panel's
     surfaces and text match the surrounding chrome. The mockup's structure
     (cards, status gradients, pills) is kept; only the base palette tracks the
     app's --uc-* variables (with literal fallbacks). */
  --blf-surface: var(--uc-secondary-bg, #1c1c21);          /* panel bg — matches side panels */
  --blf-surface-sunken: var(--uc-primary-bg, #111115);     /* search box / sunken inputs — matches app bg */
  --blf-card: color-mix(in srgb, #ffffff 5%, var(--uc-secondary-bg, #1c1c21)); /* elevated card on the panel */
  --blf-line: var(--uc-chat-divider-color, rgba(255, 255, 255, 0.08));
  --blf-line-strong: rgba(255, 255, 255, 0.16);
  --blf-fg: var(--uc-white-text-color, #e8e6f0);           /* primary text (names) */
  --blf-fg-2: var(--uc-primary-text-color, #908f9d);       /* secondary text */
  --blf-fg-3: color-mix(in srgb, var(--uc-primary-text-color, #908f9d) 62%, var(--uc-secondary-bg, #1c1c21)); /* tertiary */
  --blf-muted: var(--uc-hover-bg, rgba(255, 255, 255, 0.05));  /* hover wash — matches app hovers */
  --blf-accent: var(--uc-accent-color, #818cf8);           /* active tab underline / focus / grip */
  --blf-pill-on-bg: var(--uc-secondary-bg-light, #3e3052); /* active filter pill — app's elevated purple */
  --blf-pill-on-fg: var(--uc-white-text-color, #ece9fb);
  --blf-online-fg: #34d39e;        /* "N online" badge (semantic green) */
  --blf-online-bg: rgba(52, 211, 158, 0.15);
}

/* Stream Chat SDK v2 bubble overrides */
.uc-theme-dark .str-chat,
.uc-theme-dark.str-chat {
  --str-chat__message-bubble-color: var(--uc-primary-text-color);
  --str-chat__message-bubble-background-color: var(--uc-chat-bubble-bg);
  --str-chat__own-message-bubble-color: var(--uc-chat-bubble-own-text);
  --str-chat__message-bubble-border-radius: 14px;
}

/* _utility.css */