// 该文档用于定义项目的样式变量

// Main-Color
$primary-color = #006CE1
$secondary-color = #08E0B7
$tertiary-color = #19C2C8
// Semantic-Color
$notice-color = #209BFF
$success-color = #53C093
$warning-color = #FFB24D
$error-color = #EF7D67
$others-color = #7370FF
// Neutral-Color
$light-green = #9EEC8A
$light-yellow = #FFE47F
$red = #FF7777
$orchid = #DB84FB
$purple = #9947ED
$royal-blue = #5754F2

// Base
$body-background = #fff
$component-background = #fff

$title-color = #333333
$text-color = #333333
$label-color = #999999
$action-text-color = #8288AB
$caption-color = #BFBFBF
$link-color = $primary-color

$border-color-base = #E0E0E0
$font-size = 12px
$line-height = 20px
$border-radius = 4px
$cursor-disabled = default // not-allowed

$base-shadow = 0 1px 6px 0 rgba(44, 81, 56, 0.35)

$rect-bg = #DADCE0
$rect-color = #23292F
$rect-font-size = 16px
$rect-hover-bg = #D8EEFC
$rect-hover-color = #0E76E6

// Button
$btn-default-color = #535353
$btn-font-weight = normal
$btn-border-radius = 4px

$btn-padding-small = 1px 7px
$btn-padding-middle = 3px 11px
$btn-padding-large = 7px 23px

$btn-font-size = 12px
$btn-line-height = 20px
$btn-font-size-large = 12px
$btn-line-height-large = 20px

$btn-disable-color = $caption-color
$btn-disable-bg = #F5F5F5
$btn-disable-border = $border-color-base

$btn-circle-small = 11px
$btn-circle-middle = 16px
$btn-circle-large = 18px

// Icon
$icon-basic-color = $action-text-color
$icon-basic-color-invert = #697394
$icon-basic-hover-bg = #EEEEEE
$icon-basic-active-bg = #E2E2E2
$icon-basic-hover-color-invert = #FFF
$icon-basic-hover-bg-invert = #3C4860
$icon-basic-active-color-invert = $icon-basic-hover-color-invert
$icon-basic-active-bg-invert = $icon-basic-hover-bg-invert
$icon-basic-disabled-color = $input-border-color
$icon-basic-disabled-color-invert = #49516b

$icon-action-color = $action-text-color
$icon-action-hover-color = $primary-color
$icon-action-disabled-color = $input-border-color

// Input
$input-height-small = 26px // 暂无配置
$input-height-default = 32px
$input-height-large = 32px // 暂无配置

$input-padding-small = 3px 9px // 暂无配置
$input-padding-default = 5px 7px
$input-padding-large = 7px 9px // 暂无配置

$input-placeholder-color = #A1ABB3
$input-color = #191919
$input-border-color = #D9DEE2
$input-bg = #f6f7fa
$input-border-radius = 2px

$input-hover-border-color = #A1ABB3
$input-focus-border-color = #3889FE
$input-disabled-bg = #E5E6EB

// Select Option
$options-wrapper-max-height = 180px
$options-wrapper-bg = #F1F3F5
$options-wrapper-border-color = #cfd1d9
$options-wrapper-box-shadow = 4px 4px 16px rgba(0,0,0,0.16)

$options-wrapper-margin = 4px 0
$options-wrapper-padding = 4px 0
$options-wrapper-radius = 4px

$option-padding-small = 8px // 暂无配置
$option-padding-default = 4px 11px
$option-padding-large = 8px // 暂无配置

$option-color = $input-color
$option-hover-bg = #E1EDFA
$option-active-color = $primary-color

// Dropdown Menu
$drop-menu-line-margin = 4px 6px
$drop-menu-line-bg = #DBE2EA
$drop-menu-line-min-width = 124px

$drop-menu-item-padding = 5px 11px
$drop-menu-item-color = #333333
$drop-menu-item-disabled-color = $caption-color
$drop-menu-item-hover-bg = $option-hover-bg
$drop-menu-item-active-color = $option-active-color

$drop-menu-sub-left = calc(100% - 4px)
$drop-menu-sub-top = -8px

// Paginate

// Poptip
$poptip-min-width = 150px
$poptip-offset-padding = 7px
$poptip-content-color = #FFFFFF
$poptip-content-bg = #F1F3F5
$poptip-content-invert-bg = #2B3240
$poptip-content-padding = 10px
$poptip-content-radius = 6px

$poptip-content-btn-bg = #364157
$poptip-content-btn-hover-bg = #404A60

// Progress
$progress-bg = #F2F5FC

// Modal
$modal-mask-color = rgba(0,0,0,0.6)
$modal-bg = #FFF
$modal-box-shadow = $base-shadow
$modal-radius = 4px
$modal-min-width = 480px
$modal-top = 120px

$modal-header-padding = 20px 20px 20px 30px
$modal-content-padding = 12px 30px 24px
$modal-footer-padding = 16px 30px

$modal-footer-bg = #F2F5FC

// Switch

$switch-small-width = 28px
$switch-small-height = 16px

$switch-middle-width = 44px
$switch-middle-height = 22px

$switch-large-width = 56px
$switch-large-height = 22px

$switch-bg = #BAC1C7
$switch-active-bg = #006CE1

$switch-point-margin = 2px
$switch-point-bg = #FFF

$switch-bg-disabled = #C8D0D6
$switch-active-bg-disabled = #BFCFE1
$switch-point-bg-disabled = #D9DFE5

$switch-point-width-small = 12px
$switch-point-width-middle = 18px
$switch-point-width-large = 18px
$switch-point-right-small = ($switch-width-small - $switch-point-width-small - 2px)
$switch-point-right-middle = ($switch-width-middle - $switch-point-width-middle - 2px)
$switch-point-right-large =  ($switch-width-large - $switch-point-width-large - 2px)
$switch-slot-right = 4px



$box-shadow-color = #D5DBEC
$box-shadow = 0 0 4px $box-shadow-color
$tableBodyBg = #FFF
// table
$table-head-bg-color = #FAFAFC
$table-head-hover-bg-color = #EEF0FF
$table-head-resize-color = #404147
$table-head-font-color = #737373
$table-head-sort-color = #7C8483
$table-body-line-color = #f0f1fB
$table-body-even-bg-color = #f9fbfe
$table-body-hover-bg-color = #FEFAEE
$table-body-active-bg-color =#FEFAEE
$table-body-font-color = #000