/* ============================================================
 * 中钰招标 · V3-INT-002 全站视觉标准 tokens
 * 版本：v1.0（2026-08-13 冻结）
 * 定位：全站唯一视觉标准源。任何页面禁止硬编码品牌色，
 *       一律引用本文件变量。修改本文件需走评审。
 * 部署：/static/css/tokens.css
 * 用法：<link rel="stylesheet" href="/static/css/tokens.css">
 * ============================================================ */

:root {
  /* ---- 品牌主色（与官网 V3-INT-002 完全一致，禁改） ---- */
  --red:        #C8161D;   /* 品牌红：重点标签、栏目标签、强调 */
  --red-dark:   #9E0F15;
  --red-deep:   #7C0B10;
  --blue:       #1A5284;   /* 品牌蓝：主导航、主按钮、链接强调 */
  --blue-dark:  #123A75;
  --navy:       #14264C;   /* 深蓝：页脚、工作台顶栏、大屏标题 */
  --gold:       #C9A063;   /* 品牌金：点缀、分割线、悬停高光 */
  --gold-light: #E3C893;

  /* ---- 兼容别名（供存量页面变量名直接引用，禁新增使用） ---- */
  --cyan:        #1A5284;   /* = --blue，command-center 等页面别名 */
  --cyan-light:  #7B9CC4;   /* 浅蓝，= --chart-6 */
  --purple:      #14264C;   /* = --navy，command-center 图标色别名 */

  /* ---- 衍生色 ---- */
  --blue-light:  #2E75B6;   /* 品牌浅蓝：hover 态、渐变亮端 */
  --bg-blue:     rgba(26,82,132,.08);  /* 品牌蓝浅底：选中行、浅底卡片 */

  /* ---- 中性色 ---- */
  --bg:   #F4F5F7;         /* 页面底色 */
  --line: #DDDDDD;         /* 边线 */
  --txt:  #2B2B2B;         /* 正文 */
  --txt2: #666666;         /* 次要文字 */
  --txt3: #999999;         /* 辅助/占位文字 */

  /* ---- 字体 ---- */
  --serif: "Noto Serif SC","Source Han Serif SC","STZhongsong","SimSun",serif;   /* 标题宋体 */
  --sans:  "Microsoft YaHei","PingFang SC","Noto Sans SC",Arial,sans-serif;      /* 正文黑体 */
  --font-display: var(--serif);  /* V3-INT-002 标题字别名 */

  /* ---- 语义色（功能反馈，与品牌色解耦） ---- */
  --success: #2E7D32;      /* 通过/已完成/已支付 */
  --warning: #ED8936;      /* 待审/待处理/注意 */
  --danger:  #C8161D;      /* 驳回/废标/删除（复用品牌红） */
  --info:    #1A5284;      /* 提示/信息（复用品牌蓝） */

  /* ---- 图表色板（ECharts/Chart.js 等 JS 场景使用） ----
     注意：canvas 图表不解析 CSS 变量，JS 中请引入
     /static/js/chart-theme.js 导出的同名色值常量。 */
  --chart-1: #1A5284;      /* 品牌蓝 */
  --chart-2: #C8161D;      /* 品牌红 */
  --chart-3: #C9A063;      /* 品牌金 */
  --chart-4: #14264C;      /* 深蓝 */
  --chart-5: #2E7D32;      /* 语义绿 */
  --chart-6: #7B9CC4;      /* 浅蓝（辅助系列） */

  /* ---- 圆角与阴影 ---- */
  --radius:    6px;
  --shadow:    0 1px 4px rgba(20,38,76,.06);
  --shadow-lg: 0 4px 16px rgba(20,38,76,.12);

  /* ---- 工作台骨架 ---- */
  --topbar-bg: linear-gradient(90deg, var(--navy), var(--blue-dark));  /* 工作台顶栏 */
  --topbar-h:  52px;                                                   /* 顶栏高度 */
}

/* ---- 工作台顶栏通用类（可选引用，不强制） ---- */
.zy-topbar {
  height: var(--topbar-h);
  background: var(--topbar-bg);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 20px;
  font-family: var(--sans);
}
.zy-topbar .zy-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 16px;
  font-weight: bold;
  letter-spacing: 2px;
}
.zy-topbar .zy-brand img { height: 32px; width: auto; }
.zy-topbar .zy-brand small {
  font-size: 11px;
  font-weight: normal;
  color: rgba(255,255,255,.55);
  letter-spacing: 1px;
}
.zy-topbar a { color: rgba(255,255,255,.85); text-decoration: none; }
.zy-topbar a:hover { color: var(--gold-light); }

/* ============================================================
   工作台顶栏统一骨架 · V3-INT-002（追加到 tokens.css 末尾，v1.1）
   依赖变量：--topbar-bg / --topbar-h / --gold / --gold-light / --sans / --red
   v1.1：用户信息改双行结构、预留中间插槽、补 ARIA
   ============================================================ */

