/* ============================================================
   三人行 OA · 设计增强叠加层（theme-enhance.css） v2
   应用自 impeccable / frontend-dev 设计方法论（2026-08-12 晚）
   叠加于 theme.css 之上；回退方式：从 index.html / login.html
   摘掉 <link rel="stylesheet" href="/theme-enhance.css">
   设计原则：
     1) 意图化排版节奏（留白分段，非满屏卡片堆叠）
     2) 数字等宽（tabular-nums），统计与表格更整齐
     3) 触感反馈（按下明确缩放）
     4) 入场动效 + 错峰（cubic-bezier 缓出，非回弹）
     5) 尊重 prefers-reduced-motion 无障碍
     6) 零 emoji（一律 SVG 线性图标 / 纯文字）
   ============================================================ */

:root {
  /* 更克制的圆角节奏 */
  --radius-xl: 18px;
  --radius-lg: 14px;
  --radius-md: 10px;
  /* 排版：中文优先苹方 / 雅黑，回退系统无衬线 */
  --font-sans: "PingFang SC", "Microsoft YaHei", -apple-system, BlinkMacSystemFont,
               "Segoe UI", system-ui, sans-serif;
}

/* 数字等宽：统计卡与表格数字对齐 */
.stat-value, .stat-num, .table td, .table th, .cal-day .num {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

/* 标题字距收紧，去除泛化观感 */
.page-head h2, .card-head h3, .la-title, .login-h1 {
  letter-spacing: -.02em;
}

/* 区块分隔节奏：用留白而非嵌套卡片堆叠 */
.card + .card, .section + .section { margin-top: 20px; }

/* 触感反馈：按下更明确 */
.btn:active { transform: translateY(0) scale(.97); transition: transform .08s ease; }
.nav-item:active { transform: scale(.98); }

/* 空状态更友好（充足留白 + 引导性文案位） */
.empty {
  padding: 44px 20px;
  color: var(--muted, #94a3b8);
  font-size: 14px;
  text-align: center;
  line-height: 1.7;
}

/* 入场动效：卡片轻微上浮淡入（错峰，避免齐刷刷出现） */
@keyframes oaCardIn {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: none; }
}
.card, .stat-card {
  animation: oaCardIn .42s cubic-bezier(.16, 1, .3, 1) both;
}
.stat-card:nth-child(2) { animation-delay: .04s; }
.stat-card:nth-child(3) { animation-delay: .08s; }
.stat-card:nth-child(4) { animation-delay: .12s; }

/* 无障碍：尊重用户的减少动效偏好 */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
  .card:hover, .stat-card:hover, .btn.primary:hover { transform: none !important; }
}

/* 工资表审批：标题行内 SVG 图标对齐 */
.salary-title-icon {
  width: 14px; height: 14px;
  vertical-align: -2px;
  margin-right: 5px;
  flex-shrink: 0;
}
.salary-detail-title, .salary-warn-title {
  display: flex;
  align-items: center;
}
.salary-warn.ok { display: flex; align-items: center; }

/* 全局搜索下拉面板 */
.topbar-search { position: relative; }
.search-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 360px;
  max-width: 420px;
  max-height: 420px;
  overflow-y: auto;
  background: #fff;
  border: 1px solid var(--border, #E5EAF3);
  border-radius: 12px;
  box-shadow: 0 12px 32px rgba(15, 23, 42, .14);
  padding: 6px;
  z-index: 1200;
}
.search-group {
  font-size: 11px;
  font-weight: 700;
  color: var(--muted, #8A93A6);
  padding: 8px 10px 4px;
  letter-spacing: .04em;
}
.search-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 8px;
  cursor: pointer;
  transition: background .12s;
}
.search-item:hover, .search-item:focus-visible { background: var(--blue-soft, #EEF4FF); outline: none; }
.search-item-main { font-size: 13px; font-weight: 600; color: var(--text, #0F172A); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.search-item-sub { font-size: 11.5px; color: var(--muted, #8A93A6); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-left: auto; flex-shrink: 1; }
.search-item .tag { flex-shrink: 0; }
.search-empty { padding: 14px 10px; text-align: center; font-size: 12.5px; color: var(--muted, #8A93A6); }