body {
  /* color -------------------> */
  --color-text-dark: #262626;
  --color-text-dark-1: #595959;
  --color-text-gray: #8c8c8c;
  --color-text-gray-1: #aaa;
  --color-text-gray-2: #bfbfbf;
  --color-text-gray-3: #d3d5e0;
  --color-text-gray-4: #e0e1eb;
  --color-border: #e5e5e5;
  --color-border-bold: #d5d5d5;
  --color-background: #f2f3f5;
  --form-color-border: #d9d9d9;

  /* status */
  --color-primary: #165dff;
  --color-primary-light: #e8f3ff;
  --color-success: #00b42a;
  --color-success-light: #32cf8a;
  --color-warning: #ff9427;
  --color-danger: #fe5d4e;
  --color-cyan: #2abcff;
  --color-cyan-light: #5fc9fa;
  --color-blue: #3491fa;
  --color-blue-dark: #172666;
  --color-purple: #9877ff;
  --color-white: #fff;
  --color-dark: #262626;
  --color-transparent: transparent;

  /* shadow */
  --shadow-light: 0 0 1px rgba(0 0 0 0.15);

  /* size -------------------> */
  --font-size-base: 14px;
  --font-size-medium: 16px;
  --font-size-large: 18px;
  --border-radius: 8px;
  --border-radius-large: 12px;
  --border-radius-huge: 20px;

  /* font-family */
  --font-family: SourceHanSansCN, 'Helvetica Neue', Helvetica, 'PingFang SC',
    'Hiragino Sans GB', 'Microsoft YaHei', Arial, sans-serif;

  // arco
  --border-radius-small: 4px;
  --color-text-1: --color-text-dark-1;
}

// 自定义var
@input-color-border: var(--form-color-border);
@input-color-border_disabled: var(--form-color-border);
@input-color-border_hover: var(--form-color-border);
@input-color-border_error: var(--form-color-border);
@input-color-border_error_hover: var(--form-color-border);

@input-color-bg: var(--color-transparent);
@input-color-bg_hover: var(--color-transparent);
@input-color-bg_focus: var(--color-transparent);

@input-color-bg_error: var(--color-transparent);
@input-color-bg_error_hover: var(--color-transparent);

@form-color-bg_error: var(--color-transparent);
@form-color-bg_error_hover: var(--color-transparent);
@form-color-bg_error_focus: var(--color-transparent);
@form-color-bg_warning: var(--color-transparent);
@form-color-bg_warning_hover: var(--color-transparent);
@form-color-bg_warning_focus: var(--color-transparent);
@form-color-bg_success: var(--color-transparent);
@form-color-bg_success_hover: var(--color-transparent);
@form-color-bg_success_focus: var(--color-transparent);

@form-color-border_validating: var(--form-color-border);
@form-color-border_validating_hover: var(--color-primary-6);
@form-color-border_error: rgb(var(--danger-6));
@form-color-border_error_hover: rgb(var(--danger-6));
@form-color-border_success: rgb(var(--success-6));
@form-color-border_success_hover: rgb(var(--success-6));
@form-color-border_warning: rgb(var(--warning-6));
@form-color-border_warning_hover: rgb(var(--warning-6));

@picker-color-border: var(--form-color-border);
@picker-color-border_hover: var(--form-color-border);
@picker-color-border_disabled: var(--color-border);
@picker-color-border_error: rgb(var(--danger-6));
@picker-color-border_error_hover: rgb(var(--danger-6));
@picker-color-bg: var(--color-transparent);
@picker-color-bg_hover: var(--color-transparent);
