/*
  @component step
  @display Step
  @chinese 步骤
  @family navigation
*/
:root {
  /*
      @desc horn-width
      @semantic 连接线宽度
      @namespace size/bounding
     */
  --step-horn-line-width: var(--line-1);
  /*
      @desc node-width
      @semantic 圆点宽度
      @namespace size/bounding
     */
  --step-node-border-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: 56rpx;
  /*
      @desc common-active-color
      @semantic 激活颜色
      @namespace state/normal
     */
  --step-active-color: var(--color-brand-3);
  /*
      @desc node-bg-color
      @semantic 节点背景颜色
      @namespace state/normal
     */
  --step-node-bg-color: var(--color-white);
  /*
    @desc text-color
    @semantic 标题和描述文案颜色
    @namespace state/normal
   */
  --step-body-font-color: var(--color-text1-3);
  /*
      @desc process-title-font-color
      @semantic 标题 process 颜色
      @namespace state/normal
     */
  --step-title-process-color: var(--color-text1-4);
  /*
      @desc wait-line-color
      @semantic 连接线颜色
      @namespace state/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 箭头已完成背景颜色
      @namespace state/finish
     */
  --step-arrow-finish-bg-color: var(--color-brand-1);
  /*
      @desc circle-node-font-color
      @semantic 箭头字体颜色
      @namespace state/finish
     */
  --step-circle-finish-font-color: var(--color-text1-1);
  /*
      @desc node-wait-border-color
      @semantic 圆点边框颜色
      @namespace state/finish
     */
  --step-dot-wait-border-color: var(--color-text1-1);
  /*
      @desc circle-node-font-color
      @semantic 节点内部字体颜色
      @namespace state/process
     */
  --step-circle-process-font-color: var(--color-white);
  /*
      @desc arrow-bg-color
      @semantic 箭头未完成背景颜色
      @namespace state/wait
     */
  --step-arrow-wait-color: var(--color-fill1-2);
  /*
      @desc arrow-bg-color
      @semantic 禁用背景颜色
      @namespace state/disabled
     */
  --step-arrow-disabled-bg-color: var(--color-fill1-1);
  /*
      @desc line-color
      @semantic 连接线颜色
      @namespace state/disabled
     */
  --step-horn-disabled-color: var(--color-line1-1);
  /*
      @desc node-border-color
      @semantic 节点颜色
      @namespace state/disabled
     */
  --step-node-disabled-border-color: var(--color-line1-4);
  /*
      @desc text-color
      @semantic 标题、描述字体颜色
      @namespace state/disabled
     */
  --step-disabled-font-color: var(--color-text1-1);
}
