/* 西瓜工资条 — 设计令牌（对齐 docs/site/视觉设计体系说明.md）
 * 主题由 html[data-theme] 驱动，与 UiSettingsService 同步设置 body。 */

html[data-theme="theme-light"] {
    --ws-bg-body: #f5f5f5;
    --ws-bg-page: #f5f5f5;
    --ws-bg-sidebar: #ffffff;
    --ws-bg-top: #ffffff;
    --ws-border: #e5e5e5;
    --ws-text: #333333;
    --ws-text-muted: #666666;
    --ws-text-subtle: #999999;
    --ws-link: #0066cc;
    --ws-link-hover: #004a99;
    --ws-brand: #0066cc;
    --ws-focus-ring: #0066cc;
    --ws-focus-halo: #ffffff;

    --ws-panel-bg: #ffffff;
    --ws-panel-border: #e5e5e5;
    --ws-panel-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);

    --ws-page-subtitle: #666666;
    --ws-stat-label: #666666;
    --ws-stat-hint: #999999;
    --ws-stat-ok: #2e7d32;
    --ws-stat-bad: #c62828;

    --ws-kpi-chip-text: #0066cc;
    --ws-kpi-chip-bg: rgba(0, 102, 204, 0.08);
    --ws-kpi-chip-border: rgba(0, 102, 204, 0.2);

    --ws-sortable-hover: #0066cc;
    --ws-active-filter-border: #0066cc;
    --ws-active-filter-bg: rgba(0, 102, 204, 0.12);
    --ws-active-filter-color: #003d7a;

    --ws-channel-tag-bg: rgba(0, 102, 204, 0.1);
    --ws-channel-tag-border: rgba(0, 102, 204, 0.25);

    --ws-task-pending-fg: #0277bd;
    --ws-task-pending-bg: rgba(2, 119, 189, 0.1);
    --ws-task-pending-border: rgba(2, 119, 189, 0.35);

    --ws-task-done-fg: #2e7d32;
    --ws-task-done-bg: rgba(46, 125, 50, 0.1);
    --ws-task-done-border: rgba(46, 125, 50, 0.35);

    --ws-task-failed-fg: #c62828;
    --ws-task-failed-bg: rgba(198, 40, 40, 0.08);
    --ws-task-failed-border: rgba(198, 40, 40, 0.35);

    --ws-task-error: #b71c1c;
    --ws-pager: #666666;

    --ws-panel-hint-border: rgba(0, 102, 204, 0.22);
    --ws-panel-hint-bg: rgba(0, 102, 204, 0.06);
    --ws-panel-hint-color: #333333;

    --ws-trend-label: #666666;
    --ws-trend-bar-track: #e5e5e5;
    --ws-trend-bar: linear-gradient(90deg, #0066cc, #42a5f5);

    --ws-op-row-dash: rgba(0, 0, 0, 0.12);
    --ws-salary-net: #2e7d32;

    --ws-login-shell: linear-gradient(160deg, #f0f4f8 0%, #e8eef5 45%, #ffffff 100%);
    --ws-login-card-bg: #ffffff;
    --ws-login-card-border: #e5e5e5;
    --ws-login-card-shadow: 0 24px 64px rgba(0, 0, 0, 0.08);
    --ws-login-muted: #666666;
    --ws-login-footnote: #999999;
    --ws-login-badge-bg: linear-gradient(135deg, #0066cc 0%, #004a99 100%);

    --ws-input-bg: #ffffff;
    --ws-input-color: #333333;
    --ws-input-border: #e5e5e5;
    --ws-input-focus-bg: #ffffff;
    --ws-input-focus-color: #000000;

    --ws-app-loading-bg: linear-gradient(160deg, #eef2f7 0%, #f5f7fb 50%, #ffffff 100%);
    --ws-app-loading-card-bg: #ffffff;
    --ws-app-loading-card-border: #e5e5e5;

    --ws-loading-stroke-bg: #e0e0e0;
    --ws-loading-stroke: #0066cc;

    --ws-user-chip-bg: rgba(0, 102, 204, 0.08);
    --ws-user-chip-border: rgba(0, 102, 204, 0.22);
    --ws-user-chip-text: #0066cc;

    --ws-top-title-sub: #666666;

    --ws-nav-logo-bg: linear-gradient(135deg, #0066cc 0%, #004a99 100%);

    --ws-nav-brand-strong: #000000;
    --ws-nav-brand-sub: #666666;
    --ws-nav-group: #999999;
    --ws-nav-link: #333333;
    --ws-nav-link-hover: #000000;
    --ws-nav-link-hover-bg: rgba(0, 102, 204, 0.08);
    --ws-nav-link-active: #003d7a;
    --ws-nav-link-active-bg: rgba(0, 102, 204, 0.12);
    --ws-nav-link-active-border: rgba(0, 102, 204, 0.35);
    --ws-nav-icon-bg: rgba(0, 102, 204, 0.1);
    --ws-nav-icon-border: rgba(0, 102, 204, 0.18);
    --ws-nav-icon-fg: #0066cc;

    --ws-code: #ad1457;

    --bs-primary: #0066cc;
    --bs-primary-rgb: 0, 102, 204;
}

html[data-theme="theme-dark"] {
    --ws-bg-body: #0b1220;
    --ws-bg-page: radial-gradient(circle at top right, #12314d 0%, #0e1729 35%, #0b1220 100%);
    --ws-bg-sidebar: linear-gradient(180deg, rgba(13, 27, 46, 0.95) 0%, rgba(14, 22, 38, 0.9) 100%);
    --ws-bg-top: rgba(17, 28, 48, 0.65);
    --ws-border: rgba(255, 255, 255, 0.08);
    --ws-text: #e8eef8;
    --ws-text-muted: #8ea2c5;
    --ws-text-subtle: #9eb1d0;
    --ws-link: #59b1ff;
    --ws-link-hover: #8ccaff;
    --ws-brand: #59b1ff;
    --ws-focus-ring: #258cfb;
    --ws-focus-halo: #ffffff;

    --ws-panel-bg: linear-gradient(180deg, rgba(22, 35, 58, 0.92), rgba(16, 27, 44, 0.92));
    --ws-panel-border: rgba(130, 172, 255, 0.2);
    --ws-panel-shadow: 0 18px 38px rgba(8, 14, 24, 0.35);

    --ws-page-subtitle: #8ea2c5;
    --ws-stat-label: #95a8c9;
    --ws-stat-hint: #9eb1d0;
    --ws-stat-ok: #67e58b;
    --ws-stat-bad: #ff9b9b;

    --ws-kpi-chip-text: #cfe1ff;
    --ws-kpi-chip-bg: rgba(85, 140, 255, 0.2);
    --ws-kpi-chip-border: rgba(120, 178, 255, 0.28);

    --ws-sortable-hover: #9dd4ff;
    --ws-active-filter-border: #85c3ff;
    --ws-active-filter-bg: rgba(63, 136, 255, 0.36);
    --ws-active-filter-color: #fff;

    --ws-channel-tag-bg: rgba(86, 153, 255, 0.25);
    --ws-channel-tag-border: rgba(118, 182, 255, 0.32);

    --ws-task-pending-fg: #9bd8ff;
    --ws-task-pending-bg: rgba(79, 210, 255, 0.16);
    --ws-task-pending-border: rgba(79, 210, 255, 0.35);

    --ws-task-done-fg: #91efb0;
    --ws-task-done-bg: rgba(76, 205, 122, 0.16);
    --ws-task-done-border: rgba(76, 205, 122, 0.35);

    --ws-task-failed-fg: #ff9b9b;
    --ws-task-failed-bg: rgba(255, 102, 132, 0.16);
    --ws-task-failed-border: rgba(255, 102, 132, 0.35);

    --ws-task-error: #ffb4b4;
    --ws-pager: #9eb1d0;

    --ws-panel-hint-border: rgba(126, 178, 255, 0.35);
    --ws-panel-hint-bg: rgba(24, 42, 68, 0.72);
    --ws-panel-hint-color: #b9d5ff;

    --ws-trend-label: #a6bad9;
    --ws-trend-bar-track: rgba(109, 139, 185, 0.24);
    --ws-trend-bar: linear-gradient(90deg, #4fd2ff, #6e7eff);

    --ws-op-row-dash: rgba(141, 168, 206, 0.25);
    --ws-salary-net: #83efaa;

    --ws-login-shell: linear-gradient(135deg, #102746 0%, #101a2e 45%, #1b243a 100%);
    --ws-login-card-bg: rgba(16, 27, 44, 0.9);
    --ws-login-card-border: rgba(126, 178, 255, 0.28);
    --ws-login-card-shadow: 0 24px 50px rgba(8, 14, 24, 0.4);
    --ws-login-muted: #96aacb;
    --ws-login-footnote: #6f85a9;
    --ws-login-badge-bg: linear-gradient(135deg, #42beff 0%, #6f62ff 100%);

    --ws-input-bg: #121f35;
    --ws-input-color: #ecf3ff;
    --ws-input-border: rgba(140, 179, 238, 0.35);
    --ws-input-focus-bg: #152643;
    --ws-input-focus-color: #fff;

    --ws-app-loading-bg: radial-gradient(circle at top right, #12314d 0%, #0e1729 35%, #0b1220 100%);
    --ws-app-loading-card-bg: rgba(20, 33, 56, 0.88);
    --ws-app-loading-card-border: rgba(112, 170, 255, 0.28);

    --ws-loading-stroke-bg: #e0e0e0;
    --ws-loading-stroke: #1b6ec2;

    --ws-user-chip-bg: rgba(84, 150, 255, 0.2);
    --ws-user-chip-border: rgba(132, 176, 255, 0.45);
    --ws-user-chip-text: #d7e7ff;

    --ws-top-title-sub: #93a3bc;

    --ws-nav-logo-bg: linear-gradient(135deg, #3eb6ff 0%, #6d63ff 100%);

    --ws-nav-brand-strong: #f5f9ff;
    --ws-nav-brand-sub: #8ea2c5;
    --ws-nav-group: #7f95b9;
    --ws-nav-link: #bdd1ee;
    --ws-nav-link-hover: #ffffff;
    --ws-nav-link-hover-bg: rgba(83, 137, 255, 0.18);
    --ws-nav-link-active: #ffffff;
    --ws-nav-link-active-bg: linear-gradient(135deg, rgba(67, 184, 255, 0.45), rgba(96, 119, 255, 0.45));
    --ws-nav-link-active-border: rgba(151, 201, 255, 0.45);
    --ws-nav-icon-bg: rgba(87, 144, 255, 0.2);
    --ws-nav-icon-border: rgba(143, 188, 255, 0.22);
    --ws-nav-icon-fg: #cae0ff;

    --ws-code: #c02d76;
}

html[data-theme="theme-blue"] {
    --ws-bg-body: #0b1530;
    --ws-bg-page: radial-gradient(circle at top right, #152a52 0%, #0f1a38 40%, #0b1530 100%);
    --ws-bg-sidebar: linear-gradient(180deg, rgba(12, 28, 58, 0.96) 0%, rgba(10, 22, 48, 0.92) 100%);
    --ws-bg-top: rgba(14, 28, 56, 0.72);
    --ws-border: rgba(120, 189, 255, 0.12);
    --ws-text: #e8eef8;
    --ws-text-muted: #8ea2c5;
    --ws-text-subtle: #9eb1d0;
    --ws-link: #6ec8ff;
    --ws-link-hover: #a8deff;
    --ws-brand: #6ec8ff;
    --ws-focus-ring: #258cfb;
    --ws-focus-halo: #ffffff;

    --ws-panel-bg: linear-gradient(180deg, rgba(18, 40, 78, 0.92), rgba(14, 31, 66, 0.92));
    --ws-panel-border: rgba(120, 189, 255, 0.28);
    --ws-panel-shadow: 0 20px 44px rgba(6, 12, 32, 0.45);

    --ws-page-subtitle: #8ea2c5;
    --ws-stat-label: #95a8c9;
    --ws-stat-hint: #9eb1d0;
    --ws-stat-ok: #67e58b;
    --ws-stat-bad: #ff9b9b;

    --ws-kpi-chip-text: #cfe1ff;
    --ws-kpi-chip-bg: rgba(85, 140, 255, 0.22);
    --ws-kpi-chip-border: rgba(120, 178, 255, 0.32);

    --ws-sortable-hover: #9dd4ff;
    --ws-active-filter-border: #85c3ff;
    --ws-active-filter-bg: rgba(63, 136, 255, 0.36);
    --ws-active-filter-color: #fff;

    --ws-channel-tag-bg: rgba(86, 153, 255, 0.28);
    --ws-channel-tag-border: rgba(118, 182, 255, 0.38);

    --ws-task-pending-fg: #9bd8ff;
    --ws-task-pending-bg: rgba(79, 210, 255, 0.16);
    --ws-task-pending-border: rgba(79, 210, 255, 0.35);

    --ws-task-done-fg: #91efb0;
    --ws-task-done-bg: rgba(76, 205, 122, 0.16);
    --ws-task-done-border: rgba(76, 205, 122, 0.35);

    --ws-task-failed-fg: #ff9b9b;
    --ws-task-failed-bg: rgba(255, 102, 132, 0.16);
    --ws-task-failed-border: rgba(255, 102, 132, 0.35);

    --ws-task-error: #ffb4b4;
    --ws-pager: #9eb1d0;

    --ws-panel-hint-border: rgba(126, 178, 255, 0.4);
    --ws-panel-hint-bg: rgba(18, 36, 72, 0.75);
    --ws-panel-hint-color: #c5dfff;

    --ws-trend-label: #a6bad9;
    --ws-trend-bar-track: rgba(109, 139, 185, 0.28);
    --ws-trend-bar: linear-gradient(90deg, #5ad4ff, #7e8fff);

    --ws-op-row-dash: rgba(141, 168, 206, 0.28);
    --ws-salary-net: #83efaa;

    --ws-login-shell: linear-gradient(135deg, #0c1f42 0%, #0b1530 50%, #142a52 100%);
    --ws-login-card-bg: rgba(14, 31, 66, 0.92);
    --ws-login-card-border: rgba(120, 189, 255, 0.32);
    --ws-login-card-shadow: 0 28px 56px rgba(4, 10, 28, 0.5);
    --ws-login-muted: #96aacb;
    --ws-login-footnote: #6f85a9;
    --ws-login-badge-bg: linear-gradient(135deg, #3eb6ff 0%, #5a6dff 100%);

    --ws-input-bg: #0f2248;
    --ws-input-color: #ecf3ff;
    --ws-input-border: rgba(120, 189, 255, 0.35);
    --ws-input-focus-bg: #122a56;
    --ws-input-focus-color: #fff;

    --ws-app-loading-bg: radial-gradient(circle at top right, #1a3a6e 0%, #0f1f42 40%, #0b1530 100%);
    --ws-app-loading-card-bg: rgba(18, 40, 78, 0.9);
    --ws-app-loading-card-border: rgba(120, 189, 255, 0.3);

    --ws-loading-stroke-bg: #e0e0e0;
    --ws-loading-stroke: #3eb6ff;

    --ws-user-chip-bg: rgba(84, 150, 255, 0.24);
    --ws-user-chip-border: rgba(132, 176, 255, 0.5);
    --ws-user-chip-text: #d7e7ff;

    --ws-top-title-sub: #93a3bc;

    --ws-nav-logo-bg: linear-gradient(135deg, #3eb6ff 0%, #5a6dff 100%);

    --ws-nav-brand-strong: #f5f9ff;
    --ws-nav-brand-sub: #8ea2c5;
    --ws-nav-group: #7f95b9;
    --ws-nav-link: #bdd1ee;
    --ws-nav-link-hover: #ffffff;
    --ws-nav-link-hover-bg: rgba(83, 137, 255, 0.22);
    --ws-nav-link-active: #ffffff;
    --ws-nav-link-active-bg: linear-gradient(135deg, rgba(67, 184, 255, 0.5), rgba(96, 119, 255, 0.5));
    --ws-nav-link-active-border: rgba(151, 201, 255, 0.5);
    --ws-nav-icon-bg: rgba(87, 144, 255, 0.24);
    --ws-nav-icon-border: rgba(143, 188, 255, 0.28);
    --ws-nav-icon-fg: #cae0ff;

    --ws-code: #c02d76;
}

/* 浅色主题：Bootstrap 语义类在业务页中的外观 */
html[data-theme="theme-light"] .table.table-dark {
    --bs-table-bg: #ffffff;
    --bs-table-color: #333333;
    --bs-border-color: #e5e5e5;
    color: #333333;
    border-color: #e5e5e5;
}

html[data-theme="theme-light"] .table.table-dark > :not(caption) > * > * {
    border-bottom-color: #e5e5e5;
}

html[data-theme="theme-light"] .table.table-dark.table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-color-type: #333333;
    --bs-table-bg-type: #f5f5f5;
}

html[data-theme="theme-light"] .btn-outline-light {
    color: #0066cc;
    border-color: #cccccc;
    background: #ffffff;
}

html[data-theme="theme-light"] .btn-outline-light:hover {
    color: #004a99;
    border-color: #0066cc;
    background: rgba(0, 102, 204, 0.06);
}

html[data-theme="theme-light"] .text-light {
    color: #666666 !important;
}

html[data-theme="theme-light"] .oidc-breadcrumb .breadcrumb-item + .breadcrumb-item::before {
    color: #999999;
}

html[data-theme="theme-light"] .oidc-breadcrumb .breadcrumb-item.active {
    color: #333333;
}

html[data-theme="theme-light"] .oidc-admin-tabs {
    border-bottom-color: #e5e5e5;
}

html[data-theme="theme-light"] .oidc-admin-tabs .nav-link {
    color: #666666;
}

html[data-theme="theme-light"] .oidc-admin-tabs .nav-link:hover {
    color: #0066cc;
    border-color: rgba(0, 102, 204, 0.15);
}

html[data-theme="theme-light"] .oidc-admin-tabs .nav-link.active {
    color: #003d7a;
    background: #f0f7ff;
    border-color: #e5e5e5;
    border-bottom-color: transparent;
}

html[data-theme="theme-light"] .oidc-tab-badge {
    background: rgba(0, 102, 204, 0.12);
    color: #0066cc;
}

html[data-theme="theme-light"] .oidc-placeholder {
    border-color: rgba(0, 102, 204, 0.25);
    background: #fafafa;
}

html[data-theme="theme-light"] .oidc-admin-shortcut p.mb-0 {
    color: #666666;
}
