/* v4 forced dark dashboard contrast layer, test machine only. */
html.dark,
html.dark body,
html.dark #root {
  background: #080b10 !important;
  color: rgba(248, 250, 252, 0.96) !important;
}

html.dark .app-layout,
html.dark .semi-layout,
html.dark .app-content,
html.dark .console-content,
html.dark .semi-layout-content {
  background: #080b10 !important;
  color: rgba(248, 250, 252, 0.96) !important;
}

html.dark .app-sider,
html.dark .semi-layout-sider,
html.dark .semi-sidesheet,
html.dark .semi-navigation,
html.dark .semi-navigation-list-wrapper,
html.dark .semi-navigation-footer {
  background: #0d1117 !important;
  color: rgba(248, 250, 252, 0.94) !important;
  border-color: rgba(226, 232, 240, 0.28) !important;
}

html.dark .semi-navigation-item,
html.dark .semi-navigation-item-text,
html.dark .semi-navigation-sub-title,
html.dark .semi-navigation-item-icon,
html.dark .semi-navigation-footer,
html.dark .semi-navigation-footer *,
html.dark .app-sider * {
  color: rgba(226, 232, 240, 0.9) !important;
}

html.dark .semi-navigation-item-selected,
html.dark .semi-navigation-item-selected:hover {
  background: #087452 !important;
  color: #ffffff !important;
}

html.dark .semi-navigation-item-selected *,
html.dark .semi-navigation-item-selected .semi-navigation-item-text {
  color: #ffffff !important;
}

html.dark .semi-card,
html.dark .semi-card-body,
html.dark .semi-card-header,
html.dark .semi-collapse,
html.dark .semi-collapse-item,
html.dark .semi-collapse-header,
html.dark .semi-collapse-content,
html.dark .semi-tabs,
html.dark .semi-tabs-bar,
html.dark .semi-table,
html.dark .semi-table-container,
html.dark .semi-table-body,
html.dark .semi-table-row,
html.dark .semi-table-tbody,
html.dark .semi-table-thead,
html.dark .semi-table-cell,
html.dark .semi-modal,
html.dark .semi-modal-content,
html.dark .semi-modal-header,
html.dark .semi-modal-body,
html.dark .semi-popover,
html.dark .semi-tooltip {
  background: #090d13 !important;
  color: rgba(248, 250, 252, 0.96) !important;
  border-color: rgba(226, 232, 240, 0.72) !important;
}

html.dark .semi-card *,
html.dark .semi-collapse *,
html.dark .semi-table *,
html.dark .semi-modal *,
html.dark .semi-popover *,
html.dark .semi-tooltip *,
html.dark .semi-tabs *,
html.dark .echarts-for-react,
html.dark .echarts-for-react * {
  color: rgba(248, 250, 252, 0.94) !important;
  border-color: rgba(226, 232, 240, 0.62) !important;
}

html.dark .semi-typography,
html.dark .semi-typography *,
html.dark p,
html.dark span,
html.dark div,
html.dark label,
html.dark small,
html.dark strong,
html.dark b,
html.dark h1,
html.dark h2,
html.dark h3,
html.dark h4,
html.dark h5,
html.dark h6 {
  color: inherit;
}

html.dark .semi-card [style*="color"],
html.dark .semi-collapse [style*="color"],
html.dark .semi-modal [style*="color"],
html.dark .semi-table [style*="color"] {
  color: rgba(248, 250, 252, 0.96) !important;
}

html.dark .semi-card [style*="background"],
html.dark .semi-collapse [style*="background"],
html.dark .semi-modal [style*="background"],
html.dark .semi-table [style*="background"] {
  background-color: #0f1722 !important;
}

html.dark .semi-tag,
html.dark .semi-tag *,
html.dark .semi-button,
html.dark .semi-button *,
html.dark .semi-badge,
html.dark .semi-badge *,
html.dark [class*="tag"],
html.dark [class*="Tag"] {
  color: #ffffff !important;
}

html.dark .semi-tag,
html.dark .semi-tag-white,
html.dark .semi-tag-white-light,
html.dark .semi-tag-light,
html.dark .semi-button-light {
  background: #172033 !important;
  border-color: rgba(226, 232, 240, 0.64) !important;
}

