/* ===== n2-inline:begin tokens =====
   由 rule/UI规范/inline-assets.mjs 从 设计稿/assets/tokens.css 生成。
   不要手改这一段：设计稿更新后重跑一次脚本即可覆盖。===== */
/* ==========================================================================
   n2one Design Tokens
   --------------------------------------------------------------------------
   唯一来源。所有页面只允许引用这里的变量，不允许写死颜色/间距/字号。

   依据：
   - rule/n2one-UI设计规范.docx  v2.0（基于 N2one Design 5.x）
   - docs/CRUD页面UI规范.md      v1.0
   - docs/AI员工卡片式设计方案.md v1.0
   - docs/前端页面需求.md（布局/菜单/多标签页）
   ========================================================================== */

:root {
  /* ------------------------------------------------------------------
     1. 品牌主色阶（N2one Design 5.x 第 6 格为默认品牌色）
     ------------------------------------------------------------------ */
  --n2-color-primary: #1677ff;
  --n2-color-primary-hover: #4096ff;
  --n2-color-primary-active: #0958d9;
  --n2-color-primary-bg: #e6f4ff; /* 行悬停 / 选中底色 */
  --n2-color-primary-bg-hover: #bae0ff;
  --n2-color-primary-border: #91caff;

  /* ------------------------------------------------------------------
     2. 功能色
     ------------------------------------------------------------------ */
  --n2-color-success: #52c41a;
  --n2-color-success-bg: #f6ffed;
  --n2-color-success-border: #b7eb8f;

  --n2-color-warning: #faad14;
  --n2-color-warning-bg: #fffbe6;
  --n2-color-warning-border: #ffe58f;

  --n2-color-error: #ff4d4f;
  --n2-color-error-bg: #fff2f0;
  --n2-color-error-border: #ffccc7;
  /* 实心小底。上面第 6 格的亮色托不住白字，11～14px 徽标和实心危险按钮要用这一档。两个主题通用。 */
  --n2-color-error-strong: #cf1322; /* 白字 5.57:1 */
  --n2-color-error-strong-hover: #a8071a; /* 白字 7.75:1 */

  --n2-color-info: #1677ff;
  --n2-color-info-bg: #e6f4ff;

  /* 功能色文字。上面 6 格色只做填充，浅底上的小字要再深一档才够 4.5:1。 */
  --n2-text-success: #237804; /* 5.44:1 on #f6ffed */
  --n2-text-warning: #874d00; /* 6.53:1 on #fffbe6 */
  --n2-text-error: #cf1322; /* 5.10:1 on #fff2f0 */
  --n2-text-link: #0958d9; /* 6.16:1 on #ffffff，主色文字档 */
  --n2-text-link-hover: #003eb3; /* 8.97:1 on #ffffff */

  /* 状态圆点（CRUD 页面UI规范 4.3） */
  --n2-dot-success: #52c41a;
  --n2-dot-disabled: #bfbfbf;
  --n2-dot-pending: #faad14;
  --n2-dot-error: #ff4d4f;
  --n2-dot-draft: #8c8c8c;

  /* 工作流节点配色。6 类节点里 4 类有语义色可用（success/primary/warning/error），
     剩下通知（紫）和 HTTP（青）没有，单独立两个令牌；两者都是中明度色，
     深浅主题下都可读，因此不做暗色覆盖。 */
  --n2-wf-node-notify: #722ed1;
  --n2-wf-node-http: #13c2c2;

  /* ------------------------------------------------------------------
     3. 中性色（按透明度实现）
     ------------------------------------------------------------------ */
  --n2-text-primary: rgba(0, 0, 0, 0.88);   /* 主文字   ≈ #333 */
  --n2-text-secondary: rgba(0, 0, 0, 0.65); /* 次要文字 ≈ #666 */
  --n2-text-tertiary: rgba(0, 0, 0, 0.45);  /* 辅助文字 ≈ #999 */
  --n2-text-quaternary: rgba(0, 0, 0, 0.25);/* 占位/禁用 */
  --n2-text-inverse: #ffffff;

  /* ------------------------------------------------------------------
     4. 背景与边框
     ------------------------------------------------------------------ */
  --n2-bg-page: #f5f5f5;      /* 内容区底色 */
  --n2-bg-container: #ffffff; /* 卡片/表格 */
  --n2-bg-elevated: #ffffff;  /* 弹窗/下拉 */
  --n2-bg-layout: #ffffff;    /* 顶部栏/侧边栏 */
  --n2-bg-table-header: #fafafa;
  --n2-bg-hover: rgba(0, 0, 0, 0.04);
  --n2-bg-disabled: rgba(0, 0, 0, 0.04);
  --n2-bg-mask: rgba(0, 0, 0, 0.45);

  --n2-border: #d9d9d9;
  --n2-border-split: #f0f0f0;  /* 表格行分割线 */
  --n2-border-secondary: #f0f0f0;

  /* ------------------------------------------------------------------
     5. 字体
     ------------------------------------------------------------------ */
  --n2-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
    "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial,
    sans-serif;
  --n2-font-family-code: "SFMono-Regular", Consolas, "Liberation Mono", Menlo,
    monospace;

  /* 字号层级（docx 3.1） */
  --n2-font-display: 30px;  --n2-line-display: 38px;
  --n2-font-h1: 24px;       --n2-line-h1: 32px;
  --n2-font-h2: 20px;       --n2-line-h2: 28px;
  --n2-font-h3: 16px;       --n2-line-h3: 24px;
  --n2-font-body: 14px;     --n2-line-body: 22px;
  --n2-font-caption: 12px;  --n2-line-caption: 20px;

  --n2-font-weight-regular: 400;
  --n2-font-weight-medium: 500;
  --n2-font-weight-semibold: 600;

  /* ------------------------------------------------------------------
     6. 间距（8px 基数，docx 四）
     ------------------------------------------------------------------ */
  --n2-space-xxs: 4px;
  --n2-space-xs: 8px;
  --n2-space-sm: 12px;
  --n2-space-md: 16px;
  --n2-space-lg: 24px;
  --n2-space-xl: 32px;
  --n2-space-xxl: 48px;

  /* ------------------------------------------------------------------
     7. 圆角
     ------------------------------------------------------------------ */
  --n2-radius-sm: 4px;
  --n2-radius-base: 6px;  /* 按钮 */
  --n2-radius-md: 8px;    /* 卡片 / 弹窗 */
  --n2-radius-lg: 12px;   /* AI 员工卡片 */
  --n2-radius-round: 999px;

  /* ------------------------------------------------------------------
     8. 阴影
     ------------------------------------------------------------------ */
  --n2-shadow-card: 0 1px 2px rgba(0, 0, 0, 0.05);
  --n2-shadow-card-hover: 0 2px 8px rgba(0, 0, 0, 0.08);
  --n2-shadow-modal: 0 6px 16px rgba(0, 0, 0, 0.08);
  --n2-shadow-dropdown: 0 6px 16px rgba(0, 0, 0, 0.08);
  --n2-shadow-float: 0 6px 20px rgba(22, 119, 255, 0.32);

  /* ------------------------------------------------------------------
     9. 尺寸
     ------------------------------------------------------------------ */
  --n2-size-control: 32px;       /* 默认控件高度 */
  --n2-size-control-lg: 40px;
  --n2-size-control-sm: 24px;
  --n2-size-filter: 240px;       /* 筛选框统一宽度 */
  --n2-filter-entry-w: 216px;    /* 常用条件行行尾入口走道（更多条件查询 118 + 高级查询 90 + 8 间距） */
  --n2-filter-pin-gap: 8px;      /* 入口钉首行时的查询区列间距；常用区与更多抽屉共用（US202610130004-1） */

  --n2-size-topbar: 56px;
  --n2-size-sider: 220px;
  --n2-size-sider-collapsed: 64px;
  --n2-size-tabbar: 40px;
  --n2-size-breadcrumb: 40px;

  --n2-size-table-row: 48px;
  --n2-size-table-header: 48px;
  --n2-size-checkbox-col: 40px;
  --n2-size-index-col: 64px;
  --n2-size-actions-col: 216px;   /* 操作列默认宽；按钮多的表格在 <table> 上覆盖 */

  --n2-size-modal: 520px;
  --n2-size-modal-lg: 1040px;    /* 多标签页弹窗 */
  --n2-size-modal-xl: 1200px;    /* 全屏级编辑弹窗 */
  --n2-size-drawer: 480px;
  --n2-size-drawer-lg: 1040px;   /* 宽抽屉：多标签页配置，与宽弹窗同宽 */
  --n2-size-drawer-min: 320px;   /* 抽屉左缘拖动缩放的宽度下限 */
  --n2-size-drawer-context: 120px; /* 抽屉最宽时左侧保留的列表可见宽度 */
  --n2-size-avatar: 32px;
  --n2-size-ai-avatar: 48px;
  --n2-size-ai-card: 280px;
  --n2-size-ai-card-h: 320px;
  --n2-size-float-ball: 52px;

  /* ------------------------------------------------------------------
     10. 动效
     ------------------------------------------------------------------ */
  --n2-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --n2-duration-fast: 0.15s;
  --n2-duration-base: 0.2s;

  /* 层级 */
  --n2-z-sider: 100;
  --n2-z-topbar: 100;
  --n2-z-dropdown: 1050;
  --n2-z-modal: 1000;
  --n2-z-float: 900;
  --n2-z-message: 1100;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --n2-duration-fast: 0.001ms;
    --n2-duration-base: 0.001ms;
  }
}

