@charset "UTF-8";
/*
  @component step
  @display Step
  @chinese 步骤
  @family navigation
*/
:root {
  /*
    @desc horn-width
    @semantic 连接线粗细
    @namespace size/bounding
   */
  --step-horn-line-width: var(--line-1);
  /*
    @desc spacing
    @semantic 元素间距
    @namespace size/padding
   */
  --step-spacing: var(--box-medium-spacing);
  /*
    @desc circle-inner-font-size
    @semantic circle 模式内部字体大小
    @namespace size/font
   */
  --step-circle-inner-font-size: var(--p-body-1-icon-size);
  /*
    @desc title-font-size
    @semantic 标题字体大小
    @namespace size/font
   */
  --step-title-font-size: var(--p-body-2-icon-size);
  /*
    @desc content-font-size
    @semantic 描述文案字体大小
    @namespace size/font
   */
  --step-content-font-size: var(--p-body-1-icon-size);
  /*
    @desc circle-size
    @semantic circle 尺寸
    @namespace size/bounding
   */
  --step-circle-size: var(--s-7);
  /*
    @desc dot-size
    @semantic dot 尺寸
    @namespace size/bounding
   */
  --step-dot-size: var(--s-4);
  /*
    @desc arrow-size
    @semantic arrow 高度
    @namespace size/bounding
   */
  --step-arrow-size: 7.466666666666667vw;
  /*
    @desc common-active-color
    @semantic 激活颜色
    @namespace style/normal
   */
  --step-active-color: var(--color-brand-3);
  /*
    @desc node-bg-color
    @semantic 节点背景颜色
    @namespace style/normal
   */
  --step-node-bg-color: var(--color-white);
  /*
   @desc text-color
   @semantic 标题和描述文案颜色
   @namespace style/normal
  */
  --step-body-font-color: var(--color-text1-3);
  /*
    @desc process-title-font-color
    @semantic 标题 process 颜色
    @namespace style/normal
   */
  --step-title-process-color: var(--color-text1-4);
  /*
    @desc wait-line-color
    @semantic 连接线颜色
    @namespace style/normal
   */
  --step-wait-line-color: var(--color-line1-3);
  /*
    @desc vertical-spacing
    @semantic 垂直模式元素间距
    @namespace size/padding
   */
  --step-vertical-spacing: var(--s-4);
  /*
    @desc arrow-bg-color
    @semantic 已完成背景颜色(arrow 模式)
    @namespace style/finish
   */
  --step-arrow-finish-bg-color: var(--color-brand-1);
  /*
    @desc circle-node-font-color
    @semantic 字体颜色(circle 模式)
    @namespace style/finish
   */
  --step-circle-finish-font-color: var(--color-text1-1);
  /*
    @desc node-wait-border-color
    @semantic 边框颜色(dot 模式)
    @namespace style/finish
   */
  --step-dot-wait-border-color: var(--color-text1-1);
  /*
    @desc circle-node-font-color
    @semantic 节点内部字体颜色(circle 模式)
    @namespace style/process
   */
  --step-circle-process-font-color: var(--color-white);
  /*
    @desc arrow-bg-color
    @semantic 未完成背景颜色(arrow 模式)
    @namespace style/wait
   */
  --step-arrow-wait-color: var(--color-fill1-2);
  /*
    @desc arrow-bg-color
    @semantic 禁用背景颜色(arrow 模式)
    @namespace style/disabled
   */
  --step-arrow-disabled-bg-color: var(--color-fill1-1);
  /*
    @desc line-color
    @semantic 连接线颜色
    @namespace style/disabled
   */
  --step-horn-disabled-color: var(--color-line1-1);
  /*
    @desc node-border-color
    @semantic 节点颜色
    @namespace style/disabled
   */
  --step-node-disabled-border-color: var(--color-line1-4);
  /*
    @desc text-color
    @semantic 标题、描述字体颜色(禁用)
    @namespace style/disabled
   */
  --step-disabled-font-color: var(--color-text1-1);
}