/* stylelint-disable color-hex-case */
:root {
  /* ---------------字体颜色 begin--------------- */

  // 标题
  --ik-color-font-title: #181c32;
  // 正文
  --ik-color-font-normal: #5e6278;
  // 辅助文字
  --ik-color-font-secondary: #181c3299;
  // 占位
  --ik-color-font-placeholder: #181c3266;
  // 禁用
  --ik-color-font-disabled: #5e627866;
  // 背景色字体反转
  --ik-color-font-reverse: #fff;

  /* ---------------字体颜色 end--------------- */

  /* ---------------背景色 begin--------------- */
  // 表格表头
  --ik-color-bg-table-header: #FAFBFC;
  // 表格斑马纹颜色
  --ik-table-striped-color: #F7F9FA;
  // 表格斑马纹滑过颜色  导航选中色
  --ik-table-striped-hover-color: #EAEEF2;
  // 页签栏背景
  --ik-color-bg-nav-tag: #eaeef2;
  // 页面标签
  --ik-color-bg-page-tag: #f5f8fa;
  // 整体页面背景/导航选中背景
  --ik-color-bg-page: #f5f8fa;
  // 左侧导航背景/内容区域背景
  --ik-color-bg-page-content: #fff;
  // form控件(输入框等)、表格悬浮、表单下拉面板选中
  --ik-color-bg-form: #f5f8fa;
  // form输入控件悬浮
  --ik-color-bg-input-hover: rgb(2 158 247 / 5%);
  // form输入控件完成输入
  --ik-color-bg-input-success: rgb(2 158 247 / 5%);
  // form输入控件禁用
  --ik-color-bg-input-disabled: rgba(227 228 233 1);
  // form控件选中禁用
  --ik-color-bg-form-disabled-open: rgba(2 158 247 40%);
  // form控件未选中禁用
  --ik-color-bg-form-disabled-close: rgba(227 228 233 1);

  // form控件
  --ik-color-bg-form-error: rgba(241 65 108 0.15);
  // 双色图标背景色
  --ik-color-bg-icon: #f3f6f9;

  /* ---------------背景色 end--------------- */

  /* ---------------双色图标 begin--------------- */
  // 无背景-深色
  --ik-color-icon-dark: #a1a5b7;
  --ik-color-icon-light: rgb(227 228 233);
  // --ik-color-icon-light-disabled: rgba(226 227 233 40%);
  --ik-color-bgicon-dark: #71778d;
  --ik-color-bgicon-light: #b9bac5;
  --ik-color-icon-light-hover: #81CFFB;
  --ik-color-icon-error-light: #F8A0B5;
  --ik-color-icon-error-bg: #FDE3E9;

  /* ---------------双色图标 end--------------- */

  /* ---------------功能色 begin--------------- */
  // 信息提示
  --ik-color-primary: #029ef7;
  --ik-color-info: var(--ik-color-primary);
  // 成功提示
  --ik-color-success: #50cd89;
  // 失败提示
  --ik-color-error: #f1416c;
  // 警告提示
  --ik-color-warning: #ffc700;

  /* ---------------功能色 end--------------- */

  /* ---------------分割线 begin--------------- */
  --ik-color-divider: #f0f3f5;
  // 表格分割线
  --ik-color-divider-table: #f5f8fa;

  /* ---------------分割线 end--------------- */

  /* ---------------标签 begin--------------- */

  // 主色
  --ik-color-tag-primary: var(--ik-color-primary);
  --ik-color-tag-primary-light: #e5f5fe;
  // 辅助色
  --ik-color-tag-success: var(--ik-color-success);
  --ik-color-tag-success-light: #e6f8ee;
  // 辅助色
  --ik-color-tag-error: var(--ik-color-error);
  --ik-color-tag-error-light: #fdecf0;
  // 辅助色
  --ik-color-tag-warning: var(--ik-color-warning);
  --ik-color-tag-warning-light: #ffc80025;

  /* ---------------标签 end--------------- */

  /* ---------------按钮 begin--------------- */
  // 次要按钮
  --ik-color-bg-button-secondary: #d9f1fe;
  --ik-color-font-button-secondary: #029ef7;
  --ik-color-bg-button-secondary-mousedown: #b4e2fc;
  --ik-color-font-button-secondary-mousedown: #029ef7;
  --ik-color-bg-button-secondary-hover: #cdedfd;
  --ik-color-font-button-secondary-hover: #029ef7;
  --ik-color-bg-button-secondary-disabled: #cdedfd;
  --ik-color-font-button-secondary-disabled: #afdffc;

  /* ---------------按钮 end--------------- */
}

