/**
* @file global.less
* @desc 变量文件
*/
// Theme colors
@veui-color-brand-1: #F2F5FF;
@veui-color-brand-2: #DBE4FF;
@veui-color-brand-3: #B8CBFF;
@veui-color-brand-4: #94B2FF;
@veui-color-brand-5: #709BFF;
@veui-color-brand-6: #4C84FF;
@veui-color-brand-7: #366CD9;
@veui-color-brand-8: #2456B3;
@veui-color-brand-9: #15418C;
@veui-color-brand-10: #0A2D66;

// Info colors
@veui-color-info-1: @veui-color-brand-1;
@veui-color-info-2: @veui-color-brand-2;
@veui-color-info-3: @veui-color-brand-3;
@veui-color-info-4: @veui-color-brand-4;
@veui-color-info-5: @veui-color-brand-5;
@veui-color-info-6: @veui-color-brand-6;
@veui-color-info-7: @veui-color-brand-7;
@veui-color-info-8: @veui-color-brand-8;
@veui-color-info-9: @veui-color-brand-9;
@veui-color-info-10: @veui-color-brand-10;

// Success colors
@veui-color-success-1: #F2FFF4;
@veui-color-success-2: #D0F2D5;
@veui-color-success-3: #A5E6AE;
@veui-color-success-4: #7ED988;
@veui-color-success-5: #5ACC65;
@veui-color-success-6: #39BF45;
@veui-color-success-7: #26992E;
@veui-color-success-8: #17731C;
@veui-color-success-9: #0B4D0E;
@veui-color-success-10: #042604;

// Warning colors
@veui-color-warning-1: #FFF7F2;
@veui-color-warning-2: #FFE8DB;
@veui-color-warning-3: #FFD1B8;
@veui-color-warning-4: #FFB894;
@veui-color-warning-5: #FF9D70;
@veui-color-warning-6: #F27C49;
@veui-color-warning-7: #CC5E33;
@veui-color-warning-8: #A64721;
@veui-color-warning-9: #802E13;
@veui-color-warning-10: #591C09;

// Error colors
@veui-color-error-1: #FFF2F2;
@veui-color-error-2: #FFDBDC;
@veui-color-error-3: #FFB8BA;
@veui-color-error-4: #FF9499;
@veui-color-error-5: #F26B74;
@veui-color-error-6: #E64552;
@veui-color-error-7: #BF303E;
@veui-color-error-8: #991F2D;
@veui-color-error-9: #73111E;
@veui-color-error-10: #4D0812;

// Gray scale colors
@veui-color-gray-1: #FFFFFF;
@veui-color-gray-2: #FAFAFA;
@veui-color-gray-3: #F5F5F5;
@veui-color-gray-4: #EEEEEE;
@veui-color-gray-5: #E0E0E0;
@veui-color-gray-6: #CCCCCC;
@veui-color-gray-7: #999999;
@veui-color-gray-8: #666666;
@veui-color-gray-9: #333333;
@veui-color-gray-10: #000000;
@veui-color-gray-11: #D8D8D8;

// Font
// Font family
@veui-font-family: "PingFang SC", "Helvetica Neue", "Hiragino Sans GB", "Microsoft YaHei", Arial, SimSun, sans-serif;

// Font Size
@veui-font-size-s: 12px;
@veui-font-size-m: 14px;
@veui-font-size-l: 16px;

// Font Weight
@veui-font-weight-1: 400; // regular 400
@veui-font-weight-2: 500; // medium 500
@veui-font-weight-3: 600; // semibold 600

// Font Line height
@veui-line-height-m: 1.5;
@veui-line-height-l: 2;
@veui-line-height-fixed-s: 20px; // 12px对应行高20px
@veui-line-height-fixed: 22px; // 14px对应行高22px
@veui-line-height-fixed-l: 24px; // 16px对应行高24px

// Font Color
@veui-font-color-strong: @veui-color-gray-10; // 标题 #000
@veui-font-color-normal: @veui-color-gray-9; // 正文 #333
@veui-font-color-aux: @veui-color-gray-8; // 辅助文字 #666
@veui-font-color-weak: @veui-color-gray-7; // 引导文字 #999
@veui-font-color-disabled: @veui-color-gray-6; // 禁用文字 #ccc
@veui-font-color-error: @veui-color-error-6; // 错误状态文字颜色 #E64552
@veui-font-color-highlighted: @veui-color-brand-6; // 高亮文字颜色 #4C84FF

// Background Color
@veui-background-color-normal: @veui-color-gray-1; // #fff
@veui-background-color-normal-hover: @veui-color-gray-3; // #f5f5f5
@veui-background-color-normal-focus: @veui-color-brand-1; // #f2f5ff
@veui-background-color-normal-active: @veui-color-gray-4; // #eee
@veui-background-color-disabled: @veui-color-gray-2; // #fafafa

// Border Color
@veui-border-color-normal: @veui-color-gray-5; // 常规边框 #e0e0e0
@veui-border-color-normal-hover: @veui-color-gray-5; // 悬浮状态 #e0e0e0