html.dark .semi-button-primary,
html.dark .semi-button-primary * {
  background: #0f766e !important;
  border-color: #0f766e !important;
  color: #ffffff !important;
}

html.dark .semi-card a,
html.dark .semi-card a *,
html.dark .semi-collapse a,
html.dark .semi-collapse a *,
html.dark .semi-modal a,
html.dark .semi-modal a *,
html.dark .semi-tabs-tab-active,
html.dark .semi-tabs-tab-active * {
  color: #69b7ff !important;
}

html.dark header a,
html.dark header a *,
html.dark nav a,
html.dark nav a *,
html.dark .semi-navigation-header a,
html.dark .semi-navigation-header a * {
  color: rgba(248, 250, 252, 0.96) !important;
}

html.dark .app-sider .semi-button,
html.dark .app-sider .semi-button *,
html.dark .semi-navigation-footer .semi-button,
html.dark .semi-navigation-footer .semi-button *,
html.dark .semi-navigation-footer button,
html.dark .semi-navigation-footer button * {
  background: #111827 !important;
  border-color: rgba(226, 232, 240, 0.22) !important;
  color: rgba(226, 232, 240, 0.72) !important;
}

html.dark .sidebar-collapse-button {
  background: #101318 !important;
  border-color: rgba(226, 232, 240, 0.18) !important;
  box-shadow: none !important;
}

html.dark .sidebar-collapse-button::before,
html.dark .sidebar-collapse-button::after {
  background: #101318 !important;
  border-color: rgba(226, 232, 240, 0.18) !important;
}

html.dark .semi-spin,
html.dark .semi-spin-wrapper,
html.dark .semi-spin-children {
  color: rgba(248, 250, 252, 0.96) !important;
}

html.dark canvas + div,
html.dark [class*="chart"] *,
html.dark [class*="Chart"] * {
  color: rgba(248, 250, 252, 0.92) !important;
}

/* Console-wide table and custom-page dark contrast fixes. */
html.dark .semi-table-wrapper,
html.dark .semi-table-scroll-position-left,
html.dark .semi-table-scroll-position-right,
html.dark .semi-table-header,
html.dark .semi-table-thead,
html.dark .semi-table-tbody,
html.dark .semi-table-row,
html.dark .semi-table-row:hover,
html.dark .semi-table-row-head,
html.dark .semi-table-row-cell,
html.dark th.semi-table-row-head,
html.dark td.semi-table-row-cell,
html.dark .semi-table-cell-fixed-left,
html.dark .semi-table-cell-fixed-right,
html.dark .semi-table-cell-fixed-left-first,
html.dark .semi-table-cell-fixed-left-last,
html.dark .semi-table-cell-fixed-right-first,
html.dark .semi-table-cell-fixed-right-last {
  background: #090d13 !important;
  color: rgba(248, 250, 252, 0.94) !important;
  border-color: rgba(226, 232, 240, 0.44) !important;
}

html.dark .semi-table-thead .semi-table-row-head,
html.dark .semi-table-thead th,
html.dark .semi-table-header .semi-table-row-head {
  background: #111827 !important;
  color: rgba(248, 250, 252, 0.96) !important;
}

html.dark .semi-table-row-cell *,
html.dark .semi-table-row-head *,
html.dark td.semi-table-row-cell *,
html.dark th.semi-table-row-head * {
  color: rgba(248, 250, 252, 0.94) !important;
  border-color: rgba(226, 232, 240, 0.44) !important;
}

html.dark .semi-table-row-cell [style*="color"],
html.dark .semi-table-row-head [style*="color"],
html.dark .semi-table-row-cell [class*="text-gray-"],
html.dark .semi-table-row-cell [class*="text-slate-"],
html.dark .semi-table-row-cell [class*="text-zinc-"],
html.dark .semi-table-row-cell [class*="text-neutral-"],
html.dark .semi-table-row-head [class*="text-gray-"],
html.dark .semi-table-row-head [class*="text-slate-"],
html.dark .semi-table-row-head [class*="text-zinc-"],
html.dark .semi-table-row-head [class*="text-neutral-"] {
  color: rgba(248, 250, 252, 0.96) !important;
}

