/* P6d — Subscription / Referrals (W2) + CRM content (flag on, own chrome) */

.w2-app--live .ms-shell,
.w2-app--live .ao-shell,
.crm-themed-dashboard .ms-shell,
.crm-themed-dashboard .ao-shell,
.w2-app--live #referrals-container,
.w2-app--live .w2-ref {
  width: 100%;
  max-width: none;
  color: var(--color-text) !important;
  font-family: var(--font-sans, "Plus Jakarta Sans", Inter, system-ui, sans-serif) !important;
}

.w2-app--live .ms-shell,
.w2-app--live .ao-shell,
.crm-themed-dashboard .ms-shell,
.crm-themed-dashboard .ao-shell {
  background: var(--color-surface) !important;
  border: 1px solid var(--color-border-strong, var(--color-border)) !important;
  color: var(--color-text) !important;
  box-shadow: var(--w2-app-shadow, 0 8px 24px rgba(26, 26, 26, 0.06)) !important;
}

.w2-app--live .ms-panel,
.w2-app--live .ms-metric,
.w2-app--live .ao-card,
.crm-themed-dashboard .ms-panel,
.crm-themed-dashboard .ms-metric,
.crm-themed-dashboard .ao-card,
.w2-app--live #referrals-container .chartBox,
.w2-app--live .w2-ref .chartBox,
.w2-app--live .w2-ref .ref-card {
  background: var(--color-surface) !important;
  border: 1px solid var(--color-border-strong, var(--color-border)) !important;
  color: var(--color-text) !important;
  box-shadow: none !important;
}

.w2-app--live .ms-hero,
.crm-themed-dashboard .ms-hero {
  border-bottom-color: var(--color-border) !important;
}

.w2-app--live .ms-hero p,
.w2-app--live .ms-hero strong,
.w2-app--live .ms-metric p,
.w2-app--live .ao-shell p,
.w2-app--live .ao-price-alt,
.crm-themed-dashboard .ms-hero p,
.crm-themed-dashboard .ms-hero strong,
.crm-themed-dashboard .ms-metric p,
.crm-themed-dashboard .ao-shell p,
.crm-themed-dashboard .ao-price-alt,
.w2-app--live #referrals-container .platform_para,
.w2-app--live #referrals-container .text-light,
.w2-app--live .referrals-instructions,
.w2-app--live .how-it-works .referrals-instructions,
.w2-app--live .w2-ref .text-muted {
  color: var(--color-text-muted) !important;
}

.w2-app--live .ms-metric h5,
.w2-app--live .ms-shell h4,
.w2-app--live .ms-shell h5,
.w2-app--live .ao-shell h5,
.w2-app--live .ao-shell h6,
.crm-themed-dashboard .ms-metric h5,
.crm-themed-dashboard .ms-shell h4,
.crm-themed-dashboard .ms-shell h5,
.crm-themed-dashboard .ao-shell h5,
.crm-themed-dashboard .ao-shell h6,
.w2-app--live #referrals-container .chartBox h5,
.w2-app--live #referrals-container h4,
.w2-app--live #referrals-container h2,
.w2-app--live .w2-ref h2,
.w2-app--live .w2-ref h5,
.w2-app--live .w2-ref .stat-value {
  color: var(--color-text) !important;
}

.w2-app--live .ms-chip,
.crm-themed-dashboard .ms-chip {
  background: color-mix(in srgb, var(--color-accent) 14%, var(--color-surface)) !important;
  border-color: var(--color-accent) !important;
  color: var(--color-text) !important;
}

.w2-app--live .ms-btn-secondary,
.w2-app--live .ms-jump-link,
.crm-themed-dashboard .ms-btn-secondary,
.crm-themed-dashboard .ms-jump-link {
  background: var(--color-surface) !important;
  border: 1px solid var(--color-border-strong, var(--color-border)) !important;
  color: var(--color-text) !important;
}

.w2-app--live .ms-jump-link:hover,
.crm-themed-dashboard .ms-jump-link:hover {
  border-color: var(--color-accent) !important;
  color: var(--color-text) !important;
  background: color-mix(in srgb, var(--color-accent) 10%, var(--color-surface)) !important;
}

.w2-app--live .ms-table thead th,
.crm-themed-dashboard .ms-table thead th {
  background: var(--color-surface-alt) !important;
  color: var(--color-text-muted) !important;
  border-color: var(--color-border) !important;
}

.w2-app--live .ms-table th,
.w2-app--live .ms-table td,
.crm-themed-dashboard .ms-table th,
.crm-themed-dashboard .ms-table td {
  color: var(--color-text) !important;
  border-color: var(--color-border) !important;
}

.w2-app--live .ms-table tbody tr:nth-child(even),
.crm-themed-dashboard .ms-table tbody tr:nth-child(even) {
  background: var(--color-surface-alt) !important;
}

.w2-app--live .ms-progress,
.crm-themed-dashboard .ms-progress {
  background: var(--color-surface-alt) !important;
}

