// ===============项目使用建议使用以下变量================== 
// 主色调
$color-primary: var(--nutui-color-primary, #006DFC) !default;
$color-primary-stop-1: var(--nutui-color-primary-stop-1, #006DFC) !default;
$color-primary-stop-2: var(--nutui-color-primary-stop-2, #006DFC)  !default;
$color-primary-pressed: var(--nutui-color-primary-pressed, #006DFC)  !default;
$color-primary-disabled: var(--nutui-color-primary-disabled, #006DFC) !default;
$color-primary-light: var(--nutui-color-primary-light, #E6F5FF) !default;
$color-primary-light-pressed: var(--nutui-color-primary-light-pressed, #E6F5FF) !default;
$color-primary-background:  var(--nutui-color-primary-background, #E6F5FF) !default;

// 信息
$color-info: var(--nutui-color-info, $color-primary ) !default;
$color-info-pressed: var(--nutui-color-info-pressed, $color-primary ) !default;
$color-info-disabled: var(--nutui-color-info-disabled, $color-primary-disabled) !default;
$color-info-light: var(--nutui-color-info-light, $color-primary-light) !default;
$color-info-background: var(--nutui-color-info-background, $color-primary-light) !default;

// 成功
$color-success: var(--nutui-color-success, #13BF5C) !default;
$color-success-pressed: var(--nutui-color-success-pressed, #13BF5C) !default;
$color-success-disabled: var(--nutui-color-success-disabled, #13BF5C) !default;
$color-success-light: var(--nutui-color-success-light, #E6FFEC) !default;
$color-success-background: var(--nutui-color-success-background, #E6FFEC) !default;

// 警告
$color-warning: var(--nutui-color-warning, #FF850C) !default;
$color-warning-pressed: var(--nutui-color-warning-pressed, #FF850C) !default;
$color-warning-disabled: var(--nutui-color-warning-disabled, #FF850C ) !default;
$color-warning-light: var(--nutui-color-warning-light, #FFF7E6) !default;
$color-warning-background: var(--nutui-color-warning-background, #FFF7E6) !default;

// 危险
$color-danger: var(--nutui-color-danger, #FF4949) !default;
$color-danger-pressed: var(--nutui-color-danger-pressed, #FF4949) !default;
$color-danger-disabled: var(--nutui-color-danger-disabled,#FF4949) !default;
$color-danger-light: var(--nutui-color-danger-light, #FFF2F0) !default;
$color-danger-background: var(--nutui-color-danger-background, #FFF2F0) !default;

$black-1: rgba(0, 0, 0, 0.1);
$black-2: rgba(0, 0, 0, 0.2);
$black-3: rgba(0, 0, 0, 0.3);
$black-4: rgba(0, 0, 0, 0.4);
$black-6: rgba(0, 0, 0, 0.6);
$black-7: rgba(0, 0, 0, 0.7);
$black-95: rgba(0, 0, 0, 0.95);

// 文本颜色
$color-white: #fff !default;
$color-black: #000 !default;
$color-title: $black-95 !default; // 标题常规文字
$color-text: $black-6 !default; // 文本内容
$color-text-secondary: $black-4; //次要文字
$color-text-disabled: $black-4 !default; // 特殊禁用色
$color-text-dark: $color-white !default; //	深色背景下的反向文本色
$color-text-help: $black-6; // TODO
$color-text-link: $color-primary !default; //链接文本色

$color-required: $color-danger !default; //必填色
$color-mask: $black-7 !default; // 蒙层颜色
$color-border: $black-1 !default; // 分割信息的颜色
$color-border-disabled: $color-text-disabled !default;

// 背景颜色
$color-background: #f8f8f8 !default; // 背景色
$color-background-overlay: #ffffff !default; // 卡片背景色
$color-background-sunken: #f8f8f8 !default; // 卡片内嵌背景色，用于卡片内部的信息包裹，感知较弱。

// Font-weight
$font-weight: var(--nutui-font-weight, 400) !default;
$font-weight-bold: var(--nutui-font-weight-bold, 700) !default;

// Radius
$radius-0: 4px !default;
$radius-1: 8px !default;
$radius-2: 12px !default;
$radius-3: 16px !default;
$radius-full: 50% !default;
$radius-circle: 50px !default; // 按钮、徽标等组件的胶囊形态圆角样式

// Font
$font-size-0: 11px !default;
$font-size-1: 13px !default;
$font-size-2: 15px !default;
$font-size-3: 17px !default;
$font-size-4: 19px !default;
$icon-font-size: 16px !default;

// 间距
$spacing-0: 4px !default;
$spacing-1: 8px !default;
$spacing-2: 12px !default;
$spacing-3: 16px !default;
$spacing-4: 20px !default;
$spacing-5: 24px !default;
// =====================================================

// 中性
$color-dark: $color-border!default; // 分隔线
$color-light: $color-border !default; // 输入框、头像边框等

// 界面
$color-surface-2: $color-background!default; // 卡片、内容容器背景色
$color-surface-overlay: $color-mask !default; // 	Mask遮罩

// 圆角 corners
$radius-xxs: $radius-0 !default; // 极小号按钮、标签、多选框等组件的圆角样式
$radius-xs: $radius-1!default; // 极小、小号的按钮、标签等组件的圆角样式
$radius-s: $radius-2 !default; // 中号、大号按钮、输入框等表单组件的圆角样式
$radius-base: $radius-2 !default; // 常规宫格排列的卡片圆角样式
$radius-l: $radius-2 !default; // 下拉菜单、popup 等组件的默认圆角样式
$radius-xl: $radius-2!default; // 一级页面模块容器使用的圆角样式

// Font
$font-size-xs: $font-size-0 !default;
$font-size-small: $font-size-1 !default;
$font-size-base: $font-size-2 !default;
$font-size-large: $font-size-3 !default;
$font-size-xl: $font-size-4 !default;
$font-size-xxl: $font-size-4 !default;
$font-size-xxxl: $font-size-4!default;
$font-size-xxxxl: $font-size-4 !default;


// button
$button-xlarge-height: 52px !default;
$button-xlarge-padding: 0 $spacing-3 !default;
$button-xlarge-font-size: $font-size-3 !default;
$button-large-height: 48px !default;
$button-large-padding: 0 $spacing-3 !default;
$button-large-font-size: $font-size-3 !default;
$button-default-height: 40px !default;
$button-default-padding: 0 $spacing-3 !default;
$button-default-font-size: $font-size-3 !default;
$button-small-height: 32px !default;
$button-small-padding: 0 $spacing-3 !default; 
$button-small-font-size: $font-size-1 !default;
$button-mini-height: 24px !default;
$button-mini-padding: 0 $spacing-3 !default;
$button-mini-font-size: $font-size-1 !default;
$button-default-color: $color-text !default;
$button-default-border-color: #c8c8c8 !default;
$button-default-background-color: $color-white !default;
$button-default-disabled: var(--nutui-button-default-disabled, #c8c8c8) !default;
$button-default-disabled-color: var(--nutui-button-default-disabled-color, $color-text) !default;
$button-default-font-weight: $font-weight-bold !default;
$button-info-background-color: $color-info !default;
$button-danger-background-color: $color-danger !default;
$button-success-background-color: $color-success !default;
$button-warning-background-color: $color-warning !default;


// Cell
$cell-padding: $spacing-3;
$cell-border-radius: $radius-1;
$cell-line-height: 24px;

// Divider
$divider-spacing: $spacing-3 !default;
$divider-vertical-margin: 0 $spacing-3 !default;

// Spacing
$space-gap: $spacing-2;

// form
$form-item-error-line-color: $color-danger !default;
$form-item-required-color: $color-danger !default;
$form-item-error-message-color: $color-danger !default;

// Navbar
$navbar-title-font-size: $font-size-2 !default;

// badge
$badge-background-color: $color-danger !default;

// Tabbar
$tabbar-text-font-size: $font-size-0;

// Tabs
$tabs-titles-font-size: $font-size-3 !default;
$tabs-tab-line-width: 28px !default;
$tabs-tab-line-height: 4px !default;
$tabs-tab-line-bottom: 10% !default;
$tabs-tabpane-padding: $spacing-3 !default;

// cascader
$cascader-tabs-item-padding: 0 10px !default;
$cascader-item-padding: 10px $spacing-3 !default;

// checkbox
$checkbox-label-font-size: $font-size-2 !default;
$checkbox-label-margin-left: $spacing-0 !default;

// input
$input-padding: $spacing-3 !default;
$input-border-radius: $radius-1 !default;

// input-number
$inputnumber-input-margin: $spacing-0 !default;

// NumberKeyboard
$numberkeyboard-key-border-radius: $radius-1 !default;

// picker
$picker-item-height: 48px !default;

// Radio
$radio-label-font-size: $font-size-2 !default;
$radio-label-margin-left: $spacing-0 !default;

// searchbar
$searchbar-gap: $spacing-1 !default;
$searchbar-padding: $spacing-1 $spacing-2 !default;
$searchbar-input-height: 40px !default;
$searchbar-content-border-radius: $radius-circle !default;

// textarea
$textarea-padding: $spacing-2 !default;

// TODO Uploader(重写)
$uploader-preview-margin-right: $spacing-2 !default;
$uploader-preview-margin-bottom: $spacing-2 !default;
$uploader-image-icon-tip-font-size: $font-size-1 !default;
$uploader-image-icon-margin-bottom: $spacing-0 !default;
$uploader-preview-tips-padding: 0 $spacing-0  !default;
$uploader-image-border-radius: $radius-1 !default;

// Badge
$badge-font-size: $font-size-0;

// dialog
$dialog-border-radius: $radius-3 !default;
$dialog-padding: $spacing-5 !default;
$dialog-header-font-weight: $font-weight-bold !default;
$dialog-content-margin: $spacing-1 0 $spacing-5 0 !default;
$dialog-header-font-size: $font-size-3 !default;
$dialog-close-top: var(--nutui-dialog-close-top, 8px) !default;
$dialog-close-left: var(--nutui-dialog-close-left, 8px) !default;
$dialog-close-right: var(--nutui-dialog-close-right, 8px) !default;
// TODO
$dialog-close-width: $icon-font-size !default;
$dialog-close-height: $icon-font-size !default;
$dialog-close-top: $spacing-3 !default;
$dialog-close-left: $spacing-3 !default;
$dialog-close-right: $spacing-3 !default;
$dialog-close-color: $black-4 !default;

// empty
$empty-title-margin-top: $spacing-0;

// loading
$loading-font-size: $font-size-2;
$loading-icon-size: $icon-font-size;

// NoticeBar
$noticebar-box-padding: 0 $spacing-3 !default;
$noticebar-font-size: $font-size-2 !default;
$noticebar-wrap-padding: $spacing-2 !default;
$noticebar-icon-gap: $spacing-0 !default;
$noticebar-height: 40px !default;
$noticebar-background: $color-primary-background !default;
$noticebar-color: $color-primary !default;
$noticebar-error-background: $color-danger-background !default;
$noticebar-error-color: $color-danger !default;
$noticebar-success-background: $color-success-background !default;
$noticebar-success-color: $color-success !default;
$noticebar-warning-background: $color-warning-background !default;
$noticebar-warning-color: $color-warning !default;

// Popover
$popover-font-size: $font-size-2;
$popover-border-radius: $radius-2;

// popup
$popup-border-radius: $radius-3 !default;
$popup-title-padding: $spacing-3 !default;
$popup-title-font-size: $font-size-3 !default;
// $popup-title-height: 24px !default;
$popup-title-font-weight: $font-weight-bold !default;
$popup-icon-size: $icon-font-size !default;
$popup-description-font-size: $font-size-2 !default;

// Toast
$toast-inner-border-radius: $radius-2 !default;
$toast-inner-padding: $spacing-5 !default; // TODO 需要判断纯文本情况下16px
$toast-title-font-size: $font-size-3 !default;
$toast-text-font-size: $font-size-3 !default;

// CountDown
$countdown-font-size: $font-size-2 !default;

// TODO Tag
$tag-font-size: $font-size-0;
$tag-border-radius: $spacing-0;
$tag-padding: 0 $spacing-1;
$tag-height: 20px;
// $tag-mark-border-radius: var(--nutui-tag-mark-border-radius, 6px 0 6px 0) !default;
// $tag-color: var(--nutui-tag-color, $gray_4) !default;
// $tag-background-color: var(--nutui-tag-background-color, $gray_1) !default;
// $tag-primary-color: var(--nutui-tag-primary-color, $primary-color) !default;
// $tag-primary-background-color: var(--nutui-tag-primary-background-color, $primary-bg-color) !default;
// $tag-success-color: var(--nutui-tag-success-color, $success-color) !default;
// $tag-success-background-color: var(--nutui-tag-success-background-color, $success-bg-color) !default;
// $tag-danger-color: var(--nutui-tag-danger-color, $danger-color) !default;
// $tag-danger-background-color: var(--nutui-tag-danger-background-color, $danger-bg-color) !default;
// $tag-warning-color: var(--nutui-tag-warning-color, $warning-color) !default;
// $tag-warning-background-color: var(--nutui-tag-warning-background-color, $warning-bg-color) !default;