/* 骨架本体强化：吸顶 + 金色底线（呼应官网主导航，2px 更收敛） */
.zy-topbar {
  box-sizing: content-box;   /* border 计入外高，保证 52+2=54px 补偿稳定（防全局 border-box reset） */
  position: sticky;          /* 不用 fixed：零全局副作用，不要求 body 加 padding */
  top: 0;
  z-index: 1000;
  border-bottom: 2px solid var(--gold);
  box-shadow: 0 2px 8px rgba(20,38,76,.35);
  flex: none;                /* 在 flex 布局页中不被压缩 */
}

/* 中间插槽（预留：面包屑/全局搜索，当前为空不渲染） */
.zy-topbar .zy-center { flex: 1; display: flex; align-items: center; justify-content: center; min-width: 0; }

/* 左侧：Logo + 系统名 */
.zy-topbar .zy-brand img { height: 32px; width: auto; }
.zy-topbar .zy-brand .zy-divider {
  width: 1px; height: 22px;
  background: rgba(255,255,255,.25);
  margin: 0 4px;
}
.zy-topbar .zy-brand .zy-app {
  font-size: 17px; font-weight: bold; letter-spacing: 2px; color: #fff;
}
.zy-topbar .zy-brand .zy-app small {
  display: block; font-size: 10px; font-weight: normal;
  letter-spacing: 1px; color: rgba(255,255,255,.5); margin-top: 1px;
}

/* 右侧：用户信息（双行） + 退出 */
.zy-topbar .zy-side { display: flex; align-items: center; gap: 16px; }
.zy-topbar .zy-user { display: flex; align-items: center; gap: 8px; }
.zy-topbar .zy-avatar {
  width: 30px; height: 30px; border-radius: 50%;
  background: var(--gold); color: var(--navy);
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: bold; flex: none;
}
.zy-topbar .zy-user-meta { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.zy-topbar .zy-uname { font-size: 13px; color: #fff; max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.zy-topbar .zy-urole { font-size: 11px; color: var(--gold-light); }
.zy-topbar .zy-logout {
  display: flex; align-items: center; gap: 5px;
  background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.22);
  color: rgba(255,255,255,.9); font-size: 12px;
  padding: 5px 13px; border-radius: 6px; cursor: pointer;
  transition: all .2s; font-family: var(--sans);
}
.zy-topbar .zy-logout:hover { background: var(--red); border-color: var(--red); color: #fff; }

/* 窄屏：隐藏英文名与角色行，中文系统名保留（用户识别所在工作台的唯一标识） */
@media (max-width: 768px) {
  .zy-topbar .zy-brand .zy-app small,
  .zy-topbar .zy-urole { display: none; }
  .zy-topbar .zy-uname { max-width: 64px; }
  .zy-topbar .zy-brand .zy-app { font-size: 15px; }
}


/* ★2026-10-08 新增：AI 标识色（纯新增，不修改既有令牌，不影响 65 个在用页面）
   背景：代理端页面的 AI 元素此前混用 4 种紫（#6366f1 / #4f46e5 / #7c3aed / #8b5cf6），
   均为 Tailwind/Vue 默认紫，不在站点色板内。AI 元素需要一个可识别的标识色（利于识别），
   但四紫并存本身就是不一致。此处收敛为单一令牌，供全站 AI 元素统一引用。 */
:root{
  --ai:        #5B4BC4;   /* AI 主标识色（较 Tailwind #6366f1 更深、更沉稳） */
  --ai-dark:   #453A9E;   /* 悬停/强调 */
  --ai-light:  #EEF0FF;   /* AI 面板浅底 */
  --ai-border: #C7CCF5;   /* AI 面板边框 */
}

/* ★2026-10-08 新增：状态浅底色与描边令牌
   背景：此前各页面/脚本对"成功/警告/危险/信息"的浅底各写各的，
   同一语义存在 5~6 种近似浅色（如成功浅底有 #f0fdf4/#dcfce7/#d1fae5/#f6ffed/#d4edda 等），
   这本身就是"颜色不一致"。此前我以"强转会破坏对比度"为由放任，属判断不当——
   正确做法是【为浅底也定义少量令牌】，而不是不加约束。
   纯新增，不修改既有令牌。 */
:root{
  --success-bg:     #F0FDF4;   /* 成功浅底 */
  --success-border: #BBF7D0;
  --warning-bg:     #FFFBEB;   /* 警告浅底 */
  --warning-border: #FDE68A;
  --danger-bg:      #FEF2F2;   /* 危险浅底 */
  --danger-border:  #FECACA;
  --info-bg:        #EFF6FF;   /* 信息浅底 */
  --info-border:    #BFDBFE;
  --neutral-bg:     #F5F5F5;   /* 中性浅底 */
}

/* ★2026-10-08 补：--primary-gradient 此前【被使用但从未定义】
   来历：提交 510f6a8（09-23）"HTML内联67处硬编码颜色替换为CSS变量"把内联色值换成了
   这个变量名，却漏了定义。后果：agent-dashboard.html 三处背景失效（其中一处是
   「进行中项目」统计卡 —— 白字白底、文字不可见）。
   本处按主色系补定义（与其余三张统计卡的 linear-gradient 写法保持一致）。 */
:root{
  --primary-gradient: linear-gradient(135deg, var(--blue) 0%, var(--blue-dark) 100%);
}