/* ============================================================
   正彤智护 · 整体质感与大气感精修 v3（正彤蓝×橙·大气感）
   挂在 zt-theme-v2.css 之后叠加；纯视觉覆盖，零布局/业务/接口改动
   删挂载即整体回滚，不改 v2、不改业务 JS
   ============================================================ */

/* ---------- 0. 令牌：字阶 / 间距 / 阴影三档 ---------- */
:root{
  --v3-h1:21px; --v3-h2:15px; --v3-body:14px; --v3-aux:13px;
  --v3-gap:16px; --v3-pad-card:18px; --v3-pad-page:20px 24px;
  --v3-shadow-sm:0 1px 2px rgba(16,40,80,.05);
  --v3-shadow-md:0 2px 10px rgba(16,40,80,.06);
  --v3-shadow-lg:0 12px 48px rgba(16,40,80,.16);
}

/* ---------- A. 顶栏品牌化（P0：深底白字 + 渐变 + 橙细线） ---------- */
.app-header{
  background:linear-gradient(100deg,#10305A 0%,#1539BB 55%,#0e2a8c 100%)!important;
  height:56px!important; min-height:56px!important;
  padding:0 20px!important;
  border-bottom:none!important;
  box-shadow:0 2px 10px rgba(16,40,80,.22)!important;
  position:relative!important;
}
.app-header::after{
  content:''!important; position:absolute!important; left:0!important; right:0!important; bottom:0!important;
  height:2px!important; background:linear-gradient(90deg,#CC4422,#FFB066,transparent)!important;
  pointer-events:none!important; z-index:2!important;
}
/* 系统名：白色 18px 800 */
.app-header .sys-name{
  color:#FFFFFF!important; font-size:18px!important; font-weight:800!important;
  letter-spacing:1px!important; text-shadow:none!important;
}
.app-header .sys-name .accent{ color:#FFB066!important; }
/* 右侧信息/用户：白色系 */
.app-header .header-info,
.app-header .header-info .value,
.app-header .header-info .info-item,
.app-header #headerName{
  color:rgba(255,255,255,.88)!important; font-weight:500!important; text-shadow:none!important;
}
.app-header .app-userinfo,
.app-header .app-userinfo #userInfo,
.app-header .app-userinfo *{
  color:rgba(255,255,255,.85)!important;
}
.app-header .app-userinfo:hover{ color:#FFFFFF!important; }
/* 用户下拉浮层还色（P0 白字根治）：白底菜单项强制深色，退出登录红，hover 灰底；不破坏顶栏常显白字 */
.app-header .app-userinfo #userMenu,
.app-header .app-userinfo #userMenu *{
  color:#333333 !important;
}
.app-header .app-userinfo #userMenu [onclick*="doLogout"]{
  color:#ef4444 !important;
}
.app-header .app-userinfo #userMenu > div:hover{
  background:#f3f6fc !important;
}
/* 小箭头 / 汉堡 / 分隔线 */
.app-header #companyArrow{ color:rgba(255,255,255,.7)!important; }
#hamburger{ color:#FFFFFF!important; }
.app-header .divider{ background:rgba(255,255,255,.22)!important; }
/* logo：34px 圆角8 白底衬片 */
.app-header .logo-img{
  width:34px!important; height:34px!important; border-radius:8px!important;
  background:rgba(255,255,255,.12)!important; padding:3px!important; box-sizing:border-box!important;
  box-shadow:0 1px 4px rgba(0,0,0,.15)!important;
}
/* 顶栏橙强调（在线状态点等仅 1-2 处，克制品睛） */
.app-header .online-dot, .app-header .status-live{ color:#FFB066!important; }

/* ---------- B. 页头分量（P0：标题 21px 800 深蓝 + 4px 橙竖线） ---------- */
.view-header{ padding:0 0 18px!important; background:transparent!important; }
.view-header h3{
  font-size:var(--v3-h1)!important; font-weight:800!important; color:#1539BB!important;
  line-height:1.35!important; letter-spacing:.2px!important;
  padding-left:14px!important; position:relative!important;
}
.view-header h3:not(:empty)::before{
  content:''!important; position:absolute!important; left:0!important; top:50%!important;
  transform:translateY(-50%)!important; width:4px!important; height:22px!important;
  background:#CC4422!important; border-radius:2px!important;
}

/* ---------- C. 留白与栅格（P0：卡片间距 16px / 内容内边距） ---------- */
.view-body{ padding:var(--v3-pad-page)!important; }
.statGridRow{ gap:16px!important; }
.mgmt-view .view-body > .card, .mgmt-view .view-body > .panel{ margin-bottom:16px!important; }
.grid-cards, .card-grid{ gap:16px!important; }

/* ---------- D. KPI / 统计卡大气化（P0：去 Consolas、29px 800 tabular-nums 深蓝） ---------- */
.stat-card .num,
.statGridRow .stat-card .num,
.kpi-card .num,
.stat-item .num{
  font-family:"Microsoft YaHei","PingFang SC","Noto Sans CJK SC",sans-serif!important;
  font-variant-numeric:tabular-nums!important;
  font-size:29px!important; font-weight:800!important; line-height:1.15!important;
  color:#1539BB!important; letter-spacing:-.5px!important;
}
.stat-item .num{ font-size:28px!important; }
/* 语义色保留（绿=正常/橙=关键/红=告警），仅覆盖默认黑 */
.stat-item .num.green, .stat-item .num.g, .stat-card .num.green{ color:#16A34A!important; }
.stat-item .num.orange, .stat-item .num.o, .stat-card .num.orange{ color:#CC4422!important; }
.stat-item .num.red, .stat-item .num.r, .stat-card .num.red{ color:#DC2626!important; }
/* 空/0：淡灰，不惨白 */
.stat-card .num.zero, .stat-item .num.zero, .stat-item .num.stat-num-empty{ color:#C4CCD8!important; }
/* 标签灰 13px */
.stat-card .lbl, .stat-item .lbl, .kpi-card .lbl{ font-size:13px!important; color:#6B7280!important; }
/* 卡片质感：白底 圆角12 柔阴影 hover 上浮 */
.stat-card, .stat-item, .kpi-card{
  border-radius:12px!important;
  box-shadow:var(--v3-shadow-md)!important;
  border:1px solid #E8EDF4!important;
}
.stat-card:hover, .stat-item:hover, .kpi-card:hover{ transform:translateY(-2px)!important; box-shadow:0 8px 22px rgba(20,64,120,.10)!important; }
/* 图标块：40×40 浅色圆角 */
.stat-item .ic, .stat-card .ic, .kpi-card .ic{
  display:inline-flex!important; align-items:center!important; justify-content:center!important;
  width:40px!important; height:40px!important; border-radius:10px!important;
  background:#E8F0FA!important; font-size:20px!important; line-height:1!important; margin-bottom:8px!important;
}

/* ---------- E. 字阶字重（P1：靠字重对比 + 颜色深浅拉层级） ---------- */
.view-header h3{ font-size:var(--v3-h1)!important; font-weight:800!important; }
.card-title, .panel-title, .section-title, h4.card-title{ font-size:var(--v3-h2)!important; font-weight:700!important; color:#1F2937!important; }
.view-body, .mgmt-view .view-body{ font-size:var(--v3-body)!important; line-height:1.65!important; color:#1F2937!important; }
.aux, .muted, .desc, .hint, .sub-text{ font-size:var(--v3-aux)!important; color:#8A94A6!important; }
table td, table th{ font-variant-numeric:tabular-nums; }

/* ---------- F. 侧栏舒展（P1：228px、14px 子项、40px 高） ---------- */
.app-sidebar{ width:228px!important; min-width:228px!important; }
.app-sidebar .sub-tab-btn{
  font-size:14px!important; min-height:40px!important; line-height:1.5!important;
  padding-left:18px!important; padding-right:12px!important;
}
.app-sidebar .mgmt-tab{ min-height:40px!important; font-size:14px!important; padding-left:16px!important; }
.app-sidebar .menu-group-head{ font-size:14px!important; font-weight:600!important; padding:11px 12px!important; }
.app-sidebar .sidebar-group-label{ font-size:11px!important; color:#94A3B8!important; letter-spacing:1px!important; padding:12px 16px 4px!important; }
/* 选中项右内圆角，让选中块更浮起 */
.app-sidebar .sub-tab-btn.active, .app-sidebar .sub-tab-btn.sel,
.app-sidebar .mgmt-tab.active, .app-sidebar .mgmt-tab.sel{ border-radius:6px 0 0 6px!important; }
/* 侧栏顶部品牌区小字（可选增强品牌感） */
.app-sidebar .sidebar-brand-m{ color:#1539BB!important; font-weight:700!important; }

/* ---------- G. 卡片 / 表格 / 弹窗质感（P1） ---------- */
/* 阴影三档令牌 */
.card, .panel{ box-shadow:var(--v3-shadow-md)!important; border-radius:12px!important; }
/* 重点数据表表头：深蓝渐变白字（工作台/工资/考勤汇总） */
.dashboard-table thead th, .summary-table thead th, .payroll-table thead th, .att-summary-table thead th{
  background:linear-gradient(180deg,#0e2a8c,#1539BB)!important; color:#FFFFFF!important; font-weight:600!important;
}
/* 弹窗：圆角14 + 标题区顶部蓝橙线（保留 v2 ::before） */
.modal-box{ border-radius:14px!important; box-shadow:var(--v3-shadow-lg)!important; }
.modal-box .modal-header{ border-radius:14px 14px 0 0!important; }

/* ---------- H. 细节精致（P2 选做，克制） ---------- */
/* 过渡统一 */
.card, .panel, .stat-card, .stat-item, .kpi-card, .sub-tab-btn, .modal-box, button.btn, .btn{ transition:all .18s ease!important; }
/* 页面底色极淡品牌质感（透明度极低，宁淡勿花） */
#app-main, .app-main{ background:radial-gradient(120% 60% at 50% -10%, rgba(20,64,120,.04), transparent 60%)!important; }
/* emoji 与文字垂直居中 */
.view-header h3, .sub-tab-btn, .mgmt-tab{ display:flex!important; align-items:center!important; gap:8px!important; }

/* ---------- I. 登录页第一印象（P1：深蓝品牌渐变背景 + 白登录卡） ---------- */
#loginOverlay{
  background:
    radial-gradient(ellipse at 18% 16%, rgba(240,128,16,.14), transparent 55%),
    linear-gradient(115deg, rgba(16,48,90,.94) 0%, rgba(20,64,120,.90) 55%, rgba(31,84,150,.86) 100%),
    url('/login-bg.jpg') no-repeat center center / cover!important;
}
.login-box{
  background:#FFFFFF!important;
  backdrop-filter:none!important; -webkit-backdrop-filter:none!important;
  border:1px solid #E5E7EB!important;
  border-radius:16px!important;
  box-shadow:0 16px 56px rgba(16,40,80,.22)!important;
  width:420px!important;
}
.login-box::before{ height:3px!important; background:linear-gradient(90deg,#1539BB,#CC4422)!important; }
.login-header h2, .login-header .h2-title{
  color:#1539BB!important; font-size:24px!important; font-weight:800!important; letter-spacing:.5px!important;
}
.login-header .login-subtitle{ color:#64748B!important; }
/* Slogan 与装饰线：深蓝玻璃卡里的浅色 → 白卡上的深灰/深蓝 */
.login-box .login-header [style*="cfe8ff"]{ color:#4B5563!important; }
.login-box .login-header [style*="7dd3fc"]{ background:linear-gradient(90deg,transparent,#1539BB)!important; }
.login-box .login-header [style*="7dd3fc,transparent"]{ background:linear-gradient(90deg,#1539BB,transparent)!important; }
/* 字段：白卡上浅底深字 */
.login-field label{ color:#4B5563!important; }
.login-field input{
  background:#F8FAFC!important; border:1px solid #E5E7EB!important; color:#1F2937!important;
}
.login-field input::placeholder{ color:#9AA3AF!important; }
.login-field input:focus{ border-color:#1539BB!important; box-shadow:0 0 0 3px rgba(20,64,120,.12)!important; }
.check-label{ color:#4B5563!important; }
.forgot-link{ color:#4B5563!important; }
.forgot-link:hover{ color:#CC4422!important; }
/* 登录主按钮：整宽品牌橙（唯一主 CTA，保留 v2 决策） */
.login-btn{
  background:linear-gradient(135deg,#FF9228,#CC4422)!important; color:#FFFFFF!important;
  border-radius:10px!important; font-size:16px!important; font-weight:700!important; letter-spacing:4px!important;
  box-shadow:0 6px 18px rgba(240,128,16,.30)!important;
}
.login-btn:hover{ opacity:.94!important; box-shadow:0 8px 24px rgba(240,128,16,.38)!important; }
/* 验证码图边框 */
#captchaImg{ border:1px solid #E5E7EB!important; }
/* 登录页底部 */
.login-footer{ color:#6B7280!important; }
.login-footer .f-line{ color:#6B7280!important; }
