/* ==========================================================================
   运远国际物流 — 全站样式
   设计风格：深色科技风，品牌色取自 logo（蓝紫 + 红）
   所有颜色 / 圆角等设计变量集中在 :root，改风格只需改这里
   ========================================================================== */

/* ---------- 字体（本地化，不依赖外部 CDN） ---------- */
@font-face {
  font-family: 'Space Grotesk';
  font-style: normal;
  font-weight: 300 700;
  font-display: swap;
  src: url('../fonts/space-grotesk.woff2') format('woff2');
}

/* ---------- 设计变量 ---------- */
:root {
  --bg: #060a13;
  --bg-soft: #0a1120;
  --panel: rgba(255, 255, 255, .04);
  --panel-strong: rgba(255, 255, 255, .07);
  --stroke: rgba(148, 163, 184, .16);
  --stroke-strong: rgba(148, 163, 184, .3);

  --indigo: #5b6cff;
  --violet: #8b5cf6;
  --red: #e8283c;
  --red-bright: #ff4d5f;

  --grad: linear-gradient(135deg, #5b6cff, #8b5cf6);
  --grad-red: linear-gradient(135deg, #ff4d5f, #d61f33);
  --grad-text: linear-gradient(120deg, #7c8cff 0%, #a78bfa 55%, #ff6b7a 110%);

  --text: #f1f5f9;
  --muted: #97a6bc;
  --muted-2: #64748b;

  --radius: 18px;
  --radius-sm: 12px;
  --container: 1200px;
  --header-h: 76px;

  --font: 'Space Grotesk', 'PingFang SC', 'HarmonyOS Sans SC', 'Microsoft YaHei', sans-serif;
  --shadow-glow: 0 0 0 1px rgba(91, 108, 255, .25), 0 10px 40px -8px rgba(91, 108, 255, .35);
}

/* ---------- 基础 ---------- */
* { margin: 0; padding: 0; box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
  font-family: var(--font);
  background: var(--bg);
  color: var(--text);
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
  /* 用 clip 而不是 hidden：hidden 会把 body 变成滚动容器，破坏子元素的 sticky 定位 */
  overflow-x: clip;
}

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
button { font-family: inherit; cursor: pointer; }

::selection { background: rgba(91, 108, 255, .4); }

.container {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 24px;
}

section { position: relative; }

/* 锚点定位时给固定导航留出空间 */
section[id] { scroll-margin-top: calc(var(--header-h) + 20px); }

.section { padding: 110px 0; }
.section-soft {
  background: var(--bg-soft);
  border-top: 1px solid var(--stroke);
  border-bottom: 1px solid var(--stroke);
}

/* 版块标题结构：kicker + 标题 + 副文案 */
.section-head { max-width: 760px; margin: 0 auto 64px; text-align: center; }
.section-head.left { margin-left: 0; text-align: left; }

.kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: .14em;
  color: var(--indigo);
  text-transform: uppercase;
  margin-bottom: 18px;
}
.kicker::before {
  content: '';
  width: 22px;
  height: 2px;
  background: var(--grad-red);
  border-radius: 2px;
}

.section-title {
  font-size: clamp(30px, 4vw, 46px);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -.01em;
}
.section-title .grad {
  background: var(--grad-text);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.section-sub { color: var(--muted); margin-top: 16px; font-size: 17px; }

/* ---------- 按钮 ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 30px;
  border-radius: 999px;
  border: 1px solid transparent;
  font-size: 15.5px;
  font-weight: 600;
  letter-spacing: .02em;
  transition: transform .25s ease, box-shadow .25s ease, background .25s ease, border-color .25s ease;
  white-space: nowrap;
}
.btn:active { transform: scale(.97); }

.btn-primary {
  background: var(--grad-red);
  color: #fff;
  box-shadow: 0 8px 26px -8px rgba(232, 40, 60, .55);
}
.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 34px -8px rgba(232, 40, 60, .7);
}

.btn-ghost {
  background: transparent;
  color: var(--text);
  border-color: var(--stroke-strong);
}
.btn-ghost:hover {
  border-color: var(--indigo);
  background: rgba(91, 108, 255, .08);
  transform: translateY(-2px);
}

.btn .arrow { transition: transform .25s ease; }
.btn:hover .arrow { transform: translateX(4px); }

/* ---------- 顶部导航 ---------- */
.site-header {
  position: fixed;
  inset: 0 0 auto 0;
  height: var(--header-h);
  z-index: 100;
  transition: background .3s ease, border-color .3s ease;
  border-bottom: 1px solid transparent;
}
.site-header.scrolled {
  background: rgba(6, 10, 19, .82);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  border-bottom-color: var(--stroke);
}

.nav-inner {
  height: var(--header-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
}

.brand { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }

/* logo 浅色圆底：保证 logo 的深灰弧线在深色页面上可见 */
.brand-badge {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  background: #f4f6fb;
  display: grid;
  place-items: center;
  overflow: hidden;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .12), 0 4px 14px rgba(0, 0, 0, .4);
}
.brand-badge img { width: 78%; height: 78%; object-fit: contain; }

.brand-text { display: flex; flex-direction: column; line-height: 1.25; }
.brand-text strong { font-size: 18px; font-weight: 700; letter-spacing: .02em; }
.brand-text em {
  font-style: normal;
  font-size: 10.5px;
  letter-spacing: .22em;
  color: var(--muted);
  text-transform: uppercase;
}

.nav-links { display: flex; align-items: center; gap: 34px; }
.nav-links > a {
  font-size: 15.5px;
  color: var(--muted);
  font-weight: 500;
  position: relative;
  transition: color .25s ease;
}
.nav-links > a:hover { color: var(--text); }
.nav-links > a.active { color: var(--text); }
.nav-links > a.active::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: -8px;
  height: 2px;
  border-radius: 2px;
  background: var(--grad-red);
}
.nav-cta { padding: 11px 24px; font-size: 14.5px; }

/* 中英切换按钮 */
.lang-toggle {
  padding: 7px 15px;
  border-radius: 999px;
  border: 1px solid var(--stroke-strong);
  background: var(--panel);
  color: var(--muted);
  font-family: var(--font);
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .04em;
  transition: color .25s ease, border-color .25s ease, background .25s ease;
}
.lang-toggle:hover { color: var(--text); border-color: var(--indigo); background: rgba(91, 108, 255, .08); }

/* 导航登录区 */
#navAuth { display: inline-flex; align-items: center; gap: 14px; }
.nav-login {
  font-size: 15px;
  color: var(--muted);
  font-weight: 500;
  transition: color .25s ease;
}
.nav-login:hover { color: var(--text); }
.nav-user { font-size: 13.5px; color: var(--text); }
.nav-logout {
  padding: 7px 14px;
  border-radius: 999px;
  border: 1px solid var(--stroke);
  background: var(--panel);
  color: var(--muted);
  font-family: var(--font);
  font-size: 12.5px;
  transition: color .25s ease, border-color .25s ease;
}
.nav-logout:hover { color: var(--red-bright); border-color: rgba(232, 40, 60, .5); }

@media (max-width: 768px) {
  .nav-links .lang-toggle { margin-top: 18px; align-self: flex-start; padding: 10px 22px; }
  .nav-links #navAuth { margin-top: 10px; align-self: flex-start; }
}

/* ---------- 登录页 ---------- */
.login-page {
  min-height: 100svh;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  position: relative;
  overflow: hidden;
}
.login-glow { position: absolute; width: 640px; height: 640px; border-radius: 50%; filter: blur(110px); opacity: .25; }
.login-glow.g1 { background: #2f3fd4; top: -220px; left: -120px; }
.login-glow.g2 { background: #6d28d9; bottom: -260px; right: -140px; opacity: .2; }
.login-card {
  position: relative;
  width: 100%;
  max-width: 420px;
  padding: 44px 40px;
  border-radius: 22px;
  border: 1px solid var(--stroke);
  background: rgba(10, 17, 32, .8);
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}
.login-card .brand { justify-content: center; margin-bottom: 30px; }
.login-card h1 { font-size: 24px; text-align: center; font-weight: 700; }
.login-card .login-sub { color: var(--muted); font-size: 14px; text-align: center; margin: 8px 0 28px; }
.login-field { display: grid; gap: 8px; margin-bottom: 18px; }
.login-field label { font-size: 14px; color: var(--muted); }
.login-field input {
  width: 100%;
  padding: 13px 16px;
  border-radius: 10px;
  border: 1px solid var(--stroke);
  background: rgba(4, 7, 14, .6);
  color: var(--text);
  font-family: inherit;
  font-size: 15px;
}
.login-field input:focus { outline: none; border-color: var(--indigo); box-shadow: 0 0 0 3px rgba(91, 108, 255, .18); }
.login-field input { transition: border-color .25s ease, box-shadow .25s ease; }
.login-btn { width: 100%; justify-content: center; font-size: 16px; padding: 14px; }

/* 注册 / 找回密码表单：无标题、紧凑行距，控制整页高度 */
.login-page.mode-compact { padding: 20px 20px 28px; }
.login-page.mode-compact .login-card { padding: 28px 36px 24px; }
.login-page.mode-compact .brand { margin-bottom: 12px; }
.login-page.mode-compact .auth-tabs { margin-bottom: 14px; }
#viewRegister .login-field, #viewForgot .login-field { margin-bottom: 10px; gap: 4px; }
#viewRegister .login-field label, #viewForgot .login-field label { font-size: 13px; }
#viewRegister .login-field input, #viewForgot .login-field input { padding: 10px 14px; font-size: 14.5px; }
#viewRegister .login-btn, #viewForgot .login-btn { padding: 11px; margin-top: 2px; }
#viewRegister .code-btn, #viewForgot .code-btn { padding: 0 14px; font-size: 13.5px; }

/* 密码行：标签 + 忘记密码链接 */
.label-row { display: flex; align-items: baseline; justify-content: space-between; }
.forgot-link {
  border: none;
  background: none;
  padding: 0;
  color: var(--muted-2);
  font-family: inherit;
  font-size: 12.5px;
  cursor: pointer;
  transition: color .25s ease;
}
.forgot-link:hover { color: var(--indigo); }

/* 找回密码视图 */
#viewForgot .login-sub { margin: 0 0 18px; }
#viewForgot .back-login { margin-top: 10px; font-size: 14px; }

/* 登录 / 注册 视图切换 */
.auth-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px;
  padding: 5px;
  margin-bottom: 24px;
  border-radius: 12px;
  border: 1px solid var(--stroke);
  background: rgba(4, 7, 14, .5);
}
.auth-tab {
  padding: 10px;
  border: none;
  border-radius: 9px;
  background: transparent;
  color: var(--muted);
  font-family: inherit;
  font-size: 14.5px;
  letter-spacing: 2px;
  cursor: pointer;
  transition: color .25s ease, background .25s ease;
}
.auth-tab:hover { color: var(--text); }
.auth-tab.active {
  background: linear-gradient(135deg, var(--indigo), var(--violet));
  color: #fff;
  font-weight: 600;
}
.auth-hidden { display: none !important; }

/* 注册验证码：输入框 + 获取按钮 */
.code-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 10px;
}
.code-row input { letter-spacing: 4px; }
.code-btn {
  padding: 0 18px;
  border-radius: 10px;
  border: 1px solid rgba(91, 108, 255, .55);
  background: rgba(91, 108, 255, .12);
  color: var(--text);
  font-family: inherit;
  font-size: 14px;
  white-space: nowrap;
  cursor: pointer;
  transition: opacity .25s ease, background .25s ease;
}
.code-btn:hover { background: rgba(91, 108, 255, .22); }
.code-btn:disabled { opacity: .55; cursor: not-allowed; background: rgba(91, 108, 255, .08); }
.field-optional {
  font-style: normal;
  font-size: 11px;
  color: var(--muted-2);
  border: 1px solid var(--stroke);
  border-radius: 5px;
  padding: 1px 6px;
  margin-left: 4px;
  vertical-align: 1px;
}

/* ---------- 后台壳（客户中心 / 工作台共用） ---------- */
.portal-top {
  position: sticky;
  top: 0;
  z-index: 50;
  border-bottom: 1px solid var(--stroke);
  background: rgba(6, 10, 19, .85);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}
.portal-top-inner {
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
}
.portal-actions { display: flex; align-items: center; gap: 14px; }
.portal-actions .lang-toggle { padding: 6px 13px; }
.portal-name { font-size: 14px; font-weight: 600; color: var(--text); }
/* 顶栏用户信息：头像（姓名首字）+ 职位 + 姓名 */
.portal-user { display: flex; align-items: center; gap: 9px; }
.portal-avatar {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 13px;
  font-weight: 700;
  color: #ffd9ad;
  background: linear-gradient(160deg, rgba(251, 146, 60, .42), rgba(251, 146, 60, .12));
  border: 1px solid rgba(251, 168, 82, .5);
  cursor: pointer;
  overflow: hidden;
  transition: filter .2s ease;
}
.portal-avatar:hover { filter: brightness(1.2); }
.portal-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.portal-position {
  font-size: 12.5px;
  color: #ffc08a;
  padding: 2px 10px;
  border-radius: 999px;
  border: 1px solid rgba(251, 168, 82, .35);
  background: rgba(251, 146, 60, .07);
  white-space: nowrap;
}
.portal-link { color: var(--muted); font-size: 14px; transition: color .25s ease; }
.portal-link:hover { color: var(--text); }

.portal { padding: 48px 0 90px; }
/* 后台页面（设置/工作台/客户中心）容器撑满屏幕，仅保留两侧 24px 边距；
   官网页面保持 1200px 居中排版不变 */
.portal .container,
.portal-top .container { max-width: none; }

.role-badge {
  display: inline-block;
  padding: 5px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: .04em;
}
.role-badge.role-admin { background: rgba(232, 40, 60, .16); color: #ff8b98; border: 1px solid rgba(232, 40, 60, .45); }
.role-badge.role-manager { background: rgba(139, 92, 246, .16); color: #c4b5fd; border: 1px solid rgba(139, 92, 246, .45); }
.role-badge.role-finance { background: rgba(91, 108, 255, .16); color: #a5b4fc; border: 1px solid rgba(91, 108, 255, .5); }
.role-badge.role-staff { background: rgba(45, 212, 191, .13); color: #5eead4; border: 1px solid rgba(45, 212, 191, .4); }
.role-badge.role-client { background: rgba(52, 211, 153, .13); color: #6ee7b7; border: 1px solid rgba(52, 211, 153, .4); }
.role-badge.role-driver { background: rgba(251, 146, 60, .15); color: #fdba74; border: 1px solid rgba(251, 146, 60, .45); }

/* 工作台数据条 */
.stat-strip { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-bottom: 40px; }
.stat-strip .stat-card { padding: 20px 18px; }

/* 工作台模块网格 */
.mod-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.mod-card {
  padding: 28px 26px;
  border-radius: var(--radius);
  border: 1px solid var(--stroke);
  background: var(--panel);
  transition: transform .3s ease, border-color .3s ease;
}
.mod-card:hover { transform: translateY(-5px); border-color: rgba(91, 108, 255, .45); }
.mod-head { display: flex; justify-content: space-between; align-items: flex-start; margin-bottom: 18px; }
.mod-card h3 { font-size: 18px; font-weight: 600; margin-bottom: 8px; }
.mod-card p { color: var(--muted); font-size: 14px; }

/* ---------- 工作台大屏风格（dark-page：工作台+考勤系统页共用）：深夜蓝氛围 + 玻璃数据卡 + 集装箱模块卡 ---------- */
/* 考勤系统页：纯深蓝渐变底（不带照片） */
.dark-page {
  background: linear-gradient(180deg, #0b1526 0%, #081123 46%, #050a14 100%);
}
/* 仪表板保留夜景港口照片背景 */
body#dashboardPage {
  background:
    radial-gradient(1100px 520px at 82% -8%, rgba(64, 108, 255, .15), transparent 62%),
    radial-gradient(900px 460px at 6% 112%, rgba(30, 92, 205, .13), transparent 60%),
    linear-gradient(180deg, rgba(8, 17, 35, .72) 0%, rgba(6, 12, 26, .62) 46%, rgba(5, 10, 20, .78) 100%),
    url("../img/beijing.jpeg?v=202609262") center / cover no-repeat,
    #060a14;
}
.dark-page .portal-top {
  background: linear-gradient(180deg, rgba(9, 20, 40, .95), rgba(7, 13, 28, .9));
  border-bottom-color: rgba(96, 140, 255, .22);
}
/* 导航栏橙色点缀：底部蓝→橙渐变细线、英文副标题、链接悬停、退出按钮 */
.dark-page .portal-top::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 1px;
  background: linear-gradient(90deg, rgba(96, 140, 255, .55), rgba(251, 146, 60, .65));
}
.dark-page .brand-text em { color: #fdba74; }
.dark-page .portal-link:hover { color: #ffc08a; }
.dark-page .nav-logout {
  color: #ffc08a;
  border-color: rgba(251, 168, 82, .45);
  background: rgba(251, 146, 60, .08);
}
.dark-page .nav-logout:hover {
  color: #ffd9ad;
  border-color: rgba(251, 168, 82, .75);
  background: rgba(251, 146, 60, .18);
}
/* 布局：集装箱竖排靠左，统计卡变窄靠右 */
#dashboardPage .portal-fixed .container {
  display: flex;
  align-items: flex-start;
  gap: 30px;
  padding-top: 14px; /* 悬停上浮和光晕超出卡片顶部时不会被滚动边界裁掉 */
}
.dark-page .portal-fixed .container::-webkit-scrollbar,
#dashboardPage .portal-fixed .container::-webkit-scrollbar { display: none; }
#dashboardPage .mod-grid {
  order: -1;
  flex: 0 0 400px;
  min-width: 0;
  grid-template-columns: 1fr;
  gap: 18px;
  margin-bottom: 0;
}
#dashboardPage .stat-strip {
  flex: 1;
  grid-template-columns: repeat(3, minmax(0, 320px));
  justify-content: start;
  align-content: start;
  margin-bottom: 0;
}
#dashboardPage .stat-card {
  gap: 12px;
  padding: 20px 22px 22px;
  border-radius: 14px;
  border: none;
  background:
    radial-gradient(120% 90% at 12% 0%, rgba(88, 130, 255, .2), transparent 55%),
    linear-gradient(165deg, rgba(30, 60, 126, .5), rgba(11, 22, 48, .55));
  box-shadow: inset 0 1px 0 rgba(190, 214, 255, .14), 0 14px 34px -18px rgba(2, 6, 18, .9);
}
#dashboardPage .stat-card .label {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #a8bcdf;
  font-size: 14px;
  letter-spacing: .04em;
}
#dashboardPage .stat-card .label .ico {
  width: 30px;
  height: 30px;
  border-radius: 9px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #ffc08a;
  background: linear-gradient(160deg, rgba(251, 146, 60, .34), rgba(251, 146, 60, .1));
  border: 1px solid rgba(251, 168, 82, .45);
}
#dashboardPage .stat-card .label .ico svg { width: 16px; height: 16px; }
#dashboardPage .stat-card .num {
  font-size: clamp(34px, 3vw, 46px);
  background: none;
  -webkit-text-fill-color: #f2f7ff;
  color: #f2f7ff;
  text-shadow: 0 0 24px rgba(96, 140, 255, .45);
}
#dashboardPage .mod-card {
  padding: 26px 26px 24px;
  border-radius: 0;
  border: none;
  aspect-ratio: 685 / 355; /* 卡片跟随图片原始比例，避免拉伸变形 */
  background:
    linear-gradient(180deg, rgba(9, 18, 38, .16) 0%, rgba(7, 14, 30, .42) 100%),
    url("../img/box.png?v=202609263") center / cover no-repeat;
  box-shadow:
    inset 0 -12px 24px -16px rgba(2, 6, 18, .85),
    0 16px 34px -18px rgba(2, 6, 18, .95);
}
#dashboardPage .mod-card:hover {
  transform: translateY(-5px);
  box-shadow:
    0 0 24px -6px rgba(251, 146, 60, .5),
    0 18px 40px -16px rgba(2, 6, 18, .95);
}
#dashboardPage .mod-card h3 { color: #f2f7ff; font-size: 19px; text-shadow: 0 1px 10px rgba(4, 10, 26, .55); }
#dashboardPage .mod-card p { color: #bccbe6; }
#dashboardPage .mod-card .icon-wrap {
  width: 50px;
  height: 50px;
  border-radius: 13px;
  color: #ffe0bd;
  background: linear-gradient(160deg, rgba(251, 146, 60, .34), rgba(251, 146, 60, .1));
  border: 1px solid rgba(251, 168, 82, .45);
  box-shadow: 0 0 20px -4px rgba(251, 146, 60, .5);
}
#dashboardPage .mod-card .icon-wrap svg { width: 24px; height: 24px; }
@media (max-width: 1100px) {
  #dashboardPage .portal-fixed .container { flex-direction: column; gap: 24px; }
  #dashboardPage .mod-grid { flex: none; grid-template-columns: 1fr 1fr; }
  #dashboardPage .stat-strip { flex: none; grid-template-columns: repeat(3, 1fr); justify-content: start; }
  /* 窄屏下卡片高度回归内容高度，图片完整等比显示不裁切 */
  #dashboardPage .mod-card { aspect-ratio: auto; background-size: contain; }
}
@media (max-width: 900px) {
  #dashboardPage .mod-grid { grid-template-columns: 1fr 1fr; }
  #dashboardPage .stat-strip { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  #dashboardPage .mod-grid { grid-template-columns: 1fr; }
  #dashboardPage .stat-strip { grid-template-columns: 1fr; }
}