/* ==========================================================================
   暗色主题 —— 预留层（一期不启用）
   --------------------------------------------------------------------------
   决策：一期只做浅色。结构已就位，因此二期不需要改组件 CSS。
   启用方式：在 <html> 上加 data-theme="dark"。
   若还要跟随系统，再打开下面被注释的媒体查询即可。
   选择器用 html[...] 而不是 [...]，是为了在层叠里稳压 :root 一头。
   正文对比度按 #1f1f1f 容器底实测，全部 ≥ 4.5:1。
   ========================================================================== */
html[data-theme="dark"] {
  color-scheme: dark; /* 让原生滚动条/控件一起变暗 */

  /* 中性色反转 */
  --n2-text-primary: rgba(255, 255, 255, 0.85);
  --n2-text-secondary: rgba(255, 255, 255, 0.65);
  --n2-text-tertiary: rgba(255, 255, 255, 0.45);
  --n2-text-quaternary: rgba(255, 255, 255, 0.25);
  --n2-text-inverse: #ffffff;

  --n2-bg-page: #141414;
  --n2-bg-container: #1f1f1f;
  --n2-bg-table-header: #262626;
  --n2-bg-hover: rgba(255, 255, 255, 0.08);
  --n2-bg-disabled: rgba(255, 255, 255, 0.08);
  --n2-bg-mask: rgba(0, 0, 0, 0.65);

  --n2-border: #424242;
  --n2-border-split: #303030;
  --n2-border-secondary: #303030;

  /* 主色：填充保持品牌色不变，浅底与边框走暗色档 */
  --n2-color-primary-bg: #111a2c;
  --n2-color-primary-bg-hover: #112545;
  --n2-color-primary-border: #15325b;

  /* 功能色：浅底换暗色档，文字换亮色档 */
  --n2-color-success-bg: #162312;
  --n2-color-success-border: #274916;
  --n2-color-warning-bg: #2b2111;
  --n2-color-warning-border: #594214;
  --n2-color-error-bg: #2c1618;
  --n2-color-error-border: #58181c;
  --n2-color-info-bg: #111a2c;

  --n2-text-success: #73d13d; /* 8.57:1 on #1f1f1f */
  --n2-text-warning: #ffc53d; /* 10.44:1 on #1f1f1f */
  --n2-text-error: #ff7875; /* 6.43:1 on #1f1f1f */
  --n2-text-link: #69b1ff; /* 7.33:1 on #1f1f1f */
  --n2-text-link-hover: #91caff;

  /* 暗色下阴影靠纯黑加深，浅色阴影会发灰 */
  --n2-shadow-card: 0 1px 2px rgba(0, 0, 0, 0.45);
  --n2-shadow-card-hover: 0 2px 8px rgba(0, 0, 0, 0.55);
  --n2-shadow-modal: 0 6px 16px rgba(0, 0, 0, 0.55);
  --n2-shadow-dropdown: 0 6px 16px rgba(0, 0, 0, 0.55);
  --n2-shadow-float: 0 6px 20px rgba(0, 0, 0, 0.6);
}

/* 跟随系统暗色（一期不启用，二期与上面的开关二选一）
@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) {
    color-scheme: dark;
  }
}
*/
/* ===== n2-inline:end tokens ===== */
