/* Member-route palette, including body-teleported dialogs. No layout changes.
 * Keep financial gain/loss and warning colors semantic, and QR codes black/white.
 * The resolved color theme respects each member's light/dark preference. */
/* Keep the exposed app canvas themed while route components unmount/mount. */
html[data-cex-color-theme='dark-purple'] #app {
  background-color: #0e0c15;
}
html[data-cex-member-route][data-cex-color-theme='dark-purple'] body {
  --member-panel: #1b162b;
  --member-inset: #241c35;
  --member-border: #39304b;
  --member-text: #f3edff;
  --member-muted: #b5a8cc;
  --member-accent: #b58aff;
  --member-hover: #c9a8ff;
  --member-gradient: linear-gradient(125deg, #1b162b, #251d38);
  --ex-default-background-color: #0e0c15;
  --ex-backup--background-color: var(--member-panel);
  --ex--backup-background-color-2: var(--member-inset);
  --ex-home-tabbar-background-color: var(--member-panel);
  --ex-home-tabbar-border: var(--member-border);
  --ex-home-grid-border: var(--member-border);
  --ex-home-font-revert-color: var(--member-text);
  --ex-text-color: var(--member-text);
  --ex-default-font-color: var(--member-text);
  --ex-default-font-color2: var(--member-muted);
  --ex-default-font-color3: var(--member-text);
  --ex-default-font-color11: var(--member-accent);
  --ex-two-level-theme-color: var(--member-accent);
  --ex-bg-linear-color: var(--member-gradient);
  --ex-bg-linear-color2: linear-gradient(115deg, #b58aff, #9464d6);
  --ex-home-linear-color: var(--member-panel);
  --ex-home-bot-linear-color: var(--member-panel);
  --ex-home-linear-color4: var(--member-inset);
  --ex-home-linear-color5: var(--member-inset);
  --ex-home-font-color6: var(--member-accent);
  --ex-bot-card-bg: var(--member-gradient);
  --ex-bot-card-border: var(--member-border);
  --ex-bot-return-bg: var(--member-inset);
  --ex-detail-label-color: var(--member-muted);
  --ex-bot-start-icon-bg: #b58aff24;
  --ex-strategy-tabs-bg: var(--member-panel);
  --ex-strategy-tabs-border: var(--member-border);
  --ex-strategy-tab-active-bg: var(--member-accent);
  --ex-strategy-tab-active-color: #170e26;
  --ex-strategy-tab-inactive-color: var(--member-muted);
  --ex-strategy-metrics-bg: var(--member-inset);
  --ex-strategy-metrics-border: var(--member-border);
  --ex-trade-bg-color: var(--member-inset);
  --ex-trade-bg-color2: var(--member-inset);
  --ex-trade-bg-color3: var(--member-panel);
  --ex-trade-bg-linear-color: var(--member-gradient);
  --ex-trade-bg-linear-color2: var(--member-gradient);
  --ex-trade-font-color: var(--member-text);
  --ex-trade-font-color2: var(--member-muted);
  --ex-trade-font-color3: var(--member-accent);
  --ex-popup-background-color: var(--member-panel);
  --ex-input-background-color: var(--member-inset);
  --ex-input-background-color2: var(--member-inset);
  --ex-input-font-color: var(--member-text);
  --ex-input-border-color: var(--member-border);
  --ex-select-background-color: var(--member-inset);
  --ex-select-font-color: var(--member-text);
  --ex-select-dialog-background-color: var(--member-panel);
  --ex-select-dialog-font-color: var(--member-text);
  --ex-select-dialog-boder-color: var(--member-border);
  --border-primary: var(--member-border);
  --border-input: var(--member-border);
  --bg-modal: var(--member-panel);
  --bg-dropdown: var(--member-panel);
  --trade-bg-card: var(--member-panel);
  --user-dropdown-bg: var(--member-panel);
  --user-dropdown-text: var(--member-text);
  --user-dropdown-border: var(--member-border);
  --sidebar-theme-hover-bg: var(--member-inset);
  --ms-accent: var(--member-accent);
  --ms-accent-hover: var(--member-hover);
  --ms-card-bg: var(--member-panel);
  --ms-card-border: var(--member-border);
  --ms-card-hover-border: #715492;
  --ms-text-heading: var(--member-text);
  --ms-text-body: #d8cce8;
  --ms-text-muted: var(--member-muted);
  --ms-text-label: var(--member-muted);
  --ms-notice-bg: var(--member-inset);
  --ms-notice-text: var(--member-muted);
  --ms-icon-bg: var(--member-inset);
  --ms-icon-color: var(--member-accent);
  --ms-btn-outline-border: var(--member-border);
  --ms-btn-outline-color: var(--member-text);
  --ms-table-border: var(--member-border);
  --ms-table-head-color: var(--member-muted);
  --ms-table-cell-color: var(--member-text);
  --ms-offer-bg: linear-gradient(135deg, #503370, #332245);
  --ms-current-plan-bg: var(--member-panel);
  --ms-current-plan-border: var(--member-border);
  --ms-load-more-color: var(--member-muted);
}

/* Recovered header: desktop uses the sidebar hover token; mobile still has a
 * literal teal utility. Match those exact controls without changing layout. */
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .dashboard-page [class~='bg-[rgba(19,168,161,0.08)]'] {
  background-color: #b58aff14;
}
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .dashboard-page :is([class~='hover:bg-[var(--sidebar-theme-hover-bg)]'], [class~='bg-[rgba(19,168,161,0.08)]']):is(:hover, :focus-within, :active) {
  background-color: var(--member-inset);
}

/* Naive UI sets these variables inline, including fixed blue inputs and menus.
 * Override only neutral surfaces/accent controls, not error/success states. */
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .dashboard-page .n-card {
  --n-color: var(--member-panel) !important;
  --n-text-color: var(--member-text) !important;
  --n-title-text-color: var(--member-text) !important;
  --n-border-color: var(--member-border) !important;
}
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .n-data-table {
  --n-td-color: var(--member-panel) !important;
  --n-th-color: var(--member-inset) !important;
  --n-td-color-hover: #2e2340 !important;
  --n-td-color-striped: #211a30 !important;
  --n-td-text-color: var(--member-text) !important;
  --n-th-text-color: var(--member-muted) !important;
  --n-border-color: var(--member-border) !important;
}
html[data-cex-member-route][data-cex-color-theme='dark-purple'] :is(.n-modal, .n-dialog, .n-base-select-menu, .n-dropdown-menu, .n-popover) {
  --n-color: var(--member-panel) !important;
  --n-color-modal: var(--member-panel) !important;
  --n-card-color: var(--member-panel) !important;
  --n-text-color: var(--member-text) !important;
  --n-title-text-color: var(--member-text) !important;
  --n-border-color: var(--member-border) !important;
  --n-option-color-pending: var(--member-inset) !important;
  --n-option-color-active: var(--member-inset) !important;
  --n-option-color-active-pending: var(--member-inset) !important;
  --n-option-text-color: var(--member-text) !important;
  --n-option-text-color-active: var(--member-accent) !important;
  background-color: var(--member-panel) !important;
  color: var(--member-text);
}
html[data-cex-member-route][data-cex-color-theme='dark-purple'] :is(.n-input, .n-base-selection) {
  --n-color: var(--member-inset) !important;
  --n-color-active: var(--member-inset) !important;
  --n-color-focus: var(--member-inset) !important;
  --n-color-disabled: #211b2e !important;
  --n-text-color: var(--member-text) !important;
  --n-placeholder-color: var(--member-muted) !important;
  --n-border: 1px solid var(--member-border) !important;
  --n-border-hover: 1px solid var(--member-accent) !important;
  --n-border-focus: 1px solid var(--member-accent) !important;
  --n-border-active: 1px solid var(--member-accent) !important;
  --n-box-shadow-focus: 0 0 0 2px #b58aff24 !important;
  --n-box-shadow-active: 0 0 0 2px #b58aff24 !important;
}
html[data-cex-member-route][data-cex-color-theme='dark-purple'] :is(.connect-exchange-modal, .quick-connect-modal, .withdraw-modal) :is(.n-input, .n-base-selection-label) {
  background-color: var(--member-inset) !important;
  border-color: var(--member-border) !important;
}
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .n-button--primary-type {
  --n-color: var(--member-accent) !important;
  --n-color-hover: var(--member-hover) !important;
  --n-color-pressed: #a374e9 !important;
  --n-color-focus: var(--member-hover) !important;
  --n-text-color: #170e26 !important;
  --n-text-color-hover: #170e26 !important;
  --n-text-color-pressed: #170e26 !important;
  --n-text-color-focus: #170e26 !important;
  --n-border: 1px solid var(--member-accent) !important;
  --n-border-hover: 1px solid var(--member-hover) !important;
}
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .daily-exclusive-tab .strategy-desc { border-left-color: var(--member-accent); }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .daily-exclusive-tab .partner-icon { background: #b58aff24; color: var(--member-accent); }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] :is(.daily-exclusive-tab, .bots-tab) .start-btn { box-shadow: 0 4px 20px -5px #b58aff40; }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .lang-modal { background: var(--member-panel); border: 1px solid var(--member-border); }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .lang-modal .check-mark { background: var(--member-accent); border-color: var(--member-panel); }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] :is(.lang-title, .lang-name, .lang-close) { color: var(--member-text); }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] :is(.lang-item:hover, .lang-item.active, .lang-close:hover) { background: var(--member-inset); }

/* Existing membership confirmation uses an inline cyan gradient. */
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .buy-confirm-modal .text-center[style*='linear-gradient'] { background: linear-gradient(160deg, #624086, #38234e) !important; }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .membership-tab .payment-info-banner { background: linear-gradient(135deg, #624086, #38234e); }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .membership-tab .payment-benefits-title { color: var(--member-accent); }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .membership-tab .benefit-item { color: var(--member-accent); }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .membership-tab .benefit-svg { stroke: var(--member-accent); }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .membership-tab .benefit-tag { background: var(--member-inset); color: var(--member-accent); }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .membership-tab :is(.btn-primary, .btn-trial-cta) { color: #170e26; }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .membership-tab .current-plan-card { background: var(--member-gradient); color: var(--member-text); border-color: var(--member-border); }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .membership-tab .modal-content { background: var(--member-panel); color: var(--member-text); }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .membership-tab .modal-header { background: #503370; }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .membership-tab :is(.payment-tabs, .address-box, .payment-waiting, .payment-timer) { background: var(--member-inset); border-color: var(--member-border); color: var(--member-muted); }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .membership-tab :is(.payment-tab, .payment-plan-name, .payment-order-id) { color: var(--member-muted); border-color: var(--member-border); }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .membership-tab .payment-tab.active { background: var(--member-accent); color: #170e26; box-shadow: 0 2px 8px #b58aff30; }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .membership-tab .payment-qr-section { border-color: var(--member-border); }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .membership-tab .payment-notes { background: #332919; color: #f3d5a5; }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .membership-tab .address-text { color: var(--member-text); }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .membership-tab .btn-outline { color: var(--member-text); }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .quick-connect-modal textarea { background: var(--member-inset) !important; border-color: var(--member-border) !important; color: var(--member-text) !important; }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .quick-connect-tab[aria-pressed='false'] { background: var(--member-inset) !important; color: var(--member-muted) !important; }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .quick-connect-tab[aria-pressed='true'] { background: var(--member-accent) !important; color: #170e26 !important; }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .quick-connect-modal button:disabled { background: var(--member-inset) !important; color: var(--member-muted) !important; border-color: var(--member-border) !important; }
html[data-cex-member-route][data-cex-color-theme='dark-purple'] .membership-tab :is(.notes-item, .notes-item strong) { color: #f3d5a5; }