@veui-border-color-strong: @veui-color-gray-5; // 加强状态边框 #e0e0e0
@veui-border-color-strong-hover: @veui-color-gray-7; // 加强状态悬浮时边框 #999

@veui-border-color-focus: @veui-color-brand-6; // 聚焦时边框
@veui-border-color-error: @veui-color-error-6; // 错误时边框
@veui-border-color-disabled: @veui-color-gray-5; // 禁用时边框e0e0e0

// Separator colors
@veui-separator-color-strong: @veui-border-color-strong;
@veui-separator-color-normal: @veui-border-color-normal;

// Border radius
@veui-border-radius-s: 2px;
@veui-border-radius-m: 3px;
@veui-border-radius-l: 4px;

// Height
@veui-height-xs: @veui-height-unit * 6; // 24px
@veui-height-s: @veui-height-unit * 7; // 28px
@veui-height-m: @veui-height-unit * 8; // 32px
@veui-height-l: @veui-height-unit * 9; // 36px
@veui-height-xl: @veui-height-unit * 10; // 40px

// Spacing
@veui-spacing-unit: 4px;
@veui-padding-unit: @veui-spacing-unit;
@veui-height-unit: @veui-spacing-unit;

/* Shadows */
// General overlays
@veui-shadow-color: @veui-color-gray-10;
@veui-shadow-opacity: 0.15;
@veui-shadow-offset-x: 0;
@veui-shadow-offset-y: 2px;
@veui-shadow-blur-radius: 8px;
@veui-shadow: @veui-shadow-offset-x @veui-shadow-offset-y @veui-shadow-blur-radius
  fade(@veui-shadow-color, percentage(@veui-shadow-opacity));

// Anchored overlays
@veui-shadow-opacity-anchored: 0.1;
@veui-shadow-offset-anchored: 4px;
@veui-shadow-blur-radius-anchored: 8px;
@veui-shadow-anchored-top: 0 @veui-shadow-offset-anchored
  @veui-shadow-blur-radius-anchored
  fade(@veui-shadow-color, percentage(@veui-shadow-opacity-anchored));
@veui-shadow-anchored-right: -@veui-shadow-offset-anchored 0 @veui-shadow-blur-radius-anchored
  fade(@veui-shadow-color, percentage(@veui-shadow-opacity-anchored));
@veui-shadow-anchored-bottom: 0 -@veui-shadow-offset-anchored @veui-shadow-blur-radius-anchored
  fade(@veui-shadow-color, percentage(@veui-shadow-opacity-anchored));
@veui-shadow-anchored-left: @veui-shadow-offset-anchored 0
  @veui-shadow-blur-radius-anchored
  fade(@veui-shadow-color, percentage(@veui-shadow-opacity-anchored));

// Overflow shadow
@veui-shadow-opacity-overflow: 0.15;
@veui-shadow-offset-overflow: 2px;
@veui-shadow-blur-radius-overflow: 4px;
@veui-shadow-overflow-top: 0 @veui-shadow-offset-overflow
  @veui-shadow-blur-radius-overflow
  fade(@veui-shadow-color, percentage(@veui-shadow-opacity-overflow));
@veui-shadow-overflow-right: -@veui-shadow-offset-overflow 0 @veui-shadow-blur-radius-overflow
  fade(@veui-shadow-color, percentage(@veui-shadow-opacity-overflow));
@veui-shadow-overflow-bottom: 0 -@veui-shadow-offset-overflow @veui-shadow-blur-radius-overflow
  fade(@veui-shadow-color, percentage(@veui-shadow-opacity-overflow));
@veui-shadow-overflow-left: @veui-shadow-offset-overflow 0
  @veui-shadow-blur-radius-overflow
  fade(@veui-shadow-color, percentage(@veui-shadow-opacity-overflow));

// Focus rings
@veui-shadow-opacity-focus: 0.2;
@veui-shadow-spread-focus: 2px;
@veui-shadow-color-focus: @veui-color-brand-6;
@veui-shadow-color-error-focus: @veui-color-error-6;
@veui-shadow-focus: 0 0 0 @veui-shadow-spread-focus @veui-color-brand-2;
@veui-shadow-error-focus: 0 0 0 @veui-shadow-spread-focus @veui-color-error-2;

// Fill Color
@veui-disabled-fill-color: @veui-color-gray-4; // 禁用填充
@veui-tag-fill-color: @veui-color-gray-3; // 标签填充

// Icons
@veui-icon-size-normal: 1em; // 1em表示当前元素的字号大小，比如14px
@veui-icon-size-minor: calc(1em - 2px);
@veui-icon-size-aux: calc(1em - 4px);
@veui-icon-color-aux: @veui-font-color-weak; // #999
@veui-icon-color-aux-disabled: @veui-font-color-disabled; // #ccc

// Prefix
@veui-prefix: veui;
@veui-root-element: html;
@veui-overlay-element: veui-x-overlay;
