:root[data-theme="dark"] {
  color-scheme: dark;
  --color-body-bg: #0b1220;
  --color-surface: #131c2e;
  --color-surface-2: #182338;
  --color-surface-3: #1f2c44;
  --color-white: #131c2e;                /* legacy alias, follows --color-surface */
  --color-border: #2a3a55;
  --color-border-strong: #3a4d6e;
  --color-border-lt: #1a2436;
  --color-overlay: rgba(0, 0, 0, 0.65);
  --color-text: #f1f5f9;
  --color-text-mid: #cbd5e1;
  --color-text-muted: #94a3b8;
  --color-text-faint: #64748b;

  /* Primary in dark mode — slightly brighter so it pops against the deep navy. */
  --color-primary: #3b82f6;
  --color-primary-hover: #60a5fa;
  --color-primary-active: #2563eb;
  --color-primary-light: #1e3a5f;
  --color-primary-soft:  #1e3a5f;
  --color-primary-ring:  rgba(59, 130, 246, 0.32);

  /* Semantic bg pairs — dark, low-saturation backgrounds with bright fg. */
  --color-success-bg: #052e16;
  --color-success-soft: #0a3a22;
  --color-success-hover: #34d399;        /* lighter than --color-success on dark bg */
  --color-danger-bg: #450a0a;
  --color-danger-soft: #5b1212;
  --color-danger-hover: #f87171;
  --color-warning-bg: #422006;
  --color-warning-soft: #5a2c0a;
  --color-warning-hover: #fbbf24;
  --color-info-bg: #172554;
  --color-info-soft: #1e2f6b;
  --color-purple-bg: #2e1065;
  --color-teal-bg:    #0a3329;
  --color-pink-bg:    #4a1133;
  --color-orange-bg:  #45200a;

  /* Gradient stops are tuned a little dimmer for dark mode so the hero
     panel doesn't blow out. */
  --gradient-primary: linear-gradient(135deg, #2563eb 0%, #1d4ed8 50%, #1e3a8a 100%);
  --gradient-card-glow: linear-gradient(180deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0) 100%);

  /* Surface tokens — one source of truth for the three dark-mode surface
     shades. Use these in new code instead of hardcoded hex values. */
  --color-card:        #131c2e;
  --color-card-subtle: #1a2436;
  --color-chart-bg:    #0b1220;
  --shadow-xs:    0 1px 2px rgba(0, 0, 0, 0.4);
  --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 3px rgba(0, 0, 0, 0.4);
  --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.3), 0 1px 4px rgba(0, 0, 0, 0.4);
  --shadow-md:   0 4px 12px rgba(0, 0, 0, 0.4), 0 2px 6px rgba(0, 0, 0, 0.3);
  --shadow-lg:   0 12px 32px rgba(0, 0, 0, 0.5), 0 4px 12px rgba(0, 0, 0, 0.3);
  --shadow-xl:   0 24px 48px rgba(0, 0, 0, 0.55), 0 8px 16px rgba(0, 0, 0, 0.3);
  --shadow-modal: 0 24px 64px rgba(0, 0, 0, 0.7), 0 8px 24px rgba(0, 0, 0, 0.4);
  --shadow-popup: 0 16px 48px rgba(0, 0, 0, 0.55), 0 4px 12px rgba(0, 0, 0, 0.4);
  --shadow-glow-primary: 0 8px 24px rgba(37, 99, 235, 0.32);
}

:root {
  /* Light-mode defaults so var() references don't blow up on pages that use
     the tokens unconditionally. Redefined above for dark. */
  --color-card: #ffffff;
  --color-card-subtle: #f9fafb;
  --color-chart-bg: #ffffff;
}

[data-theme="dark"] {
  background: var(--color-body-bg);
}

[data-theme="dark"] body {
  background: var(--color-body-bg);
  color: var(--color-text);
}

[data-theme="dark"] [style*="background:#fff"],
[data-theme="dark"] [style*="background: #fff"],
[data-theme="dark"] [style*="background:#FFF"],
[data-theme="dark"] [style*="background: #FFF"],
[data-theme="dark"] [style*="background:white"],
[data-theme="dark"] [style*="background: white"],
[data-theme="dark"] [style*="background: rgb(255, 255, 255)"],
[data-theme="dark"] [style*="background: rgb(255,255,255)"],
[data-theme="dark"] [style*="background-color:#fff"],
[data-theme="dark"] [style*="background-color: #fff"],
[data-theme="dark"] [style*="background-color:#FFF"],
[data-theme="dark"] [style*="background-color: #FFF"],
[data-theme="dark"] [style*="background-color:white"],
[data-theme="dark"] [style*="background-color: white"],
[data-theme="dark"] [style*="background:#f9fafb"],
[data-theme="dark"] [style*="background: #f9fafb"],
[data-theme="dark"] [style*="background-color:#f9fafb"],
[data-theme="dark"] [style*="background-color: #f9fafb"] {
  background: var(--color-white) !important;
  background-color: var(--color-white) !important;
}

[data-theme="dark"] [style*="background:#f3f4f6"],
[data-theme="dark"] [style*="background: #f3f4f6"],
[data-theme="dark"] [style*="background:#f8fafc"],
[data-theme="dark"] [style*="background: #f8fafc"],
[data-theme="dark"] [style*="background:#f0f4ff"],
[data-theme="dark"] [style*="background: #f0f4ff"],
[data-theme="dark"] [style*="background-color:#f3f4f6"],
[data-theme="dark"] [style*="background-color: #f3f4f6"],
[data-theme="dark"] [style*="background-color:#f8fafc"],
[data-theme="dark"] [style*="background-color: #f8fafc"],
[data-theme="dark"] [style*="background-color:#f0f4ff"],
[data-theme="dark"] [style*="background-color: #f0f4ff"] {
  background: #1a2436 !important;
  background-color: #1a2436 !important;
}

[data-theme="dark"] [style*="background:#eef2ff"],
[data-theme="dark"] [style*="background: #eef2ff"],
[data-theme="dark"] [style*="background:#eff6ff"],
[data-theme="dark"] [style*="background: #eff6ff"],
[data-theme="dark"] [style*="background-color:#eef2ff"],
[data-theme="dark"] [style*="background-color: #eef2ff"],
[data-theme="dark"] [style*="background-color:#eff6ff"],
[data-theme="dark"] [style*="background-color: #eff6ff"] {
  background: #1e3a5f !important;
  background-color: #1e3a5f !important;
}

[data-theme="dark"] [style*="background:#ecfdf5"],
[data-theme="dark"] [style*="background: #ecfdf5"],
[data-theme="dark"] [style*="background:#dcfce7"],
[data-theme="dark"] [style*="background: #dcfce7"],
[data-theme="dark"] [style*="background:#f0fdf4"],
[data-theme="dark"] [style*="background: #f0fdf4"],
[data-theme="dark"] [style*="background-color:#ecfdf5"],
[data-theme="dark"] [style*="background-color: #ecfdf5"],
[data-theme="dark"] [style*="background-color:#dcfce7"],
[data-theme="dark"] [style*="background-color: #dcfce7"],
[data-theme="dark"] [style*="background-color:#f0fdf4"],
[data-theme="dark"] [style*="background-color: #f0fdf4"] {
  background: #052e16 !important;
  background-color: #052e16 !important;
}

[data-theme="dark"] [style*="background:#fef2f2"],
[data-theme="dark"] [style*="background: #fef2f2"],
[data-theme="dark"] [style*="background:#fef3c7"],
[data-theme="dark"] [style*="background: #fef3c7"],
[data-theme="dark"] [style*="background:#fff7ed"],
[data-theme="dark"] [style*="background: #fff7ed"],
[data-theme="dark"] [style*="background:#fffbeb"],
[data-theme="dark"] [style*="background: #fffbeb"],
[data-theme="dark"] [style*="background-color:#fef2f2"],
[data-theme="dark"] [style*="background-color: #fef2f2"],
[data-theme="dark"] [style*="background-color:#fef3c7"],
[data-theme="dark"] [style*="background-color: #fef3c7"],
[data-theme="dark"] [style*="background-color:#fff7ed"],
[data-theme="dark"] [style*="background-color: #fff7ed"],
[data-theme="dark"] [style*="background-color:#fffbeb"],
[data-theme="dark"] [style*="background-color: #fffbeb"] {
  background: #422006 !important;
  background-color: #422006 !important;
}

[data-theme="dark"] [style*="background:#f5f3ff"],
[data-theme="dark"] [style*="background: #f5f3ff"],
[data-theme="dark"] [style*="background:#faf5ff"],
[data-theme="dark"] [style*="background: #faf5ff"],
[data-theme="dark"] [style*="background:#fdf4ff"],
[data-theme="dark"] [style*="background: #fdf4ff"],
[data-theme="dark"] [style*="background-color:#f5f3ff"],
[data-theme="dark"] [style*="background-color: #f5f3ff"],
[data-theme="dark"] [style*="background-color:#faf5ff"],
[data-theme="dark"] [style*="background-color: #faf5ff"],
[data-theme="dark"] [style*="background-color:#fdf4ff"],
[data-theme="dark"] [style*="background-color: #fdf4ff"] {
  background: #2e1065 !important;
  background-color: #2e1065 !important;
}

[data-theme="dark"] [style*="color:#1a1a2e"],
[data-theme="dark"] [style*="color: #1a1a2e"],
[data-theme="dark"] [style*="color:#111827"],
[data-theme="dark"] [style*="color: #111827"],
[data-theme="dark"] [style*="color:#374151"],
[data-theme="dark"] [style*="color: #374151"] {
  color: var(--color-text) !important;
}