.w2-app--live .ao-cycle-toggle,
.crm-themed-dashboard .ao-cycle-toggle {
  border-color: var(--color-border-strong, var(--color-border)) !important;
}

.w2-app--live .ao-cycle-toggle a,
.crm-themed-dashboard .ao-cycle-toggle a {
  color: var(--color-text-muted) !important;
}

.w2-app--live .ao-cycle-toggle a.active,
.crm-themed-dashboard .ao-cycle-toggle a.active {
  background: color-mix(in srgb, var(--color-accent) 16%, var(--color-surface)) !important;
  color: var(--color-text) !important;
}

.w2-app--live .ao-btn-ghost,
.crm-themed-dashboard .ao-btn-ghost,
.w2-app--live .w2-ref .copy-link,
.w2-app--live .w2-ref .add-code-form .add-code-input,
.w2-app--live .w2-ref .form-control,
.w2-app--live .w2-ref .referral-qr-inner,
.w2-app--live .w2-ref .referral-qr-input {
  background: var(--color-surface) !important;
  border: 1px solid var(--color-border-strong, var(--color-border)) !important;
  color: var(--color-text) !important;
}

.w2-app--live .ao-btn,
.w2-app--live .ms-btn-primary,
.crm-themed-dashboard .ao-btn,
.crm-themed-dashboard .ms-btn-primary {
  color: #042028 !important;
}

.w2-app--live #referrals-container table.table-striped thead th,
.w2-app--live .w2-ref table thead th {
  color: var(--color-text-muted) !important;
  background: var(--color-surface-alt) !important;
  border-color: var(--color-border) !important;
}

.w2-app--live #referrals-container table.table-striped tbody td,
.w2-app--live .w2-ref table td {
  color: var(--color-text) !important;
  border-color: var(--color-border) !important;
}

.w2-app--live .w2-ref table.table-striped tbody tr:hover {
  background: var(--color-surface-alt) !important;
}

.w2-app--live .w2-ref .referral-qr-title {
  color: var(--color-text) !important;
}