:root.dark {
  /* ---------------字体颜色 begin--------------- */
  // 标题 #FFFFFF 90%
  --ik-color-font-title: #ffffffe6;
  // 正文
  --ik-color-font-normal: #92929f;
  // 辅助文字 #FFFFFF 60%
  --ik-color-font-secondary: #fff9;
  // 占位 #FFFFFF 40%
  --ik-color-font-placeholder: #fff6;
  // 禁用 #92929F 40%
  --ik-color-font-disabled: #92929f66;
  // 背景色字体反转
  --ik-color-font-reverse: #5e6278;

  /* ---------------字体颜色 end--------------- */

  /* 背景色 begin */
  // 表格表头 #28283C 70%
  --ik-color-bg-table-header: #28283cb3;
  // 表格斑马纹颜色
  --ik-table-striped-color: var(--el-fill-color-lighter);
  // 表格斑马纹滑过颜色
  --ik-table-striped-hover-color: #28283c;
  // 页面标签 #28283C
  --ik-color-bg-page-tag: #28283c;
  // 整体页面背景 #151521
  --ik-color-bg-page: #151521;
  // 左侧导航背景/内容区域背景 #1E1E2D
  --ik-color-bg-page-content: #1e1e2d;
  // 输入框、表格悬浮、表单下拉面板选中 #2B2B40
  --ik-color-bg-form: #2b2b40;
  // 双色图标背景色 #2B2B40
  --ik-color-bg-icon: #2b2b40;
  // form输入控件悬浮
  --ik-color-bg-input-hover: rgb(2 158 247 / 5%);
  // form输入控件完成输入
  --ik-color-bg-input-success: rgb(2 158 247 / 5%);
  // form输入控件禁用
  --ik-color-bg-input-disabled: rgba(227 228 233 1);
  // form控件选中禁用
  --ik-color-bg-form-disabled-open: rgba(2 158 247 40%);
  // form控件未选中禁用
  --ik-color-bg-form-disabled-close: rgba(227 228 233 1);

  /* ---------------背景色 end--------------- */

  /* ---------------双色图标 begin--------------- */
  // 无背景-深色 #50526B
  --ik-color-icon-dark: #50526b;
  // 无背景-浅色 #C5C5D8
  --ik-color-icon-light: #c5c5d8;
  // 带背景-浅色 #81869E
  --ik-color-bgicon-dark: #81869e;
  // 带背景-深色 #50526B
  --ik-color-bgicon-light: #50526b;
  --ik-color-icon-light-hover: #81CFFB;
  --ik-color-icon-error-light: #F8A0B5;
  --ik-color-icon-error-bg: #FDE3E9;

  /* ---------------双色图标 end--------------- */

  /* ---------------功能色 begin--------------- */
  --ik-color-primary: #029ef7;
  // 信息提示 #029EF7
  --ik-color-info: var(--ik-color-primary);
  // 成功提示 #50CD89
  --ik-color-success: #50cd89;
  // 失败提示 #F1416C
  --ik-color-error: #f1416c;
  // 警告提示 #FFC700
  --ik-color-warning: #ffc700;

  /* ---------------功能色 end--------------- */

  /* ---------------分割线 begin--------------- */
  // 分割线 border
  --ik-color-divider: #2b2b40;
  // 表格分割线 #2B2B40
  --ik-color-divider-table: #2b2b40;

  /* ---------------分割线 end--------------- */

  /* ---------------标签 begin--------------- */
  // 主色-深 #029EF7
  --ik-color-tag-primary: var(--ik-color-primary);
  // 主色-浅 #212E48
  --ik-color-tag-primary-light: #212e48;
  // 成功-深
  --ik-color-tag-success: var(--ik-color-success);
  // 成功-浅 #1D3238
  --ik-color-tag-success-light: #1d3238;
  // 错误-深
  --ik-color-tag-error: var(--ik-color-error);
  // 错误-浅 #3A2434
  --ik-color-tag-error-light: #3a2434;
  // 警告-深
  --ik-color-tag-warning: var(--ik-color-warning);
  // 警告-浅 #392F28
  --ik-color-tag-warning-light: #392f28;

  /* ---------------标签 end--------------- */

  /* ---------------按钮 begin--------------- */
  // 次要按钮
  --ik-color-bg-button-secondary: #d9f1fe;
  --ik-color-font-button-secondary: #029ef7;
  --ik-color-bg-button-secondary-mousedown: #b4e2fc;
  --ik-color-font-button-secondary-mousedown: #029ef7;
  --ik-color-bg-button-secondary-hover: #cdedfd;
  --ik-color-font-button-secondary-hover: #029ef7;
  --ik-color-bg-button-secondary-disabled: #cdedfd;
  --ik-color-font-button-secondary-disabled: #afdffc;

  /* ---------------按钮 end--------------- */
}
