/* Page-specific adapters, loaded after each page's own styles. Shared controls live in admin-workbench.css. */
body.dcc-admin-navigation {
  --dcc-nav-ink: var(--admin-text, #303133);
  --dcc-nav-muted: var(--admin-text-secondary, #606266);
  --dcc-nav-line: var(--admin-divider, #ebeef5);
  --dcc-nav-accent: var(--admin-primary, #409eff);
  --dcc-nav-selected: var(--admin-primary-soft, #ecf5ff);
}
body.dcc-admin-navigation .navbar-static-top .nav-left > li.active > a,
body.dcc-admin-navigation .navbar-static-top .nav-left > li:hover > a,
body.dcc-admin-navigation .dcc-navigation-toggle:hover { background: var(--admin-primary-soft, #ecf5ff); }
body.dcc-admin-navigation #side-menu li > a { font-size: 14px; }

/* Workbench: neutral KPI cards keep emphasis on the actual figures and risk states. */
.wb-page { padding: 24px; }
.wb-title { font-size: 22px; }
.wb-card, .wb-card:nth-child(n), .wb-panel, .wb-filter {
  border: 1px solid var(--admin-border-soft, #e4e7ed);
  border-radius: 6px;
  box-shadow: none;
}
.wb-subtitle, .wb-updated, .wb-card-label, .wb-supply-name { color: #606266; font-size: 14px; }
.wb-card-note, .wb-incident-meta, .wb-trend-summary { color: #606266; }
.wb-panel-link { color: #409eff; font-size: 14px; }
.wb-task-count { border-radius: 4px; }
.wb-supply-item { border-radius: 4px; }

/* Login retains its existing logo, fields and validation. */
body.page-login { overflow-y: auto; min-height: 100vh; color: #303133; background: #f5f7fa; }
.page-login.page-dark.layout-full:before,
.page-login.page-dark.layout-full:after { background: none; }
.page-login .page-brand-info .brand { display: inline-flex; align-items: center; padding: 20px 24px; border-radius: 6px; background: #337ecc; }
.page-login .page-brand-info .brand span { font-size: 22px; }
.page-login .page-login-main { border-left: 1px solid #e4e7ed; color: #606266; }
.page-login .page-login-main h2, .page-login .page-login-main h3 { color: #303133; font-size: 22px; }
.page-login .page-login-main .btn-primary { background: #409eff; border-color: #409eff; border-radius: 4px; }
.page-login .page-login-main .btn-primary:hover { background: #337ecc; border-color: #337ecc; }
.page-login .login-form a, .page-login .page-copyright a { color: #409eff; }
.page-login .checkbox-primary input:checked + label:before { background: #409eff; border-color: #409eff; }
.page-login .checkbox-custom input:focus-visible + label:before { outline: 2px solid #409eff; outline-offset: 2px; }

/* Help, API reference and detail pages share the product page's title and panel hierarchy. */
.manual-page, .api-doc-page { padding: 24px; background: #f5f7fa; color: #303133; font-size: 14px; }
.manual-hero { padding: 24px; color: #303133; background: #fff; border: 1px solid #e4e7ed; border-radius: 6px; box-shadow: none; }
.manual-hero h2 { font-size: 22px; }
.manual-hero p { color: #606266; opacity: 1; }
.manual-section { padding: 24px; }
.manual-section h3, .manual-nav .nav-title { font-size: 16px; color: #303133; }
.manual-section h4 { color: #303133; }
.manual-nav { box-shadow: none; }
.manual-nav a { font-size: 14px; }
.manual-tag { border-radius: 4px; }
.api-doc-sidebar h3, .api-doc-content h2, .api-doc-content h3 { font-size: 16px; }
.api-doc-content h1 { font-size: 22px; }
.merchant-detail-page { padding: 24px; }
.merchant-detail-hero { background: #fff; border-color: #e4e7ed; }
.merchant-detail-page .widget-title h5 { font-size: 16px; }
.merchant-section-heading h4 { font-size: 16px; }
.merchant-detail-meta, .merchant-section-heading p, .merchant-detail-card .control-label { color: #606266; }

/* Media detail: preserve playback surfaces and semantic status badges. */
.video-detail-container, .category-tree { border: 1px solid #e4e7ed; box-shadow: none; }
.video-header { padding: 24px; background: #fff; color: #303133; border-bottom: 1px solid #ebeef5; }
.video-header:before, .section-title:after { content: none; }
.video-title { font-size: 22px; text-shadow: none; }
.video-subtitle { font-size: 14px; color: #606266; opacity: 1; }
.video-meta .meta-item { color: #606266; background: #f5f7fa; border-radius: 4px; backdrop-filter: none; }
.video-content { padding: 24px; }
.video-content .section-title { font-size: 16px; border-bottom-width: 1px; }
.video-content .cover-image { box-shadow: none; }
.video-content .cover-image:hover { transform: none; }
.video-content .no-cover { background: #f5f7fa; }
.video-content .tag-item, .video-header .type-badge { color: #337ecc; background: #ecf5ff; border-radius: 4px; box-shadow: none; }
.video-content .episode-item { border-width: 1px; }
.video-content .episode-item:hover { color: #337ecc; background: #ecf5ff; border-color: #409eff; transform: none; box-shadow: none; }
.video-content .btn-custom { padding: 8px 16px; border-radius: 4px; box-shadow: none; }
.video-content .btn-custom:hover { transform: none; box-shadow: none; }
.video-header .status-active, .category-tree .label-success { background: #e8f7ef; color: #26754d; }
.video-header .status-inactive, .category-tree .label-danger { background: #fef0f0; color: #b64040; }
.category-item:hover, .category-item:active { transform: none; background: #f5f7fa; }

/* Relationship graph keeps its node canvas, coordinates and data untouched. */
body:has(.graph-wrap) #content { background: #f5f7fa; }
body:has(.graph-wrap) .widget-box { background: #fff; border-color: #e4e7ed; border-radius: 6px; box-shadow: none; }
.graph-toolbar, .filter-row, .graph-hud { color: #606266; background: #f5f7fa; border-color: #e4e7ed; box-shadow: none; }
.graph-wrap { background: #fff; border-color: #e4e7ed; border-radius: 6px; }
body:has(.graph-wrap) .kpi-card { background: #fff; border-color: #e4e7ed; box-shadow: none; }
body:has(.graph-wrap) .kpi-label { color: #606266; font-size: 14px; }
body:has(.graph-wrap) .kpi-value { color: #303133; }
.detail-panel { color: #303133; background: #fff; border-color: #e4e7ed; }
.detail-title, .node-tooltip .t-title { color: #303133; }
.node-tooltip { color: #606266; border-color: #e4e7ed; box-shadow: 0 4px 12px rgba(0,0,0,.08); }

/* Data screen: readable light panels and scrollable layout, preserving bar heights and series data. */
.hwz-screen { height: auto; min-height: 100vh; padding: 24px; background: #f5f7fa; color: #303133; overflow: visible; }
.hwz-screen .screen-header { justify-content: space-between; gap: 16px; height: auto; min-height: 46px; color: #303133; text-shadow: none; border-color: #e4e7ed; }
.hwz-screen .screen-title { font-size: 22px; letter-spacing: 0; }
.hwz-screen .screen-time { position: static; color: #606266; font-size: 14px; white-space: nowrap; }
.hwz-screen .screen-grid { grid-template-columns: minmax(0,3fr) minmax(0,4fr) minmax(0,3fr); height: 920px; gap: 16px; padding-top: 16px; }
.hwz-screen .screen-col { gap: 16px; min-width: 0; }
.hwz-screen .screen-col.left { grid-template-rows: minmax(0,57fr) minmax(0,43fr); }
.hwz-screen .screen-col.center { grid-template-rows: minmax(0,36fr) minmax(0,16fr) minmax(0,48fr); }
.hwz-screen .screen-col.right { grid-template-rows: minmax(0,31fr) minmax(0,31fr) minmax(0,38fr); }
.hwz-screen .screen-panel, .hwz-screen .kpi-card { background: #fff; border: 1px solid #e4e7ed; border-radius: 6px; box-shadow: none; }
.hwz-screen .screen-panel:before { content: none; }
.hwz-screen .panel-title { color: #303133; font-size: 16px; }
.hwz-screen .sales-filter { color: #606266; background: #fff; border-color: #dcdfe6; }
.hwz-screen .progress-row, .hwz-screen .status-item, .hwz-screen .hero-sub, .hwz-screen .kpi-label { color: #606266; }
.hwz-screen .progress-track { background: #ebeef5; }
.hwz-screen .progress-bar { background: #409eff; box-shadow: none; }
.hwz-screen .progress-rate { color: #303133; text-shadow: 0 0 2px #fff; }
.hwz-screen .status-chart { border-color: #e4e7ed; }
.hwz-screen .status-bar { background: #409eff; box-shadow: none; }
.hwz-screen .hero-slogan { color: #337ecc; font-size: 22px; letter-spacing: 0; text-shadow: none; white-space: normal; text-align: center; }
.hwz-screen .hero-map { background: #ecf5ff; border-radius: 6px; filter: none; }
.hwz-screen .hero-sub { gap: 12px; }
.hwz-screen .kpi-main, .hwz-screen .kpi-number { color: #303133; font-size: 24px; }
.hwz-screen .kpi-unit { font-size: 14px; }
.hwz-screen .market-list, .hwz-screen .offer-list { background: #fff; color: #606266; font-size: 14px; }
.hwz-screen .market-list th, .hwz-screen .offer-list th { color: #606266; background: #f5f7fa; border-color: #e4e7ed; }
.hwz-screen .market-list tbody tr, .hwz-screen .offer-list tbody tr,
.hwz-screen .market-list tbody tr:nth-child(even), .hwz-screen .offer-list tbody tr:nth-child(even) { background: #fff; }
.hwz-screen .market-list td, .hwz-screen .offer-list td,
.hwz-screen .market-list td:first-child, .hwz-screen .offer-list td:first-child { color: #606266; border-color: #ebeef5; }
.hwz-screen .market-list .price-up, .hwz-screen .offer-list .price-up { color: #8b5b0d; }
.hwz-screen .buy-btn { color: #337ecc; background: #ecf5ff; border-color: #b3d8ff; box-shadow: none; }
/* Highcharts writes text colors as inline SVG fill; scope this exception to chart labels. */
.hwz-screen .highcharts-axis-labels text, .hwz-screen .highcharts-legend-item text { fill: #606266 !important; color: #606266 !important; }
.hwz-screen .highcharts-grid-line { stroke: #ebeef5; }

/* Legacy message-only responses have no shared widget wrapper. */
.msgbox { width: calc(100% - 48px); max-width: 500px; padding: 0; background: #fff; border: 1px solid #e4e7ed; border-radius: 6px; overflow: hidden; }
.msgbox h2 { height: auto; padding: 16px; font-size: 16px; line-height: 1.5; background: #fff; border-bottom: 1px solid #ebeef5; }
.msgbox .content { padding: 24px; }
.msgbox h4 { color: #303133; font-size: 14px; }
@media (max-width: 1100px) {
  .hwz-screen .screen-grid { grid-template-columns: 1fr; height: auto; }
  .hwz-screen .screen-col { grid-template-rows: none; }
  .hwz-screen .screen-panel { min-height: 320px; }
  .hwz-screen .chart-box { height: 280px; }
  .hwz-screen .kpi-card { min-height: 100px; }
  .hwz-screen .status-chart { height: 250px; }
}
@media (max-width: 767px) {
  .wb-page, .manual-page, .api-doc-page, .merchant-detail-page, .hwz-screen { padding: 12px; }
  .manual-section, .manual-hero, .video-header, .video-content { padding: 16px; }
  .page-login .page-login-main { padding: 0 24px; border: 0; }
  .page-login .page-brand-info .brand span { font-size: 22px; }
  .hwz-screen .screen-header { align-items: flex-start; flex-direction: column; padding-bottom: 12px; }
  .hwz-screen .kpi-row { grid-template-columns: 1fr; }
  .hwz-screen .screen-panel { padding: 14px 12px; }
  .hwz-screen .hero-sub { flex-direction: column; text-align: center; }
  .msgbox { width: calc(100% - 24px); }
}
/* Legacy framework documentation has its own CSS entry after document/common.tpl. */
body:has(.bs-docs-container) { color: #303133; background: #f5f7fa; font-size: 14px; }
body:has(.bs-docs-container) #top { background: #fff; border-bottom: 1px solid #e4e7ed; }
body:has(.bs-docs-container) #top .navbar-brand { color: #303133; }
body:has(.bs-docs-container) #top .navbar-brand.active { color: #409eff; }
.bs-docs-container { padding: 24px; }
.bs-docs-section { background: #fff; border: 1px solid #e4e7ed; border-radius: 6px; padding: 24px; margin-bottom: 16px; }
.bs-docs-section .page-header { font-size: 22px; color: #303133; }
.bs-docs-sidebar .nav > .active > a { color: #337ecc; border-color: #409eff; }
@media (max-width: 767px) { .bs-docs-container { padding: 12px; } .bs-docs-section { padding: 16px; } }
.hwz-screen .sales-filter { position: static; margin-bottom: 8px; }
.hwz-screen .status-chart { overflow-x: auto; }
.hwz-screen .status-item { flex: 0 0 34px; }
.msgbox div, .msgbox p, .msgbox a { font-size: 14px; }