html.dark .semi-table-placeholder,
html.dark .semi-table-empty,
html.dark .semi-pagination,
html.dark .semi-pagination *,
html.dark .semi-select,
html.dark .semi-select *,
html.dark .semi-input-wrapper,
html.dark .semi-input-wrapper *,
html.dark .semi-datepicker,
html.dark .semi-datepicker * {
  background-color: #090d13 !important;
  color: rgba(248, 250, 252, 0.92) !important;
  border-color: rgba(226, 232, 240, 0.44) !important;
}

html.dark .app-content [class*="text-gray-"],
html.dark .app-content [class*="text-slate-"],
html.dark .app-content [class*="text-zinc-"],
html.dark .app-content [class*="text-neutral-"],
html.dark .console-content [class*="text-gray-"],
html.dark .console-content [class*="text-slate-"],
html.dark .console-content [class*="text-zinc-"],
html.dark .console-content [class*="text-neutral-"],
html.dark .semi-modal [class*="text-gray-"],
html.dark .semi-modal [class*="text-slate-"],
html.dark .semi-modal [class*="text-zinc-"],
html.dark .semi-modal [class*="text-neutral-"] {
  color: rgba(248, 250, 252, 0.92) !important;
}

html.dark .app-content [class*="bg-white"],
html.dark .app-content [class*="bg-gray-50"],
html.dark .app-content [class*="bg-gray-100"],
html.dark .app-content [class*="bg-slate-50"],
html.dark .app-content [class*="bg-slate-100"],
html.dark .console-content [class*="bg-white"],
html.dark .console-content [class*="bg-gray-50"],
html.dark .console-content [class*="bg-gray-100"],
html.dark .console-content [class*="bg-slate-50"],
html.dark .console-content [class*="bg-slate-100"],
html.dark .semi-modal [class*="bg-white"],
html.dark .semi-modal [class*="bg-gray-50"],
html.dark .semi-modal [class*="bg-gray-100"],
html.dark .semi-modal [class*="bg-slate-50"],
html.dark .semi-modal [class*="bg-slate-100"] {
  background-color: #0f1722 !important;
  border-color: rgba(226, 232, 240, 0.44) !important;
}

/* Override legacy ciyuan-ui-polish table rules in dark mode. */
html.dark body:has(.sidebar-container) .semi-table-thead > .semi-table-row > .semi-table-row-head,
html.dark body:has(.sidebar-container) .semi-table-thead > .semi-table-row > th.semi-table-row-head,
html.dark body:has(.sidebar-container) .semi-table-header .semi-table-row-head {
  background: #111827 !important;
  background-color: #111827 !important;
  color: rgba(248, 250, 252, 0.96) !important;
  border-color: rgba(226, 232, 240, 0.44) !important;
}

html.dark body:has(.sidebar-container) .semi-table-tbody > .semi-table-row > .semi-table-row-cell,
html.dark body:has(.sidebar-container) .semi-table-tbody > .semi-table-row > td.semi-table-row-cell,
html.dark body:has(.sidebar-container) .semi-table-tbody > .semi-table-row:hover > .semi-table-row-cell,
html.dark body:has(.sidebar-container) .semi-table-tbody > .semi-table-row:hover > td.semi-table-row-cell {
  background: #090d13 !important;
  background-color: #090d13 !important;
  color: rgba(248, 250, 252, 0.94) !important;
  border-color: rgba(226, 232, 240, 0.44) !important;
}

html.dark body:has(.sidebar-container) .semi-table-tbody > .semi-table-row > .semi-table-row-cell *,
html.dark body:has(.sidebar-container) .semi-table-tbody > .semi-table-row > td.semi-table-row-cell *,
html.dark body:has(.sidebar-container) .semi-table-thead > .semi-table-row > .semi-table-row-head *,
html.dark body:has(.sidebar-container) .semi-table-thead > .semi-table-row > th.semi-table-row-head * {
  color: rgba(248, 250, 252, 0.94) !important;
  border-color: rgba(226, 232, 240, 0.44) !important;
}