/* 通用数据表格 */
.data-panel {
  border-radius: var(--radius);
  border: 1px solid var(--stroke);
  background: var(--panel);
  padding: 26px 28px;
  margin-bottom: 24px;
}
.data-panel-head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 18px; gap: 12px; flex-wrap: wrap; }
.data-panel-head h2 { font-size: 19px; font-weight: 600; }
/* 设置页面板：操作区撑满整行，"新增"按钮推到最右 */
#settingsPage .data-panel-head .panel-actions { flex: 1; }
#settingsPage .data-panel-head .btn:last-child { margin-left: auto; }
.data-table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.data-table th, .data-table td { text-align: left; padding: 13px 14px; border-bottom: 1px solid var(--stroke); }
.data-table th { color: var(--muted-2); font-weight: 500; font-size: 13px; letter-spacing: .04em; white-space: nowrap; }
.data-table td { color: var(--text); }
.data-table tr:last-child td { border-bottom: none; }
.data-table .mono { font-family: var(--font); letter-spacing: .03em; color: var(--indigo); font-weight: 600; }

.status-chip { display: inline-block; padding: 4px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 600; }
.status-chip.transit { background: rgba(91, 108, 255, .15); color: #a5b4fc; }
.status-chip.done { background: rgba(52, 211, 153, .13); color: #6ee7b7; }
.status-chip.quoting { background: rgba(251, 191, 36, .13); color: #fcd34d; }
.status-chip.quoted { background: rgba(139, 92, 246, .15); color: #c4b5fd; }
.status-chip.on { background: rgba(52, 211, 153, .13); color: #6ee7b7; }
.status-chip.off { background: rgba(148, 163, 184, .15); color: #94a3b8; }

/* 系统内置标记（职位管理等字典里的内置项） */
.sys-tag { display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 600; background: rgba(91, 108, 255, .15); color: #a5b4fc; }

/* ---------- 系统设置页 ---------- */
.btn-sm { padding: 9px 18px; font-size: 13.5px; }

.user-form {
  margin-bottom: 26px;
  padding: 22px;
  border: 1px solid var(--stroke);
  border-radius: var(--radius-sm);
  background: rgba(4, 7, 14, .45);
}

/* 设置页：跟随所编辑用户的权限区块 */
/* 权限管理：职位筛选行（无边框紧凑布局） */
.perm-filter { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.perm-filter label { font-size: 14px; color: var(--muted); }
.perm-filter select { width: 220px; padding: 9px 14px; font-size: 14px; border-radius: 10px; border: 1px solid var(--stroke); background-color: rgba(4, 7, 14, .6); color: var(--text); }
/* 大模块：组标题醒目 + 勾选项加粗放大；小模块：缩进 + 左侧竖线 + 字小色淡 */
.perm-list { display: grid; gap: 22px; margin-bottom: 16px; }
.perm-group-title { font-size: 15px; font-weight: 700; color: var(--text); margin-bottom: 12px; }
.perm-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px 20px; }
.perm-sub-title { font-size: 13px; color: var(--muted); margin-top: 10px; }
.perm-group > .perm-grid:not(.perm-sub-grid) > .perm-item { font-size: 15.5px; font-weight: 600; gap: 10px; }
.perm-group > .perm-grid:not(.perm-sub-grid) > .perm-item input[type="checkbox"] { width: 19px; height: 19px; }
.perm-sub-grid { margin: 12px 0 0 9px; padding-left: 16px; border-left: 2px solid var(--stroke); }
.perm-sub-grid .perm-item { font-size: 13.5px; color: var(--muted); }
.perm-sub-grid .perm-item input[type="checkbox"] { width: 15px; height: 15px; }
.perm-item { display: flex; align-items: center; gap: 9px; font-size: 14.5px; color: var(--text); cursor: pointer; }
.perm-item input[type="checkbox"] { width: 17px; height: 17px; accent-color: var(--indigo); cursor: pointer; }

/* 设置页：员工工资区块 */
.salary-current {
  padding: 10px 16px;
  border-radius: 10px;
  border: 1px solid rgba(52, 211, 153, .35);
  background: rgba(52, 211, 153, .07);
  color: #6ee7b7;
  font-size: 14px;
  line-height: 1.8;
}
.salary-current b { font-size: 16px; letter-spacing: .02em; }
/* 三个输入框等宽一行，备注跨满整行（宽度 = 上面三框合计） */
.salary-fields { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.salary-fields .form-field:last-child { grid-column: 1 / -1; }
/* 数字输入框去掉上下微调按钮 */
.salary-fields input[type="number"]::-webkit-outer-spin-button,
.salary-fields input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.salary-fields input[type="number"] { -moz-appearance: textfield; appearance: textfield; }
.salary-history { border-top: 1px dashed var(--stroke); padding-top: 14px; }
.salary-history-head { font-size: 14px; font-weight: 600; margin-bottom: 10px; }
@media (max-width: 600px) {
  .salary-fields { grid-template-columns: 1fr; }
}

.btn-ghost.danger { border-color: rgba(232, 40, 60, .6); color: #ff8b98; background: rgba(232, 40, 60, .1); }

/* 日期输入：深色主题适配 + 日历选择器视觉提示 */
input[type="date"] { color-scheme: dark; cursor: pointer; }
input[type="date"]::-webkit-calendar-picker-indicator {
  filter: invert(.72);
  cursor: pointer;
  opacity: .85;
}
input[type="date"]::-webkit-calendar-picker-indicator:hover { opacity: 1; }

/* 员工表单：部门变更历史 */
.dept-history-head { font-size: 14px; font-weight: 600; margin-bottom: 10px; }

/* 部门下拉多选（自定义组件） */
.dept-dd { position: relative; }
.dept-dd-toggle {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border-radius: 10px;
  border: 1px solid var(--stroke);
  background: rgba(4, 7, 14, .6);
  color: var(--text);
  font-family: var(--font);
  font-size: 15px;
  cursor: pointer;
  text-align: left;
}
.dept-dd-toggle:hover { border-color: var(--stroke-strong); }
.dept-dd-arrow { color: var(--muted); font-size: 12px; }
.dept-dd-panel {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 30;
  max-height: 220px;
  overflow-y: auto;
  border-radius: 10px;
  border: 1px solid var(--stroke-strong);
  background: #0c1220;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .55);
  padding: 6px;
}
.dept-opt {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 9px 12px;
  border-radius: 8px;
  cursor: pointer;
  color: var(--muted);
  font-size: 14.5px;
}
.dept-opt:hover { background: rgba(91, 108, 255, .15); color: var(--text); }
.dept-opt.on { color: var(--text); background: rgba(91, 108, 255, .18); }
.dept-opt .ck { width: 16px; text-align: center; color: var(--indigo); font-weight: 700; visibility: hidden; }
.dept-opt.on .ck { visibility: visible; }

/* 员工附件：缩略图一行 + 加号 */
.file-thumbs { display: flex; gap: 10px; flex-wrap: wrap; }
.file-thumb {
  width: 76px; height: 76px;
  border-radius: 10px;
  border: 1px solid var(--stroke);
  background: var(--bg-soft);
  position: relative;
  overflow: hidden;
  display: grid;
  place-items: center;
  cursor: pointer;
}
.file-thumb img { width: 100%; height: 100%; object-fit: cover; }
.file-thumb .file-ext {
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .05em;
  color: var(--red-bright);
  background: rgba(232, 40, 60, .1);
  padding: 4px 8px;
  border-radius: 6px;
}
.file-thumb .file-del {
  position: absolute;
  top: 2px; right: 2px;
  width: 20px; height: 20px;
  border-radius: 50%;
  border: none;
  background: rgba(0, 0, 0, .65);
  color: #fff;
  font-size: 12px;
  line-height: 1;
  cursor: pointer;
  display: grid;
  place-items: center;
}
.file-thumb .file-del:hover { background: rgba(232, 40, 60, .85); }
.file-add {
  width: 76px; height: 76px;
  border-radius: 10px;
  border: 1px dashed var(--stroke-strong);
  background: rgba(148, 163, 184, .05);
  color: var(--muted);
  font-size: 30px;
  font-weight: 300;
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: border-color .25s ease, color .25s ease;
}
.file-add:hover { border-color: var(--indigo); color: var(--indigo); }

/* 员工证件上传 */
.user-form input[type="file"] { color-scheme: dark; color: var(--text); font-size: 13px; padding: 9px; }
.file-now { font-size: 12.5px; color: var(--muted); }
.file-now a { color: var(--indigo); }

/* 通用：头部操作按钮组 + 表格行点选 */
.panel-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.btn:disabled { opacity: .45; cursor: not-allowed; transform: none; box-shadow: none; }
.data-table tbody tr[data-id] { cursor: pointer; transition: background .2s ease; }
.data-table tbody tr[data-id]:hover { background: rgba(148, 163, 184, .05); }
.data-table tbody tr.row-selected,
.data-table tbody tr.row-selected:hover { background: rgba(91, 108, 255, .12); box-shadow: inset 3px 0 0 var(--indigo); }

/* 设置页：员工/客户账号标签 */
.user-tabs { display: flex; gap: 10px; margin-bottom: 18px; flex-wrap: wrap; }
.user-tab {
  padding: 10px 22px;
  border-radius: 999px;
  border: 1px solid var(--stroke);
  background: var(--panel);
  color: var(--muted);
  font-family: var(--font);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  transition: color .25s ease, border-color .25s ease, background .25s ease;
}
.user-tab:hover { color: var(--text); border-color: var(--stroke-strong); }
.user-tab.active { color: var(--text); border-color: rgba(91, 108, 255, .5); background: rgba(91, 108, 255, .12); }
.user-tab .tab-count { margin-left: 4px; font-size: 12px; color: var(--muted-2); }
.user-tab.active .tab-count { color: #a5b4fc; }

/* 设置页：左侧分类菜单 + 右侧内容区（新增设置项：菜单加按钮 + 内容区加 section） */
.settings-layout { display: grid; grid-template-columns: 230px 1fr; gap: 26px; align-items: start; }

/* 设置页固定外壳：页面整体不滚动，左侧菜单完全固定，右侧内容区独立滚动 */
body:has(> main.portal-fixed) { display: flex; flex-direction: column; height: 100svh; overflow: hidden; }
.portal-fixed { flex: 1; min-height: 0; padding: 20px 0 0; }
.portal-fixed .container { height: 100%; overflow-y: auto; padding-bottom: 30px; }
/* 设置页容器不直接滚，由内部 .settings-content 滚动 */
.portal-fixed .container:has(.settings-layout) { display: flex; flex-direction: column; overflow: hidden; padding-bottom: 0; }
.portal-fixed .settings-layout { flex: 1; min-height: 0; align-items: stretch; }
.portal-fixed .settings-content { overflow-y: auto; min-height: 0; padding: 2px 8px 30px 0; }
/* 列表固定高度：面板撑满内容区剩余高度，列表在固定区域内滚动、表头吸附固定；
   不加 min-height:0 —— 面板最小只能压到内容高度，工资/司机等子面板打开时超出部分由 .settings-content 滚动；
   历史记录等次要列表用 .hist 限高滚动 */
#settingsPage .settings-content { display: flex; flex-direction: column; }
#settingsPage .settings-cat { flex: 1 1 auto; display: flex; flex-direction: column; }
#settingsPage .settings-cat > .data-panel:first-child { flex: 1 1 auto; display: flex; flex-direction: column; }
#settingsPage .table-scroll { flex: 1 1 0; min-height: 150px; overflow: auto; scrollbar-width: none; }
/* 隐藏滚动条但保留滚轮/触控板滚动，与考勤页 .att-panel-scroll 做法一致 */
#settingsPage .table-scroll::-webkit-scrollbar { display: none; }
#settingsPage .table-scroll.hist { flex: 0 0 auto; max-height: 240px; }
/* 列表底部贴近屏幕底部：去掉主面板的下外边距、收窄底部内边距，只留 10px 呼吸位；
   主面板与下方子面板（工资/司机/挂车）之间改用上外边距保持间隔 */
#settingsPage .settings-content { padding-bottom: 10px; }
#settingsPage .settings-cat > .data-panel:first-child { margin-bottom: 0; padding-bottom: 10px; }
#settingsPage .settings-cat > .data-panel:not(:first-child) { margin-top: 24px; }
#settingsPage .table-scroll .data-table { border-collapse: separate; border-spacing: 0; }
#settingsPage .table-scroll .data-table thead th {
  position: sticky;
  top: 0;
  z-index: 5;
  /* --panel 本身是半透明白，直接用会透出滚动的行：用不透明的页面底色叠加同款半透明白，外观一致且不透底 */
  background-color: var(--bg);
  background-image: linear-gradient(var(--panel), var(--panel));
}
.settings-nav { display: flex; flex-direction: column; gap: 8px; }
/* 底部"返回工作台"入口靠 margin-top:auto 推到菜单最下方（窄屏横排时自然回到行内） */
.settings-nav .settings-nav-back { margin-top: auto; }
.settings-nav-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 13px 18px;
  border-radius: 12px;
  border: 1px solid var(--stroke);
  background: var(--panel);
  color: var(--muted);
  font-family: var(--font);
  font-size: 14.5px;
  font-weight: 500;
  text-align: left;
  cursor: pointer;
  transition: color .25s ease, border-color .25s ease, background .25s ease;
}
.settings-nav-item:hover { color: var(--text); border-color: var(--stroke-strong); }
.settings-nav-item.active { color: var(--text); border-color: rgba(91, 108, 255, .5); background: rgba(91, 108, 255, .1); }
.settings-nav-item.disabled { opacity: .55; cursor: not-allowed; }
.settings-nav-item.disabled:hover { color: var(--muted); border-color: var(--stroke); }
.settings-nav-item .soon { font-size: 11px; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--stroke-strong); color: var(--muted-2); white-space: nowrap; }
@media (max-width: 768px) {
  .settings-layout { grid-template-columns: 1fr; gap: 18px; }
  .settings-nav { position: static; flex-direction: row; justify-content: start; overflow-x: auto; padding-bottom: 4px; }
  .settings-nav-item { white-space: nowrap; }
}

@media (max-width: 900px) {
  .mod-grid { grid-template-columns: 1fr 1fr; }
  .stat-strip { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 600px) {
  .mod-grid { grid-template-columns: 1fr; }
  .nav-user { display: none; }
  .data-table th, .data-table td { padding: 10px 8px; font-size: 13px; }
}

.nav-burger {
  display: none;
  width: 42px;
  height: 42px;
  border: 1px solid var(--stroke);
  border-radius: 10px;
  background: var(--panel);
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
}
.nav-burger span {
  width: 18px;
  height: 2px;
  background: var(--text);
  border-radius: 2px;
  transition: transform .3s ease, opacity .3s ease;
}
.nav-burger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-burger.open span:nth-child(2) { opacity: 0; }
.nav-burger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* ---------- Hero ---------- */
.hero {
  min-height: 100svh;
  display: flex;
  align-items: center;
  padding: calc(var(--header-h) + 60px) 0 90px;
  overflow: hidden;
}

/* 背景：点阵地图（JS 注入）+ 渐变光晕 + 细网格 */
.hero-bg { position: absolute; inset: 0; pointer-events: none; }
.hero-map {
  position: absolute;
  left: 50%;
  top: 54%;
  transform: translate(-50%, -50%);
  width: min(1500px, 160vw);
  opacity: .16;
}
.hero-glow {
  position: absolute;
  width: 760px;
  height: 760px;
  border-radius: 50%;
  filter: blur(120px);
  opacity: .28;
}
.hero-glow.g1 { background: #2f3fd4; top: -280px; left: -160px; }
.hero-glow.g2 { background: #6d28d9; bottom: -320px; right: -180px; opacity: .22; }
.hero-glow.g3 { background: #b91c3c; top: 30%; right: 12%; width: 420px; height: 420px; opacity: .12; }
.hero-grid {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(148, 163, 184, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148, 163, 184, .05) 1px, transparent 1px);
  background-size: 72px 72px;
  -webkit-mask-image: radial-gradient(ellipse 90% 70% at 50% 40%, #000 30%, transparent 75%);
  mask-image: radial-gradient(ellipse 90% 70% at 50% 40%, #000 30%, transparent 75%);
}

.hero-inner { position: relative; text-align: center; max-width: 980px; margin: 0 auto; }

.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 9px 20px;
  border-radius: 999px;
  border: 1px solid var(--stroke);
  background: var(--panel);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  font-size: 13.5px;
  color: var(--muted);
  margin-bottom: 30px;
}
.hero-badge .dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #34d399;
  box-shadow: 0 0 10px #34d399;
  animation: pulse-dot 2s infinite;
}
@keyframes pulse-dot { 50% { opacity: .4; } }

.hero h1 {
  font-size: clamp(46px, 8.4vw, 96px);
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: .01em;
}
.hero h1 .grad {
  background: var(--grad-text);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}

.hero-sub {
  max-width: 700px;
  margin: 26px auto 0;
  color: var(--muted);
  font-size: clamp(16px, 2vw, 19px);
}

.hero-actions { display: flex; gap: 16px; justify-content: center; margin-top: 42px; flex-wrap: wrap; }

/* Hero 底部悬浮数据卡 */
.hero-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  max-width: 920px;
  margin: 78px auto 0;
}
.stat-card {
  padding: 24px 12px;
  border-radius: var(--radius);
  border: 1px solid var(--stroke);
  background: rgba(10, 17, 32, .55);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  transition: transform .3s ease, border-color .3s ease;
}
.stat-card:hover { transform: translateY(-5px); border-color: rgba(91, 108, 255, .5); }
.stat-card .num {
  font-size: clamp(28px, 3.4vw, 40px);
  font-weight: 700;
  letter-spacing: -.01em;
  background: var(--grad-text);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.stat-card .num sup { font-size: .55em; }
.stat-card .label { color: var(--muted); font-size: 14px; margin-top: 4px; }

/* ---------- 跑马灯 ---------- */
.marquee {
  padding: 30px 0;
  border-top: 1px solid var(--stroke);
  border-bottom: 1px solid var(--stroke);
  background: rgba(255, 255, 255, .015);
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 12%, #000 88%, transparent);
}
.marquee-track {
  display: flex;
  gap: 56px;
  width: max-content;
  animation: marquee 30s linear infinite;
}
.marquee:hover .marquee-track { animation-play-state: paused; }
.marquee-track span {
  font-size: 17px;
  font-weight: 500;
  color: var(--muted);
  letter-spacing: .06em;
  display: flex;
  align-items: center;
  gap: 56px;
  white-space: nowrap;
}
.marquee-track span::after {
  content: '';
  width: 7px; height: 7px;
  border-radius: 2px;
  background: var(--red);
  transform: rotate(45deg);
  opacity: .8;
}
@keyframes marquee { to { transform: translateX(-50%); } }

/* ---------- 服务便当网格 ---------- */
.services-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.service-card {
  position: relative;
  padding: 34px 30px;
  border-radius: var(--radius);
  border: 1px solid var(--stroke);
  background: var(--panel);
  overflow: hidden;
  transition: transform .35s ease, border-color .35s ease, background .35s ease;
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.service-card::before {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(420px circle at var(--mx, 50%) var(--my, 0%), rgba(91, 108, 255, .12), transparent 60%);
  opacity: 0;
  transition: opacity .35s ease;
  pointer-events: none;
}
.service-card:hover { transform: translateY(-6px); border-color: rgba(91, 108, 255, .45); background: var(--panel-strong); }
.service-card:hover::before { opacity: 1; }

.service-card.wide { grid-column: span 2; }

.icon-wrap {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  background: var(--grad);
  display: grid;
  place-items: center;
  color: #fff;
  box-shadow: 0 8px 22px -6px rgba(91, 108, 255, .55);
  flex-shrink: 0;
}
.icon-wrap svg { width: 27px; height: 27px; }
.service-card.wide .icon-wrap { width: 62px; height: 62px; }

.service-card h3 { font-size: 21px; font-weight: 600; }
.service-card p { color: var(--muted); font-size: 15px; flex: 1; }
.service-card .more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--indigo);
  font-size: 14.5px;
  font-weight: 600;
}
.service-card .more svg { width: 15px; height: 15px; transition: transform .25s ease; }
.service-card:hover .more svg { transform: translateX(4px); }

.service-tag {
  position: absolute;
  top: 26px; right: 26px;
  font-size: 11px;
  letter-spacing: .16em;
  color: var(--muted-2);
  text-transform: uppercase;
}

/* 宽卡内的装饰航线图 */
.route-art { position: absolute; right: -10px; bottom: -20px; width: 300px; opacity: .5; pointer-events: none; }

/* 服务网格末尾的"定制方案"卡 */
.service-card.cta-card {
  border-style: dashed;
  border-color: rgba(91, 108, 255, .45);
  background: rgba(91, 108, 255, .06);
  justify-content: center;
}
.service-card.cta-card h3 { font-size: 20px; }
.service-card.cta-card p { flex: none; margin-bottom: 10px; }
.service-card.cta-card .btn { align-self: flex-start; }

/* ---------- 全球网络（点阵地图） ---------- */
.network-wrap {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 48px;
  align-items: center;
}
.network-info h2 { margin-bottom: 0; }
.network-points { margin-top: 30px; display: grid; gap: 14px; }
.network-points li {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  color: var(--muted);
  font-size: 15px;
}
.network-points li svg { width: 20px; height: 20px; color: var(--red-bright); flex-shrink: 0; margin-top: 3px; }
.network-points li strong { color: var(--text); font-weight: 600; }

.map-panel {
  position: relative;
  border-radius: var(--radius);
  border: 1px solid var(--stroke);
  background:
    radial-gradient(1000px 500px at 60% 30%, rgba(47, 63, 212, .12), transparent 65%),
    var(--bg-soft);
  padding: 28px;
  overflow: hidden;
}
.map-panel svg { width: 100%; height: auto; display: block; }
.map-legend {
  display: flex;
  gap: 26px;
  justify-content: center;
  margin-top: 16px;
  color: var(--muted);
  font-size: 13px;
}
.map-legend i {
  display: inline-block;
  width: 8px; height: 8px;
  border-radius: 50%;
  margin-right: 7px;
}
.map-legend .lg-node i { background: var(--red-bright); }
.map-legend .lg-route i { background: var(--indigo); }

/* SVG 地图内的动画元素样式 */
.map-node { fill: var(--red-bright); }
.map-node-ring {
  fill: none;
  stroke: var(--red-bright);
  stroke-width: 1.4;
  opacity: 0;
  animation: node-ring 2.6s ease-out infinite;
  transform-box: fill-box;
  transform-origin: center;
}
@keyframes node-ring {
  0% { transform: scale(.4); opacity: .9; }
  70%, 100% { transform: scale(2.6); opacity: 0; }
}
.map-route {
  fill: none;
  stroke: url(#routeGrad);
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-dasharray: 5 9;
  animation: route-flow 1.6s linear infinite;
  opacity: .85;
}
@keyframes route-flow { to { stroke-dashoffset: -28; } }
.map-plane { fill: #fff; opacity: .95; }

/* ---------- 服务流程 ---------- */
.process-track {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 18px;
  counter-reset: step;
}
.step {
  position: relative;
  padding: 28px 22px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--stroke);
  background: var(--panel);
  transition: transform .3s ease, border-color .3s ease;
}
.step:hover { transform: translateY(-5px); border-color: rgba(139, 92, 246, .45); }
.step-num {
  font-size: 40px;
  font-weight: 700;
  line-height: 1;
  background: var(--grad);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  opacity: .95;
}
.step h3 { font-size: 17.5px; font-weight: 600; margin: 16px 0 8px; }
.step p { color: var(--muted); font-size: 14px; line-height: 1.65; }
.step::after {
  content: '';
  position: absolute;
  top: 44px;
  right: -14px;
  width: 10px;
  height: 10px;
  border-top: 2px solid var(--stroke-strong);
  border-right: 2px solid var(--stroke-strong);
  transform: rotate(45deg);
}
.step:last-child::after { display: none; }

/* ---------- 核心优势 ---------- */
.adv-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.adv-card {
  padding: 34px 28px;
  border-radius: var(--radius);
  border: 1px solid var(--stroke);
  background: var(--panel);
  transition: transform .3s ease, border-color .3s ease;
}
.adv-card:hover { transform: translateY(-6px); border-color: rgba(91, 108, 255, .45); }
.adv-card .icon-wrap { margin-bottom: 20px; }
.adv-card h3 { font-size: 18.5px; font-weight: 600; margin-bottom: 10px; }
.adv-card p { color: var(--muted); font-size: 14.5px; }

/* ---------- 客户评价 ---------- */
.quote-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
.quote-card {
  padding: 32px 30px;
  border-radius: var(--radius);
  border: 1px solid var(--stroke);
  background: var(--panel);
  display: flex;
  flex-direction: column;
  gap: 20px;
  transition: transform .3s ease, border-color .3s ease;
}
.quote-card:hover { transform: translateY(-6px); border-color: var(--stroke-strong); }
.quote-card .mark {
  font-size: 46px;
  font-weight: 700;
  line-height: .6;
  background: var(--grad-red);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
  font-family: Georgia, serif;
}
.quote-card blockquote { color: var(--muted); font-size: 15px; flex: 1; }
.quote-who strong { display: block; font-size: 15px; }
.quote-who span { color: var(--muted-2); font-size: 13px; }

/* ---------- FAQ ---------- */
.faq-list { max-width: 800px; margin: 0 auto; display: grid; gap: 14px; }
.faq-item {
  border: 1px solid var(--stroke);
  border-radius: var(--radius-sm);
  background: var(--panel);
  overflow: hidden;
  transition: border-color .3s ease;
}
.faq-item[open] { border-color: rgba(91, 108, 255, .45); }
.faq-item summary {
  list-style: none;
  cursor: pointer;
  padding: 22px 26px;
  font-size: 16.5px;
  font-weight: 600;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 20px;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary .chev {
  flex-shrink: 0;
  width: 30px; height: 30px;
  border-radius: 50%;
  border: 1px solid var(--stroke-strong);
  display: grid;
  place-items: center;
  transition: transform .3s ease, background .3s ease;
}
.faq-item summary .chev svg { width: 14px; height: 14px; }
.faq-item[open] summary .chev { transform: rotate(180deg); background: var(--grad); border-color: transparent; color: #fff; }
.faq-item .faq-body { padding: 0 26px 24px; color: var(--muted); font-size: 15px; }

/* ---------- CTA 大区 ---------- */
.cta-band {
  position: relative;
  overflow: hidden;
  border-radius: 28px;
  border: 1px solid rgba(91, 108, 255, .3);
  padding: 90px 40px;
  text-align: center;
  background:
    radial-gradient(700px 300px at 20% 0%, rgba(47, 63, 212, .3), transparent 60%),
    radial-gradient(600px 300px at 85% 100%, rgba(190, 24, 60, .22), transparent 60%),
    var(--bg-soft);
}
.cta-band h2 { font-size: clamp(30px, 4.4vw, 50px); font-weight: 700; line-height: 1.25; }
.cta-band p { color: var(--muted); margin: 18px auto 36px; max-width: 560px; font-size: 17px; }

/* ---------- 页脚 ---------- */
.site-footer {
  border-top: 1px solid var(--stroke);
  background: #04070e;
  padding: 72px 0 0;
  margin-top: 110px;
}
.footer-grid {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1.3fr;
  gap: 44px;
  padding-bottom: 56px;
}
.footer-brand p { color: var(--muted); font-size: 14.5px; margin-top: 20px; max-width: 300px; }
.footer-col h4 {
  font-size: 13px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--muted-2);
  margin-bottom: 22px;
  font-weight: 600;
}
.footer-col ul { display: grid; gap: 13px; }
.footer-col a { color: var(--muted); font-size: 14.5px; transition: color .25s ease; }
.footer-col a:hover { color: var(--text); }
.footer-col .contact-line { display: flex; gap: 10px; align-items: flex-start; color: var(--muted); font-size: 14.5px; }
.footer-col .contact-line svg { width: 17px; height: 17px; color: var(--indigo); flex-shrink: 0; margin-top: 4px; }
.footer-bottom {
  border-top: 1px solid var(--stroke);
  padding: 24px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  color: var(--muted-2);
  font-size: 13px;
}

/* ---------- 内页 Hero ---------- */
.page-hero {
  padding: calc(var(--header-h) + 90px) 0 80px;
  text-align: center;
  position: relative;
  overflow: hidden;
}
.page-hero::after {
  content: '';
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(rgba(148, 163, 184, .05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148, 163, 184, .05) 1px, transparent 1px);
  background-size: 72px 72px;
  -webkit-mask-image: radial-gradient(ellipse 70% 80% at 50% 20%, #000 20%, transparent 70%);
  mask-image: radial-gradient(ellipse 70% 80% at 50% 20%, #000 20%, transparent 70%);
  pointer-events: none;
}
.page-hero .crumb { color: var(--muted-2); font-size: 13.5px; letter-spacing: .1em; margin-bottom: 18px; text-transform: uppercase; }
.page-hero h1 { font-size: clamp(38px, 6vw, 64px); font-weight: 700; }
.page-hero .grad {
  background: var(--grad-text);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.page-hero p { color: var(--muted); max-width: 600px; margin: 20px auto 0; font-size: 17px; }

/* ---------- 服务详情（交替布局） ---------- */
.service-detail {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
  padding: 64px 0;
}
.service-detail:nth-child(even) { direction: rtl; }
.service-detail:nth-child(even) > * { direction: ltr; }

.service-detail .num-tag {
  font-size: 13px;
  letter-spacing: .2em;
  color: var(--red-bright);
  font-weight: 600;
  display: block;
  margin-bottom: 14px;
}
.service-detail h2 { font-size: clamp(26px, 3.4vw, 38px); font-weight: 600; margin-bottom: 18px; }
.service-detail .desc { color: var(--muted); font-size: 15.5px; margin-bottom: 26px; }
.service-detail .feats { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 20px; margin-bottom: 30px; }
.service-detail .feats li {
  display: flex;
  gap: 9px;
  align-items: center;
  color: var(--muted);
  font-size: 14.5px;
}
.service-detail .feats li::before {
  content: '';
  width: 6px; height: 6px;
  border-radius: 50%;
  background: var(--red-bright);
  flex-shrink: 0;
  box-shadow: 0 0 8px rgba(232, 40, 60, .8);
}

.service-visual {
  border-radius: 20px;
  border: 1px solid var(--stroke);
  background:
    radial-gradient(500px 260px at 70% 20%, rgba(47, 63, 212, .18), transparent 65%),
    var(--bg-soft);
  padding: 44px;
  display: grid;
  place-items: center;
  min-height: 320px;
}
.service-visual svg { width: 100%; max-width: 380px; height: auto; }

/* 参数卡头部（图标 + 英文服务名） */
.spec-head { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; }
.spec-head .icon-wrap { width: 48px; height: 48px; border-radius: 13px; }
.spec-head .icon-wrap svg { width: 22px; height: 22px; }
.spec-head strong { font-size: 15px; letter-spacing: .1em; }
.spec-head em { display: block; font-style: normal; color: var(--muted-2); font-size: 12px; letter-spacing: .08em; margin-top: 2px; }

.spec-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 14.5px;
  margin-top: 8px;
}
.spec-table caption {
  text-align: left;
  font-size: 13px;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--muted-2);
  padding-bottom: 14px;
}
.spec-table th, .spec-table td {
  text-align: left;
  padding: 13px 16px;
  border-bottom: 1px solid var(--stroke);
}
.spec-table th { color: var(--text); font-weight: 600; white-space: nowrap; }
.spec-table td { color: var(--muted); }
.spec-table tr:first-child th, .spec-table tr:first-child td { border-top: 1px solid var(--stroke); }

/* ---------- 关于页：时间线 ---------- */
.timeline { position: relative; max-width: 820px; margin: 0 auto; }
.timeline::before {
  content: '';
  position: absolute;
  left: 9px;
  top: 6px;
  bottom: 6px;
  width: 2px;
  background: linear-gradient(180deg, var(--indigo), var(--violet), var(--red));
  opacity: .35;
}
.timeline li { position: relative; padding: 0 0 40px 48px; }
.timeline li:last-child { padding-bottom: 0; }
.timeline li::before {
  content: '';
  position: absolute;
  left: 2px;
  top: 7px;
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background: var(--bg);
  border: 3px solid var(--indigo);
  box-shadow: 0 0 12px rgba(91, 108, 255, .6);
}
.timeline li:last-child::before { border-color: var(--red); box-shadow: 0 0 12px rgba(232, 40, 60, .6); }
.timeline .year {
  font-size: 20px;
  font-weight: 700;
  background: var(--grad-text);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  color: transparent;
}
.timeline h3 { font-size: 17.5px; font-weight: 600; margin: 8px 0 6px; }
.timeline p { color: var(--muted); font-size: 14.5px; }

/* ---------- 价值观 ---------- */
.value-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.value-card {
  padding: 32px 26px;
  border-radius: var(--radius);
  border: 1px solid var(--stroke);
  background: var(--panel);
  text-align: center;
  transition: transform .3s ease, border-color .3s ease;
}
.value-card:hover { transform: translateY(-6px); border-color: rgba(139, 92, 246, .45); }
.value-card .icon-wrap { margin: 0 auto 18px; }
.value-card h3 { font-size: 18px; margin-bottom: 8px; }
.value-card p { color: var(--muted); font-size: 14px; }

/* ---------- 联系页 ---------- */
.contact-wrap {
  display: grid;
  grid-template-columns: 380px 1fr;
  gap: 40px;
  align-items: start;
}
.contact-cards { display: grid; gap: 16px; }
.contact-card {
  padding: 24px 26px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--stroke);
  background: var(--panel);
  display: flex;
  gap: 16px;
  align-items: flex-start;
  transition: border-color .3s ease, transform .3s ease;
}
.contact-card:hover { border-color: rgba(91, 108, 255, .45); transform: translateX(4px); }
.contact-card .icon-wrap { width: 46px; height: 46px; border-radius: 12px; }
.contact-card .icon-wrap svg { width: 21px; height: 21px; }
.contact-card h3 { font-size: 15.5px; margin-bottom: 3px; }
.contact-card p { color: var(--muted); font-size: 14px; }

.quote-form {
  padding: 40px;
  border-radius: var(--radius);
  border: 1px solid var(--stroke);
  background: var(--panel);
}
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
/* 一行平铺的字段布局（职位管理等字段少的表单），空间不够时自动换行 */
.form-grid.cols-auto { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
/* 部门多选下拉（用户表单"可查看部门"，外观与其他输入框一致） */
.dept-select { position: relative; }
.dept-select-btn {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 13px 16px;
  border-radius: 10px;
  border: 1px solid var(--stroke);
  background: rgba(4, 7, 14, .6);
  color: var(--text);
  font-family: inherit;
  font-size: 15px;
  text-align: left;
  cursor: pointer;
  transition: border-color .25s ease, box-shadow .25s ease;
}
.dept-select-btn::after { content: '▾'; color: var(--muted); font-size: 13px; }
.dept-select-btn:hover { border-color: var(--stroke-strong); }
.dept-select.open .dept-select-btn { border-color: var(--indigo); box-shadow: 0 0 0 3px rgba(91, 108, 255, .18); }
.dept-select-panel {
  position: absolute;
  top: calc(100% + 6px);
  left: 0;
  right: 0;
  z-index: 40;
  max-height: 240px;
  overflow-y: auto;
  padding: 10px 14px;
  border-radius: 10px;
  border: 1px solid var(--stroke);
  background: #0b1322;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .45);
  display: grid;
  gap: 4px;
}
.dept-select-panel .perm-item { padding: 5px 0; }

/* 四个字段一行（用户表单：姓名/用户名/密码/职位），空间不够时降为两列 / 一列 */
.form-grid.cols-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1150px) { .form-grid.cols-4 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 700px) { .form-grid.cols-4 { grid-template-columns: 1fr; } }
.form-field { display: grid; gap: 8px; }
.form-field.full { grid-column: 1 / -1; }
.form-field label { font-size: 14px; color: var(--muted); font-weight: 500; }
.form-field label b { color: var(--red-bright); font-weight: 400; }
.form-field input,
.form-field select,
.form-field textarea {
  width: 100%;
  padding: 14px 16px;
  border-radius: 10px;
  border: 1px solid var(--stroke);
  background: rgba(4, 7, 14, .6);
  color: var(--text);
  font-family: inherit;
  font-size: 15px;
  transition: border-color .25s ease, box-shadow .25s ease;
}
.form-field select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%); background-position: calc(100% - 22px) 50%, calc(100% - 16px) 50%; background-size: 6px 6px; background-repeat: no-repeat; }
.form-field textarea { min-height: 130px; resize: vertical; }
.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus {
  outline: none;
  border-color: var(--indigo);
  box-shadow: 0 0 0 3px rgba(91, 108, 255, .18);
}
.form-field.error input,
.form-field.error textarea { border-color: var(--red); }
.form-field .err-msg { color: var(--red-bright); font-size: 12.5px; display: none; }
.form-field.error .err-msg { display: block; }
.form-foot { grid-column: 1 / -1; display: flex; align-items: center; gap: 18px; flex-wrap: wrap; margin-top: 6px; }
.form-tip { color: var(--muted-2); font-size: 13px; }

/* ---------- 统一操作提示（全站共用，js/main.js 的 YYToast 触发） ----------
   从屏幕右侧边缘外滑入，停在顶栏下方，停留 2.8 秒后向右收回；多条时纵向堆叠
   top 取 84px：后台顶栏高 64px、官网顶栏高 76px，两种页面都落在顶栏下面 */
.yy-toasts {
  position: fixed;
  top: 84px;
  right: 24px;
  z-index: 9999;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 10px;
  pointer-events: none;
}
.yy-toast {
  max-width: 380px;
  padding: 13px 20px;
  border-radius: 12px;
  font-size: 14px;
  line-height: 1.6;
  box-shadow: 0 12px 32px rgba(0, 0, 0, .45);
  transform: translateX(calc(100% + 40px));
  opacity: 0;
  transition: transform .38s ease, opacity .38s ease;
}
.yy-toast.in { transform: translateX(0); opacity: 1; }
.yy-toast.out { transform: translateX(calc(100% + 40px)); opacity: 0; }
.yy-toast.ok { border: 1px solid rgba(52, 211, 153, .4); background: rgba(10, 20, 32, .96); color: #6ee7b7; }
.yy-toast.err { border: 1px solid rgba(232, 40, 60, .45); background: rgba(28, 10, 16, .96); color: #ff8b98; }

/* 登录验证期间隐藏受保护页面内容（auth.js 确认登录态后解除） */
html.auth-wait body { visibility: hidden; }

/* ---------- 滚动渐入动画（仅 JS 可用时隐藏，避免无 JS 环境页面空白） ---------- */
.js [data-reveal] {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .8s cubic-bezier(.2, .65, .3, 1), transform .8s cubic-bezier(.2, .65, .3, 1);
  transition-delay: var(--d, 0s);
}
.js [data-reveal].revealed { opacity: 1; transform: none; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  [data-reveal] { opacity: 1; transform: none; transition: none; }
  .marquee-track { animation: none; }
  .map-route { animation: none; }
  .map-node-ring { animation: none; opacity: .35; }
}

/* ---------- 响应式 ---------- */
@media (max-width: 1024px) {
  .section { padding: 88px 0; }
  .services-grid { grid-template-columns: 1fr 1fr; }
  .service-card.wide { grid-column: span 2; }
  .network-wrap { grid-template-columns: 1fr; gap: 40px; }
  .process-track { grid-template-columns: repeat(2, 1fr); }
  .step::after { display: none; }
  .adv-grid, .value-grid { grid-template-columns: 1fr 1fr; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .contact-wrap { grid-template-columns: 1fr; }
  .service-detail { grid-template-columns: 1fr; gap: 36px; padding: 48px 0; }
  .service-detail:nth-child(even) { direction: ltr; }
}

@media (max-width: 768px) {
  .nav-links {
    position: fixed;
    top: var(--header-h);
    left: 0; right: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    background: rgba(6, 10, 19, .97);
    -webkit-backdrop-filter: blur(20px);
    backdrop-filter: blur(20px);
    border-bottom: 1px solid var(--stroke);
    padding: 12px 24px 26px;
    display: none;
  }
  .nav-links.open { display: flex; }
  .nav-links > a { padding: 15px 4px; border-bottom: 1px solid var(--stroke); font-size: 16px; }
  .nav-links > a.active::after { display: none; }
  .nav-links > a.active { color: var(--indigo); }
  .nav-cta { margin-top: 18px; justify-content: center; }
  .nav-burger { display: flex; }

  .hero { padding-top: calc(var(--header-h) + 40px); }
  .hero-stats { grid-template-columns: 1fr 1fr; margin-top: 54px; }
  .hero-actions .btn { flex: 1; }
  .services-grid { grid-template-columns: 1fr; }
  .service-card.wide { grid-column: span 1; }
  .quote-grid { grid-template-columns: 1fr; }
  .process-track { grid-template-columns: 1fr; }
  .stats-band { grid-template-columns: 1fr 1fr; gap: 30px; }
  .form-grid { grid-template-columns: 1fr; }
  .quote-form { padding: 28px 22px; }
}

@media (max-width: 560px) {
  .section { padding: 72px 0; }
  .adv-grid, .value-grid { grid-template-columns: 1fr; }
  .stats-band { grid-template-columns: 1fr 1fr; }
  .hero-stats { grid-template-columns: 1fr 1fr; gap: 12px; }
  .cta-band { padding: 64px 24px; }
  .footer-grid { grid-template-columns: 1fr; gap: 36px; }
  .brand-text em { display: none; }
  .service-detail .feats { grid-template-columns: 1fr; }
  .spec-table th, .spec-table td { padding: 11px 10px; }
}

/* 车辆证件上传：文件框与已传文件链接 */
.form-field input[type="file"] { width: 100%; font-size: 12px; color: var(--muted); }
.form-field input[type="file"]::file-selector-button { margin-right: 10px; padding: 6px 12px; border: 1px solid var(--stroke); border-radius: 8px; background: var(--panel); color: var(--text); font-size: 12px; cursor: pointer; }
.veh-file-link { display: inline-block; margin-top: 6px; font-size: 12px; color: var(--indigo); text-decoration: none; }
.veh-file-link:hover { text-decoration: underline; }

/* 车辆证件缩略图：类型标签与待上传态 */
.veh-files-field { margin-top: 14px; }
.veh-files-field > label { display: block; font-size: 13px; color: var(--muted); margin-bottom: 10px; }
.file-thumb .file-type {
  position: absolute;
  left: 0; right: 0; bottom: 0;
  padding: 3px 0;
  font-size: 11px;
  text-align: center;
  color: #fff;
  background: rgba(4, 7, 14, .65);
}
.file-add { position: relative; }
.file-add .file-add-label { position: absolute; left: 4px; right: 4px; bottom: 8px; font-size: 11px; line-height: 1.3; font-weight: 400; }
.file-thumb.pending { outline: 2px dashed var(--indigo); outline-offset: -2px; }
.emp-files-field { margin-top: 14px; }
.emp-files-field > label { display: block; font-size: 13px; color: var(--muted); margin-bottom: 10px; }

/* 日期切换条 + 保存按钮（子元素等高：行高由日期条撑起，统计卡与保存按钮自动拉伸对齐） */
.att-toolbar {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 10px;
}
.att-date-nav {
  display: flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  border: 1px solid #dde6f2;
  border-radius: var(--radius-sm);
  padding: 8px 12px;
  box-shadow: 0 2px 10px rgba(29, 51, 89, .05);
}
.att-date-nav input[type="date"],
.att-date-nav input[type="month"] {
  border: none;
  background: transparent;
  font: inherit;
  font-weight: 600;
  font-size: 15px;
  color: #1f2d45;
  outline: none;
}
.att-day-btn, .att-today-btn {
  border: 1px solid #dde6f2;
  background: #f7fafe;
  border-radius: 9px;
  font: inherit;
  cursor: pointer;
  transition: background .2s ease, border-color .2s ease;
}
.att-day-btn { width: 32px; height: 32px; line-height: 1; font-size: 18px; color: #5f7189; }
.att-today-btn { padding: 6px 14px; font-size: 13px; font-weight: 600; color: #4f5fe0; background: #eef1ff; border-color: #d8defc; }
.att-day-btn:hover { background: #eef3fa; }
.att-today-btn:hover { background: #e2e7ff; }

/* 当日统计小卡（与日期条、保存按钮同行，居中占满剩余空间） */
.att-stats {
  flex: 1;
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  align-content: stretch;
  gap: 10px;
}
.att-stat-card {
  background: #fff;
  border: 1px solid #dde6f2;
  border-radius: var(--radius-sm);
  padding: 9px 14px;
  font-size: 12.5px;
  color: #5f7189;
  box-shadow: 0 2px 10px rgba(29, 51, 89, .05);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  white-space: nowrap;
}
.att-stat-card b { font-size: 18px; line-height: 1.2; }
.att-stat-card.on b { color: #16a06a; }
.att-stat-card.rest b { color: #8a97a8; }
.att-stat-card.leave b { color: #2b7fd4; }
.att-stat-card.year b { color: #d9822b; }
.att-stat-card.sick b { color: #b0941c; }
.att-stat-card.absent b { color: #d9534f; }

/* 名单面板（月度表格较宽，容器内横向+纵向滚动）；
   操作页内容区改为列布局——工具条固定在上方，表格面板占满剩余空间内部滚动；
   顶栏与工具条、工具条与表格之间的间距压缩，页面更紧凑（各操作页一致） */
.portal-fixed .container:has(.att-panel-scroll) {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding-bottom: 0;
}
.att-toolbar { flex: 0 0 auto; }
.att-panel {
  background: #fff;
  border: 1px solid #dde6f2;
  border-radius: var(--radius);
  box-shadow: 0 4px 16px rgba(29, 51, 89, .06);
  overflow: hidden;
}
/* 面板内部滚动但隐藏滚动条（滚轮/触控板滚动不受影响） */
.att-panel-scroll { flex: 1 1 auto; min-height: 0; overflow: auto; scrollbar-width: none; }
.att-panel-scroll::-webkit-scrollbar { display: none; }
.att-table { width: 100%; border-collapse: collapse; }
/* 表头固定：吸附在面板顶部；姓名列表头同时左右吸附，层级更高 */
.att-month-table thead th { position: sticky; top: 0; z-index: 5; padding: 6px 6px 7px; text-align: center; }
.att-month-table thead .att-name-col { z-index: 6; }
.att-day-num { display: block; font-size: 13px; font-weight: 700; color: #6b7a90; }
.att-week { display: block; font-size: 11px; font-weight: 500; color: #9aa9be; }
.att-day-col.weekend .att-day-num,
.att-day-col.weekend .att-week { color: #e08a8a; }
.att-day-col.att-fest-col .att-day-num,
.att-day-col.att-fest-col .att-week { color: #e02b2b; font-weight: 700; }
.att-table th {
  text-align: left;
  font-size: 13px;
  font-weight: 600;
  color: #8595ad;
  background: #f5f8fd;
  padding: 12px 20px;
  border-bottom: 1px solid #e7eef7;
}
.att-table td {
  padding: 14px 20px;
  border-bottom: 1px solid #eef3f9;
  font-size: 14.5px;
  color: #273449;
}
.att-table tr:last-child td { border-bottom: none; }
.att-name { font-weight: 600; color: #1f2d45; white-space: nowrap; }

/* 月度考勤表：姓名列固定在左，1~31 号每列一个窄格子 */
/* 分离边框模式：collapse 下边框由表格层统一绘制，表头吸附滚动时缝隙会透出内容 */
.att-month-table { min-width: max-content; border-collapse: separate; border-spacing: 0; }
.att-month-table th { text-align: center; padding: 10px 6px; }
.att-month-table td { height: 43px; padding: 8px 4px; border-bottom: 1px solid #eef3f9; }
.att-month-table td .att-cell { display: block; margin: 0 auto; }
.att-name-col {
  position: sticky;
  left: 0;
  z-index: 4;
  min-width: 96px;
  text-align: left !important;
  padding-left: 20px !important;
  padding-right: 14px !important;
  background: #fff;
}
.att-plate-col { min-width: 72px; text-align: left !important; }
.att-plate { color: #4c5d75; font-weight: 600; letter-spacing: .02em; white-space: nowrap; }
.att-month-table thead .att-name-col { background: #f5f8fd; }
.att-day-col { min-width: 34px; font-variant-numeric: tabular-nums; }
.att-day-col.weekend { color: #e08a8a; }
/* 表头第二行：星期几 / 节日（节日两行数字与"节"同色，区别于周末的淡红） */
.att-month-table thead tr:nth-child(2) th { padding: 2px 6px 9px; font-size: 11px; font-weight: 500; }
.att-cell {
  width: 30px;
  height: 26px;
  border: 1px solid transparent;
  border-radius: 7px;
  background: #f4f7fc;
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  color: transparent;
  cursor: pointer;
  transition: background .15s ease, border-color .15s ease;
}
.att-cell:hover { background: #e8eef8; border-color: #cdd9ea; }
.att-cell.s1 { background: #e7f8f0; color: #16a06a; }        /* 出勤：淡绿 */
.att-cell.s0 { background: #f0f2f5; color: #8a97a8; }        /* 休息：灰 */
.att-cell.s2 { background: #e3f1fc; color: #2b7fd4; }        /* 事假：蓝 */
.att-cell.s3 { background: #fdf1e7; color: #d9822b; }        /* 年假：橙 */
.att-cell.s4 { background: #fdf9dc; color: #b0941c; }        /* 病假：黄 */
.att-cell.s5 { background: #f6d8d8; color: #a83232; font-weight: 700; } /* 旷工：红 */
.att-cell.att-fest { background: #fdecec; color: #e02b2b; font-weight: 700; } /* 节假日出勤"加"：红色 */
/* 入职前/离职后的日期：置灰禁用 */
.att-cell:disabled {
  background: #fafbfe;
  border-color: transparent;
  cursor: not-allowed;
  opacity: .5;
}
.att-cell:disabled:hover { background: #fafbfe; border-color: transparent; }

/* 节假日管理 */
.hol-year-nav { display: flex; align-items: center; gap: 8px; }
.hol-year-nav input {
  width: 96px;
  padding: 7px 10px;
  border: 1px solid rgba(148, 163, 184, .28);
  border-radius: 9px;
  background: rgba(255, 255, 255, .05);
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  color: #f1f5f9;
  text-align: center;
  outline: none;
  -moz-appearance: textfield;
  appearance: textfield;
  transition: border-color .2s ease;
}
/* 隐藏数字输入的微调按钮 */
.hol-year-nav input::-webkit-inner-spin-button,
.hol-year-nav input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.hol-year-nav input:focus { border-color: rgba(124, 140, 255, .65); }
.hol-type-badge { display: inline-block; padding: 3px 12px; border-radius: 999px; font-size: 12.5px; font-weight: 600; }
.hol-type-1 { background: #fdecec; color: #e02b2b; }
.hol-type-2 { background: #fdf1e7; color: #d9822b; }
.hol-type-3 { background: #eef2f8; color: #5b7191; }
.hol-tip { color: #93a3b8; font-size: 12.5px; padding: 12px 20px; margin: 0; }

/* 实发工资输入框 */
.settle-input {
  width: 118px;
  padding: 7px 12px;
  border: 1px solid #dde6f2;
  border-radius: 9px;
  background: #fff;
  font: inherit;
  font-size: 13.5px;
  color: #273449;
  text-align: right;
  outline: none;
  transition: border-color .18s ease;
}
.settle-input:focus { border-color: #9db4d8; box-shadow: 0 0 0 3px rgba(91, 108, 255, .12); }
.settle-input:disabled { opacity: .55; }
/* 隐藏数字输入框右侧的上下微调箭头（Chrome/Safari/Firefox） */
.settle-input::-webkit-outer-spin-button,
.settle-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.settle-input { -moz-appearance: textfield; appearance: textfield; }

.att-empty {
  padding: 46px 20px;
  text-align: center;
  color: #93a3b8;
  font-size: 14px;
}

/* 工资结算列表（salary.html）与考核评分列表（assess.html）：天数列居中等宽，旷工大于 0 红色提醒；
   分离边框 + 吸附表头（面板内部滚动时表头固定，与考勤月表同理）；
   工资表 16 列与面板同宽：表格按内容自然宽（width:max-content）横向滚动，列少时 min-width 撑满面板 */
.att-salary-table, .att-assess-table { border-collapse: separate; border-spacing: 0; }
.att-salary-table { width: max-content; min-width: 100%; }
/* 考核表列少：始终等于容器宽度（输入框跟随格子伸缩），任何窗口宽度都不会超出 */
.att-assess-table { width: 100%; }
/* 单元格间距收窄：左右 5px、上下 10px，首列留 16px 与面板边缘的呼吸位 */
.att-salary-table th, .att-salary-table td,
.att-assess-table th, .att-assess-table td { padding: 10px 5px; }
.att-salary-table th:first-child, .att-salary-table td:first-child,
.att-assess-table th:first-child, .att-assess-table td:first-child { padding-left: 16px; }
.att-salary-table thead th, .att-assess-table thead th { position: sticky; top: 0; z-index: 5; }
.att-salary-table th.num, .att-salary-table td.num,
.att-assess-table th.num, .att-assess-table td.num { text-align: center; width: 88px; }
/* 天数列（全勤/出勤/休息/请假/加班/旷工）只有 1~2 位数，列宽收窄 */
.att-salary-table th.day, .att-salary-table td.day { width: 44px; }
/* 除天数列与支付状态列外，其余各列统一宽度 92px；天数列 40px、支付状态列 64px，16 列一屏放下不横向滚动 */
.att-salary-table th, .att-salary-table td { width: 92px; }
.att-salary-table th.day, .att-salary-table td.day { width: 40px; }
.att-salary-table th:last-child, .att-salary-table td:last-child { width: 64px; }
.att-salary-table .att-name-col { min-width: 0; }
.att-salary-table .settle-input { width: 100%; padding: 7px 4px; box-sizing: border-box; }
.att-salary-table thead th { white-space: nowrap; }
.att-salary-table .pay-badge { padding: 4px 10px; font-size: 12px; }
/* 表头文字水平居中（姓名列表头的 left !important 也覆盖为居中），支付状态徽章在格子内居中 */
.att-salary-table thead th { text-align: center; }
.att-salary-table thead th.att-name-col { text-align: center !important; }
.att-salary-table td:last-child { text-align: center; }
.att-salary-table td.num, .att-assess-table td.num { font-weight: 600; color: #1f2d45; font-variant-numeric: tabular-nums; }
.att-salary-table td.num { white-space: nowrap; }
.att-salary-table td.num.bad, .att-assess-table td.num.bad { color: #d9534f; }

/* 考核评分列表：固定表格布局，姓名/车号按内容给宽，其余 12 个字段列均分剩余宽度（列宽全部一样） */
.att-assess-table { table-layout: fixed; }
.att-assess-table th:nth-child(1), .att-assess-table td:nth-child(1) { width: 90px; }
.att-assess-table th:nth-child(2), .att-assess-table td:nth-child(2) { width: 110px; }
.att-assess-table th.num, .att-assess-table td.num { width: auto; }
.att-assess-table .settle-input { width: 100%; }
/* 表头文字与两个考核开关水平居中 */
.att-assess-table thead th { text-align: center; }
.att-assess-table td.switch-col { text-align: center; }

/* 支付状态徽章（工资结算表）：点击在 未付/已付 间切换 */
.pay-badge {
  border: 1px solid rgba(95, 113, 137, .35);
  border-radius: 999px;
  padding: 5px 14px;
  font: inherit;
  font-size: 12.5px;
  font-weight: 600;
  color: #8a97a8;
  background: #fff;
  white-space: nowrap;
  cursor: pointer;
  transition: color .2s ease, background .2s ease, border-color .2s ease;
}
.pay-badge:hover { border-color: #16a06a; color: #16a06a; }
.pay-badge.paid { background: #e7f8f0; border-color: #bfe8d4; color: #16a06a; }
.pay-badge:disabled { opacity: .5; cursor: not-allowed; }
.pay-badge:disabled:hover { border-color: var(--stroke); color: inherit; }

/* 工资结算表列较多：姓名列横向滚动时固定在左侧，合计列加重显示 */
.att-salary-table .att-name-col { text-align: left !important; }
.att-salary-table thead .att-name-col { z-index: 6; background: #f5f8fd; }
.att-salary-table td.total { font-weight: 700; color: #1f2d45; }

/* 考核开关（油耗考核/高速考核）：滑块式开关，选中为主题蓝 */
.assess-switch { position: relative; display: inline-block; width: 40px; height: 22px; vertical-align: middle; }
.assess-switch input { position: absolute; opacity: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.assess-switch i {
  position: absolute; inset: 0; pointer-events: none;
  border-radius: 999px; background: #d5deec; transition: background .18s ease;
}
.assess-switch i::after {
  content: ''; position: absolute; top: 2px; left: 2px; width: 18px; height: 18px;
  border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(31, 45, 69, .3);
  transition: transform .18s ease;
}
.assess-switch input:checked + i { background: var(--indigo); }
.assess-switch input:checked + i::after { transform: translateX(18px); }

@media (max-width: 900px) {
  /* 窄屏：统计卡整体换到下一行，仍保持一行四张 */
  .att-stats { flex-basis: 100%; order: 3; }
}
@media (max-width: 640px) {
  .att-stats { grid-template-columns: 1fr 1fr; }
}

/* ==========================================================================
   公司网盘（pan.html）：深色大屏风格，复用考勤页的 att-toolbar / att-panel / att-table
   ========================================================================== */

/* 文件路径（面包屑）：嵌在顶栏页签右侧、与页签同行；当前层级橙色高亮，上级可点返回 */
.pan-crumb {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 1px;
  margin-left: 14px;
  padding: 6px 14px;
  border-radius: 999px;
  border: 1px solid rgba(148, 178, 224, .16);
  background: rgba(255, 255, 255, .04);
  font-size: 13px;
  max-width: 46vw;
  overflow: hidden;
}
.pan-crumb a {
  color: #a8bcdf;
  text-decoration: none;
  padding: 3px 7px;
  border-radius: 7px;
  transition: background .18s ease, color .18s ease;
}
.pan-crumb a:hover { background: rgba(88, 130, 255, .16); color: #e8f0ff; }
.pan-crumb .cur { color: #ffd9ad; font-weight: 600; padding: 3px 7px; }
.pan-crumb .sep { color: #7d90ad; }
.pan-crumb.auth-hidden { display: none; }
@media (max-width: 1200px) {
  .pan-crumb { display: none; } /* 窄屏顶栏放不下路径，只留页签 */
}

/* 操作按钮：新建文件夹（深色玻璃）/ 上传文件（橙色强调，与考勤页按钮同族）；
   现置于表头最右格，缩小一号贴合表头 */
.pan-actions { display: flex; align-items: center; gap: 8px; }
.pan-head-actions { text-align: right; padding: 8px 12px !important; }
.pan-head-actions .pan-actions { justify-content: flex-end; }
.pan-head-actions .pan-btn { padding: 6px 12px; font-size: 12.5px; box-shadow: none; border-radius: 9px; }
.pan-head-actions .pan-btn svg { width: 14px; height: 14px; }
.pan-btn {
  border: 1px solid rgba(148, 178, 224, .25);
  border-radius: var(--radius-sm);
  background: rgba(255, 255, 255, .05);
  font: inherit;
  font-size: 13.5px;
  font-weight: 600;
  color: #a8bcdf;
  padding: 0 18px;
  cursor: pointer;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  transition: background .2s ease, border-color .2s ease, color .2s ease;
  box-shadow: 0 2px 10px rgba(2, 6, 18, .4);
}
.pan-btn svg { width: 16px; height: 16px; flex: none; }
.pan-btn:hover { color: #e8f0ff; background: rgba(88, 130, 255, .16); }
.pan-btn:disabled { opacity: .55; cursor: default; }
.pan-btn.primary { color: #ffd9ad; background: rgba(251, 146, 60, .16); border-color: rgba(251, 168, 82, .45); }
.pan-btn.primary:hover { background: rgba(251, 146, 60, .26); }

/* 文件列表：名称列（图标 + 名称），文件夹名可点进入，文件名可点预览/下载 */
.pan-table { width: 100%; border-collapse: separate; border-spacing: 0; }
.pan-table thead th {
  position: sticky;
  top: 0;
  z-index: 5;
  text-align: left;
  font-size: 13px;
  font-weight: 600;
  color: #a8bcdf;
  background: rgba(16, 31, 62, .95);
  padding: 12px 20px;
  border-bottom: 1px solid rgba(148, 178, 224, .18);
}
.pan-table td {
  padding: 10px 20px;
  border-bottom: 1px solid rgba(148, 178, 224, .1);
  font-size: 14.5px;
  color: #dce6f7;
}
.pan-table tr:last-child td { border-bottom: none; }
.pan-table tbody tr { transition: background .15s ease; }
.pan-table tbody tr:hover { background: rgba(251, 146, 60, .08); }
.pan-table .col-size, .pan-table .col-time { white-space: nowrap; color: #a8bcdf; font-size: 13.5px; }

/* 上传人列：小圆头像（有头像图用图，没有显示姓名首字）+ 姓名 */
.pan-uploader { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.pan-avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
  font-size: 11.5px;
  font-weight: 700;
  color: #ffd9ad;
  background: linear-gradient(160deg, rgba(251, 146, 60, .42), rgba(251, 146, 60, .12));
  border: 1px solid rgba(251, 168, 82, .5);
  overflow: hidden;
}
.pan-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }

.pan-name { display: flex; align-items: center; gap: 12px; min-width: 280px; }
.pan-ico {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: none;
}
.pan-ico svg { width: 19px; height: 19px; }
/* 图标配色按文件类型分组（深色玻璃底 + 提亮字色）：文件夹 / 图片 / PDF / 文档 / 表格 / 演示 / 压缩包 / 音视频 / 其他 */
.pan-ico.ft-folder { background: rgba(251, 146, 60, .16); color: #ffd9ad; }
.pan-ico.ft-img    { background: rgba(34, 197, 94, .15);  color: #4ade80; }
.pan-ico.ft-pdf    { background: rgba(216, 80, 80, .28);  color: #ff9c9c; }
.pan-ico.ft-doc    { background: rgba(43, 127, 212, .22); color: #7ab8f5; }
.pan-ico.ft-xls    { background: rgba(16, 185, 129, .16); color: #6ee7b7; }
.pan-ico.ft-ppt    { background: rgba(217, 130, 43, .24); color: #fda55c; }
.pan-ico.ft-zip    { background: rgba(139, 92, 246, .2);  color: #c4b5fd; }
.pan-ico.ft-media  { background: rgba(176, 148, 28, .22); color: #e5d34a; }
.pan-ico.ft-file   { background: rgba(148, 178, 224, .14); color: #a8bcdf; }
.pan-file-name {
  font-weight: 600;
  color: #eef4ff;
  cursor: pointer;
  word-break: break-all;
  transition: color .18s ease;
}
.pan-file-name:hover { color: #fda55c; }

/* 行内操作按钮：下载 / 重命名 / 删除（删除两步确认时变红，与全站做法一致） */
.pan-ops { display: flex; align-items: center; justify-content: flex-end; gap: 6px; white-space: nowrap; }
.pan-op {
  border: 1px solid rgba(148, 178, 224, .25);
  border-radius: 8px;
  background: rgba(255, 255, 255, .05);
  font: inherit;
  font-size: 12.5px;
  font-weight: 600;
  color: #a8bcdf;
  padding: 5px 12px;
  cursor: pointer;
  transition: background .18s ease, border-color .18s ease, color .18s ease;
}
.pan-op:hover { background: rgba(88, 130, 255, .16); color: #e8f0ff; }
.pan-op.danger { color: #ff9c9c; }
.pan-op.danger:hover { background: rgba(216, 80, 80, .25); border-color: rgba(255, 156, 156, .4); color: #ffb3b3; }
.pan-op.confirm { background: rgba(216, 80, 80, .3); border-color: rgba(255, 156, 156, .45); color: #ffb3b3; }

/* 重命名的行内输入框（替换名称文字，确认/取消小按钮跟随） */
.pan-rename { display: flex; align-items: center; gap: 8px; flex: 1; min-width: 0; }
.pan-rename input {
  flex: 1;
  min-width: 0;
  padding: 7px 12px;
  border: 1px solid rgba(122, 162, 255, .25);
  border-radius: 9px;
  background: rgba(10, 20, 40, .55);
  font: inherit;
  font-size: 14px;
  color: #e8f0ff;
  outline: none;
  transition: border-color .18s ease, box-shadow .18s ease;
}
.pan-rename input:focus { border-color: rgba(251, 146, 60, .6); box-shadow: 0 0 0 3px rgba(251, 146, 60, .14); }
.pan-rename .pan-op.confirm-save { color: #ffd9ad; background: rgba(251, 146, 60, .16); border-color: rgba(251, 168, 82, .45); }
.pan-rename .pan-op.confirm-save:hover { background: rgba(251, 146, 60, .26); }


/* ==========================================================================
   考勤系统深色大屏风格（dark-page：考勤表/考核评分/工资结算，参考工作台 UI）
   ========================================================================== */
.dark-page .portal-fixed { padding-top: 10px; }
.dark-page .portal-fixed .container { scrollbar-width: none; }

/* 顶部页签导航：仪表板 / 考勤表 / 考核评分 / 工资结算 */
.dark-page .portal-nav {
  display: flex;
  gap: 6px;
  padding: 4px;
  border-radius: 999px;
  border: 1px solid rgba(148, 178, 224, .18);
  background: rgba(255, 255, 255, .04);
}
.dark-page .portal-nav-item {
  padding: 7px 14px;
  border-radius: 999px;
  font-size: 13.5px;
  font-weight: 600;
  color: #a8bcdf;
  transition: color .2s ease, background .2s ease;
}
.dark-page .portal-nav-item:hover { color: #e8f0ff; background: rgba(88, 130, 255, .12); }
.dark-page .portal-nav-item.active { color: #ffd9ad; background: rgba(251, 146, 60, .16); }

/* 年月切换工具条：深色玻璃控件 */
.dark-page .att-date-nav {
  background: rgba(10, 20, 40, .55);
  border-color: rgba(122, 162, 255, .28);
  box-shadow: 0 2px 10px rgba(2, 6, 18, .4);
}
.dark-page .att-date-nav input[type="month"],
.dark-page .att-date-nav input[type="date"] {
  background: transparent;
  color: #e8f0ff;
  color-scheme: dark;
}
.dark-page .att-day-btn {
  color: #a8bcdf;
  background: rgba(255, 255, 255, .05);
  border-color: rgba(148, 178, 224, .25);
}
.dark-page .att-day-btn:hover { color: #e8f0ff; background: rgba(88, 130, 255, .16); }
.dark-page .att-today-btn {
  color: #ffd9ad;
  background: rgba(251, 146, 60, .16);
  border-color: rgba(251, 168, 82, .45);
}

/* 顶栏页签：紧跟品牌靠左（不再被空间均分推到中间），年月选择器并入页签行 */
.portal-top .portal-nav { margin-right: auto; align-items: center; }
.portal-nav .att-date-nav {
  padding: 3px 10px;
  gap: 6px;
  margin-left: 8px;
  box-shadow: none;
}
.portal-nav .att-date-nav input[type="month"],
.portal-nav .att-date-nav input[type="date"] { font-size: 13.5px; }
.portal-nav .att-day-btn { width: 26px; height: 26px; font-size: 15px; }
.portal-nav .att-today-btn { padding: 3px 10px; font-size: 12px; }
.dark-page .att-today-btn:hover { background: rgba(251, 146, 60, .26); }

/* 顶栏"小油"控件：当月油价与数量，与年月选择器同排的紧凑玻璃框 */
.oil-nav {
  display: flex;
  align-items: center;
  gap: 5px;
  margin-left: 8px;
  padding: 3px 8px;
  border-radius: 999px;
  border: 1px solid rgba(251, 168, 82, .35);
  background: rgba(251, 146, 60, .08);
}
.oil-lab { font-size: 12px; font-weight: 700; color: #ffd9ad; }
.oil-field { display: inline-flex; align-items: center; gap: 2px; font-size: 12px; color: #a8bcdf; }
.oil-field input {
  width: 44px;
  border: none;
  background: transparent;
  font: inherit;
  font-size: 12.5px;
  font-weight: 600;
  color: #e8f0ff;
  text-align: right;
  outline: none;
  color-scheme: dark;
  appearance: textfield;
  -moz-appearance: textfield;
}
.oil-field input::-webkit-outer-spin-button,
.oil-field input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
/* 总价数值较大，宽度放宽一档 */
.oil-field input#asOilTotal { width: 56px; }
.oil-field input[readonly] { cursor: default; }

/* 当月统计小卡：深色玻璃 + 状态色提亮 */
.dark-page .att-stat-card {
  border-radius: 14px;
  border: 1px solid rgba(122, 162, 255, .22);
  background:
    radial-gradient(120% 90% at 12% 0%, rgba(88, 130, 255, .16), transparent 55%),
    linear-gradient(165deg, rgba(30, 60, 126, .45), rgba(11, 22, 48, .5));
  color: #cdd9ee;
  box-shadow: inset 0 1px 0 rgba(190, 214, 255, .12), 0 14px 34px -18px rgba(2, 6, 18, .9);
}
.dark-page .att-stat-card b { font-size: 20px; text-shadow: 0 0 18px rgba(96, 140, 255, .35); }
.dark-page .att-stat-card.on b { color: #4ade80; }
.dark-page .att-stat-card.rest b { color: #a9b7c9; }
.dark-page .att-stat-card.leave b { color: #7ab8f5; }
.dark-page .att-stat-card.year b { color: #fda55c; }
.dark-page .att-stat-card.sick b { color: #e5d34a; }
.dark-page .att-stat-card.absent b { color: #ff9c9c; }

/* 表格面板：深色玻璃 */
/* 表格面板：扎实的深蓝底（不再透出页面背景） */
.dark-page .att-panel {
  border: 1px solid rgba(122, 162, 255, .18);
  border-radius: 14px;
  background: #0d1830; /* 全表统一实色底：吸附姓名列用同色，整表颜色一致 */
  box-shadow: 0 16px 34px -18px rgba(2, 6, 18, .95);
}
.dark-page .att-table th {
  color: #a8bcdf;
  background: rgba(16, 31, 62, .95);
  border-bottom-color: rgba(148, 178, 224, .18);
}
.dark-page .att-table td { color: #dce6f7; border-bottom-color: rgba(148, 178, 224, .1); }
.dark-page .att-name { color: #eef4ff; }
.dark-page .att-plate { color: #a8bcdf; }
.dark-page .att-day-num { color: #cdd9ee; }
.dark-page .att-week { color: #7d90ad; }
.dark-page .att-day-col.weekend .att-day-num,
.dark-page .att-day-col.weekend .att-week { color: #c99393; }
.dark-page .att-day-col.att-fest-col .att-day-num,
.dark-page .att-day-col.att-fest-col .att-week { color: #ff8f8f; }

/* 姓名列吸附时用实色深底，避免透出底图 */
.dark-page .att-name-col { background: #0d1830; }
.dark-page .att-month-table thead .att-name-col,
.dark-page .att-salary-table thead .att-name-col { background: #101f3e; }
.dark-page .att-month-table td { border-bottom-color: rgba(148, 178, 224, .1); }

/* 状态格：默认"休"近乎隐形，只让记录过的状态跳出来，降低满屏色块的视觉噪音 */
.dark-page .att-cell { background: transparent; border-color: transparent; }
.dark-page .att-cell:hover { background: rgba(251, 146, 60, .18); border-color: rgba(251, 168, 82, .4); }
.dark-page .att-cell.s0 { background: transparent; color: #4a5a78; }
.dark-page .att-cell.s0:hover { color: #9db0cc; }
.dark-page .att-cell.s1 { background: rgba(34, 197, 94, .15); color: #4ade80; }
.dark-page .att-cell.s2 { background: rgba(43, 127, 212, .22); color: #7ab8f5; }
.dark-page .att-cell.s3 { background: rgba(217, 130, 43, .24); color: #fda55c; }
.dark-page .att-cell.s4 { background: rgba(176, 148, 28, .22); color: #e5d34a; }
.dark-page .att-cell.s5 { background: rgba(216, 80, 80, .3); color: #ff9c9c; }
.dark-page .att-cell.att-fest { background: rgba(224, 43, 43, .2); color: #ff8f8f; }
.dark-page .att-cell:disabled { background: transparent; }
.dark-page .att-cell:disabled:hover { background: transparent; border-color: transparent; }
/* 悬停整行高亮（橙色）：姓名列为实色同步提亮（吸附列不能透出下层内容） */
.dark-page .att-table tbody tr:hover td:not(.att-name-col):not(.col-hi) { background: rgba(251, 146, 60, .12); }
.dark-page .att-table tbody tr:hover td.att-name-col {
  background: linear-gradient(rgba(251, 146, 60, .12), rgba(251, 146, 60, .12)), #0c1730;
}
/* 悬停单元格所在列高亮（JS 给该列单元格加 .col-hi），颜色与行高亮一致，表头数字同步变橙 */
.dark-page .att-table td.col-hi { background: rgba(251, 146, 60, .12); }
.dark-page .att-table th.col-hi .att-day-num,
.dark-page .att-table th.col-hi .att-week { color: #fda55c; }

/* 实发工资输入框 / 支付徽章 / 考核开关 */
.dark-page .settle-input {
  background: rgba(10, 20, 40, .55);
  border-color: rgba(122, 162, 255, .25);
  color: #e8f0ff;
}
.dark-page .settle-input:focus {
  border-color: rgba(251, 146, 60, .6);
  box-shadow: 0 0 0 3px rgba(251, 146, 60, .14);
}
.dark-page .att-salary-table td.num,
.dark-page .att-assess-table td.num { color: #e8f0ff; }
.dark-page .att-salary-table td.num.bad,
.dark-page .att-assess-table td.num.bad { color: #ff9c9c; }
.dark-page .att-salary-table td.total { color: #fff; }
.dark-page .pay-badge {
  color: #a8bcdf;
  border-color: rgba(148, 178, 224, .3);
  background: rgba(255, 255, 255, .05);
}
.dark-page .pay-badge:hover { border-color: #34d399; color: #4ade80; }
.dark-page .pay-badge:disabled { opacity: .45; cursor: not-allowed; border-color: var(--stroke); color: var(--muted); }
.dark-page .pay-badge:disabled:hover { border-color: var(--stroke); color: var(--muted); }
.dark-page .pay-badge.paid {
  color: #4ade80;
  border-color: rgba(74, 222, 128, .4);
  background: rgba(22, 160, 106, .2);
}
.dark-page .assess-switch i { background: rgba(148, 178, 224, .28); }
.dark-page .assess-switch input:checked + i { background: rgba(251, 146, 60, .85); }
.dark-page .att-empty { color: #8fa3c0; }

@media (max-width: 768px) {
  .dark-page .portal-nav-item { padding: 7px 12px; font-size: 14px; }
  .dark-page .portal-name { display: none; }
}

/* 考勤页统计卡内嵌顶栏：紧凑胶囊（页签与用户信息之间居中） */
.portal-top .att-stats {
  display: flex;
  gap: 8px;
  flex: 1;
  justify-content: center;
  min-width: 0;
}
.portal-top .att-stat-card {
  justify-content: flex-start;
  gap: 7px;
  padding: 0 12px;
  height: 37px; /* 与页签(.portal-nav-item)等高 */
  line-height: 1;
  border-radius: 999px;
}
.portal-top .att-stat-card b { font-size: 15px; }
@media (max-width: 1500px) {
  .portal-top .att-stats { gap: 6px; }
  .portal-top .att-stat-card { padding: 0 9px; gap: 5px; font-size: 12px; }
  .portal-top .att-stat-card b { font-size: 14px; }
}
@media (max-width: 1280px) {
  .portal-top .att-stat-card { padding: 0 7px; }
}
@media (max-width: 1080px) {
  .portal-top .att-stats { display: none; }
}

/* ---------- 系统设置页深色大屏风格（dark-page，UI 参考考核评分/考勤页） ---------- */
/* 面板：深蓝玻璃底（同 .dark-page .att-panel） */
#settingsPage .data-panel {
  border: 1px solid rgba(122, 162, 255, .18);
  border-radius: 14px;
  background: linear-gradient(180deg, #101d3a 0%, #0b1730 100%);
  box-shadow: 0 16px 34px -18px rgba(2, 6, 18, .95);
}
/* 表格：蓝灰表头 + 浅色正文；吸附表头用实色深底防透行 */
#settingsPage .data-table th { color: #a8bcdf; border-bottom-color: rgba(148, 178, 224, .18); }
#settingsPage .data-table td { color: #dce6f7; border-bottom-color: rgba(148, 178, 224, .1); }
#settingsPage .data-table .mono { color: #a5b4fc; }
#settingsPage .data-table .mono.yn-yes { color: #34d399; }
#settingsPage .data-table .mono.yn-no { color: #f87171; }
#settingsPage .table-scroll .data-table thead th { background: rgba(16, 31, 62, .95); }
/* 行悬停橙色微亮、选中行橙色左条（同考勤页行高亮语言） */
#settingsPage .data-table tbody tr[data-id]:hover { background: rgba(251, 146, 60, .08); }
#settingsPage .data-table tbody tr.row-selected,
#settingsPage .data-table tbody tr.row-selected:hover { background: rgba(251, 146, 60, .12); box-shadow: inset 3px 0 0 rgba(251, 168, 82, .8); }
/* 左侧分类菜单：深色玻璃 + 橙色选中（同顶部页签 active） */
#settingsPage .settings-nav-item { border-color: rgba(148, 178, 224, .18); background: rgba(255, 255, 255, .04); color: #a8bcdf; }
#settingsPage .settings-nav-item:hover { color: #e8f0ff; border-color: rgba(122, 162, 255, .4); background: rgba(88, 130, 255, .12); }
#settingsPage .settings-nav-item.active { color: #ffd9ad; border-color: rgba(251, 168, 82, .45); background: rgba(251, 146, 60, .16); }
/* 表单区：深蓝底、蓝灰边框、浅色文字 */
#settingsPage .user-form { border-color: rgba(122, 162, 255, .18); background: rgba(10, 20, 40, .45); }
#settingsPage .form-field label { color: #a8bcdf; }
#settingsPage .form-field input,
#settingsPage .form-field select,
#settingsPage .form-field textarea { border-color: rgba(148, 178, 224, .22); background: rgba(10, 20, 40, .55); color: #e8f0ff; }
/* 员工/客户账号标签：深色玻璃 + 橙色选中 */
#settingsPage .user-tab { border-color: rgba(148, 178, 224, .18); background: rgba(255, 255, 255, .04); color: #a8bcdf; }
#settingsPage .user-tab:hover { color: #e8f0ff; border-color: rgba(122, 162, 255, .4); }
#settingsPage .user-tab.active { color: #ffd9ad; border-color: rgba(251, 168, 82, .45); background: rgba(251, 146, 60, .16); }
#settingsPage .user-tab.active .tab-count { color: #ffd9ad; }
/* 部门下拉 / 历史记录分隔线：深蓝玻璃 */
#settingsPage .dept-select-panel,
#settingsPage .dept-dd-panel { background: #0c1730; border-color: rgba(122, 162, 255, .25); }
#settingsPage .salary-history { border-top-color: rgba(148, 178, 224, .18); }

/* ---------- 顶栏用户下拉菜单（点用户区域展开：个人设置 / 退出登录） ---------- */
.portal-user {
  position: relative;
  padding: 6px 10px;
  margin: -6px -10px;
  border-radius: 10px;
  cursor: pointer;
  transition: background .2s ease;
}
.portal-user:hover,
.portal-user.menu-open { background: rgba(255, 255, 255, .07); }
.portal-user .portal-menu {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  min-width: 138px;
  padding: 6px;
  display: none;
  background: #0d1a35;
  border: 1px solid rgba(122, 162, 255, .28);
  border-radius: 12px;
  box-shadow: 0 18px 38px -14px rgba(2, 6, 18, .95);
}
.portal-user.menu-open .portal-menu { display: block; }
.portal-menu-item {
  display: block;
  width: 100%;
  padding: 9px 12px;
  border: 0;
  border-radius: 8px;
  background: none;
  font-size: 13.5px;
  color: #dce6f7;
  text-align: left;
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  transition: background .15s ease, color .15s ease;
}
.portal-menu-item:hover { background: rgba(251, 146, 60, .14); color: #ffd9ad; }
.portal-menu-item.danger { color: #ff8b98; }
.portal-menu-item.danger:hover { background: rgba(232, 40, 60, .16); color: #ffa2ad; }

/* ---------- 个人设置页（profile.html，dark-page 风格与系统设置页同族） ---------- */
#profilePage .data-panel {
  border: 1px solid rgba(122, 162, 255, .18);
  border-radius: 14px;
  background: linear-gradient(180deg, #101d3a 0%, #0b1730 100%);
  box-shadow: 0 16px 34px -18px rgba(2, 6, 18, .95);
}
#profilePage .data-panel-head h2 { color: #e8f0ff; }
.profile-panel { max-width: 960px; margin: 0 auto; }
.profile-layout { display: flex; gap: 36px; align-items: flex-start; flex-wrap: wrap; }
.profile-side {
  flex: 0 0 180px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding-top: 8px;
}
.profile-avatar { width: 84px; height: 84px; font-size: 32px; }
.profile-avatar-tip { font-size: 12.5px; color: var(--muted); }
.profile-meta { display: grid; gap: 7px; margin-top: 10px; }
.profile-meta p { display: flex; gap: 12px; font-size: 13.5px; }
.profile-meta span { color: var(--muted); }
.profile-meta b { color: #e8f0ff; font-weight: 600; }
.profile-main { flex: 1 1 420px; min-width: 0; }
.profile-block {
  padding: 20px;
  border: 1px solid rgba(122, 162, 255, .18);
  border-radius: 12px;
  background: rgba(10, 20, 40, .45);
}
.profile-block + .profile-block { margin-top: 18px; }
.profile-block-title { font-size: 15px; font-weight: 600; color: #ffd9ad; margin-bottom: 16px; }
.profile-block-tip { font-size: 12.5px; font-weight: 400; color: var(--muted); margin-left: 8px; }
.profile-foot { margin-top: 20px; }
#profilePage .form-field label { color: #a8bcdf; }
#profilePage .form-field input {
  border-color: rgba(148, 178, 224, .22);
  background: rgba(10, 20, 40, .55);
  color: #e8f0ff;
}
#profilePage .form-field input:disabled { color: #a8bcdf; opacity: .75; }
/* 只读字段（公司）：淡显并禁用编辑光标，提示由管理员维护 */
#profilePage .form-field input[readonly] { color: #a8bcdf; background: rgba(10, 20, 40, .3); cursor: not-allowed; }
.profile-readonly-tip { font-size: 12px; font-weight: 400; color: var(--muted); margin-left: 8px; }
/* 基本资料三列行：姓名占两列；邮箱/手机号/邮箱验证码同行（验证码发送至绑定邮箱） */
.form-grid.cols-3 .span-2 { grid-column: span 2; }
#profilePage .code-row { grid-template-columns: 1fr 1fr; }
#profilePage .code-row > * { min-width: 0; }
#profilePage .code-btn { padding: 0 6px; font-size: 13px; }
#profilePage .code-row input { border-color: rgba(148, 178, 224, .22); background: rgba(10, 20, 40, .55); color: #e8f0ff; }
#profilePage .code-btn { border-color: rgba(148, 178, 224, .3); background: rgba(251, 146, 60, .12); color: #ffd9ad; }
#profilePage .code-btn:hover { background: rgba(251, 146, 60, .22); }
#profilePage .code-btn:disabled { opacity: .5; cursor: not-allowed; background: rgba(251, 146, 60, .06); }
/* 三列字段行（修改密码区），空间不够时逐级收窄 */
.form-grid.cols-3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 900px) { .form-grid.cols-3 { grid-template-columns: 1fr; } }

/* ---------- 设置页模态框：新增/编辑/安排等操作从内联表单改为弹窗 ----------
   复用原有 id（overlay 承接 auth-hidden 显隐），JS 开合逻辑不变；
   backdrop-filter/transform 只在 header/按钮上，模态框祖先无此类属性，fixed 定位安全 */
.modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 500;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  background: rgba(2, 6, 18, .62);
  backdrop-filter: blur(3px);
}
.modal-box {
  width: min(780px, 100%);
  max-height: min(88vh, 860px);
  display: flex;
  flex-direction: column;
  border-radius: 16px;
  border: 1px solid rgba(122, 162, 255, .25);
  background: linear-gradient(180deg, #101d3a 0%, #0b1730 100%);
  box-shadow: 0 30px 70px -20px rgba(2, 6, 18, .95);
  overflow: hidden;
  animation: modalIn .2s ease;
}
.modal-box.modal-lg { width: min(980px, 100%); }
.modal-box.modal-sm { width: min(560px, 100%); }
@keyframes modalIn { from { opacity: 0; transform: translateY(14px) scale(.985); } }
.modal-head {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 15px 22px;
  border-bottom: 1px solid rgba(148, 178, 224, .14);
}
.modal-head h3 { font-size: 16.5px; font-weight: 600; color: #eef4ff; }
.modal-close {
  width: 30px;
  height: 30px;
  border-radius: 8px;
  border: 1px solid rgba(148, 178, 224, .2);
  background: rgba(255, 255, 255, .04);
  color: #a8bcdf;
  font-size: 17px;
  line-height: 1;
  cursor: pointer;
  transition: color .2s ease, border-color .2s ease, background .2s ease;
}
.modal-close:hover { color: #ffd9ad; border-color: rgba(251, 168, 82, .45); background: rgba(251, 146, 60, .14); }
.modal-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; padding: 20px 22px; scrollbar-width: none; }
.modal-body::-webkit-scrollbar { display: none; }
/* 弹窗内的表单：去掉 user-form 自带的边框底色（外层 modal-box 已有） */
.modal-body .user-form { border: 0; background: none; padding: 0; margin-bottom: 0; }
/* 弹窗内列表自然排布：整体由 modal-body 滚动，不再嵌套内部滚动/吸附 */
#settingsPage .modal-body .table-scroll { flex: 0 0 auto; min-height: 0; overflow: visible; max-height: none; }
#settingsPage .modal-body .table-scroll .data-table thead th { position: static; }
/* 弹窗打开时锁住背后内容滚动 */
body:has(.modal-overlay:not(.auth-hidden)) .settings-content { overflow: hidden; }

/* ---------- 工作台集装箱卡片点击动画（吊起 → 砸向屏幕中底 → 爆开进新页面） ---------- */
/* 飞行的集装箱克隆件：外观沿用 #dashboardPage .mod-card，这里只管定位层级 */
.mod-fly {
  position: fixed;
  z-index: 200;
  pointer-events: none;
  will-change: transform;
}
/* 爆炸碎片：小钢片，颜色由 JS 内联 */
.shard {
  position: fixed;
  z-index: 201;
  border-radius: 2px;
  pointer-events: none;
  will-change: transform, opacity;
}
/* 爆炸火光圆 */
.boom-flash {
  position: fixed;
  z-index: 202;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(circle, rgba(255, 241, 219, .95), rgba(251, 146, 60, .55) 40%, transparent 70%);
}
/* 集装箱裂开的两半：与飞行件同款外观，用 clip-path 切开 */
.boom-half {
  position: fixed;
  z-index: 201;
  pointer-events: none;
  will-change: transform, opacity;
  background:
    linear-gradient(180deg, rgba(9, 18, 38, .16) 0%, rgba(7, 14, 30, .42) 100%),
    url("../img/box.png?v=202609263") center / cover no-repeat;
}
/* 爆炸白屏罩：以爆点为中心的放射光，盖满全屏时跳转新页面 */
.boom-cover {
  position: fixed;
  inset: 0;
  z-index: 203;
  pointer-events: none;
}


/* 油耗考核开关缩小版：同格内并列显示百公里油耗数据 */
.assess-switch-sm { width: 32px; height: 18px; }
.assess-switch-sm i::after { width: 14px; height: 14px; }
.assess-switch-sm input:checked + i::after { transform: translateX(14px); }
.fuel-wrap { display: inline-flex; align-items: center; gap: 5px; }
.fuel-val, .road-val { font-size: 14.5px; font-weight: 600; color: #dce6f7; font-variant-numeric: tabular-nums; white-space: nowrap; }

/* 整列出勤确认弹窗（考勤页深色玻璃风） */
.att-confirm {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(4, 8, 18, .6);
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}
.att-confirm-box {
  width: 340px;
  padding: 24px;
  border-radius: 14px;
  border: 1px solid rgba(122, 162, 255, .25);
  background: linear-gradient(180deg, #101d3a, #0b1730);
  box-shadow: 0 24px 60px -12px rgba(2, 6, 18, .9);
}
.att-confirm-text { color: #e8f0ff; font-size: 15px; font-weight: 600; line-height: 1.6; }
.att-confirm-hint { color: #8fa3c0; font-size: 13px; line-height: 1.6; margin-top: 6px; }
.att-confirm-btns { display: flex; gap: 10px; margin-top: 20px; }
.att-confirm-btn {
  flex: 1;
  padding: 9px 0;
  border-radius: 9px;
  border: 1px solid rgba(148, 178, 224, .3);
  background: rgba(255, 255, 255, .05);
  color: #a8bcdf;
  font: inherit;
  font-size: 14px;
  cursor: pointer;
  transition: background .2s ease, color .2s ease, border-color .2s ease;
}
.att-confirm-btn:hover { color: #e8f0ff; background: rgba(88, 130, 255, .16); }
.att-confirm-btn.primary {
  color: #ffd9ad;
  border-color: rgba(251, 168, 82, .55);
  background: rgba(251, 146, 60, .2);
}
.att-confirm-btn.primary:hover { color: #fff; background: rgba(251, 146, 60, .34); }
/* 表头日期可点击：手型光标 */
.dark-page .att-month-table th[data-day] { cursor: pointer; }

/* 考核表起始公里：自动读取带出的值只读展示 */
.settle-input[readonly] { cursor: default; opacity: .8; }

/* 考核超标数字红色提醒：油耗>30、高速>50 */
.fuel-val.assess-bad, .road-val.assess-bad { color: #ff5f5f; }

/* ---------- 员工列表社保/公积金 Y/N 颜色 ---------- */
.mono.yn-yes { color: #34d399; font-weight: 700; }
.mono.yn-no { color: #f87171; font-weight: 700; }


/* 左侧菜单底部"返回工作台"：橙色点缀（与退出登录/顶栏选中同语言），固定在菜单最下方 */
#settingsPage .settings-nav-back {
  justify-content: center;
  text-decoration: none;
  text-align: center;
  color: #ffd9ad;
  border-color: rgba(251, 168, 82, .45);
  background: rgba(251, 146, 60, .16);
}
#settingsPage .settings-nav-back:hover { color: #ffe6c7; border-color: rgba(251, 168, 82, .75); background: rgba(251, 146, 60, .26); }

/* 考核表已付锁定行：不变淡，输入框改为与"公里数"计算列一致的纯数值展示 */
.att-assess-table tr[data-locked] .settle-input {
  border: none;
  background: transparent;
  padding: 7px 0;
  font-size: 14.5px;
  font-weight: 600;
  color: #dce6f7;
  cursor: default;
}
.att-assess-table tr[data-locked] .assess-switch { cursor: default; }