/* Dark mode: Bootstrap's own dark theme (data-bs-theme="dark" on <html>, set by theme.js) plus dark versions of the
   portal's fixed colours. Soft "tint" backgrounds become deep tones; their text colours become lighter. */
[data-bs-theme="dark"] {
  --cn-brand: #6ea8de;
  --cn-brand-soft: #34465a;
  --cn-bg: #2b2e33;
  --cn-card: #35383e;
  --cn-border: #4a4f57;
  --cn-muted: #b0b7c0;
  --bs-primary: #4f8cc9;
  --bs-primary-rgb: 79, 140, 201;
  --bs-link-color: #7fb2e5;
  --bs-link-color-rgb: 127, 178, 229;
  --bs-link-hover-color: #a5c9ee;
  --bs-body-bg: #2b2e33;
  --bs-body-color: #e4e7eb;
  --bs-secondary-bg: #35383e;
  --bs-tertiary-bg: #303338;
  --bs-border-color: #4a4f57;
  color-scheme: dark;
}
[data-bs-theme="dark"] body { color: #e4e7eb; }
[data-bs-theme="dark"] .btn-primary { --bs-btn-bg: #2f6aa3; --bs-btn-border-color: #2f6aa3; --bs-btn-hover-bg: #3a7bb8; --bs-btn-hover-border-color: #3a7bb8; --bs-btn-active-bg: #3a7bb8; --bs-btn-color: #fff; }

/* Surfaces */
[data-bs-theme="dark"] .table { --bs-table-bg: var(--cn-card); --bs-table-hover-bg: rgba(255, 255, 255, .045); }
[data-bs-theme="dark"] .form-control, [data-bs-theme="dark"] .form-select { background-color: #2f3237; }
[data-bs-theme="dark"] .cn-topbar,
[data-bs-theme="dark"] .cn-client-top,
[data-bs-theme="dark"] .cn-auth-card,
[data-bs-theme="dark"] .cn-tile,
[data-bs-theme="dark"] .cn-logo { background: var(--cn-card); }
[data-bs-theme="dark"] .cn-search .form-control:focus { background: var(--cn-card); }
[data-bs-theme="dark"] .cn-table thead th,
[data-bs-theme="dark"] .cn-group-row td { background: #303338; }
[data-bs-theme="dark"] .cn-column { background: #303338; }
[data-bs-theme="dark"] .cn-column-hold { background: #37332c; }
[data-bs-theme="dark"] .cn-deal-board .cn-column-won { background: #2c3a31; }
[data-bs-theme="dark"] .cn-deal-board .cn-column-lost { background: #3b2e2e; }
[data-bs-theme="dark"] .cn-card-attention { border-color: #7a6427; background: #3a3426; }
[data-bs-theme="dark"] .cn-tile:hover,
[data-bs-theme="dark"] .cn-stat-link:hover,
[data-bs-theme="dark"] .cn-sop-card:hover,
[data-bs-theme="dark"] .cn-stage-tile:hover { border-color: #5d636c; box-shadow: 0 2px 10px rgba(0, 0, 0, .25); }
[data-bs-theme="dark"] .cn-rich thead th,
[data-bs-theme="dark"] .cn-rich table tr:first-child td { background: #3b3f46; }
[data-bs-theme="dark"] .ql-editor table td { border-color: #565b63; }

/* Text that was dark grey */
[data-bs-theme="dark"] .cn-topbar .nav-link,
[data-bs-theme="dark"] .cn-column-head,
[data-bs-theme="dark"] .cn-tabs .nav-link,
[data-bs-theme="dark"] .cn-status-pills .nav-link,
[data-bs-theme="dark"] .cn-chip,
[data-bs-theme="dark"] .cn-activity-icon,
[data-bs-theme="dark"] .cn-type-filter a,
[data-bs-theme="dark"] .cn-email-preview,
[data-bs-theme="dark"] .cn-timeline-item.is-system .cn-rich,
[data-bs-theme="dark"] .rnd-subnav .nav-link { color: #c3cad3; }
[data-bs-theme="dark"] .cn-mini-stats span,
[data-bs-theme="dark"] .cn-step button:hover,
[data-bs-theme="dark"] .cn-step.done button,
[data-bs-theme="dark"] .cn-step.done .cn-step-label,
[data-bs-theme="dark"] .cn-client-steps li.done { color: #e6eaef; }
[data-bs-theme="dark"] .cn-topbar .nav-link.active { color: #9cc5ef; }
[data-bs-theme="dark"] .cn-status-pills .nav-link.active,
[data-bs-theme="dark"] .cn-type-filter a.is-active { background: #2f6aa3; color: #fff; }
[data-bs-theme="dark"] .cn-type-filter a:hover { background: #43474e; }
[data-bs-theme="dark"] .rnd-subnav .nav-link:hover { background: var(--cn-card); }

/* Neutral dots, avatars, stage pills */
[data-bs-theme="dark"] .cn-avatar-more,
[data-bs-theme="dark"] .cn-step-dot,
[data-bs-theme="dark"] .cn-timeline-item.is-system .cn-avatar { background: #464a51; color: #d6dbe1; }
[data-bs-theme="dark"] .cn-avatar-xs { border-color: var(--cn-card); }
[data-bs-theme="dark"] .cn-client-steps li::before { background: #4a4f57; }
[data-bs-theme="dark"] .cn-stage { background: #43474e; color: #e4e7eb; }
[data-bs-theme="dark"] .cn-stage-archived,
[data-bs-theme="dark"] .cn-plat-dropped { background: #3e4147; color: #b0b7c0; }

/* Tinted badges: green / amber / red / blue */
[data-bs-theme="dark"] .cn-stage-website-completed,
[data-bs-theme="dark"] .cn-deal-stage-won,
[data-bs-theme="dark"] .cn-chip-ok,
[data-bs-theme="dark"] .cn-activity-call,
[data-bs-theme="dark"] .cn-plat-active,
[data-bs-theme="dark"] .cn-email-in { background: #2e4a39; color: #9be3b6; }
[data-bs-theme="dark"] .cn-step.done .cn-step-dot { background: #34553f; color: #9be3b6; }
[data-bs-theme="dark"] .cn-stage-converting,
[data-bs-theme="dark"] .cn-activity-email,
[data-bs-theme="dark"] .cn-plat-paused { background: #4d3f22; color: #f5cf85; }
[data-bs-theme="dark"] .cn-stage-on-hold,
[data-bs-theme="dark"] .cn-deal-stage-lost,
[data-bs-theme="dark"] .cn-chip-late,
[data-bs-theme="dark"] .cn-plat-suspended { background: #553333; color: #f6b0a9; }
[data-bs-theme="dark"] .cn-stage-final-design { background: #2a4652; color: #95d4ec; }
[data-bs-theme="dark"] .cn-activity-meeting,
[data-bs-theme="dark"] .cn-activity-demo,
[data-bs-theme="dark"] .cn-activity-visit,
[data-bs-theme="dark"] .cn-email-out { background: #2f4359; color: #b2d2f2; }
[data-bs-theme="dark"] .cn-rich del + span,
[data-bs-theme="dark"] .cn-rich .text-success { color: #7fd6a2; }
[data-bs-theme="dark"] .cn-stage-tile-note.is-late { color: #f29b93; }
[data-bs-theme="dark"] .cn-stage-tile.is-empty .cn-stage-tile-count { color: #5d6672; }
[data-bs-theme="dark"] .cn-email-original .cn-email-text { color: #9aa3ae; }

/* Support and R&D pages */
[data-bs-theme="dark"] .sp-done td { color: #8b95a1; }
[data-bs-theme="dark"] .sp-extra { background: #453d29; }
[data-bs-theme="dark"] .rnd-grid .rnd-calc-head { background: #3b3f46; }
[data-bs-theme="dark"] .rnd-grid td.rnd-calc { background: #303338; }
[data-bs-theme="dark"] .rnd-grid td.rnd-missing { background: #4f4826; }
[data-bs-theme="dark"] .swatch-missing { background: #4f4826; }
[data-bs-theme="dark"] .swatch-calc { background: #3b3f46; }
[data-bs-theme="dark"] .swatch-done { background: var(--cn-card); }
[data-bs-theme="dark"] .rnd-swatch { border-color: rgba(255, 255, 255, .15); }
[data-bs-theme="dark"] .rnd-kpi-warn .cn-stat-value { color: #f0a46b; }
[data-bs-theme="dark"] fieldset[disabled] .form-control,
[data-bs-theme="dark"] fieldset[disabled] .form-select { background-color: #303338; }

/* Third-party widgets: type-to-search pickers and the rich-text editor */
[data-bs-theme="dark"] .ts-control,
[data-bs-theme="dark"] .ts-wrapper.single.input-active .ts-control,
[data-bs-theme="dark"] .ts-dropdown { background: var(--bs-body-bg); color: var(--bs-body-color); border-color: var(--bs-border-color); }
[data-bs-theme="dark"] .ts-control input { color: var(--bs-body-color); }
[data-bs-theme="dark"] .ts-dropdown .active { background: #3d5064; color: #fff; }
[data-bs-theme="dark"] .ts-dropdown .create, [data-bs-theme="dark"] .ts-dropdown .no-results { color: var(--cn-muted); }
[data-bs-theme="dark"] .ts-wrapper.multi .ts-control > div { background: #43474e; color: #e4e7eb; border-color: #565b63; }
[data-bs-theme="dark"] .ql-toolbar.ql-snow, [data-bs-theme="dark"] .ql-container.ql-snow { border-color: var(--bs-border-color); }
[data-bs-theme="dark"] .ql-toolbar .ql-stroke { stroke: #c3cad3; }
[data-bs-theme="dark"] .ql-toolbar .ql-fill { fill: #c3cad3; }
[data-bs-theme="dark"] .ql-toolbar .ql-picker, [data-bs-theme="dark"] .ql-toolbar .ql-picker-label { color: #c3cad3; }
[data-bs-theme="dark"] .ql-picker-options { background: var(--cn-card); }
[data-bs-theme="dark"] .ql-editor.ql-blank::before { color: #7d8692; }
[data-bs-theme="dark"] .ql-snow .ql-tooltip { background: var(--cn-card); color: #dde2e8; border-color: var(--bs-border-color); box-shadow: none; }

/* Theme switch in the user menu */
.cn-theme-switch { display: flex; gap: .25rem; padding: .25rem 1rem .4rem; }
.dropdown-menu:has(.cn-theme-switch) { min-width: 15.5rem; }
.cn-theme-switch button { flex: 1; white-space: nowrap; border: 1px solid var(--cn-border); background: transparent; color: inherit; border-radius: .35rem; font-size: .78rem; padding: .25rem .3rem; }
.cn-theme-switch button.is-active { background: var(--cn-brand-soft); border-color: var(--cn-brand); color: var(--cn-brand); font-weight: 600; }
