/* ============================================================
   全局 UI 统一层（据 D:\HR-Systems\UI统一规范.md v0.1）
   设计原则：框架外壳统一、业务强调色保留。
   本文件只做「增量统一」，不改动各业务自有配色与布局，
   删除本文件链接即可一键回退。
   统一项：① 中文优先字体栈 ② 顶栏统一深色 slate-800（去渐变）
           ③ 移动端 ≤768px 基础断点（顶栏换行 / 内容区收窄）
   ============================================================ */
:root{
  /* 统一深色顶栏（规范 §2） */
  --hdr-bg:#1f2937;          /* slate-800 */
  --hdr-fg:#f8fafc;
  /* 中文优先字体栈（规范 §1） */
  --font-sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",
              "Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
html,body{font-family:var(--font-sans)}

/* —— 顶栏：去掉花哨渐变，统一为中性深色（规范 §2 明确禁止渐变背景） —— */
.topbar{
  background:var(--hdr-bg) !important;
  color:var(--hdr-fg) !important;
}
.topbar .brand-name,
.topbar .brand-sub,
.topbar .nav a{color:var(--hdr-fg) !important}
.topbar .brand-sub{border-left-color:rgba(248,250,252,.25) !important}
/* 导航激活态在深底上用浅色芯片，保持可读 */
.topbar .nav a.active{background:rgba(255,255,255,.16) !important;color:#fff !important}

/* —— 移动端基础断点（规范 §7）：≤768px 单列堆叠 —— */
@media (max-width:768px){
  .topbar{
    flex-wrap:wrap !important;
    height:auto !important;
    padding:10px 14px !important;
    row-gap:6px;
  }
  .topbar .nav{width:100%;margin-left:0;justify-content:flex-start}
  .layout{flex-direction:column}
  .app,.container{padding:14px !important}
  /* 表格在窄屏横向滚动，避免挤压 */
  .table-wrap,table.ledger{width:100%}
}
/* ===== HR-Systems 统一设计令牌 (Phase A · 2026-08-25) =====
   纯增量、可一键回退：仅设置装饰性属性，不改变布局/事件/数据。 */
:root{
  --brand:#2563eb; --brand-600:#1d4ed8; --brand-700:#1e40af; --brand-50:#eff6ff;
  --accent:#7c3aed; --accent-50:#f5f3ff;
  --ok:#16a34a; --warn:#d97706; --danger:#dc2626;
  --ink:#0f172a; --body:#334155; --muted:#64748b;
  --line:#e2e8f0; --line-2:#cbd5e1;
  --bg:#f8fafc; --surface:#ffffff; --surface-2:#f1f5f9;
  --r-xs:6px; --r-sm:8px; --r:12px; --r-lg:16px; --r-xl:20px;
  --sh-1:0 1px 2px rgba(15,23,42,.04),0 1px 3px rgba(15,23,42,.06);
  --sh-2:0 4px 14px rgba(15,23,42,.08);
  --f-zh:"PingFang SC","Microsoft YaHei","Hiragino Sans GB","Source Han Sans SC","Noto Sans CJK SC",sans-serif;
}
body{font-family:var(--f-zh);color:var(--body);background:var(--bg);-webkit-font-smoothing:antialiased;}
button,input,select,textarea,table,code,th,td{font-family:inherit;}
a{color:var(--brand);}
button,.btn{border-radius:var(--r-sm);cursor:pointer;transition:border-color .15s,background .15s,box-shadow .15s;}
input[type=text],input[type=password],input[type=email],input[type=search],input[type=number],input[type=date],select,textarea{
  border:1px solid var(--line-2);border-radius:var(--r-sm);background:var(--surface);color:var(--ink);
  padding:8px 10px;transition:border-color .15s,box-shadow .15s;}
input:focus,select:focus,textarea:focus{border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-50);outline:none;}
.card,.panel,.box,.module,.widget{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1);}
table{border-collapse:collapse;width:100%;}
th,td{border:1px solid var(--line);padding:8px 10px;color:var(--body);vertical-align:top;}
th{background:var(--surface-2);color:var(--ink);font-weight:600;text-align:left;}
.btn-primary,button.primary{background:var(--brand);border:1px solid var(--brand);color:#fff;}
.btn-primary:hover,button.primary:hover{background:var(--brand-600);}


/* == HR-Systems UI 阶段 B（组件级精修） == */
/* === 阶段 B：组件级精修 · 安全增量 CSS === */
/* 仅新增类/状态，不覆盖已有业务选择器，零功能风险 */

/* 页面标题 */
.page-title,.page-heading{font-size:1.5rem;font-weight:700;color:var(--ink);margin-bottom:1rem;line-height:1.3;}
.page-title small,.page-heading small{display:block;font-size:.85rem;font-weight:400;color:var(--muted);margin-top:.25rem;}

/* 统计卡片 */
.stat-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:1.25rem;box-shadow:var(--sh-1);transition:transform .15s,box-shadow .15s;}
.stat-card:hover{transform:translateY(-2px);box-shadow:var(--sh-2);}
.stat-card .value{font-size:1.75rem;font-weight:700;color:var(--ink);line-height:1.2;}
.stat-card .label{font-size:.875rem;color:var(--muted);margin-top:.25rem;}
.stat-card .icon{width:40px;height:40px;border-radius:var(--r-sm);display:flex;align-items:center;justify-content:center;background:var(--brand-50);color:var(--brand);margin-bottom:.75rem;}

/* 表单标签 */
.form-label,.label{font-size:.875rem;font-weight:500;color:var(--ink);margin-bottom:.375rem;display:block;}
.form-label.required::after,.label.required::after{content:"*";color:var(--danger);margin-left:2px;}

/* 空状态 */
.empty-state{text-align:center;padding:2.5rem 1rem;color:var(--muted);}
.empty-state .icon{font-size:2.5rem;color:var(--line-2);margin-bottom:.75rem;}
.empty-state .title{font-size:1rem;font-weight:600;color:var(--ink);margin-bottom:.25rem;}

/* 表格行悬停 */
table tbody tr{transition:background .12s;}
table tbody tr:hover{background:var(--surface-2);}

/* 按钮焦点环强化 */
button:focus-visible,.btn:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none;box-shadow:0 0 0 3px var(--brand-50);}

/* 链接下划线 */
a:hover{text-decoration:underline;}

/* 面包屑 */
.breadcrumb{display:flex;align-items:center;gap:.5rem;font-size:.875rem;color:var(--muted);margin-bottom:1rem;}
.breadcrumb a{color:var(--brand);text-decoration:none;}
.breadcrumb a:hover{text-decoration:underline;}
.breadcrumb .sep{color:var(--line-2);}