/* CRM keeps its own sidebar; remap content only when this file is loaded */
.crm-themed-dashboard .content,
.crm-themed-dashboard .crm-app-main {
  background: var(--color-background, #fff) !important;
  color: var(--color-text, #1a1a1a) !important;
}

.crm-themed-dashboard .top-shell {
  background: var(--color-surface, #fff) !important;
  border-bottom: 1px solid var(--color-border-strong, var(--color-border, #dadce0)) !important;
}

.crm-themed-dashboard .top-shell__headline,
.crm-themed-dashboard .top-shell__eyebrow {
  color: var(--color-text, #1a1a1a) !important;
}

.crm-themed-dashboard .crm-shell {
  max-width: none;
  color: var(--color-text, #1a1a1a) !important;
}

.crm-themed-dashboard .crm-hero,
.crm-themed-dashboard .crm-panel,
.crm-themed-dashboard .crm-card,
.crm-themed-dashboard .crm-focus-card,
.crm-themed-dashboard .crm-overview-stack .crm-panel:first-of-type,
.crm-themed-dashboard .crm-modal {
  background: var(--color-surface, #fff) !important;
  border: 1px solid var(--color-border-strong, var(--color-border, #dadce0)) !important;
  color: var(--color-text, #1a1a1a) !important;
  box-shadow: none !important;
}

.crm-themed-dashboard .crm-hero__eyebrow,
.crm-themed-dashboard .crm-section-kicker,
.crm-themed-dashboard .crm-muted,
.crm-themed-dashboard .crm-empty,
.crm-themed-dashboard .crm-empty-state,
.crm-themed-dashboard .crm-table th,
.crm-themed-dashboard .crm-card h5,
.crm-themed-dashboard .crm-field label,
.crm-themed-dashboard .crm-count-pill {
  color: var(--color-text-muted, #5f6368) !important;
}

.crm-themed-dashboard .crm-section-title,
.crm-themed-dashboard .crm-panel h3,
.crm-themed-dashboard .crm-focus-card__value,
.crm-themed-dashboard .crm-detail-header h2,
.crm-themed-dashboard .crm-table td,
.crm-themed-dashboard .crm-card .val,
.crm-themed-dashboard .crm-modal .modal-title {
  color: var(--color-text, #1a1a1a) !important;
  background: none !important;
  -webkit-text-fill-color: var(--color-text, #1a1a1a);
}

.crm-themed-dashboard .crm-tabs {
  background: var(--color-surface-alt, #f7f7f7) !important;
  border: 1px solid var(--color-border-strong, var(--color-border, #dadce0)) !important;
  box-shadow: none !important;
}

.crm-themed-dashboard .crm-tab {
  background: transparent !important;
  border: 1px solid transparent !important;
  color: var(--color-text-muted, #5f6368) !important;
  box-shadow: none !important;
}

.crm-themed-dashboard .crm-tab:hover,
.crm-themed-dashboard .crm-tab.active {
  background: color-mix(in srgb, var(--crm-primary, var(--color-accent)) 16%, var(--color-surface, #fff)) !important;
  border-color: var(--crm-primary, var(--color-accent)) !important;
  color: var(--color-text, #1a1a1a) !important;
}

.crm-themed-dashboard .crm-btn-ghost,
.crm-themed-dashboard .crm-shell input,
.crm-themed-dashboard .crm-shell select,
.crm-themed-dashboard .crm-shell textarea,
.crm-themed-dashboard .crm-input {
  background: var(--color-surface, #fff) !important;
  border: 1px solid var(--color-border-strong, var(--color-border, #dadce0)) !important;
  color: var(--color-text, #1a1a1a) !important;
}

.crm-themed-dashboard .crm-btn-ghost:hover {
  background: var(--color-surface-alt, #f7f7f7) !important;
  color: var(--color-text, #1a1a1a) !important;
}

.crm-themed-dashboard .crm-badge {
  background: color-mix(in srgb, var(--crm-primary, var(--color-accent)) 14%, var(--color-surface, #fff)) !important;
  border-color: var(--crm-primary, var(--color-accent)) !important;
  color: var(--color-text, #1a1a1a) !important;
}

.crm-themed-dashboard .crm-table th,
.crm-themed-dashboard .crm-table td {
  border-bottom-color: var(--color-border, #ececec) !important;
}

html[data-theme="dark"] .crm-themed-dashboard .content,
html[data-theme="dark"] .crm-themed-dashboard .crm-app-main {
  background: var(--color-background, #121212) !important;
  color: var(--color-text, #f2f2f2) !important;
}

html[data-theme="dark"] .crm-themed-dashboard .crm-hero,
html[data-theme="dark"] .crm-themed-dashboard .crm-panel,
html[data-theme="dark"] .crm-themed-dashboard .crm-card,
html[data-theme="dark"] .crm-themed-dashboard .crm-focus-card,
html[data-theme="dark"] .crm-themed-dashboard .crm-modal {
  background: var(--color-surface, #1c1c1c) !important;
  color: var(--color-text, #f2f2f2) !important;
}

/* Studio layout — subscription, add-ons, affiliates */
.w2-app--live .ms-hero--studio,
.w2-app--live .ao-hero,
.w2-app--live .aff-hero {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 18px 20px;
  margin-bottom: 16px;
  border-radius: 20px;
  background:
    radial-gradient(circle at 12% 20%, color-mix(in srgb, #ea4335 16%, transparent), transparent 42%),
    radial-gradient(circle at 88% 10%, color-mix(in srgb, #4285f4 18%, transparent), transparent 40%),
    var(--color-surface-alt);
  border: 1px solid var(--color-border-strong, var(--color-border));
}

.w2-app--live .ms-kicker,
.w2-app--live .aff-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--color-accent) !important;
}

.w2-app--live .ms-hero__art,
.w2-app--live .ao-hero__art,
.w2-app--live .aff-hero__art {
  position: relative;
  width: 88px;
  height: 88px;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  border-radius: 28px;
  background: color-mix(in srgb, var(--color-accent) 16%, var(--color-surface));
  color: var(--color-accent);
  font-size: 2rem;
  overflow: hidden;
}

.w2-app--live .aff-blob {
  position: absolute;
  border-radius: 50%;
  filter: blur(2px);
}
.w2-app--live .aff-blob--a { width: 46px; height: 46px; top: -8px; left: -6px; background: #ea433533; }
.w2-app--live .aff-blob--b { width: 36px; height: 36px; bottom: 4px; right: -4px; background: #34a85333; }
.w2-app--live .aff-blob--c { width: 28px; height: 28px; top: 28px; right: 18px; background: #4285f433; }
.w2-app--live .aff-hero__art i { position: relative; z-index: 1; }

.w2-app--live .ms-tabbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 16px;
}

.w2-app--live .ms-tabs {
  display: flex;
  flex-wrap: nowrap;
  gap: 4px;
  overflow-x: auto;
  padding: 5px;
  margin: 0;
  border-radius: 14px;
  background: var(--color-surface-alt) !important;
  border: 1px solid var(--color-border) !important;
  scrollbar-width: thin;
}

.w2-app--live .ms-tab,
.w2-app--live .ms-tab-action {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  min-height: 36px;
  border: 1px solid transparent !important;
  border-radius: 10px;
  padding: 0.45rem 0.8rem;
  background: transparent !important;
  color: var(--color-text-muted) !important;
  box-shadow: none !important;
  font-size: 0.82rem;
  font-weight: 650;
}

.w2-app--live .ms-tab:hover,
.w2-app--live .ms-tab-action:hover {
  color: var(--color-text) !important;
  background: color-mix(in srgb, var(--color-surface) 82%, transparent) !important;
}

.w2-app--live .ms-tab.is-active {
  color: var(--color-accent) !important;
  background: color-mix(in srgb, var(--color-accent) 12%, var(--color-surface)) !important;
  font-weight: 800;
}

.w2-app--live .ms-tab-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-left: auto;
}

.w2-app--live .ms-tab-action {
  border-color: var(--color-border) !important;
  background: var(--color-surface) !important;
}

.w2-app--live .ms-tab-panel {
  display: none;
}

.w2-app--live .ms-tab-panel.is-active {
  display: block;
}

.w2-app--live .ms-panel-title {
  color: var(--color-text) !important;
}

.w2-app--live .ms-panel-copy,
.w2-app--live .ms-addon-group h6,
.w2-app--live .ms-choice__meta {
  color: var(--color-text-muted) !important;
}

.w2-app--live .ms-choice {
  background: var(--color-surface-alt) !important;
  border: 1px solid var(--color-border) !important;
  color: var(--color-text) !important;
}

.w2-app--live .ms-choice:hover {
  border-color: var(--color-accent) !important;
  background: color-mix(in srgb, var(--color-accent) 8%, var(--color-surface)) !important;
}

.w2-app--live .ms-choice__price {
  color: var(--color-accent) !important;
}

.w2-app--live .ms-cycle {
  border-color: var(--color-border);
}

.w2-app--live .ms-cycle a {
  color: var(--color-text-muted);
}

.w2-app--live .ms-cycle a.is-active {
  background: color-mix(in srgb, var(--color-accent) 14%, var(--color-surface));
  color: var(--color-text);
}

.w2-app--live .ms-product-ico--blue { background: #e3f2fd; color: #1565c0; }
.w2-app--live .ms-product-ico--green { background: #e8f5e9; color: #2e7d32; }
.w2-app--live .ms-product-ico--yellow { background: #fff8e1; color: #f9a825; }
.w2-app--live .ms-product-ico--red { background: #fdecea; color: #c62828; }
.w2-app--live .ms-product-ico--muted { background: var(--color-surface-alt); color: var(--color-text-muted); }

html[data-theme="dark"] .w2-app--live .ms-product-ico--blue { background: rgba(66, 133, 244, 0.2); color: #8ab4f8; }
html[data-theme="dark"] .w2-app--live .ms-product-ico--green { background: rgba(52, 168, 83, 0.2); color: #81c995; }
html[data-theme="dark"] .w2-app--live .ms-product-ico--yellow { background: rgba(251, 188, 4, 0.2); color: #fdd663; }
html[data-theme="dark"] .w2-app--live .ms-product-ico--red { background: rgba(234, 67, 53, 0.2); color: #f28b82; }
html[data-theme="dark"] .w2-app--live .ms-product-ico--muted { background: rgba(129, 173, 214, 0.16); color: #b8d4e9; }

.w2-app--live .ms-jump--blue,
.w2-app--live .ms-jump--green,
.w2-app--live .ms-jump--violet,
.w2-app--live .ms-jump--amber,
.w2-app--live .ms-jump--red,
.w2-app--live .ms-jump--cyan {
  border-color: var(--color-border) !important;
  background: var(--color-surface) !important;
}

/* Light theme: leftover dark-page hex colors are unreadable on white. */
html:not([data-theme="dark"]) .w2-app--live:has(.w2-sub) .w2-app__page-kicker,
html:not([data-theme="dark"]) .w2-app--live:has(.w2-sub) .w2-app__topbar-eyebrow,
html:not([data-theme="dark"]) .w2-app--live:has(.w2-sub) .w2-app__page-sub {
  color: #4b5563 !important;
}

html:not([data-theme="dark"]) .w2-app--live .ms-shell .ms-muted,
html:not([data-theme="dark"]) .w2-app--live .ms-shell .ms-panel-copy,
html:not([data-theme="dark"]) .w2-app--live .ms-shell .ms-metric p,
html:not([data-theme="dark"]) .w2-app--live .ms-shell .ms-hero p,
html:not([data-theme="dark"]) .w2-app--live .ms-shell .ms-addon-group h6,
html:not([data-theme="dark"]) .w2-app--live .ms-shell .ms-choice__meta,
html:not([data-theme="dark"]) .w2-app--live .ms-shell .ms-table thead th,
html:not([data-theme="dark"]) .w2-app--live .ao-shell p,
html:not([data-theme="dark"]) .w2-app--live .ao-price-alt {
  color: #4b5563 !important;
}

html:not([data-theme="dark"]) .w2-app--live .ms-shell .ms-strong,
html:not([data-theme="dark"]) .w2-app--live .ms-shell strong,
html:not([data-theme="dark"]) .w2-app--live .ms-shell .ms-panel-title,
html:not([data-theme="dark"]) .w2-app--live .ms-shell .ms-choice__name {
  color: var(--color-text) !important;
}

html:not([data-theme="dark"]) .w2-app--live .ms-tab,
html:not([data-theme="dark"]) .w2-app--live .ms-tab-action {
  color: #1f2937 !important;
}

html:not([data-theme="dark"]) .w2-app--live .ms-tab.is-active {
  color: #1557c0 !important;
}

html:not([data-theme="dark"]) .w2-app--live .ms-locked {
  color: #b45309 !important;
}

html:not([data-theme="dark"]) .w2-app--live .ms-locked-link {
  color: #1557c0 !important;
  text-decoration: underline;
}

html:not([data-theme="dark"]) .w2-app--live .ms-status-ok {
  color: #15803d !important;
}

html:not([data-theme="dark"]) .w2-app--live .ms-status-warn {
  color: #b45309 !important;
}

html:not([data-theme="dark"]) .w2-app--live .ms-shell [style*="#9fb3c7"],
html:not([data-theme="dark"]) .w2-app--live .ao-shell [style*="#9fb3c7"],
html:not([data-theme="dark"]) .w2-app--live .ms-shell [style*="#b8d4ff"] {
  color: #4b5563 !important;
}

html:not([data-theme="dark"]) .w2-app--live .ms-shell [style*="#e8f4fc"],
html:not([data-theme="dark"]) .w2-app--live .ao-shell [style*="#e8f4fc"] {
  color: var(--color-text) !important;
}

html:not([data-theme="dark"]) .w2-app--live .ms-shell [style*="#9bf4ff"],
html:not([data-theme="dark"]) .w2-app--live .ao-shell [style*="#03ccda"] {
  color: #1557c0 !important;
}

html:not([data-theme="dark"]) .w2-app--live .ms-shell [style*="#ffdca0"],
html:not([data-theme="dark"]) .w2-app--live .ms-shell [style*="#ffd2d2"] {
  color: #b45309 !important;
}

html:not([data-theme="dark"]) .w2-app--live .ms-shell [style*="#89efc0"] {
  color: #15803d !important;
}

.w2-app--live .ao-hero { margin-bottom: 18px; }
.w2-app--live .ao-card { position: relative; padding-top: 18px; }
.w2-app--live .ao-card__icon {
  width: 36px;
  height: 36px;
  display: grid;
  place-items: center;
  border-radius: 10px;
  margin-bottom: 10px;
  background: #e3f2fd;
  color: #1565c0;
}
.w2-app--live .ao-card:nth-child(3n+2) .ao-card__icon { background: #e8f5e9; color: #2e7d32; }
.w2-app--live .ao-card:nth-child(3n) .ao-card__icon { background: #fff3e0; color: #ef6c00; }

.w2-app--live .aff-studio h2,
.w2-app--live .aff-studio h3,
.w2-app--live .aff-hero h2 {
  color: var(--color-text) !important;
  margin: 0 0 6px;
}
.w2-app--live .aff-hero p,
.w2-app--live .aff-sharebox p,
.w2-app--live .aff-dest header p,
.w2-app--live .aff-pagebar p {
  color: var(--color-text-muted) !important;
  margin: 0;
}

.w2-app--live .aff-hero__actions,
.w2-app--live .aff-sharebox__row,
.w2-app--live .aff-dest__actions,
.w2-app--live .aff-inline-form {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 12px;
}

.w2-app--live .aff-btn,
.w2-app--live .aff-studio .aff-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border-radius: 12px;
  padding: 9px 14px;
  font-weight: 700;
  text-decoration: none;
  border: 1px solid var(--color-border-strong, var(--color-border));
  color: var(--color-text) !important;
  background: var(--color-surface) !important;
}
.w2-app--live .aff-btn--primary {
  background: linear-gradient(135deg, #03ccda, #10d8e5) !important;
  border-color: transparent !important;
  color: #042028 !important;
}

.w2-app--live .aff-sharebox,
.w2-app--live .aff-create,
.w2-app--live .aff-table-card,
.w2-app--live .aff-steps {
  background: var(--color-surface) !important;
  border: 1px solid var(--color-border-strong, var(--color-border)) !important;
  border-radius: 18px;
  padding: 16px 18px;
  margin-bottom: 16px;
}

.w2-app--live .aff-sharebox__input,
.w2-app--live .aff-create .form-control {
  flex: 1 1 220px;
  min-height: 42px;
  background: var(--color-surface) !important;
  border: 1px solid var(--color-border-strong, var(--color-border)) !important;
  color: var(--color-text) !important;
  border-radius: 12px;
  padding: 8px 12px;
}

.w2-app--live .aff-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.w2-app--live .aff-kpi {
  border-radius: 16px;
  padding: 14px 16px;
  border: 1px solid var(--color-border-strong, var(--color-border));
  background: var(--color-surface);
  min-height: 110px;
}
.w2-app--live .aff-kpi i { font-size: 1.1rem; margin-bottom: 8px; display: block; }
.w2-app--live .aff-kpi p { margin: 0; color: var(--color-text-muted) !important; font-size: 0.82rem; }
.w2-app--live .aff-kpi strong { display: block; margin-top: 4px; font-size: 1.35rem; color: var(--color-text) !important; }
.w2-app--live .aff-kpi--green { background: #e8f5e9; border-color: #a5d6a7; }
.w2-app--live .aff-kpi--amber { background: #fff8e1; border-color: #ffe082; }
.w2-app--live .aff-kpi--blue { background: #e3f2fd; border-color: #90caf9; }
.w2-app--live .aff-kpi--violet { background: #f3e5f5; border-color: #ce93d8; }

html[data-theme="dark"] .w2-app--live .aff-kpi--green,
html[data-theme="dark"] .w2-app--live .aff-kpi--amber,
html[data-theme="dark"] .w2-app--live .aff-kpi--blue,
html[data-theme="dark"] .w2-app--live .aff-kpi--violet {
  background: var(--color-surface) !important;
}

.w2-app--live .aff-dest header { margin-bottom: 12px; }
.w2-app--live .aff-dest__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  margin-bottom: 16px;
}
.w2-app--live .aff-dest__card {
  border-radius: 16px;
  padding: 14px;
  border: 1px solid var(--color-border-strong, var(--color-border));
  background: var(--color-surface);
  min-height: 180px;
}
.w2-app--live .aff-dest__card i { font-size: 1.25rem; margin-bottom: 8px; }
.w2-app--live .aff-dest__card h4 { margin: 0 0 6px; font-size: 1rem; }
.w2-app--live .aff-dest__card p { color: var(--color-text-muted) !important; font-size: 0.82rem; }
.w2-app--live .aff-dest__card--red { background: #fdecea; }
.w2-app--live .aff-dest__card--blue { background: #e3f2fd; }
.w2-app--live .aff-dest__card--violet { background: #f3e5f5; }
.w2-app--live .aff-dest__card--green { background: #e8f5e9; }

html[data-theme="dark"] .w2-app--live .aff-dest__card--red,
html[data-theme="dark"] .w2-app--live .aff-dest__card--blue,
html[data-theme="dark"] .w2-app--live .aff-dest__card--violet,
html[data-theme="dark"] .w2-app--live .aff-dest__card--green {
  background: var(--color-surface) !important;
}

.w2-app--live .aff-steps ol {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
  padding: 0;
  margin: 12px 0 0;
  list-style: none;
}
.w2-app--live .aff-steps li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}
.w2-app--live .aff-steps li span {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: #e3f2fd;
  color: #1565c0;
  font-weight: 800;
  flex-shrink: 0;
}
.w2-app--live .aff-steps li p { margin: 2px 0 0; color: var(--color-text-muted) !important; font-size: 0.82rem; }
.w2-app--live .aff-steps__more { margin-top: 14px; color: var(--color-text-muted); }
.w2-app--live .aff-charts {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 16px;
  align-items: start;
}
.w2-app--live .aff-chart-card {
  min-height: 0 !important;
  height: auto !important;
  max-height: none;
  overflow: hidden;
}
.w2-app--live .aff-chart-card h5 {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 10px;
  font-size: 0.95rem;
}
.w2-app--live .aff-chart-card h5 i { color: var(--color-accent); }
.w2-app--live .aff-chart-frame {
  position: relative;
  height: 220px;
  max-height: 220px;
  overflow: hidden;
}
.w2-app--live .aff-chart-frame .chart-canvas,
.w2-app--live .aff-charts .chart-canvas,
.w2-app--live .w2-ref .aff-chart-frame canvas {
  display: block !important;
  width: 100% !important;
  height: 220px !important;
  max-height: 220px !important;
}
.w2-app--live .aff-chart-empty {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  margin: 0;
  color: var(--color-text-muted) !important;
  font-size: 0.88rem;
  text-align: center;
  padding: 16px;
}
.w2-app--live .aff-table-card,
.w2-app--live .aff-charts + .aff-table-card {
  overflow-x: auto;
}
.w2-app--live .aff-table-card__head,
.w2-app--live .aff-pagebar {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  flex-wrap: wrap;
  margin-bottom: 12px;
}
.w2-app--live .aff-create__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 12px;
}
.w2-app--live .aff-create label { color: var(--color-text-muted); font-size: 0.82rem; font-weight: 700; }
.w2-app--live .aff-status {
  display: inline-flex;
  padding: 3px 10px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
}
.w2-app--live .aff-status--paid { background: #e8f5e9; color: #1b5e20; }
.w2-app--live .aff-status--approved { background: #e3f2fd; color: #0d47a1; }
.w2-app--live .aff-status--pending { background: #fff8e1; color: #e65100; }

@media (max-width: 900px) {
  .w2-app--live .aff-kpis,
  .w2-app--live .aff-dest__grid,
  .w2-app--live .aff-steps ol,
  .w2-app--live .aff-charts,
  .w2-app--live .aff-create__grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 640px) {
  .w2-app--live .aff-kpis,
  .w2-app--live .aff-dest__grid,
  .w2-app--live .aff-steps ol,
  .w2-app--live .aff-charts,
  .w2-app--live .aff-create__grid {
    grid-template-columns: 1fr;
  }
  .w2-app--live .ms-hero__art,
  .w2-app--live .ao-hero__art,
  .w2-app--live .aff-hero__art { display: none; }
}

/* Wallet — light/dark tokens (keep gold CTA) */
.w2-app--live .wl-shell,
.w2-app--live .wt-shell,
.w2-app--live .w2-wallet {
  background: var(--color-surface) !important;
  border: 1px solid var(--color-border-strong, var(--color-border)) !important;
  color: var(--color-text) !important;
  box-shadow: var(--w2-app-shadow, 0 8px 24px rgba(26, 26, 26, 0.06)) !important;
}

.w2-app--live .wl-shell::before,
.w2-app--live .wt-shell::after {
  opacity: 0.35;
}

.w2-app--live .wl-card,
.w2-app--live .wl-history-item,
.w2-app--live .wt-table-wrap,
.w2-app--live .wl-modal-theme {
  background: var(--color-surface) !important;
  border-color: var(--color-border-strong, var(--color-border)) !important;
  color: var(--color-text) !important;
}

.w2-app--live .wl-head h4,
.w2-app--live .wl-card h5,
.w2-app--live .wl-card h6,
.w2-app--live .wt-title,
.w2-app--live .wl-modal-theme .modal-title,
.w2-app--live .wl-modal-theme .text-light {
  color: var(--color-text) !important;
}

.w2-app--live .wl-shell p,
.w2-app--live .wl-empty,
.w2-app--live .wl-tx-meta,
.w2-app--live .wl-summary-pill .pill-label,
.w2-app--live .wl-balance-pill {
  color: var(--color-text-muted) !important;
}

.w2-app--live .wl-balance {
  background: color-mix(in srgb, #d6a940 16%, var(--color-surface)) !important;
  border-color: #d6a940 !important;
}

.w2-app--live .wl-balance-label {
  color: #8a6a12 !important;
}

html[data-theme="dark"] .w2-app--live .wl-balance-label {
  color: #ffd67a !important;
}

.w2-app--live .wl-balance-value {
  color: var(--color-text) !important;
}

.w2-app--live .wl-field,
.w2-app--live .wl-input,
.w2-app--live .wl-prefix,
.w2-app--live .wt-search,
.w2-app--live .wt-search.form-control,
.w2-app--live .wl-modal-theme .form-control,
.w2-app--live .wl-modal-theme .input-group-text,
.w2-app--live .w2-wallet #popover-button.button2 {
  background: var(--color-surface) !important;
  border-color: var(--color-border-strong, var(--color-border)) !important;
  color: var(--color-text) !important;
}

.w2-app--live .wl-input::placeholder,
.w2-app--live .wt-search::placeholder {
  color: var(--color-placeholder, var(--color-text-muted)) !important;
}

.w2-app--live .wl-btn-secondary,
.w2-app--live .wt-back,
.w2-app--live .wt-page,
.w2-app--live .wl-sound-toggle {
  background: var(--color-surface) !important;
  border-color: var(--color-border-strong, var(--color-border)) !important;
  color: var(--color-text) !important;
}

.w2-app--live .wl-sound-toggle {
  border-color: #d6a940 !important;
  color: #8a6a12 !important;
}

html[data-theme="dark"] .w2-app--live .wl-sound-toggle {
  color: #f8d56a !important;
}

.w2-app--live .wl-history-item.is-credit p,
.w2-app--live .wl-history-item.is-debit p,
.w2-app--live .wl-history-item.is-other p {
  color: var(--color-text) !important;
}

.w2-app--live .wl-history-item.is-credit p + p {
  color: var(--color-success, #2e7d32) !important;
}

.w2-app--live .wl-history-item.is-debit p + p {
  color: var(--color-error, #e42527) !important;
}

.w2-app--live .wl-history-item.is-other p + p,
.w2-app--live .credit_amount_preview,
.w2-app--live #credit_amount_preview {
  color: var(--color-text-muted) !important;
}

.w2-app--live .wl-summary-pill {
  background: var(--color-surface-alt) !important;
}

.w2-app--live .wl-summary-pill.credit { border-color: #81c784 !important; }
.w2-app--live .wl-summary-pill.debit { border-color: #ef9a9a !important; }
.w2-app--live .wl-summary-pill.count { border-color: #ffe082 !important; }

.w2-app--live .w2-wallet a[href*="wallet"] {
  color: var(--color-accent) !important;
}

.w2-app--live .wt-table thead th,
.w2-app--live .wt-table td,
.w2-app--live .wt-table th,
.w2-app--live .w2-wallet th,
.w2-app--live .w2-wallet td {
  background: var(--color-surface) !important;
  color: var(--color-text) !important;
  border-color: var(--color-border) !important;
}

.w2-app--live .wt-table thead th {
  background: var(--color-surface-alt) !important;
  color: var(--color-text-muted) !important;
}

.w2-app--live .wt-table tbody tr.walletTransactHistory:nth-child(even) {
  background: var(--color-surface-alt) !important;
}

.w2-app--live .wt-amount,
.w2-app--live .wl-amt,
.w2-app--live .pill-val.count,
.w2-app--live .wl-amt-other {
  color: #8a6a12 !important;
}

html[data-theme="dark"] .w2-app--live .wt-amount,
html[data-theme="dark"] .w2-app--live .wl-amt,
html[data-theme="dark"] .w2-app--live .pill-val.count,
html[data-theme="dark"] .w2-app--live .wl-amt-other {
  color: #f8d56a !important;
}

.w2-app--live .wl-modal-theme .modal-header,
.w2-app--live .wl-modal-theme .modal-footer {
  border-color: var(--color-border) !important;
}

html[data-theme="light"] .w2-app--live .wl-modal-theme .btn-close-white {
  filter: invert(1);
}

.w2-app--live .wl-modal-balance {
  background: color-mix(in srgb, #d6a940 16%, var(--color-surface)) !important;
  border-color: #d6a940 !important;
}

.w2-app--live .wl-modal-balance .text-light {
  color: var(--color-text) !important;
}

.w2-app--live .wl-coin {
  opacity: 0.55;
}

.w2-app--live .wt-lead,
.w2-app--live .wt-pager__meta,
.w2-app--live .wt-pager__of,
.w2-app--live .wt-time,
.w2-app--live .wt-dash,
.w2-app--live .wt-empty {
  color: var(--color-text-muted) !important;
}

.w2-app--live .wt-head {
  align-items: flex-start;
  margin-bottom: 16px;
}

.w2-app--live .wt-title {
  margin: 8px 0 4px;
  font-size: 1.45rem;
}

.w2-app--live .wt-lead {
  margin: 0;
  max-width: 42rem;
}

.w2-app--live .wt-count {
  display: inline-flex;
  align-items: center;
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 0.78rem;
  font-weight: 800;
  background: var(--color-surface-alt);
  border: 1px solid var(--color-border-strong, var(--color-border));
  color: var(--color-text);
}

.w2-app--live .wt-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-bottom: 14px;
}

.w2-app--live .wt-datebtn,
.w2-app--live .w2-wallet #popover-button.button2 {
  display: inline-flex !important;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  padding: 8px 14px 8px 14px !important;
  background-image: none !important;
  width: auto !important;
  max-width: 100%;
}

.w2-app--live .wt-search-form {
  position: relative;
  flex: 1 1 280px;
}

.w2-app--live .wt-search-form i {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--color-text-muted);
  pointer-events: none;
}

.w2-app--live .wt-search {
  padding-left: 36px !important;
  min-height: 42px;
}

.w2-app--live .wt-clear {
  color: var(--color-accent) !important;
  font-weight: 700;
  text-decoration: none;
}

.w2-app--live .wt-table-wrap {
  max-height: min(62vh, 640px);
}

.w2-app--live .wt-table {
  min-width: 980px;
}

.w2-app--live .wt-date {
  display: block;
  font-weight: 700;
}

.w2-app--live .wt-time {
  display: block;
  font-size: 0.75rem;
}

.w2-app--live .wt-type {
  gap: 6px;
}

.w2-app--live .wt-type--credit {
  color: #1b5e20 !important;
  background: #e8f5e9 !important;
  border-color: #a5d6a7 !important;
}

.w2-app--live .wt-type--debit {
  color: #b71c1c !important;
  background: #fdecea !important;
  border-color: #ef9a9a !important;
}

.w2-app--live .wt-type--other {
  color: #e65100 !important;
  background: #fff8e1 !important;
  border-color: #ffe082 !important;
}

.w2-app--live .wt-status--success {
  color: #1b5e20 !important;
  background: #e8f5e9 !important;
  border-color: #a5d6a7 !important;
}

.w2-app--live .wt-amount.is-credit { color: #1b5e20 !important; }
.w2-app--live .wt-amount.is-debit { color: #b71c1c !important; }

html[data-theme="dark"] .w2-app--live .wt-type--credit,
html[data-theme="dark"] .w2-app--live .wt-status--success,
html[data-theme="dark"] .w2-app--live .wt-amount.is-credit {
  color: #81c784 !important;
}

html[data-theme="dark"] .w2-app--live .wt-type--debit,
html[data-theme="dark"] .w2-app--live .wt-amount.is-debit {
  color: #ef9a9a !important;
}

.w2-app--live .wt-id {
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.78rem;
}

.w2-app--live .wt-copy {
  margin-left: 6px;
  border: 0;
  background: transparent;
  color: var(--color-accent);
  font-size: 0.75rem;
  font-weight: 700;
  padding: 0;
}

.w2-app--live .wt-pager {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 14px;
}

.w2-app--live .wt-pager__meta,
.w2-app--live .wt-pager__of {
  margin: 0;
  font-size: 0.85rem;
}

.w2-app--live .wt-page--wide {
  min-width: 5.5rem !important;
}

.w2-app--live .wt-page.is-disabled {
  opacity: 0.45;
  pointer-events: none;
}

.w2-app--live .wt-empty {
  padding: 36px 16px !important;
  text-align: center;
}