[data-theme="dark"] [style*="color:#6b7280"],
[data-theme="dark"] [style*="color: #6b7280"],
[data-theme="dark"] [style*="color:#9ca3af"],
[data-theme="dark"] [style*="color: #9ca3af"] {
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] [style*="border:1px solid #e5e7eb"],
[data-theme="dark"] [style*="border: 1px solid #e5e7eb"],
[data-theme="dark"] [style*="border: 1px solid rgb(229, 231, 235)"],
[data-theme="dark"] [style*="border:1px solid #f3f4f6"],
[data-theme="dark"] [style*="border: 1px solid #f3f4f6"],
[data-theme="dark"] [style*="border: 1px solid rgb(243, 244, 246)"],
[data-theme="dark"] [style*="border-top:1px solid #eef2f7"],
[data-theme="dark"] [style*="border-top: 1px solid #eef2f7"],
[data-theme="dark"] [style*="border-bottom:1px solid #eef2f7"],
[data-theme="dark"] [style*="border-bottom: 1px solid #eef2f7"],
[data-theme="dark"] [style*="border-color:#e5e7eb"],
[data-theme="dark"] [style*="border-color: #e5e7eb"],
[data-theme="dark"] [style*="border-color:#f3f4f6"],
[data-theme="dark"] [style*="border-color: #f3f4f6"],
[data-theme="dark"] [style*="border-color:#eef2f7"],
[data-theme="dark"] [style*="border-color: #eef2f7"] {
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .sidebar {
  background: #1e293b;
  border-right-color: #334155;
}

[data-theme="dark"] .sidebar a,
[data-theme="dark"] .logo span,
[data-theme="dark"] .admin-name {
  color: #cbd5e1;
}

[data-theme="dark"] .header {
  background: rgba(15, 23, 42, 0.92);
}

[data-theme="dark"] .card,
[data-theme="dark"] .modal-content,
[data-theme="dark"] .toolbar-search,
[data-theme="dark"] .header-search,
[data-theme="dark"] .select,
[data-theme="dark"] .btn,
[data-theme="dark"] .header-btn,
[data-theme="dark"] .stat-card,
[data-theme="dark"] .eng-card,
[data-theme="dark"] .chart-card,
[data-theme="dark"] .tpl-card,
[data-theme="dark"] .action-menu-list {
  background: var(--color-white) !important;
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .input,
[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea {
  background: #0f172a !important;
  color: var(--color-text) !important;
  border-color: var(--color-border) !important;
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder {
  color: var(--color-text-faint);
}

[data-theme="dark"] table thead th,
[data-theme="dark"] table th {
  background: #0f172a !important;
  color: var(--color-text-mid) !important;
  border-bottom: 1px solid var(--color-border) !important;
}

/* ── Reports page overrides — class rules live in the page's own <style>, so
      attribute-substring selectors can't reach them. ─────────────────────── */
[data-theme="dark"] .breakdown-label { color: var(--color-text) !important; }
[data-theme="dark"] .breakdown-value { color: var(--color-text) !important; }
[data-theme="dark"] .breakdown-item { border-bottom-color: var(--color-border) !important; }
[data-theme="dark"] .chart-title { color: var(--color-text) !important; }
[data-theme="dark"] .chart-card {
  background: var(--color-white) !important;
  border-color: var(--color-border) !important;
}
[data-theme="dark"] .section-hdr-label { color: var(--color-text-mid) !important; }
[data-theme="dark"] .section-hdr-line { background: var(--color-border) !important; }
[data-theme="dark"] .date-row label { color: var(--color-text-mid) !important; }

[data-theme="dark"] th,
[data-theme="dark"] td,
[data-theme="dark"] .sidebar-bottom,
[data-theme="dark"] .toolbar-search,
[data-theme="dark"] .header-search,
[data-theme="dark"] .header-btn,
[data-theme="dark"] .select,
[data-theme="dark"] .card,
[data-theme="dark"] .stat-card,
[data-theme="dark"] .chart-card,
[data-theme="dark"] .tpl-card,
[data-theme="dark"] .eng-card {
  border-color: var(--color-border) !important;
}

/* Row dividers — shorthand `border-bottom: 1px solid var(--color-border-lt)`
   in components.css resolves to #1e293b in dark (same as card bg → invisible).
   Force the bottom border to use the brighter border color. */
[data-theme="dark"] tbody td {
  border-bottom: 1px solid var(--color-border) !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] tbody tr:last-child td {
  border-bottom: none !important;
}

[data-theme="dark"] tr:hover td {
  background: var(--color-card-subtle) !important;
}

[data-theme="dark"] .table tbody tr:hover td,
[data-theme="dark"] tr[onclick]:hover td {
  background: #1e3a5f !important;
}

[data-theme="dark"] .btn:hover,
[data-theme="dark"] .header-btn:hover,
[data-theme="dark"] .nav-item:hover,
[data-theme="dark"] .stat-card:hover,
[data-theme="dark"] .action-menu-item:hover {
  background: #334155 !important;
}

[data-theme="dark"] .action-menu-item {
  color: var(--color-text);
}

[data-theme="dark"] .admin-role,
[data-theme="dark"] .nav-section,
[data-theme="dark"] .header-left p,
[data-theme="dark"] .header-search i,
[data-theme="dark"] .toolbar-search i,
[data-theme="dark"] .eng-card-label,
[data-theme="dark"] .stat-label,
[data-theme="dark"] .user-cell-sub,
[data-theme="dark"] .alert-time,
[data-theme="dark"] .section-hdr-label {
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .hamburger-btn,
[data-theme="dark"] .sidebar-close-btn,
[data-theme="dark"] #notif-popup {
  background: var(--color-white);
  border-color: var(--color-border);
  color: var(--color-text);
}

[data-theme="dark"] .np-header,
[data-theme="dark"] .np-tabs,
[data-theme="dark"] .np-footer,
[data-theme="dark"] .np-item {
  border-color: var(--color-border);
}

[data-theme="dark"] .np-title,
[data-theme="dark"] .np-item-title {
  color: var(--color-text);
}

[data-theme="dark"] .np-item:hover {
  background: var(--color-card-subtle);
}

[data-theme="dark"] .np-mark-all:hover {
  background: #1e3a5f;
}

[data-theme="dark"] .eng-progress {
  background: #334155;
}

[data-theme="dark"] .stat-value,
[data-theme="dark"] .chart-card-title,
[data-theme="dark"] .hero-name,
[data-theme="dark"] .user-cell-name,
[data-theme="dark"] .alert-text,
[data-theme="dark"] .section-hdr-label,
[data-theme="dark"] .header-search input,
[data-theme="dark"] #lastUpdatedLabel {
  color: var(--color-text) !important;
}

[data-theme="dark"] .section-hdr-line,
[data-theme="dark"] .alert-item,
[data-theme="dark"] .agenda-item:hover {
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .hero-card,
[data-theme="dark"] .ctc-modal,
[data-theme="dark"] .tab-count,
[data-theme="dark"] .chip-id,
[data-theme="dark"] .chip-deactivated {
  background: var(--color-white) !important;
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .hero-card {
  background: var(--color-white) !important;
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .hero-contact,
[data-theme="dark"] .tab-btn,
[data-theme="dark"] .ctc-row label {
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .hero-contact i {
  color: var(--color-text-faint) !important;
}

[data-theme="dark"] .tabs-bar {
  border-bottom-color: var(--color-border) !important;
}

[data-theme="dark"] .tab-btn:hover {
  color: var(--color-text) !important;
}

[data-theme="dark"] .tab-count {
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .tab-btn.active .tab-count {
  background: #1e3a5f !important;
  color: #93c5fd !important;
}

[data-theme="dark"] .chip-id {
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .chip-paying,
[data-theme="dark"] .chip-active,
[data-theme="dark"] .chip-blocked,
[data-theme="dark"] .chip-kyc,
[data-theme="dark"] .chip-tag,
[data-theme="dark"] .mode-badge.calls,
[data-theme="dark"] .mode-badge.email,
[data-theme="dark"] .mode-badge.wts,
[data-theme="dark"] .mode-badge.chat {
  border: 1px solid transparent !important;
}

[data-theme="dark"] .empty-state i[style*="color:#e5e7eb"],
[data-theme="dark"] .empty-state i[style*="color: #e5e7eb"] {
  color: var(--color-border) !important;
}

[data-theme="dark"] .section-hdr-line {
  background: var(--color-border) !important;
}

[data-theme="dark"] .agenda-item:hover {
  background: #334155 !important;
}

[data-theme="dark"] .header-btn .notif-dot {
  border-color: var(--color-white) !important;
}

[data-theme="dark"] .loading-spinner {
  border-color: var(--color-border) !important;
  border-top-color: var(--color-primary) !important;
}

[data-theme="dark"] .stat-icon.blue {
  background: #1e3a5f !important;
}

[data-theme="dark"] .stat-icon.green {
  background: #052e16 !important;
}

[data-theme="dark"] .stat-icon.orange {
  background: #422006 !important;
}

[data-theme="dark"] .stat-icon.purple {
  background: #2e1065 !important;
}

[data-theme="dark"] .stat-icon.red {
  background: #450a0a !important;
}

[data-theme="dark"] .stat-icon.teal {
  background: #0f3d3a !important;
  color: #2dd4bf !important;
}

[data-theme="dark"] .status-badge.gray,
[data-theme="dark"] .platform-badge {
  background: rgba(148, 163, 184, 0.28);
  color: #e2e8f0;
  border: 1px solid rgba(148, 163, 184, 0.45);
}

/* Tickets page: replace bright pills with darker tinted chips */
[data-theme="dark"] .type-badge,
[data-theme="dark"] .tab-count,
[data-theme="dark"] .chip-id,
[data-theme="dark"] .chip-deactivated {
  background: rgba(148, 163, 184, 0.28) !important;
  color: #e2e8f0 !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
}

[data-theme="dark"] .priority-badge,
[data-theme="dark"] .source-badge,
[data-theme="dark"] .status-badge,
[data-theme="dark"] .mode-badge {
  border: 1px solid transparent !important;
  box-shadow: none !important;
}

/* Communications page */
[data-theme="dark"] .tab-bar,
[data-theme="dark"] .inbox-layout,
[data-theme="dark"] .thread-icon {
  background: var(--color-white) !important;
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .tab-btn {
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .tab-btn:hover {
  color: var(--color-text) !important;
  background: #334155 !important;
}

[data-theme="dark"] .tab-btn.active {
  background: #1e3a5f !important;
  color: #dbeafe !important;
}

[data-theme="dark"] .tab-btn .badge {
  background: rgba(255, 255, 255, 0.12) !important;
  color: inherit !important;
}

[data-theme="dark"] .tab-btn:not(.active) .badge,
[data-theme="dark"] .cbadge.CLOSED {
  background: #1a2436 !important;
  color: var(--color-text-muted) !important;
  border: 1px solid #334155 !important;
}

[data-theme="dark"] .call-row-btn {
  background: #1a2436 !important;
  border-color: #334155 !important;
  color: #86efac !important;
}

[data-theme="dark"] .call-row-btn:hover {
  background: rgba(34, 197, 94, 0.16) !important;
  border-color: rgba(34, 197, 94, 0.28) !important;
}

[data-theme="dark"] .entity-chip {
  background: #1a2436 !important;
  color: var(--color-text) !important;
  border: 1px solid #334155 !important;
}

[data-theme="dark"] .sb-initiated {
  background: rgba(59, 130, 246, 0.16) !important;
  border-color: rgba(59, 130, 246, 0.28) !important;
  color: #93c5fd !important;
}

[data-theme="dark"] .sb-ringing,
[data-theme="dark"] .cbadge.PENDING {
  background: rgba(245, 158, 11, 0.16) !important;
  border: 1px solid rgba(245, 158, 11, 0.28) !important;
  color: #fbbf24 !important;
}

[data-theme="dark"] .sb-answered,
[data-theme="dark"] .sb-completed,
[data-theme="dark"] .cbadge.OPEN {
  background: rgba(34, 197, 94, 0.16) !important;
  border: 1px solid rgba(34, 197, 94, 0.28) !important;
  color: #86efac !important;
}

[data-theme="dark"] .sb-missed {
  background: rgba(249, 115, 22, 0.16) !important;
  border: 1px solid rgba(249, 115, 22, 0.28) !important;
  color: #fdba74 !important;
}

[data-theme="dark"] .sb-failed {
  background: rgba(239, 68, 68, 0.16) !important;
  border: 1px solid rgba(239, 68, 68, 0.28) !important;
  color: #fca5a5 !important;
}

[data-theme="dark"] .convo-row,
[data-theme="dark"] .thread-item,
[data-theme="dark"] .thread-detail-header,
[data-theme="dark"] .reply-area {
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .convo-row:hover,
[data-theme="dark"] .thread-item:hover {
  background: var(--color-card-subtle) !important;
}

[data-theme="dark"] .convo-row.unread,
[data-theme="dark"] .thread-item.active {
  background: #1e3a5f !important;
}

[data-theme="dark"] .convo-subject,
[data-theme="dark"] .detail-header-info .thread-name,
[data-theme="dark"] #headerSub+* {
  color: var(--color-text) !important;
}

[data-theme="dark"] .convo-time,
[data-theme="dark"] .convo-last,
[data-theme="dark"] .input-hint,
[data-theme="dark"] #convoCount {
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .convo-icon.WHATSAPP {
  background: rgba(34, 197, 94, 0.16) !important;
  color: #86efac !important;
}

[data-theme="dark"] .convo-icon.EMAIL {
  background: rgba(59, 130, 246, 0.16) !important;
  color: #93c5fd !important;
}

[data-theme="dark"] .convo-icon.CALL {
  background: rgba(168, 85, 247, 0.16) !important;
  color: #d8b4fe !important;
}

[data-theme="dark"] .convo-icon.SMS {
  background: rgba(249, 115, 22, 0.16) !important;
  color: #fdba74 !important;
}

[data-theme="dark"] .convo-icon.INTERNAL_CHAT {
  background: rgba(20, 184, 166, 0.16) !important;
  color: #5eead4 !important;
}

/* Ticket detail page */
[data-theme="dark"] .messages-panel,
[data-theme="dark"] .messages-header,
[data-theme="dark"] .messages-body,
[data-theme="dark"] .add-message-form,
[data-theme="dark"] .form-select-sm,
[data-theme="dark"] .msg-textarea,
[data-theme="dark"] .status-select-full,
[data-theme="dark"] .log-item {
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .messages-panel {
  background: var(--color-white) !important;
}

[data-theme="dark"] .messages-header,
[data-theme="dark"] .messages-body {
  background: var(--color-white) !important;
}

[data-theme="dark"] .messages-header-title,
[data-theme="dark"] .assign-row .value {
  color: var(--color-text) !important;
}

[data-theme="dark"] .msg-count-badge {
  background: #1e3a5f !important;
  color: #93c5fd !important;
}

[data-theme="dark"] .empty-msgs,
[data-theme="dark"] .unassigned-state,
[data-theme="dark"] .assign-empty,
[data-theme="dark"] .assign-row .label,
[data-theme="dark"] .log-item,
[data-theme="dark"] .add-message-form>div[style*='color:#9ca3af'],
[data-theme="dark"] .add-message-form>div[style*='color: #9ca3af'] {
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .empty-msgs i,
[data-theme="dark"] i[style*='color:#e5e7eb'],
[data-theme="dark"] i[style*='color: #e5e7eb'] {
  color: var(--color-border) !important;
}

[data-theme="dark"] .msg-type-chip {
  background: #1a2436 !important;
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .msg-bubble.customer {
  background: #1a2436 !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] .msg-bubble.executive {
  background: rgba(34, 197, 94, 0.12) !important;
  border-color: rgba(34, 197, 94, 0.24) !important;
  color: #86efac !important;
}

[data-theme="dark"] .add-message-form {
  background: var(--color-card-subtle) !important;
}

[data-theme="dark"] .form-select-sm,
[data-theme="dark"] .msg-textarea,
[data-theme="dark"] .status-select-full {
  background: #0f172a !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] .msg-textarea:focus,
[data-theme="dark"] .status-select-full:focus,
[data-theme="dark"] .form-select-sm:focus {
  border-color: var(--color-primary) !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.16) !important;
}

[data-theme="dark"] .send-btn {
  background: #1e3a5f !important;
}

[data-theme="dark"] .send-btn:hover {
  background: #2563a8 !important;
}

[data-theme="dark"] .log-item {
  background: var(--color-card-subtle) !important;
  border-left-color: #334155 !important;
}

[data-theme="dark"] .priority-badge.low,
[data-theme="dark"] .status-badge.open {
  background: rgba(34, 197, 94, 0.28) !important;
  border-color: rgba(34, 197, 94, 0.45) !important;
  color: #86efac !important;
}

[data-theme="dark"] .priority-badge.medium,
[data-theme="dark"] .status-badge.waiting {
  background: rgba(245, 158, 11, 0.28) !important;
  border-color: rgba(245, 158, 11, 0.45) !important;
  color: #fbbf24 !important;
}

[data-theme="dark"] .priority-badge.high {
  background: rgba(239, 68, 68, 0.28) !important;
  border-color: rgba(239, 68, 68, 0.45) !important;
  color: #fca5a5 !important;
}

[data-theme="dark"] .status-badge.inprogress,
[data-theme="dark"] .source-badge.internal {
  background: rgba(59, 130, 246, 0.28) !important;
  border-color: rgba(59, 130, 246, 0.45) !important;
  color: #93c5fd !important;
}

[data-theme="dark"] .status-badge.resolved {
  background: rgba(20, 184, 166, 0.28) !important;
  border-color: rgba(20, 184, 166, 0.45) !important;
  color: #5eead4 !important;
}

[data-theme="dark"] .status-badge.closed {
  background: rgba(148, 163, 184, 0.28) !important;
  border-color: rgba(148, 163, 184, 0.45) !important;
  color: #e2e8f0 !important;
}

[data-theme="dark"] .source-badge.public,
[data-theme="dark"] .mode-badge.chat {
  background: rgba(168, 85, 247, 0.28) !important;
  border-color: rgba(168, 85, 247, 0.45) !important;
  color: #d8b4fe !important;
}

[data-theme="dark"] .mode-badge.calls {
  background: rgba(34, 197, 94, 0.28) !important;
  border-color: rgba(34, 197, 94, 0.45) !important;
  color: #86efac !important;
}

[data-theme="dark"] .mode-badge.email {
  background: rgba(59, 130, 246, 0.28) !important;
  border-color: rgba(59, 130, 246, 0.45) !important;
  color: #93c5fd !important;
}

[data-theme="dark"] .mode-badge.wts {
  background: rgba(20, 184, 166, 0.28) !important;
  border-color: rgba(20, 184, 166, 0.45) !important;
  color: #5eead4 !important;
}

[data-theme="dark"] .action-btn.view {
  background: var(--badge-bg-blue) !important;
  color: var(--badge-fg-blue) !important;
  border: 1px solid rgba(59, 130, 246, 0.45) !important;
}

[data-theme="dark"] .action-btn.view:hover {
  background: rgba(59, 130, 246, 0.42) !important;
  color: #eff6ff !important;
}

[data-theme="dark"] .action-btn.edit {
  background: var(--badge-bg-orange) !important;
  color: var(--badge-fg-orange) !important;
  border: 1px solid rgba(234, 88, 12, 0.45) !important;
}

[data-theme="dark"] .action-btn.edit:hover {
  background: rgba(234, 88, 12, 0.42) !important;
  color: #fff7ed !important;
}

[data-theme="dark"] .action-btn.danger {
  background: var(--badge-bg-red) !important;
  color: var(--badge-fg-red) !important;
  border: 1px solid rgba(239, 68, 68, 0.45) !important;
}

[data-theme="dark"] .action-btn.danger:hover {
  background: rgba(239, 68, 68, 0.42) !important;
  color: #fee2e2 !important;
}

[data-theme="dark"] .action-btn.success {
  background: var(--badge-bg-green) !important;
  color: var(--badge-fg-green) !important;
  border: 1px solid rgba(5, 150, 105, 0.45) !important;
}

[data-theme="dark"] .action-btn.success:hover {
  background: rgba(5, 150, 105, 0.42) !important;
  color: #ecfdf5 !important;
}

[data-theme="dark"] .action-btn:not(.view):not(.edit):not(.danger):not(.success):not(.call):not(.call-off):not(.type):not(.rotate) {
  background: var(--badge-bg-neutral) !important;
  color: var(--badge-fg-neutral) !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
}

[data-theme="dark"] .action-btn:not(.view):not(.edit):not(.danger):not(.success):not(.call):not(.call-off):not(.type):not(.rotate):hover {
  background: rgba(148, 163, 184, 0.42) !important;
  color: #f1f5f9 !important;
}

[data-theme="dark"] input[type='checkbox'] {
  accent-color: #3b82f6;
}

/* Tasks page */
[data-theme="dark"] .density-btn,
[data-theme="dark"] .status-dropdown-menu,
[data-theme="dark"] .call-feedback,
[data-theme="dark"] #taskModal .input[readonly],
[data-theme="dark"] #taskCallModal .input[readonly] {
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .density-btn {
  background: #1a2436 !important;
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .density-btn:hover {
  background: #334155 !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] .density-btn.active {
  background: #1e3a5f !important;
  color: #dbeafe !important;
  border-color: #2563a8 !important;
}

[data-theme="dark"] .status-pill-btn .badge {
  border: 1px solid transparent !important;
}

[data-theme="dark"] .status-dropdown-menu {
  background: var(--color-white) !important;
  box-shadow: var(--shadow-card) !important;
}

[data-theme="dark"] .status-dropdown-menu button {
  color: var(--color-text) !important;
}

[data-theme="dark"] .status-dropdown-menu button:hover {
  background: #334155 !important;
}

[data-theme="dark"] .action-btn.call {
  background: var(--badge-bg-green) !important;
  color: var(--badge-fg-green) !important;
  border: 1px solid rgba(5, 150, 105, 0.45) !important;
}

[data-theme="dark"] .action-btn.call:hover {
  background: rgba(5, 150, 105, 0.42) !important;
  color: #f0fdf4 !important;
}

[data-theme="dark"] .action-btn.call-off {
  background: var(--badge-bg-neutral) !important;
  color: var(--badge-fg-neutral) !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
}

[data-theme="dark"] .action-btn.call-off:hover {
  background: rgba(148, 163, 184, 0.42) !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] .action-btn.type {
  background: var(--badge-bg-purple) !important;
  color: var(--badge-fg-purple) !important;
  border: 1px solid rgba(147, 51, 234, 0.45) !important;
}

[data-theme="dark"] .action-btn.type:hover {
  background: rgba(147, 51, 234, 0.42) !important;
  color: #faf5ff !important;
}

[data-theme="dark"] .desc-cell {
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .due-overdue {
  color: #fca5a5 !important;
}

[data-theme="dark"] .call-feedback.ok {
  background: rgba(34, 197, 94, 0.16) !important;
  color: #86efac !important;
}

[data-theme="dark"] .call-feedback.err {
  background: rgba(239, 68, 68, 0.16) !important;
  color: #fca5a5 !important;
}

[data-theme="dark"] #taskModal .input[readonly],
[data-theme="dark"] #taskCallModal .input[readonly] {
  background: #1a2436 !important;
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] #tcCallBtn[style*='background: #059669'],
[data-theme="dark"] #tcCallBtn[style*='background:#059669'] {
  background: #166534 !important;
  border-color: #166534 !important;
}

[data-theme="dark"] #tcCallBtn[style*='background: #059669']:hover,
[data-theme="dark"] #tcCallBtn[style*='background:#059669']:hover {
  background: #15803d !important;
  border-color: #15803d !important;
}

/* Task detail page */
[data-theme="dark"] .hero-card,
[data-theme="dark"] .card,
[data-theme="dark"] .progress-bar-wrap,
[data-theme="dark"] .checklist-item:hover,
[data-theme="dark"] .cl-input,
[data-theme="dark"] .add-item-input {
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .hero-card,
[data-theme="dark"] .card {
  background: var(--color-white) !important;
}

[data-theme="dark"] .card-header,
[data-theme="dark"] .add-item-row,
[data-theme="dark"] .cl-view-item {
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .task-title,
[data-theme="dark"] .card-title,
[data-theme="dark"] .cl-view-value {
  color: var(--color-text) !important;
}

[data-theme="dark"] .task-desc,
[data-theme="dark"] .checklist-item label,
[data-theme="dark"] .cl-label,
[data-theme="dark"] .cl-checkbox-wrap label,
[data-theme="dark"] .cl-view-label {
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .checklist-item label.done,
[data-theme="dark"] .checklist-item .item-date,
[data-theme="dark"] .cl-view-empty {
  color: var(--color-text-faint) !important;
}

[data-theme="dark"] .progress-bar-wrap {
  background: #1a2436 !important;
}

[data-theme="dark"] .progress-bar {
  background: #2563a8 !important;
}

[data-theme="dark"] .checklist-item:hover {
  background: var(--color-card-subtle) !important;
}

[data-theme="dark"] .add-item-input,
[data-theme="dark"] .cl-input {
  background: #0f172a !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] .chip-pending {
  background: rgba(245, 158, 11, 0.28) !important;
  color: #fbbf24 !important;
  border: 1px solid rgba(245, 158, 11, 0.45) !important;
}

[data-theme="dark"] .chip-in_progress,
[data-theme="dark"] .chip-type {
  background: rgba(59, 130, 246, 0.28) !important;
  color: #93c5fd !important;
  border: 1px solid rgba(59, 130, 246, 0.45) !important;
}

[data-theme="dark"] .chip-completed,
[data-theme="dark"] .cl-submitted-badge {
  background: rgba(34, 197, 94, 0.28) !important;
  color: #86efac !important;
  border: 1px solid rgba(34, 197, 94, 0.45) !important;
}

[data-theme="dark"] .chip-overdue,
[data-theme="dark"] .chip-priority-high {
  background: rgba(239, 68, 68, 0.28) !important;
  color: #fca5a5 !important;
  border: 1px solid rgba(239, 68, 68, 0.45) !important;
}

[data-theme="dark"] .chip-priority-low {
  background: rgba(148, 163, 184, 0.28) !important;
  color: #e2e8f0 !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
}

[data-theme="dark"] .chip-priority-medium {
  background: rgba(249, 115, 22, 0.28) !important;
  color: #fdba74 !important;
  border: 1px solid rgba(249, 115, 22, 0.45) !important;
}

[data-theme="dark"] .chip-priority-urgent {
  background: var(--badge-bg-red) !important;
  color: var(--badge-fg-red) !important;
  border: 1px solid rgba(239, 68, 68, 0.45) !important;
}

/* Task history page */
[data-theme="dark"] .priority-badge {
  border: 1px solid transparent !important;
}

[data-theme="dark"] .priority-low {
  background: rgba(148, 163, 184, 0.28) !important;
  color: #e2e8f0 !important;
  border-color: rgba(148, 163, 184, 0.45) !important;
}

[data-theme="dark"] .priority-medium {
  background: rgba(249, 115, 22, 0.28) !important;
  color: #fdba74 !important;
  border-color: rgba(249, 115, 22, 0.45) !important;
}

[data-theme="dark"] .priority-high {
  background: rgba(239, 68, 68, 0.28) !important;
  color: #fca5a5 !important;
  border-color: rgba(239, 68, 68, 0.45) !important;
}

[data-theme="dark"] .priority-urgent {
  background: var(--badge-bg-red) !important;
  color: var(--badge-fg-red) !important;
  border-color: rgba(239, 68, 68, 0.45) !important;
}

[data-theme="dark"] a[style*='color:#1a1a2e'],
[data-theme="dark"] a[style*='color: #1a1a2e'] {
  color: var(--color-text) !important;
}

/* Sales page */
[data-theme="dark"] .table-card,
[data-theme="dark"] .search-input,
[data-theme="dark"] .filter-select,
[data-theme="dark"] .page-btn,
[data-theme="dark"] .item-block,
[data-theme="dark"] .item-input,
[data-theme="dark"] .pay-summary,
[data-theme="dark"] .form-textarea,
[data-theme="dark"] #saleModal .input[readonly] {
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .table-card,
[data-theme="dark"] .item-block,
[data-theme="dark"] .pay-summary {
  background: var(--color-white) !important;
}

[data-theme="dark"] .search-input,
[data-theme="dark"] .filter-select,
[data-theme="dark"] .item-input,
[data-theme="dark"] .form-textarea,
[data-theme="dark"] #saleModal .input[readonly] {
  background: #0f172a !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] .search-wrap i,
[data-theme="dark"] .stat-label,
[data-theme="dark"] .stat-sub,
[data-theme="dark"] .page-info,
[data-theme="dark"] .item-block-label,
[data-theme="dark"] .item-field-label,
[data-theme="dark"] .pay-label {
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .stat-val,
[data-theme="dark"] .item-total-val,
[data-theme="dark"] .pay-val {
  color: var(--color-text) !important;
}

[data-theme="dark"] .td-mono {
  color: #93c5fd !important;
}

[data-theme="dark"] td[style*='font-weight:700;color:#1a1a2e'],
[data-theme="dark"] td[style*='font-weight: 700; color:#1a1a2e'],
[data-theme="dark"] td[style*='font-weight:700;color: #1a1a2e'] {
  color: var(--color-text) !important;
}

[data-theme="dark"] .sbadge {
  border: 1px solid transparent !important;
}

[data-theme="dark"] .sbadge.DRAFT {
  background: #1a2436 !important;
  color: var(--color-text-muted) !important;
  border-color: #334155 !important;
}

[data-theme="dark"] .sbadge.CONFIRMED {
  background: rgba(59, 130, 246, 0.16) !important;
  color: #93c5fd !important;
  border-color: rgba(59, 130, 246, 0.28) !important;
}

[data-theme="dark"] .sbadge.PROCESSING,
[data-theme="dark"] .sbadge.SHIPPED,
[data-theme="dark"] .sbadge.REFUNDED {
  background: rgba(245, 158, 11, 0.16) !important;
  color: #fbbf24 !important;
  border-color: rgba(245, 158, 11, 0.28) !important;
}

[data-theme="dark"] .sbadge.DELIVERED,
[data-theme="dark"] .sbadge.PAID {
  background: rgba(34, 197, 94, 0.16) !important;
  color: #86efac !important;
  border-color: rgba(34, 197, 94, 0.28) !important;
}

[data-theme="dark"] .sbadge.INVOICED,
[data-theme="dark"] .sbadge.PARTIALLY_PAID {
  background: rgba(168, 85, 247, 0.16) !important;
  color: #d8b4fe !important;
  border-color: rgba(168, 85, 247, 0.28) !important;
}

[data-theme="dark"] .sbadge.CANCELLED {
  background: rgba(239, 68, 68, 0.16) !important;
  color: #fca5a5 !important;
  border-color: rgba(239, 68, 68, 0.28) !important;
}

[data-theme="dark"] .page-btn {
  background: #1a2436 !important;
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .page-btn:hover:not(:disabled) {
  background: #334155 !important;
  color: var(--color-text) !important;
  border-color: #2563a8 !important;
}

[data-theme="dark"] .page-btn.active {
  background: #1e3a5f !important;
  color: #dbeafe !important;
  border-color: #2563a8 !important;
}

[data-theme="dark"] .remove-item-btn {
  background: #1a2436 !important;
  border-color: #7f1d1d !important;
  color: #fca5a5 !important;
}

[data-theme="dark"] .remove-item-btn:hover {
  background: #450a0a !important;
}

[data-theme="dark"] .item-block-footer,
[data-theme="dark"] .pay-row.total {
  border-color: var(--color-border) !important;
}

/* Sale detail page */
[data-theme="dark"] .card,
[data-theme="dark"] .items-table th,
[data-theme="dark"] .edit-items-table th,
[data-theme="dark"] .items-table-wrap-sm,
[data-theme="dark"] .pay-mini,
[data-theme="dark"] .item-input,
[data-theme="dark"] .status-select-full,
[data-theme="dark"] .form-textarea {
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .card,
[data-theme="dark"] .pay-mini {
  background: var(--color-white) !important;
}

[data-theme="dark"] .card-header,
[data-theme="dark"] .info-cell,
[data-theme="dark"] .items-table th,
[data-theme="dark"] .items-table td,
[data-theme="dark"] .pay-row,
[data-theme="dark"] .side-row,
[data-theme="dark"] .edit-items-table th,
[data-theme="dark"] .edit-items-table td {
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .card-title,
[data-theme="dark"] .info-value,
[data-theme="dark"] .items-table td,
[data-theme="dark"] .pay-val,
[data-theme="dark"] .side-value,
[data-theme="dark"] .timeline-text strong {
  color: var(--color-text) !important;
}

[data-theme="dark"] .info-label,
[data-theme="dark"] .items-table th,
[data-theme="dark"] .pay-label,
[data-theme="dark"] .side-label,
[data-theme="dark"] .timeline-item,
[data-theme="dark"] .timeline-text,
/* [data-theme="dark"] .hero-sub {
  color: var(--color-text-muted) !important;
} */

[data-theme="dark"] .info-value.mono {
  color: #93c5fd !important;
}

[data-theme="dark"] .items-table th,
[data-theme="dark"] .edit-items-table th {
  background: #1a2436 !important;
}

[data-theme="dark"] .pay-val.grand {
  color: #93c5fd !important;
}

[data-theme="dark"] .pay-val.red,
[data-theme="dark"] td[style*='color:#ef4444'],
[data-theme="dark"] td[style*='color: #ef4444'],
[data-theme="dark"] span[style*='color:#ef4444'],
[data-theme="dark"] span[style*='color: #ef4444'] {
  color: #fca5a5 !important;
}

[data-theme="dark"] .pay-val.green {
  color: #86efac !important;
}

[data-theme="dark"] .side-row,
[data-theme="dark"] .pay-row,
[data-theme="dark"] .timeline-item {
  background: transparent !important;
}

[data-theme="dark"] .status-select-full,
[data-theme="dark"] .item-input,
[data-theme="dark"] .form-textarea {
  background: #0f172a !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] .remove-item-btn {
  background: #1a2436 !important;
  border-color: #7f1d1d !important;
  color: #fca5a5 !important;
}

[data-theme="dark"] .remove-item-btn:hover {
  background: #450a0a !important;
}

[data-theme="dark"] .timeline-icon.updated {
  background: #475569 !important;
}

/* Deals list/detail pages */
[data-theme="dark"] .table-card,
[data-theme="dark"] .search-input,
[data-theme="dark"] .filter-select,
[data-theme="dark"] .page-btn,
[data-theme="dark"] .pipe-step,
[data-theme="dark"] .card,
[data-theme="dark"] #editModal>div,
[data-theme="dark"] #editModal input[type='text'],
[data-theme="dark"] #editModal input[type='number'],
[data-theme="dark"] #editModal input[type='date'],
[data-theme="dark"] #editModal select,
[data-theme="dark"] #editModal textarea {
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .table-card,
[data-theme="dark"] .card,
[data-theme="dark"] #editModal>div {
  background: var(--color-white) !important;
}

[data-theme="dark"] .search-input,
[data-theme="dark"] .filter-select,
[data-theme="dark"] #editModal input[type='text'],
[data-theme="dark"] #editModal input[type='number'],
[data-theme="dark"] #editModal input[type='date'],
[data-theme="dark"] #editModal select,
[data-theme="dark"] #editModal textarea {
  background: #0f172a !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] .stat-label,
[data-theme="dark"] .stat-sub,
[data-theme="dark"] .search-wrap i,
[data-theme="dark"] .page-info,
[data-theme="dark"] .kanban-col-title,
[data-theme="dark"] .kanban-col-count,
[data-theme="dark"] .info-label,
[data-theme="dark"] .activity-time,
[data-theme="dark"] .loading-wrap,
[data-theme="dark"] #dealTasksList,
[data-theme="dark"] #dealCommsList,
[data-theme="dark"] #dealActivityList {
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .stat-val,
[data-theme="dark"] .card-title,
[data-theme="dark"] .info-val,
[data-theme="dark"] .activity-text,
[data-theme="dark"] .kanban-card-title,
[data-theme="dark"] .table-card td,
[data-theme="dark"] a[style*='color:#1a1a2e'],
[data-theme="dark"] a[style*='color: #1a1a2e'],
[data-theme="dark"] div[style*='color: #1a1a2e'],
[data-theme="dark"] div[style*='color:#1a1a2e'] {
  color: var(--color-text) !important;
}

[data-theme="dark"] .sbadge,
[data-theme="dark"] .pbadge {
  border: 1px solid transparent !important;
}

[data-theme="dark"] .sbadge.PROSPECTING {
  background: rgba(59, 130, 246, 0.16) !important;
  color: #93c5fd !important;
  border-color: rgba(59, 130, 246, 0.28) !important;
}

[data-theme="dark"] .sbadge.QUALIFICATION,
[data-theme="dark"] .sbadge.NEGOTIATION {
  background: rgba(245, 158, 11, 0.16) !important;
  color: #fbbf24 !important;
  border-color: rgba(245, 158, 11, 0.28) !important;
}

[data-theme="dark"] .sbadge.PROPOSAL {
  background: rgba(168, 85, 247, 0.16) !important;
  color: #d8b4fe !important;
  border-color: rgba(168, 85, 247, 0.28) !important;
}

[data-theme="dark"] .sbadge.CLOSED_WON {
  background: rgba(34, 197, 94, 0.16) !important;
  color: #86efac !important;
  border-color: rgba(34, 197, 94, 0.28) !important;
}

[data-theme="dark"] .sbadge.CLOSED_LOST {
  background: rgba(239, 68, 68, 0.16) !important;
  color: #fca5a5 !important;
  border-color: rgba(239, 68, 68, 0.28) !important;
}

[data-theme="dark"] .pbadge.LOW {
  background: #1a2436 !important;
  color: var(--color-text-muted) !important;
  border-color: #334155 !important;
}

[data-theme="dark"] .pbadge.MEDIUM {
  background: rgba(249, 115, 22, 0.16) !important;
  color: #fdba74 !important;
  border-color: rgba(249, 115, 22, 0.28) !important;
}

[data-theme="dark"] .pbadge.HIGH {
  background: rgba(239, 68, 68, 0.16) !important;
  color: #fca5a5 !important;
  border-color: rgba(239, 68, 68, 0.28) !important;
}

[data-theme="dark"] .page-btn {
  background: #1a2436 !important;
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .page-btn:hover:not(:disabled) {
  background: #334155 !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] .view-btn {
  background: #1a2436 !important;
  color: var(--color-text-muted) !important;
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .view-btn.active {
  background: #1e3a5f !important;
  color: #dbeafe !important;
  border-color: #2563a8 !important;
}

[data-theme="dark"] .kanban-col {
  background: var(--color-card-subtle) !important;
}

[data-theme="dark"] .kanban-col.drag-over {
  background: #1e3a5f !important;
}

[data-theme="dark"] .kanban-card {
  background: var(--color-white) !important;
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .kanban-add-btn {
  border-color: var(--color-border) !important;
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .kanban-add-btn:hover {
  background: #334155 !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] .pipe-step {
  background: transparent !important;
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .pipe-step:hover {
  background: var(--color-card-subtle) !important;
  color: #93c5fd !important;
}

[data-theme="dark"] .pipe-step.active {
  background: #1e3a5f !important;
  color: #dbeafe !important;
}

[data-theme="dark"] .pipe-step.won {
  background: rgba(34, 197, 94, 0.16) !important;
  color: #86efac !important;
  border-color: rgba(34, 197, 94, 0.28) !important;
}

[data-theme="dark"] .pipe-step.lost {
  background: rgba(239, 68, 68, 0.16) !important;
  color: #fca5a5 !important;
  border-color: rgba(239, 68, 68, 0.28) !important;
}

[data-theme="dark"] .info-row,
[data-theme="dark"] .activity-item {
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .activity-text strong {
  color: #93c5fd !important;
}

[data-theme="dark"] .activity-dot {
  background: #3b82f6 !important;
}

/* Follow-ups page */
[data-theme="dark"] .search-input,
[data-theme="dark"] .filter-select,
[data-theme="dark"] .table-card,
[data-theme="dark"] .table-card thead th,
[data-theme="dark"] .table-card tbody tr,
[data-theme="dark"] .page-btn,
[data-theme="dark"] .form-textarea {
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .table-card {
  background: var(--color-white) !important;
}

[data-theme="dark"] .search-input,
[data-theme="dark"] .filter-select,
[data-theme="dark"] .form-textarea {
  background: #0f172a !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] .stat-label,
[data-theme="dark"] .stat-sub,
[data-theme="dark"] .search-wrap i,
[data-theme="dark"] .table-card thead th,
[data-theme="dark"] .page-info {
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .stat-val,
[data-theme="dark"] .table-card tbody td {
  color: var(--color-text) !important;
}

[data-theme="dark"] .table-card thead th {
  background: #1a2436 !important;
}

[data-theme="dark"] .table-card tbody tr:hover {
  background: var(--color-card-subtle) !important;
}

[data-theme="dark"] .sbadge,
[data-theme="dark"] .tbadge,
[data-theme="dark"] .pbadge {
  border: 1px solid transparent !important;
}

[data-theme="dark"] .sbadge.PENDING {
  background: rgba(59, 130, 246, 0.16) !important;
  color: #93c5fd !important;
  border-color: rgba(59, 130, 246, 0.28) !important;
}

[data-theme="dark"] .sbadge.COMPLETED {
  background: rgba(34, 197, 94, 0.16) !important;
  color: #86efac !important;
  border-color: rgba(34, 197, 94, 0.28) !important;
}

[data-theme="dark"] .sbadge.CANCELLED {
  background: rgba(239, 68, 68, 0.16) !important;
  color: #fca5a5 !important;
  border-color: rgba(239, 68, 68, 0.28) !important;
}

[data-theme="dark"] .tbadge.CALL {
  background: rgba(59, 130, 246, 0.16) !important;
  color: #93c5fd !important;
  border-color: rgba(59, 130, 246, 0.28) !important;
}

[data-theme="dark"] .tbadge.EMAIL {
  background: rgba(168, 85, 247, 0.16) !important;
  color: #d8b4fe !important;
  border-color: rgba(168, 85, 247, 0.28) !important;
}

[data-theme="dark"] .tbadge.MEETING,
[data-theme="dark"] .tbadge.DEMO {
  background: rgba(245, 158, 11, 0.16) !important;
  color: #fbbf24 !important;
  border-color: rgba(245, 158, 11, 0.28) !important;
}

[data-theme="dark"] .tbadge.TASK,
[data-theme="dark"] .pbadge.LOW {
  background: #1a2436 !important;
  color: var(--color-text-muted) !important;
  border-color: #334155 !important;
}

[data-theme="dark"] .pbadge.MEDIUM {
  background: rgba(249, 115, 22, 0.16) !important;
  color: #fdba74 !important;
  border-color: rgba(249, 115, 22, 0.28) !important;
}

[data-theme="dark"] .pbadge.HIGH {
  background: rgba(239, 68, 68, 0.16) !important;
  color: #fca5a5 !important;
  border-color: rgba(239, 68, 68, 0.28) !important;
}

[data-theme="dark"] .overdue {
  color: #fca5a5 !important;
}

[data-theme="dark"] .page-btn {
  background: #1a2436 !important;
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .page-btn:hover:not(:disabled) {
  background: #334155 !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] .followup-pagination {
  border-top-color: var(--color-border) !important;
}

/* Leads list/detail pages */
[data-theme="dark"] .import-modal-content,
[data-theme="dark"] .drop-zone,
[data-theme="dark"] .progress-bar-wrap,
[data-theme="dark"] .schema-table th,
[data-theme="dark"] .schema-table td,
[data-theme="dark"] .tag-req,
[data-theme="dark"] .tag-opt,
[data-theme="dark"] .profile-card,
[data-theme="dark"] .notes-box,
[data-theme="dark"] .card,
[data-theme="dark"] .detail-grid .card,
[data-theme="dark"] .detail-fields .input,
[data-theme="dark"] .detail-fields .select,
[data-theme="dark"] .detail-fields textarea,
[data-theme="dark"] .header-staff-avatar {
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .import-modal-content,
[data-theme="dark"] .profile-card,
[data-theme="dark"] .card,
[data-theme="dark"] .detail-grid .card {
  background: var(--color-white) !important;
}

[data-theme="dark"] .drop-zone,
[data-theme="dark"] .notes-box.empty {
  background: var(--color-card-subtle) !important;
}

[data-theme="dark"] .drop-zone:hover,
[data-theme="dark"] .drop-zone.drag-over {
  background: #1e3a5f !important;
  border-color: #2563a8 !important;
}

[data-theme="dark"] .drop-zone i,
[data-theme="dark"] .loading-wrap,
[data-theme="dark"] .profile-sub,
[data-theme="dark"] .info-row i,
[data-theme="dark"] .info-row-label,
[data-theme="dark"] .field-label,
[data-theme="dark"] .loading-wrap,
[data-theme="dark"] #tasksList,
[data-theme="dark"] #leadDealsList,
[data-theme="dark"] #leadActivityTimeline,
[data-theme="dark"] .schema-table th,
[data-theme="dark"] .schema-table td,
[data-theme="dark"] .tag-opt,
[data-theme="dark"] .drop-zone .drop-sub,
[data-theme="dark"] .summary-row {
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .drop-zone .drop-title,
[data-theme="dark"] .profile-name,
[data-theme="dark"] .info-row-value,
[data-theme="dark"] .field-value,
[data-theme="dark"] .header-staff-name,
[data-theme="dark"] .schema-table td,
[data-theme="dark"] .notes-box,
[data-theme="dark"] .card-title,
[data-theme="dark"] .header-title[style*='color: #1a1a2e'],
[data-theme="dark"] .header-title[style*='color:#1a1a2e'],
[data-theme="dark"] div[style*='color: #1a1a2e'],
[data-theme="dark"] div[style*='color:#1a1a2e'] {
  color: var(--color-text) !important;
}

[data-theme="dark"] .field-value.empty,
[data-theme="dark"] .notes-box.empty,
[data-theme="dark"] .loading-wrap p {
  color: var(--color-text-faint) !important;
}

[data-theme="dark"] .profile-divider,
[data-theme="dark"] .info-row,
[data-theme="dark"] .result-row,
[data-theme="dark"] .schema-table th,
[data-theme="dark"] .schema-table td {
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .status-badge.orange {
  background: rgba(245, 158, 11, 0.28) !important;
  color: #fbbf24 !important;
  border: 1px solid rgba(245, 158, 11, 0.45) !important;
}

[data-theme="dark"] .status-badge.blue {
  background: rgba(59, 130, 246, 0.28) !important;
  color: #93c5fd !important;
  border: 1px solid rgba(59, 130, 246, 0.45) !important;
}

[data-theme="dark"] .status-badge.purple {
  background: rgba(168, 85, 247, 0.28) !important;
  color: #d8b4fe !important;
  border: 1px solid rgba(168, 85, 247, 0.45) !important;
}

[data-theme="dark"] .status-badge.green {
  background: rgba(34, 197, 94, 0.28) !important;
  color: #86efac !important;
  border: 1px solid rgba(34, 197, 94, 0.45) !important;
}

[data-theme="dark"] .status-badge.red {
  background: rgba(239, 68, 68, 0.28) !important;
  color: #fca5a5 !important;
  border: 1px solid rgba(239, 68, 68, 0.45) !important;
}

[data-theme="dark"] .status-badge.gray {
  background: rgba(148, 163, 184, 0.28) !important;
  color: #e2e8f0 !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
}

[data-theme="dark"] .status-badge.teal {
  background: rgba(20, 184, 166, 0.28) !important;
  color: #5eead4 !important;
  border: 1px solid rgba(20, 184, 166, 0.45) !important;
}

[data-theme="dark"] .value-badge {
  background: rgba(34, 197, 94, 0.12) !important;
  border-color: rgba(34, 197, 94, 0.24) !important;
}

[data-theme="dark"] .value-badge-label {
  color: #86efac !important;
}

[data-theme="dark"] .value-badge-amount {
  color: #dcfce7 !important;
}

[data-theme="dark"] .notes-box {
  background: rgba(245, 158, 11, 0.12) !important;
  border-color: rgba(245, 158, 11, 0.24) !important;
  color: #fde68a !important;
}

[data-theme="dark"] .tag-req {
  background: rgba(239, 68, 68, 0.28) !important;
  color: #fca5a5 !important;
}

[data-theme="dark"] .tag-opt {
  background: #1a2436 !important;
}

[data-theme="dark"] #autoTaskSlider {
  background: #475569 !important;
}

/* Campaign list/detail pages */
[data-theme="dark"] .platform-badge,
[data-theme="dark"] .eng-card,
[data-theme="dark"] .tpl-card,
[data-theme="dark"] .aud-card,
[data-theme="dark"] .aud-json,
[data-theme="dark"] .status-select-full,
[data-theme="dark"] .form-textarea,
[data-theme="dark"] .eng-track-item .input,
[data-theme="dark"] .eng-track-item .form-select,
[data-theme="dark"] #campModal .input,
[data-theme="dark"] #campModal .form-select,
[data-theme="dark"] #campModal .textarea {
  background: var(--color-card-subtle) !important;
  color: #e5eefc !important;
  border-color: #334155 !important;
}

[data-theme="dark"] .camp-hero.default {
  background: linear-gradient(135deg, #1b2740, #334155) !important;
}

[data-theme="dark"] .hero-icon,
[data-theme="dark"] .chip-white {
  background: rgba(148, 163, 184, 0.28) !important;
  color: #f8fafc !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
}

[data-theme="dark"] .eng-card,
[data-theme="dark"] .tpl-card,
[data-theme="dark"] .aud-card {
  box-shadow: none !important;
}

[data-theme="dark"] .eng-card-label,
[data-theme="dark"] .tpl-subject-label,
[data-theme="dark"] .aud-title,
[data-theme="dark"] .eng-label,
[data-theme="dark"] .label-hint,
[data-theme="dark"] .eng-track-item label {
  color: #94a3b8 !important;
}

[data-theme="dark"] .eng-card-num,
[data-theme="dark"] .tpl-title,
[data-theme="dark"] .tpl-subject,
[data-theme="dark"] .tpl-content,
[data-theme="dark"] .att-chip,
[data-theme="dark"] .aud-json,
[data-theme="dark"] .side-card-title {
  color: #e5eefc !important;
}

[data-theme="dark"] .eng-card-rate.zero,
[data-theme="dark"] .tpl-empty,
[data-theme="dark"] .aud-empty,
[data-theme="dark"] .eng-label,
[data-theme="dark"] .count-muted,
[data-theme="dark"] .roi-meta,
[data-theme="dark"] #countLabel {
  color: #94a3b8 !important;
}

[data-theme="dark"] .eng-progress {
  background: #243047 !important;
}

[data-theme="dark"] .tpl-header,
[data-theme="dark"] .tpl-subject,
[data-theme="dark"] .tpl-attachments,
[data-theme="dark"] .info-row,
[data-theme="dark"] .side-row {
  border-color: #334155 !important;
}

[data-theme="dark"] .att-chip {
  background: #1a2436 !important;
  border: 1px solid #334155 !important;
}

[data-theme="dark"] .aud-json {
  font-family: monospace !important;
}

[data-theme="dark"] .status-select-full:focus,
[data-theme="dark"] .form-textarea:focus,
[data-theme="dark"] .eng-track-item .input:focus,
[data-theme="dark"] .eng-track-item .form-select:focus,
[data-theme="dark"] #campModal .input:focus,
[data-theme="dark"] #campModal .form-select:focus,
[data-theme="dark"] #campModal .textarea:focus {
  border-color: #4f8cff !important;
  box-shadow: 0 0 0 3px rgba(79, 140, 255, 0.14) !important;
}

[data-theme="dark"] .platform-badge {
  color: #c7d2fe !important;
  border: 1px solid #334155 !important;
}

[data-theme="dark"] .eng-num {
  color: #e5eefc !important;
}

[data-theme="dark"] .engagement-mini {
  gap: 12px !important;
}

[data-theme="dark"] .eng-item {
  min-width: 32px !important;
}

[data-theme="dark"] .card .action-btn.edit,
[data-theme="dark"] .card .action-btn.danger {
  border: 1px solid transparent !important;
}

[data-theme="dark"] [style*="color:#6b7280;"],
[data-theme="dark"] [style*="color: #6b7280;"] {
  color: #94a3b8 !important;
}

[data-theme="dark"] [style*="color:#16a34a;"],
[data-theme="dark"] [style*="color: #16a34a;"] {
  color: #4ade80 !important;
}

[data-theme="dark"] [style*="color:#dc2626;"],
[data-theme="dark"] [style*="color: #dc2626;"] {
  color: #f87171 !important;
}

[data-theme="dark"] .status-badge.draft {
  background: #1a2436 !important;
  color: #cbd5e1 !important;
  border: 1px solid #334155 !important;
}

[data-theme="dark"] .status-badge.scheduled {
  background: rgba(245, 158, 11, 0.16) !important;
  color: #fcd34d !important;
  border: 1px solid rgba(245, 158, 11, 0.28) !important;
}

[data-theme="dark"] .status-badge.running {
  background: rgba(34, 197, 94, 0.16) !important;
  color: #86efac !important;
  border: 1px solid rgba(34, 197, 94, 0.28) !important;
}

[data-theme="dark"] .status-badge.completed {
  background: rgba(79, 140, 255, 0.14) !important;
  color: #9ec5ff !important;
  border: 1px solid rgba(79, 140, 255, 0.28) !important;
}

[data-theme="dark"] .status-badge.cancelled {
  background: rgba(239, 68, 68, 0.16) !important;
  color: #fca5a5 !important;
  border: 1px solid rgba(239, 68, 68, 0.28) !important;
}

/* Developer options page */
[data-theme="dark"] .guide-section h4,
[data-theme="dark"] .card-title code,
[data-theme="dark"] .secret-value,
[data-theme="dark"] .ref-tab,
[data-theme="dark"] .lang-tab,
[data-theme="dark"] .badge-scope {
  color: #e5eefc !important;
}

[data-theme="dark"] .ref-tab,
[data-theme="dark"] .lang-tab {
  background: var(--color-card-subtle) !important;
  border-color: #334155 !important;
}

[data-theme="dark"] .ref-tab.active {
  background: #3158b6 !important;
  border-color: #3158b6 !important;
  color: #f8fbff !important;
}

[data-theme="dark"] .lang-tab.active {
  background: #0f172a !important;
  border-color: #0f172a !important;
}

[data-theme="dark"] .secret-box {
  background: rgba(245, 158, 11, 0.12) !important;
  border-color: rgba(245, 158, 11, 0.26) !important;
}

[data-theme="dark"] .secret-box h4 {
  color: #fcd34d !important;
}

[data-theme="dark"] .secret-value {
  background: #0f172a !important;
  border-color: #334155 !important;
}

[data-theme="dark"] .badge-scope {
  background: rgba(79, 140, 255, 0.14) !important;
  color: #9ec5ff !important;
}

[data-theme="dark"] .action-btn.rotate {
  background: rgba(245, 158, 11, 0.28) !important;
  color: #fcd34d !important;
  border: 1px solid rgba(245, 158, 11, 0.45) !important;
}

[data-theme="dark"] .action-btn.rotate:hover {
  background: rgba(245, 158, 11, 0.42) !important;
  color: #fde68a !important;
}

[data-theme="dark"] .card [style*="background:#f0fdf4"],
[data-theme="dark"] .card [style*="background: #f0fdf4"] {
  background: rgba(34, 197, 94, 0.16) !important;
  border-color: rgba(34, 197, 94, 0.28) !important;
}

[data-theme="dark"] .card [style*="background:#eef2ff"],
[data-theme="dark"] .card [style*="background: #eef2ff"] {
  background: rgba(79, 140, 255, 0.14) !important;
  border-color: rgba(79, 140, 255, 0.28) !important;
}

[data-theme="dark"] .card [style*="background:#fff7ed"],
[data-theme="dark"] .card [style*="background: #fff7ed"] {
  background: rgba(245, 158, 11, 0.14) !important;
  border-color: rgba(245, 158, 11, 0.28) !important;
}

[data-theme="dark"] .card [style*="background:#f9fafb"],
[data-theme="dark"] .card [style*="background: #f9fafb"] {
  background: #1a2436 !important;
}

[data-theme="dark"] .card [style*="border-bottom:1px solid #f3f4f6"],
[data-theme="dark"] .card [style*="border-bottom: 1px solid #f3f4f6"],
[data-theme="dark"] .card [style*="border-bottom:1px solid #e5e7eb"],
[data-theme="dark"] .card [style*="border-bottom: 1px solid #e5e7eb"],
[data-theme="dark"] .card [style*="border:1px solid #e5e7eb"],
[data-theme="dark"] .card [style*="border: 1px solid #e5e7eb"] {
  border-color: #334155 !important;
}

[data-theme="dark"] .card [style*="color:#1a1a2e"],
[data-theme="dark"] .card [style*="color: #1a1a2e"] {
  color: #e5eefc !important;
}

[data-theme="dark"] .card [style*="color:#374151"],
[data-theme="dark"] .card [style*="color: #374151"] {
  color: #cbd5e1 !important;
}

[data-theme="dark"] .card [style*="color:#6b7280"],
[data-theme="dark"] .card [style*="color: #6b7280"] {
  color: #94a3b8 !important;
}

[data-theme="dark"] .card [style*="color:#15803d"],
[data-theme="dark"] .card [style*="color: #15803d"] {
  color: #86efac !important;
}

[data-theme="dark"] .card [style*="color:#1e40af"],
[data-theme="dark"] .card [style*="color: #1e40af"] {
  color: #9ec5ff !important;
}

[data-theme="dark"] .card [style*="color:#c2410c"],
[data-theme="dark"] .card [style*="color: #c2410c"] {
  color: #fdba74 !important;
}

[data-theme="dark"] .card [style*="color:#7c3aed"],
[data-theme="dark"] .card [style*="color: #7c3aed"] {
  color: #c084fc !important;
}

/* Org user detail page */
[data-theme="dark"] .back-btn,
[data-theme="dark"] .hero-card,
[data-theme="dark"] .info-card,
[data-theme="dark"] .side-card,
[data-theme="dark"] .perm-edit-table,
[data-theme="dark"] .perm-edit-table th {
  background: var(--color-card-subtle) !important;
  border-color: #334155 !important;
}

[data-theme="dark"] .back-btn {
  color: #cbd5e1 !important;
}

[data-theme="dark"] .back-btn:hover {
  color: #9ec5ff !important;
  border-color: #4f8cff !important;
}

[data-theme="dark"] .header-title,
[data-theme="dark"] .hero-name,
[data-theme="dark"] .info-value,
[data-theme="dark"] .side-value,
[data-theme="dark"] .perm-table td,
[data-theme="dark"] .perm-edit-table td {
  color: #e5eefc !important;
}

[data-theme="dark"] .header-sub,
[data-theme="dark"] .info-card-title,
[data-theme="dark"] .info-label,
[data-theme="dark"] .side-card-title,
[data-theme="dark"] .side-label,
[data-theme="dark"] .perm-table th,
[data-theme="dark"] .perm-edit-table th,
[data-theme="dark"] .section-sep,
[data-theme="dark"] .hero-contact,
[data-theme="dark"] .hero-contact i {
  color: #94a3b8 !important;
}

[data-theme="dark"] .info-value.mono {
  color: #9ec5ff !important;
}

[data-theme="dark"] .chip-id {
  background: #1a2436 !important;
  color: #cbd5e1 !important;
  border: 1px solid #334155 !important;
}

[data-theme="dark"] .chip-active {
  background: rgba(34, 197, 94, 0.28) !important;
  color: #86efac !important;
  border: 1px solid rgba(34, 197, 94, 0.45) !important;
}

[data-theme="dark"] .chip-inactive {
  background: #1a2436 !important;
  color: #94a3b8 !important;
  border: 1px solid #334155 !important;
}

[data-theme="dark"] .chip-dept,
[data-theme="dark"] .count-badge {
  background: rgba(79, 140, 255, 0.14) !important;
  color: #9ec5ff !important;
  border: 1px solid rgba(79, 140, 255, 0.24) !important;
}

[data-theme="dark"] .chip-role,
[data-theme="dark"] .chip-vendor {
  background: rgba(168, 85, 247, 0.14) !important;
  color: #d8b4fe !important;
  border: 1px solid rgba(168, 85, 247, 0.24) !important;
}

[data-theme="dark"] .perm-table th,
[data-theme="dark"] .perm-table td,
[data-theme="dark"] .perm-edit-table th,
[data-theme="dark"] .perm-edit-table td,
[data-theme="dark"] .info-row,
[data-theme="dark"] .side-row {
  border-color: #334155 !important;
}

[data-theme="dark"] .perm-table td:first-child,
[data-theme="dark"] .perm-edit-table td:first-child {
  color: #cbd5e1 !important;
}

[data-theme="dark"] .perm-dot-no {
  color: #334155 !important;
}

[data-theme="dark"] .perm-cb {
  accent-color: #4f8cff !important;
}

/* data integration page */
[data-theme="dark"] .api-snippet {
  background: #0f172a !important;
  color: var(--color-text) !important;
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .stat-card {
  background: var(--color-card-subtle) !important;
  color: var(--color-text) !important;
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .section-card {
  background: var(--color-white) !important;
  color: var(--color-text) !important;
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .section-hdr h2,

[data-theme="dark"] .empty-state {
  color: var(--color-text-muted) !important;
}

/* ── User Management vendor selector bar ──────────────────────────────────────
   JS toggles display:flex on this element via bar.style.display = 'flex', which
   causes the browser to re-serialise the entire style attribute and normalise
   `#fff` to `rgb(255, 255, 255)`. The attribute-substring selectors above now
   cover that form, but this rule is the belt-and-braces fallback. */
[data-theme="dark"] #vendorSelectorBar {
  background: var(--color-white) !important;
  border-color: var(--color-border) !important;
  color: var(--color-text) !important;
}

/* ── Pill-style tabs (User Management: Users / Roles) ─────────────────────────
   The .tabs container + .tab.active selectors are defined in the page's own
   <style> block with hardcoded `#fff` / `#2563a8`, which the substring
   overrides can't reach because these are CSS classes, not inline styles. */
[data-theme="dark"] .tabs {
  background: var(--color-white) !important;
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .tab {
  color: var(--color-text-muted) !important;
}

[data-theme="dark"] .tab.active {
  background: var(--color-primary, #4f8cff) !important;
  color: #fff !important;
}

[data-theme="dark"] .p {
  color: var(--color-text) !important;
}

[data-theme="dark"] .modal-content .import-instructions {
  background: var(--color-white) !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] .modal-content .import-instructions .code {
  background: var(--color-white) !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] .modal-content-wide {
  background: var(--color-white) !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] .custom-chip {
  background: var(--color-white) !important;
}

[data-theme="dark"] .modal-title {
  color: var(--color-text) !important;
}

[data-theme="dark"]  .label {
  color: var(--color-text) !important;
}

[data-theme="dark"]  .login-form-panel {
  background: var(--color-white) !important;
  color: var(--color-text) !important;
}
[data-theme="dark"] .login-form-panel h1 {
  color: var(--color-text) !important;
}

[data-theme="dark"] .remember {
  color: var(--color-text) !important;
}
[data-theme="dark"] .drawer-body {
  background: var(--color-white) !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] .drawer-header {
  color: var(--color-text) !important;
  background: var(--color-white) !important;
}

[data-theme="dark"] #reportsSummaryBar {
  background: var(--color-white) !important;
  color: var(--color-text) !important;
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .chart-card {
  background: var(--color-white) !important;
  color: var(--color-text) !important;
  border-color: var(--color-border) !important;
}
[data-theme="dark"] .chart-title {  
  color: var(--color-text) !important;
}

[data-theme="dark"] .leadStatusChart {
  background: var(--color-white) !important;
  color: var(--color-text) !important;
  border-color: var(--color-border) !important;
}

/* ──────────────────────────────────────────────────────────────────────────
   Dark-mode coverage pass — mainHome / deals / dealDetail
   Page-local <style> blocks bake in light-mode colors that the attribute
   substring selectors at the top of this file can't reach (class selectors,
   not inline styles). These rules are the minimum set needed to read the
   affected content on a dark background.
   ─────────────────────────────────────────────────────────────────────── */

/* mainHome dashboard */
[data-theme="dark"] .user-cell-name { color: var(--color-text) !important; }
[data-theme="dark"] .alert-time { color: var(--color-text-faint) !important; }

/* Deals stage + priority badges — shared by deals.html, dealDetail.html,
   and any other page that uses the same class names. Keep the accent hue,
   swap the background to a muted tint that works on dark cards. */
[data-theme="dark"] .sbadge.PROSPECTING   { background: rgba(37, 99, 168, 0.18)  !important; color: #7ab0ef !important; }
[data-theme="dark"] .sbadge.QUALIFICATION { background: rgba(234, 88, 12, 0.18)  !important; color: #f79860 !important; }
[data-theme="dark"] .sbadge.PROPOSAL      { background: rgba(147, 51, 234, 0.18) !important; color: #c89bf7 !important; }
[data-theme="dark"] .sbadge.NEGOTIATION   { background: rgba(202, 138, 4, 0.18)  !important; color: #e5b64e !important; }
[data-theme="dark"] .sbadge.CLOSED_WON    { background: rgba(5, 150, 105, 0.18)  !important; color: #5ed9a5 !important; }
[data-theme="dark"] .sbadge.CLOSED_LOST   { background: rgba(239, 68, 68, 0.18)  !important; color: #f38b8b !important; }

[data-theme="dark"] .pbadge.LOW     { background: rgba(148, 163, 184, 0.18) !important; color: var(--color-text-muted) !important; }
[data-theme="dark"] .pbadge.MEDIUM  { background: rgba(234, 88, 12, 0.18)   !important; color: #f79860 !important; }
[data-theme="dark"] .pbadge.HIGH    { background: rgba(239, 68, 68, 0.18)   !important; color: #f38b8b !important; }

/* dealDetail activity stream */
[data-theme="dark"] .activity-text { color: var(--color-text) !important; }
[data-theme="dark"] .activity-time { color: var(--color-text-faint) !important; }

/* ──────────────────────────────────────────────────────────────────────────
   Badge dark-mode overrides — centralized
   Every status / priority / type badge class defined in page-local <style>
   blocks lives here. Keeping the hue cues (blue = active, red = error,
   green = success, orange = warning, purple = info) but swapping bright
   pastel backgrounds for translucent tints that read correctly on dark
   cards, and brightening text to readable shades.
   ─────────────────────────────────────────────────────────────────────── */

/* Semantic color tokens the badges below reuse. These stay scoped to the
   dark block so they can't accidentally leak into light mode. */
[data-theme="dark"] {
  --badge-bg-blue:    rgba(37, 99, 168, 0.28);
  --badge-bg-green:   rgba(5, 150, 105, 0.28);
  --badge-bg-orange:  rgba(234, 88, 12, 0.28);
  --badge-bg-red:     rgba(239, 68, 68, 0.28);
  --badge-bg-purple:  rgba(147, 51, 234, 0.28);
  --badge-bg-yellow:  rgba(202, 138, 4, 0.28);
  --badge-bg-teal:    rgba(20, 184, 166, 0.28);
  --badge-bg-neutral: rgba(148, 163, 184, 0.28);

  --badge-fg-blue:    #7ab0ef;
  --badge-fg-green:   #5ed9a5;
  --badge-fg-orange:  #f79860;
  --badge-fg-red:     #f38b8b;
  --badge-fg-purple:  #c89bf7;
  --badge-fg-yellow:  #e5b64e;
  --badge-fg-teal:    #5fd9c9;
  --badge-fg-neutral: #94a3b8;
}

/* Deals — .sbadge stages + .pbadge priorities (deals.html, dealDetail.html) */
[data-theme="dark"] .sbadge.PROSPECTING   { background: var(--badge-bg-blue)   !important; color: var(--badge-fg-blue)   !important; }
[data-theme="dark"] .sbadge.QUALIFICATION { background: var(--badge-bg-orange) !important; color: var(--badge-fg-orange) !important; }
[data-theme="dark"] .sbadge.PROPOSAL      { background: var(--badge-bg-purple) !important; color: var(--badge-fg-purple) !important; }
[data-theme="dark"] .sbadge.NEGOTIATION   { background: var(--badge-bg-yellow) !important; color: var(--badge-fg-yellow) !important; }
[data-theme="dark"] .sbadge.CLOSED_WON    { background: var(--badge-bg-green)  !important; color: var(--badge-fg-green)  !important; }
[data-theme="dark"] .sbadge.CLOSED_LOST   { background: var(--badge-bg-red)    !important; color: var(--badge-fg-red)    !important; }

/* Sales — .sbadge statuses (sales.html) */
[data-theme="dark"] .sbadge.DRAFT          { background: var(--badge-bg-neutral) !important; color: var(--badge-fg-neutral) !important; }
[data-theme="dark"] .sbadge.CONFIRMED      { background: var(--badge-bg-blue)    !important; color: var(--badge-fg-blue)    !important; }
[data-theme="dark"] .sbadge.PROCESSING     { background: var(--badge-bg-orange)  !important; color: var(--badge-fg-orange)  !important; }
[data-theme="dark"] .sbadge.SHIPPED        { background: var(--badge-bg-yellow)  !important; color: var(--badge-fg-yellow)  !important; }
[data-theme="dark"] .sbadge.DELIVERED      { background: var(--badge-bg-green)   !important; color: var(--badge-fg-green)   !important; }
[data-theme="dark"] .sbadge.INVOICED       { background: var(--badge-bg-purple)  !important; color: var(--badge-fg-purple)  !important; }
[data-theme="dark"] .sbadge.PARTIALLY_PAID { background: var(--badge-bg-purple)  !important; color: var(--badge-fg-purple)  !important; }
[data-theme="dark"] .sbadge.PAID           { background: var(--badge-bg-green)   !important; color: var(--badge-fg-green)   !important; }
[data-theme="dark"] .sbadge.CANCELLED      { background: var(--badge-bg-red)     !important; color: var(--badge-fg-red)     !important; }
[data-theme="dark"] .sbadge.REFUNDED       { background: var(--badge-bg-yellow)  !important; color: var(--badge-fg-yellow)  !important; }

/* Followups — .sbadge statuses (followups.html) */
[data-theme="dark"] .sbadge.PENDING   { background: var(--badge-bg-blue)  !important; color: var(--badge-fg-blue)  !important; }
[data-theme="dark"] .sbadge.COMPLETED { background: var(--badge-bg-green) !important; color: var(--badge-fg-green) !important; }
/* .sbadge.CANCELLED already covered above */

/* Priorities — .pbadge used across deals.html, followups.html, and any
   future page that reuses the pattern. */
[data-theme="dark"] .pbadge.LOW    { background: var(--badge-bg-neutral) !important; color: var(--badge-fg-neutral) !important; }
[data-theme="dark"] .pbadge.MEDIUM { background: var(--badge-bg-orange)  !important; color: var(--badge-fg-orange)  !important; }
[data-theme="dark"] .pbadge.HIGH   { background: var(--badge-bg-red)     !important; color: var(--badge-fg-red)     !important; }

/* Communications — .sb-* call-state badges (communications.html) */
[data-theme="dark"] .sb-initiated { background: var(--badge-bg-blue)    !important; color: var(--badge-fg-blue)    !important; }
[data-theme="dark"] .sb-ringing   { background: var(--badge-bg-yellow)  !important; color: var(--badge-fg-yellow)  !important; }
[data-theme="dark"] .sb-answered  { background: var(--badge-bg-green)   !important; color: var(--badge-fg-green)   !important; }
[data-theme="dark"] .sb-completed { background: var(--badge-bg-green)   !important; color: var(--badge-fg-green)   !important; }
[data-theme="dark"] .sb-missed    { background: var(--badge-bg-orange)  !important; color: var(--badge-fg-orange)  !important; }
[data-theme="dark"] .sb-failed    { background: var(--badge-bg-red)     !important; color: var(--badge-fg-red)     !important; }

/* Communications — .cbadge conversation statuses (communications.html) */
[data-theme="dark"] .cbadge.OPEN    { background: var(--badge-bg-green)   !important; color: var(--badge-fg-green)   !important; }
[data-theme="dark"] .cbadge.CLOSED  { background: var(--badge-bg-neutral) !important; color: var(--badge-fg-neutral) !important; }
[data-theme="dark"] .cbadge.PENDING { background: var(--badge-bg-orange)  !important; color: var(--badge-fg-orange)  !important; }

/* Communication detail — .chip-* type & priority + .badge-* duplicates */
[data-theme="dark"] .chip-open     { background: var(--badge-bg-green)  !important; color: var(--badge-fg-green)  !important; }
[data-theme="dark"] .chip-closed   { background: var(--badge-bg-neutral)!important; color: var(--badge-fg-neutral)!important; }
[data-theme="dark"] .chip-pending  { background: var(--badge-bg-yellow) !important; color: var(--badge-fg-yellow) !important; }
[data-theme="dark"] .chip-call     { background: var(--badge-bg-green)  !important; color: var(--badge-fg-green)  !important; }
[data-theme="dark"] .chip-email    { background: var(--badge-bg-blue)   !important; color: var(--badge-fg-blue)   !important; }
[data-theme="dark"] .chip-whatsapp { background: var(--badge-bg-teal)   !important; color: var(--badge-fg-teal)   !important; }
[data-theme="dark"] .chip-sms      { background: var(--badge-bg-orange) !important; color: var(--badge-fg-orange) !important; }
[data-theme="dark"] .chip-chat     { background: var(--badge-bg-purple) !important; color: var(--badge-fg-purple) !important; }
[data-theme="dark"] .chip-inbound  { background: var(--badge-bg-blue)   !important; color: var(--badge-fg-blue)   !important; }
[data-theme="dark"] .chip-outbound { background: var(--badge-bg-purple) !important; color: var(--badge-fg-purple) !important; }
[data-theme="dark"] .chip-low      { background: var(--badge-bg-green)  !important; color: var(--badge-fg-green)  !important; }
[data-theme="dark"] .chip-medium   { background: var(--badge-bg-blue)   !important; color: var(--badge-fg-blue)   !important; }
[data-theme="dark"] .chip-high     { background: var(--badge-bg-orange) !important; color: var(--badge-fg-orange) !important; }
[data-theme="dark"] .chip-urgent   { background: var(--badge-bg-red)    !important; color: var(--badge-fg-red)    !important; }

[data-theme="dark"] .badge-open     { background: var(--badge-bg-green)  !important; color: var(--badge-fg-green)  !important; }
[data-theme="dark"] .badge-closed   { background: var(--badge-bg-neutral)!important; color: var(--badge-fg-neutral)!important; }
[data-theme="dark"] .badge-pending  { background: var(--badge-bg-yellow) !important; color: var(--badge-fg-yellow) !important; }
[data-theme="dark"] .badge-low      { background: var(--badge-bg-green)  !important; color: var(--badge-fg-green)  !important; }
[data-theme="dark"] .badge-medium   { background: var(--badge-bg-blue)   !important; color: var(--badge-fg-blue)   !important; }
[data-theme="dark"] .badge-high     { background: var(--badge-bg-orange) !important; color: var(--badge-fg-orange) !important; }
[data-theme="dark"] .badge-urgent   { background: var(--badge-bg-red)    !important; color: var(--badge-fg-red)    !important; }
[data-theme="dark"] .badge-call     { background: var(--badge-bg-green)  !important; color: var(--badge-fg-green)  !important; }
[data-theme="dark"] .badge-email    { background: var(--badge-bg-blue)   !important; color: var(--badge-fg-blue)   !important; }
[data-theme="dark"] .badge-whatsapp { background: var(--badge-bg-teal)   !important; color: var(--badge-fg-teal)   !important; }
[data-theme="dark"] .badge-sms      { background: var(--badge-bg-orange) !important; color: var(--badge-fg-orange) !important; }
[data-theme="dark"] .badge-chat     { background: var(--badge-bg-purple) !important; color: var(--badge-fg-purple) !important; }
[data-theme="dark"] .badge-inbound  { background: var(--badge-bg-blue)   !important; color: var(--badge-fg-blue)   !important; }
[data-theme="dark"] .badge-outbound { background: var(--badge-bg-purple) !important; color: var(--badge-fg-purple) !important; }
[data-theme="dark"] .badge-scope    { background: var(--badge-bg-blue)   !important; color: var(--badge-fg-blue)   !important; }

/* Generic .status-badge semantic aliases (components.css) — map solid dark
   backgrounds like #052e16 onto the tinted badge tokens for consistency. */
[data-theme="dark"] .status-badge.active,
[data-theme="dark"] .status-badge.paid,
[data-theme="dark"] .status-badge.won,
[data-theme="dark"] .status-badge.green {
  background: var(--badge-bg-green) !important;
  color: var(--badge-fg-green) !important;
}
[data-theme="dark"] .status-badge.blocked,
[data-theme="dark"] .status-badge.overdue,
[data-theme="dark"] .status-badge.lost,
[data-theme="dark"] .status-badge.red {
  background: var(--badge-bg-red) !important;
  color: var(--badge-fg-red) !important;
}
[data-theme="dark"] .status-badge.pending,
[data-theme="dark"] .status-badge.in_progress,
[data-theme="dark"] .status-badge.orange {
  background: var(--badge-bg-orange) !important;
  color: var(--badge-fg-orange) !important;
}
[data-theme="dark"] .status-badge.new,
[data-theme="dark"] .status-badge.blue {
  background: var(--badge-bg-blue) !important;
  color: var(--badge-fg-blue) !important;
}
[data-theme="dark"] .status-badge.deactivated,
[data-theme="dark"] .status-badge.inactive,
[data-theme="dark"] .status-badge.gray {
  background: var(--badge-bg-neutral) !important;
  color: var(--badge-fg-neutral) !important;
  border: 1px solid rgba(148, 163, 184, 0.45) !important;
}
[data-theme="dark"] .status-badge.purple {
  background: var(--badge-bg-purple) !important;
  color: var(--badge-fg-purple) !important;
}
[data-theme="dark"] .status-badge.teal {
  background: var(--badge-bg-teal) !important;
  color: var(--badge-fg-teal) !important;
}

/* Generic .badge-* variants from components.css */
[data-theme="dark"] .badge-success { background: var(--badge-bg-green)   !important; color: var(--badge-fg-green)   !important; }
[data-theme="dark"] .badge-danger  { background: var(--badge-bg-red)     !important; color: var(--badge-fg-red)     !important; }
[data-theme="dark"] .badge-warning { background: var(--badge-bg-orange)  !important; color: var(--badge-fg-orange)  !important; }
[data-theme="dark"] .badge-info    { background: var(--badge-bg-blue)    !important; color: var(--badge-fg-blue)    !important; }
[data-theme="dark"] .badge-purple  { background: var(--badge-bg-purple)  !important; color: var(--badge-fg-purple)  !important; }
[data-theme="dark"] .badge-gray    { background: var(--badge-bg-neutral) !important; color: var(--badge-fg-neutral) !important; }
[data-theme="dark"] .badge-orange  { background: var(--badge-bg-orange)  !important; color: var(--badge-fg-orange)  !important; }
[data-theme="dark"] .badge-blue    { background: var(--badge-bg-blue)    !important; color: var(--badge-fg-blue)    !important; }
[data-theme="dark"] .badge-green   { background: var(--badge-bg-green)   !important; color: var(--badge-fg-green)   !important; }
[data-theme="dark"] .badge-red     { background: var(--badge-bg-red)     !important; color: var(--badge-fg-red)     !important; }

/* Campaigns — .status-badge.<stage> (campaignDetail.html) */
[data-theme="dark"] .status-badge.draft     { background: var(--badge-bg-neutral)!important; color: var(--badge-fg-neutral)!important; }
[data-theme="dark"] .status-badge.scheduled { background: var(--badge-bg-yellow) !important; color: var(--badge-fg-yellow) !important; }
[data-theme="dark"] .status-badge.running   { background: var(--badge-bg-green)  !important; color: var(--badge-fg-green)  !important; }
[data-theme="dark"] .status-badge.completed { background: var(--badge-bg-blue)   !important; color: var(--badge-fg-blue)   !important; }
[data-theme="dark"] .status-badge.cancelled { background: var(--badge-bg-red)    !important; color: var(--badge-fg-red)    !important; }

/* Tickets — .status-badge.<state> (tickets.html) */
[data-theme="dark"] .status-badge.open       { background: var(--badge-bg-green)   !important; color: var(--badge-fg-green)   !important; }
[data-theme="dark"] .status-badge.inprogress { background: var(--badge-bg-blue)    !important; color: var(--badge-fg-blue)    !important; }
[data-theme="dark"] .status-badge.waiting    { background: var(--badge-bg-orange)  !important; color: var(--badge-fg-orange)  !important; }
[data-theme="dark"] .status-badge.resolved   { background: var(--badge-bg-teal)    !important; color: var(--badge-fg-teal)    !important; }
[data-theme="dark"] .status-badge.closed     { background: var(--badge-bg-neutral) !important; color: var(--badge-fg-neutral) !important; }

/* Notifications — .type-badge.<kind> (notifications.html) */
[data-theme="dark"] .type-badge.message    { background: var(--badge-bg-blue)   !important; color: var(--badge-fg-blue)   !important; }
[data-theme="dark"] .type-badge.assignment { background: var(--badge-bg-green)  !important; color: var(--badge-fg-green)  !important; }
[data-theme="dark"] .type-badge.ticket     { background: var(--badge-bg-orange) !important; color: var(--badge-fg-orange) !important; }

/* Super-admin — .role-*-badge (superAdmin.html) */
[data-theme="dark"] .role-type-badge.admin      { background: var(--badge-bg-red)     !important; color: var(--badge-fg-red)     !important; }
[data-theme="dark"] .role-type-badge.client     { background: var(--badge-bg-blue)    !important; color: var(--badge-fg-blue)    !important; }
[data-theme="dark"] .role-status-badge.active   { background: var(--badge-bg-green)   !important; color: var(--badge-fg-green)   !important; }
[data-theme="dark"] .role-status-badge.inactive { background: var(--badge-bg-neutral) !important; color: var(--badge-fg-neutral) !important; }

/* Super-admin — vendor list badges (vendors.html) */
[data-theme="dark"] .badge-active   { background: var(--badge-bg-green)   !important; color: var(--badge-fg-green)   !important; }
[data-theme="dark"] .badge-inactive { background: var(--badge-bg-neutral) !important; color: var(--badge-fg-neutral) !important; }
[data-theme="dark"] .badge-size     { background: var(--badge-bg-blue)    !important; color: var(--badge-fg-blue)    !important; }

[data-theme="dark"] .code {
  background: var(--color-white) !important;
  color: var(--color-text) !important;
  border-color: var(--color-border) !important;
}

/* Bare <code> elements across the app — many pages have a page-level
   `code { background: #f3f4f6 }` rule that doesn't theme-adapt. This makes
   any inline <code> chip blend into the dark surface. Higher-specificity
   class rules (e.g. .code, .ti-value, .canonical-map-note code) still win
   so the syntax-highlighted code blocks aren't affected. */
[data-theme="dark"] code {
  background: var(--color-card-subtle) !important;
  color: var(--color-text) !important;
  border: 1px solid var(--color-border-lt) !important;
}
/* Inside dark code blocks (.api-snippet, .code-block), the inline <code>
   chips should NOT have their own background — they sit on an already-dark
   background and would look like odd boxes. Inherit the parent's look. */
[data-theme="dark"] pre.api-snippet code,
[data-theme="dark"] .code-block code {
  background: transparent !important;
  border: none !important;
  color: inherit !important;
  padding: 0 !important;
}

[data-theme="dark"] .sidebar-bottom {
  padding-top: 0% !important;
}

[data-theme="dark"] .detail-card {
  background: var(--color-white) !important;
  color: var(--color-text) !important;
}

[data-theme="dark"] .actions {
  padding-bottom: 10px !important;
}
[data-theme="dark"] .bulk-bar {
  background: var(--color-white) !important;
}

/* ── Dark-theme coverage for badges/chips with hardcoded light hex values ─────
   Reuses the --badge-bg-X and --badge-fg-X tokens defined earlier so all
   light-mode hardcoded pills get a consistent dark treatment. */

/* Product type badges (products list + productDetail) */
[data-theme="dark"] .pbadge.GOOD         { background: var(--badge-bg-blue) !important;   color: var(--badge-fg-blue) !important; }
[data-theme="dark"] .pbadge.SERVICE      { background: var(--badge-bg-green) !important;  color: var(--badge-fg-green) !important; }
[data-theme="dark"] .pbadge.SUBSCRIPTION { background: var(--badge-bg-purple) !important; color: var(--badge-fg-purple) !important; }
[data-theme="dark"] .pbadge.inactive     { background: var(--badge-bg-neutral) !important; color: var(--badge-fg-neutral) !important; }

/* Followup status + activity-type badges */
[data-theme="dark"] .sbadge.PENDING   { background: var(--badge-bg-blue) !important;  color: var(--badge-fg-blue) !important; }
[data-theme="dark"] .sbadge.COMPLETED { background: var(--badge-bg-green) !important; color: var(--badge-fg-green) !important; }
[data-theme="dark"] .tbadge           { border: 1px solid transparent !important; }
[data-theme="dark"] .tbadge.CALL      { background: var(--badge-bg-blue) !important;    color: var(--badge-fg-blue) !important; }
[data-theme="dark"] .tbadge.EMAIL     { background: var(--badge-bg-purple) !important;  color: var(--badge-fg-purple) !important; }
[data-theme="dark"] .tbadge.MEETING   { background: var(--badge-bg-orange) !important;  color: var(--badge-fg-orange) !important; }
[data-theme="dark"] .tbadge.DEMO      { background: var(--badge-bg-yellow) !important;  color: var(--badge-fg-yellow) !important; }
[data-theme="dark"] .tbadge.TASK      { background: var(--badge-bg-neutral) !important; color: var(--badge-fg-neutral) !important; }

/* Notification badges (notificationDetail) */
[data-theme="dark"] .read-badge.read       { background: var(--badge-bg-green) !important;  color: var(--badge-fg-green) !important; }
[data-theme="dark"] .read-badge.unread     { background: var(--badge-bg-orange) !important; color: var(--badge-fg-orange) !important; }
[data-theme="dark"] .type-badge.message    { background: var(--badge-bg-blue) !important;   color: var(--badge-fg-blue) !important; }
[data-theme="dark"] .type-badge.assignment { background: var(--badge-bg-purple) !important; color: var(--badge-fg-purple) !important; }
[data-theme="dark"] .type-badge.ticket     { background: var(--badge-bg-green) !important;  color: var(--badge-fg-green) !important; }

/* Quote portal status badges */
[data-theme="dark"] .badge.draft    { background: var(--badge-bg-neutral) !important; color: var(--badge-fg-neutral) !important; }
[data-theme="dark"] .badge.sent     { background: var(--badge-bg-blue) !important;    color: var(--badge-fg-blue) !important; }
[data-theme="dark"] .badge.accepted { background: var(--badge-bg-green) !important;   color: var(--badge-fg-green) !important; }
[data-theme="dark"] .badge.rejected { background: var(--badge-bg-red) !important;     color: var(--badge-fg-red) !important; }
[data-theme="dark"] .badge.expired  { background: var(--badge-bg-yellow) !important;  color: var(--badge-fg-yellow) !important; }

/* Role exec-status chips (roleDetail) */
[data-theme="dark"] .exec-status.active   { background: var(--badge-bg-green) !important;   color: var(--badge-fg-green) !important; }
[data-theme="dark"] .exec-status.inactive { background: var(--badge-bg-neutral) !important; color: var(--badge-fg-neutral) !important; }

/* User Management department / role / status chips (userManagement.html).
   These class names also leak into related pages — the rules are scoped to the
   class so they only fire where the markup uses them. */
[data-theme="dark"] .dept-MANAGER     { background: var(--badge-bg-blue) !important;    color: var(--badge-fg-blue) !important; }
[data-theme="dark"] .dept-EXECUTIVE   { background: var(--badge-bg-green) !important;   color: var(--badge-fg-green) !important; }
[data-theme="dark"] .dept-TELLECALLER { background: var(--badge-bg-orange) !important;  color: var(--badge-fg-orange) !important; }
[data-theme="dark"] .dept-default     { background: var(--badge-bg-neutral) !important; color: var(--badge-fg-neutral) !important; }
[data-theme="dark"] .role-chip        { background: var(--badge-bg-blue) !important;    color: var(--badge-fg-blue) !important; }
[data-theme="dark"] .status-active    { background: var(--badge-bg-green) !important;   color: var(--badge-fg-green) !important; }
[data-theme="dark"] .status-inactive  { background: var(--badge-bg-red) !important;     color: var(--badge-fg-red) !important; }

/* User Management add/edit modal: <select> + permissions grid.
   .form-select gets a global dark override (campaign-scoped rule already
   exists earlier in this file; this catches the rest). The perms-grid
   classes are page-local in userManagement.html and have hardcoded light
   backgrounds (#f9fafb header, #f0f4ff select-all, #f3f4f6 row separators)
   that read as near-white on dark cards without these overrides. */
[data-theme="dark"] .form-select {
  background: var(--color-card) !important;
  color: var(--color-text) !important;
  border-color: var(--color-border) !important;
}
[data-theme="dark"] .form-select:focus {
  border-color: var(--color-primary) !important;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.16) !important;
}
[data-theme="dark"] .form-select option {
  background: var(--color-card) !important;
  color: var(--color-text) !important;
}
[data-theme="dark"] .perms-section {
  border-color: var(--color-border) !important;
  background: var(--color-card) !important;
}
[data-theme="dark"] .perms-header {
  background: var(--color-card-subtle, #1e293b) !important;
  border-color: var(--color-border) !important;
  color: var(--color-text-muted) !important;
}
[data-theme="dark"] .perms-row {
  border-color: var(--color-border) !important;
}
[data-theme="dark"] .perms-row label {
  color: var(--color-text) !important;
}
[data-theme="dark"] .perms-select-all {
  background: rgba(59, 130, 246, 0.12) !important;
  border-color: var(--color-border) !important;
  color: var(--badge-fg-blue) !important;
}

/* Inline-styled status pills — attribute-substring overrides catch JS-rendered
   chips in roles.html, vendorDetail.html, products.html, productDetail.html,
   customerDetail.html that hardcode light hex backgrounds. */
[data-theme="dark"] [style*="background:#fef2f2"],
[data-theme="dark"] [style*="background: #fef2f2"] {
  background: var(--badge-bg-red) !important;
  color: var(--badge-fg-red) !important;
}
[data-theme="dark"] [style*="background:#eef2ff"],
[data-theme="dark"] [style*="background: #eef2ff"] {
  background: var(--badge-bg-blue) !important;
  color: var(--badge-fg-blue) !important;
}
[data-theme="dark"] [style*="background:#dcfce7"],
[data-theme="dark"] [style*="background: #dcfce7"] {
  background: var(--badge-bg-green) !important;
  color: var(--badge-fg-green) !important;
}
[data-theme="dark"] [style*="background:#ecfdf5"],
[data-theme="dark"] [style*="background: #ecfdf5"] {
  background: var(--badge-bg-green) !important;
  color: var(--badge-fg-green) !important;
}
[data-theme="dark"] [style*="background:#f3f4f6"],
[data-theme="dark"] [style*="background: #f3f4f6"] {
  background: var(--badge-bg-neutral) !important;
  color: var(--badge-fg-neutral) !important;
}
/* Yellow "Default" flag on the roles list */
[data-theme="dark"] [style*="background:#fef3c7"],
[data-theme="dark"] [style*="background: #fef3c7"] {
  background: var(--badge-bg-yellow) !important;
  color: var(--badge-fg-yellow) !important;
}

/* Inline info/edit banners and developer-page callouts.
   The edit banner (customer/lead detail) shares #eff6ff/#bfdbfe with the
   developer page info box, so a single rule handles both. */
[data-theme="dark"] [style*="background:#eff6ff"] {
  background: var(--badge-bg-blue) !important;
  color: var(--badge-fg-blue) !important;
  border-color: rgba(122, 176, 239, 0.35) !important;
}
[data-theme="dark"] [style*="background:#f0fdf4"] {
  background: var(--badge-bg-green) !important;
  color: var(--badge-fg-green) !important;
  border-color: rgba(94, 217, 165, 0.35) !important;
}
[data-theme="dark"] [style*="background:#fff7ed"] {
  background: var(--badge-bg-orange) !important;
  color: var(--badge-fg-orange) !important;
  border-color: rgba(247, 152, 96, 0.35) !important;
}

[data-theme="dark"] .field-wrap {
  background: var(--color-white) !important;
  color: var(--color-text) !important;
  border-color: var(--color-border) !important;
}

[data-theme="dark"] .field-use-btn {
  background: var(--color-white) !important;
  color: var(--color-text) !important;
  border-color: var(--color-border) !important;
}