/* Visual acceptance layer aligned with 人才管理驾驶舱.html.
   The reference is used only as a visual source; product data and authorization stay unchanged. */

:root {
  --color-sidebar: #101828;
  --color-sidebar-deep: #0a0e14;
  --color-sidebar-text: #c0cada;
  --color-canvas: #f4f5f7;
  --color-surface: #ffffff;
  --color-surface-subtle: #f7f8fa;
  --color-text: #101828;
  --color-text-secondary: #667085;
  --color-border: #e4e7ec;
  --color-primary: #2e5bd7;
  --color-primary-soft: #eef3ff;
  --color-success: #12a866;
  --color-success-soft: #dff7e9;
  --color-warning: #c66a0a;
  --color-warning-soft: #fff1cf;
  --color-danger: #d5483e;
  --color-danger-soft: #fee9e7;
  --shadow-card: 0 1px 3px rgba(16,24,40,.06), 0 8px 24px -16px rgba(16,24,40,.18);
}

.shell { grid-template-columns: 224px minmax(0,1fr); }
.app-sidebar { padding: 16px 12px; background: var(--color-sidebar-deep); }
.sidebar-brand { gap: 10px; padding: 6px 10px 16px; }
.sidebar-brand-mark { width: 32px; height: 32px; border-radius: 9px; background: linear-gradient(135deg,#2e5bd7,#7a5af8); box-shadow: none; }
.sidebar-brand strong { font-size: 14px; }
.primary-nav { padding-top: 10px; }
.nav-group { margin-top: 12px; }
.nav-group-label { margin: 0 10px 4px; color: #69758b; font-weight: 600; letter-spacing: .04em; }
.nav-item { min-height: 36px; margin: 1px 0; padding: 7px 10px; border-radius: 8px; font-weight: 560; }
.nav-item.active { background: var(--color-primary); box-shadow: none; font-weight: 700; }
.nav-glyph { width: 18px; height: 18px; border-radius: 5px; background: transparent; }
.nav-item.active .nav-glyph { background: rgba(255,255,255,.12); }
.sidebar-user { padding: 14px 10px 2px; }
.sidebar-avatar { width: 30px; height: 30px; background: var(--color-primary); color: #fff; }

.workspace { padding: 16px 22px 44px; }
.topbar { min-height: 43px; margin: 0 0 14px; padding: 0; position: static; border: 0; background: transparent; backdrop-filter: none; }
.page-context .kicker { display: none; }
.page-context h1 { font-size: 20px; font-weight: 760; }
.page-context p:last-child { margin-top: 4px; color: #8b95a7; }
.context-chip,.mode-pill { min-height: 32px; padding: 6px 9px; border-radius: 8px; }
.button { min-height: 32px; padding: 7px 13px; border-radius: 9px; }

.overview-hero { margin-bottom: 14px; padding: 14px 16px; border: 1px solid var(--color-border); border-radius: 12px; background: var(--color-surface); color: var(--color-text); box-shadow: var(--shadow-card); }
.overview-hero::after { display: none; }
.overview-hero .section-label { color: var(--color-text-secondary); }
.overview-hero h2 { font-size: 14px; }
.overview-hero p:last-child { max-width: 820px; margin-top: 5px; color: var(--color-text-secondary); }
.overview-hero-badge { padding: 5px 9px; border-color: var(--color-border); background: var(--color-primary-soft); color: var(--color-primary); }
.dashboard-filterbar { padding: 10px 12px; border-radius: 12px; background: var(--color-surface); box-shadow: var(--shadow-card); }
.dashboard-filterbar select { min-height: 32px; }
.overview-metrics { gap: 14px; }
.overview-metric { min-height: 106px; padding: 14px 16px; border-radius: 12px; }
.metric-value-line { margin: 8px 0 3px; }
.overview-metric strong { font-size: 30px; font-weight: 800; }
.overview-main-grid,.overview-bottom-grid { gap: 14px; }
.overview-card { padding: 14px 16px; border-radius: 12px; }
.overview-card-head { margin-bottom: 10px; }
.overview-card-head h3 { font-size: 14px; }
.coverage-chart { gap: 7px; }
.overview-main-grid > .overview-card { align-self: start; }
#homeDepartmentChart { max-height: 184px; overflow-y: auto; padding-right: 4px; scrollbar-color: var(--color-border) transparent; }
#homeRiskList { max-height: 300px; overflow-y: auto; padding-right: 4px; scrollbar-color: var(--color-border) transparent; }
.coverage-button { padding-block: 6px; }
.overview-selection { margin-top: 10px; padding: 10px; }
.trend-strip { margin-top: 10px; min-height: 74px; padding: 10px 12px; }

html[data-theme="dark"] {
    color-scheme: dark;
    --color-canvas: #0f1319;
    --color-sidebar: #0a0e14;
    --color-sidebar-deep: #080c12;
    --color-sidebar-text: #b8c2d1;
    --color-surface: #161d27;
    --color-surface-subtle: #121923;
    --color-text: #eef1f6;
    --color-text-secondary: #aab5c5;
    --color-border: #26303f;
    --color-primary: #5b82e8;
    --color-primary-soft: #1d2a44;
    --color-success: #32d583;
    --color-success-soft: #10351f;
    --color-warning: #fdb022;
    --color-warning-soft: #3a2c12;
    --color-danger: #f97066;
    --color-danger-soft: #3a1f1c;
    --shadow-card: 0 1px 3px rgba(0,0,0,.16), 0 8px 24px -16px rgba(0,0,0,.52);
    --paper: var(--color-canvas);
    --ink: var(--color-text);
    --soft: var(--color-text-secondary);
    --line: var(--color-border);
    --green: var(--color-success);
    --green-soft: var(--color-success-soft);
    --blue: var(--color-primary);
    --blue-soft: var(--color-primary-soft);
    --amber: var(--color-warning);
    --amber-soft: var(--color-warning-soft);
    --violet: #b69bf6;
    --violet-soft: #2b2240;
    --surface-soft: var(--color-surface-subtle);
    --muted: var(--color-text-secondary);

  body { background: var(--color-canvas); color: var(--color-text); }
  .topbar { background: transparent; }
  .context-chip,.mode-pill,.dashboard-filterbar,.overview-hero,
  .overview-metric,.overview-card,.metric-card,.data-panel,.progress-card,.score-card,
  .capability,.audit-card,.operations-panel,.org-tree-panel,.talent-panel,.tool-card,
  .talent-visual-card,.evidence-overview,.operations-view,.organization-view,.workbench,
  .operations-metrics article,.evidence-admin-metrics article,.governance-cards article,
  .evidence-admin-grid > section,.task-status-overview article,.failure-cluster,
  .connection-item,.schedule-item,.rule-version-list > article,.quality-alert-list > article,
  .retention-policy-item,.operations-audit-item,.task-detail-failures article,
  .task-detail-summary article,.status-list-item,.loop-fact-column,.evidence-timeline article {
    border-color: var(--color-border);
    background: var(--color-surface);
    color: var(--color-text);
    box-shadow: var(--shadow-card);
  }
  .operations-view,.organization-view,.workbench { background: var(--color-canvas); box-shadow: none; }
  .topbar,.profile-dialog-head { border-color: var(--color-border); }
  .section-label,.eyebrow,.kicker,.nav-group-label { color: #748096; }
  .panel-head > span:not(.status),.access-summary,.sec-tag {
    border-color: var(--color-border);
    background: var(--color-surface-subtle);
    color: var(--color-text-secondary);
  }
  .page-context p:last-child,.dashboard-filter-copy span,.overview-card-head p,
  .overview-metric header,.overview-metric small,.overview-metric time,
  .trend-copy span,.trend-copy small,.coverage-row span,.selection-people small,
  .status-list-item p,.status-item-owner,.talent-meta,.profile-subtitle,
  .operations-audit-item span,.operations-audit-item small { color: var(--color-text-secondary); }

  .button.ghost,.button.secondary,.mini-action,.profile-link,
  input,select,textarea,.dashboard-filterbar select,.talent-toolbar select,.talent-toolbar input,
  .operations-toolbar input,.operations-toolbar select,.operation-field input,.operation-field select,
  .retention-policy-item input,.retention-policy-item select {
    border-color: var(--color-border);
    background: var(--color-surface);
    color: var(--color-text);
  }
  .button.primary { background: var(--color-primary); }
  .button.danger { border-color: #663033; background: var(--color-danger-soft); color: var(--color-danger); }
  .empty-state,.status-item-facts span,.status-item-aside > span,.preview-summary article,
  .timeline-meta-grid span,.audit-change > div,.talent-metrics article,
  .evidence-metrics article,.department-evidence-grid article { background: var(--color-surface-subtle); color: var(--color-text-secondary); }
  .access-feedback,.access-feedback.loading,.access-feedback.error {
    border-color: var(--color-border);
    background: var(--color-surface-subtle);
    color: var(--color-text);
  }
  .operations-table th,.talent-table th,.dept-row.dept-head { background: #111823; color: #8490a4; }
  .operations-table td,.talent-table td,.dept-row,.event,.profile-grid dl > div,.profile-status-list > div { border-color: var(--color-border); color: var(--color-text); }
  .operations-table tr:hover td,.talent-table tr:hover td,.talent-table tbody tr:nth-child(even) td { background: #182231; }
  .coverage-track,.source-coverage-row > div { background: #253044; }
  .coverage-button:hover,.comparison-row:hover { border-color: #34445d; background: #182233; }
  .coverage-button.active,.talent-map-node.active,.org-node.active { border-color: #4c6fbf; background: var(--color-primary-soft); }
  .overview-selection,.profile-subtitle,.profile-evidence-section { border-color: var(--color-border); background: #131d2b !important; }
  .selection-people button,.talent-map-node,.comparison-row { border-color: var(--color-border); background: #151d28; color: var(--color-text); }
  .trend-strip { border-color: var(--color-border); background: linear-gradient(180deg,transparent,#121923); }
  .trend-bars i { background: #34425a; }
  .metric-delta,.risk-legend .info,.severity-badge,.task-state { background: #232d3b; color: #aab5c5; }

  .profile-dialog,.confirm-dialog { border-color: var(--color-border); background: var(--color-surface); color: var(--color-text); }
  .profile-dialog-head { background: rgba(22,29,39,.97); }
  .profile-grid > section,.evidence-review-source,.role-options,.preview-orgs,.preview-employees { border-color: var(--color-border); background: var(--color-surface-subtle); }
  .analysis-empty { background: var(--color-warning-soft) !important; }
  .confirm-impact { border-color: #663033; background: var(--color-danger-soft); }
  .confirm-impact p { color: #f2a49e; }
  .profile-dialog::backdrop,.confirm-dialog::backdrop { background: rgba(3,7,12,.7); }

  .login-gate { background: radial-gradient(circle at 16% 12%,rgba(91,130,232,.16),transparent 30rem),var(--color-canvas); }
  .login-panel { border-color: var(--color-border); background: rgba(22,29,39,.97); color: var(--color-text); box-shadow: 0 30px 90px rgba(0,0,0,.45); }
  .login-step,.login-step.complete { border-color: var(--color-border); background: var(--color-surface); color: var(--color-text); }
  .login-step.active { border-color: #4868ad; box-shadow: 0 0 0 3px rgba(91,130,232,.14); }
  .login-step.locked,.login-feedback { background: var(--color-surface-subtle); color: var(--color-text-secondary); }
  .login-copy > p:last-child,.login-step > p,.login-boundary,.login-brand small { color: var(--color-text-secondary); }
  .login-feedback.success { background: var(--color-success-soft); color: var(--color-success); }
  .login-feedback.error { background: var(--color-danger-soft); color: var(--color-danger); }
}

@media (max-width: 1180px) {
  .shell { grid-template-columns: 210px minmax(0,1fr); }
}

@media (max-width: 760px) {
  .shell { display: block; }
  .workspace { padding: 0 14px 32px; }
  .topbar { min-height: 62px; margin: 0 -14px 14px; padding: 11px 14px; position: sticky; border-bottom: 1px solid var(--color-border); background: color-mix(in srgb,var(--color-surface) 94%,transparent); }
}