
@kd-prefix: kd;

/* -----------  color  ——————---- start */
@theme-color: #5582f3; // 主题色
// 使用hsb/hsv 计算色值
@hsv-h: hsvhue(@theme-color); // 色相
@hsv-s: hsvsaturation(@theme-color); // 饱和度
@hsv-v: hsvvalue(@theme-color); // 明度

@theme-color-disabled: hsv(@hsv-h, max(5%, (@hsv-s - 54%)), min((@hsv-v + 24%), 100%)); // 禁用色
@theme-color-hover: hsv(@hsv-h, max(5%, (@hsv-s - 18%)), min((@hsv-v + 8%), 100%)); // 悬浮色
@theme-color-click: hsv(@hsv-h, min((@hsv-s + 8%), 100%), max(5%, (@hsv-v - 16%))); // 点击色
@theme-color-active-light: hsv(@hsv-h, max(5%, (@hsv-s - 90%)), min((@hsv-v + 40%), 100%)); // 浅色选中
@theme-color-active-dark: @theme-color; // 深色选中
@hover-color: #f5f5f5; // 中性的悬停色
@disabled-contain-bg: #f5f5f5; // 容器失效背景色
@success-color: #1ba854; // 成功色(深)
@success-bg-color: #f2fff5; // 成功反馈浮层的底色
@success-border-color: #6dd18e; // 成功反馈浮层的容器边框色
@warning-color: #ff991c; // 警示色(深)
@warning-bg-color: #fffbf2; // 警示反馈浮层的底色
@warning-border-color: #ffcb78; // 警示反馈浮层的容器边框色
@error-color: #fb2323; // 失败色(深)
@error-bg-color: #fff2f4; // 失败反馈浮层的底色
@error-border-color: #ff8088; // 失败反馈浮层的容器边框色
@ongoing-color: #276ff5; // 进行中(深)
@ongoing-bg-color: #f2f9ff; // 进行中反馈浮层的底色
@ongoing-border-color: #85b8ff; // 进行中反馈浮层的容器边框色
@disabled-color: #b2b2b2; // 失效色
@disabled-border-color: #ccc; // 失效边框色
@end-color: #666; // 暂停或者终止等状态标签色
@link-color: #0e5fd8; // 链接色
@link-color-hover: #3987ed; // 链接色或辅助色(悬浮)
@link-color-active: #0041b0; // 链接色或辅助色(点击)
@primary-text-color: #212121; // 一级文本
@primary-text-color2: rgba(255, 255, 255, 1); // 一级文本
@secondary-text-color: #666; // 二级文本
@secondary-text-color2: rgba(255, 255, 255, 0.65); // 二级文本
@third-text-color: #999; // 三级文本
@third-text-color2: rgba(255, 255, 255, 0.4); // 三级文本
@placeholder-text-color: #ccc; // 占位符文本
@placeholder-text-color2: rgba(255, 255, 255, 0.3); // 占位符文本
@bg: #fff; // 底色白背景
@bg2: #f2f2f2; // 底色灰背景
@contain-bg: #fafafa; // 容器内的灰背景
@radius-size: 2px; // 圆角值
@input-color: #999; // 线型录入的默认态
@strong-border-color: #d9d9d9; // 强线条 --带操作
@strong-border-color-1: #d9d9d9; // 强线条 --分割内容/容器包裹线
@weak-border-color: #e5e5e5; // 弱线条 -- 需要多层级时
// @shadow-on-hover: ; // 悬停时阴影
@white: #fff;
@dirList: left, top, bottom, right;
/* -----------  color  ——————---- end */

/* -----------  font  ——————---- start */
@font-size: 14px;
@font-weight: 400;
@small-font-size: 12px;
@middle-font-size: 14px;
@large-font-size: 16px;
@xlarge-font-size: 18px;
/* -----------  font  ——————---- end */

@radius-size: 2px; // 圆角值

/* -----------  zIndex  ——————---- start */
/*
    普通组件内部自身层级应设置在0-100间
*/
@zIndex-below: -1; // 置于下层
@zIndex-popper: 1000; // 弹出层
@zIndex-dialog: 1050; // 对话框
@zIndex-masker: 3000; // 遮罩层 （loading等）
@zIndex-apex: 9999; // 顶层 （notify）
/* -----------  zIndex  ——————---- end */

/* -----------  transition  ——————---- start */
@transition-duration: 0.3s;
/* -----------  transition  ——————---- end */

/* -----------  Button  ——————---- start */
@btn-border-width: 1px;
@btn-border-style: solid;
@btn-primary-font-color: @white; // 基础文字颜色
@btn-primary-background-color: @theme-color; // 基础背景颜色
@btn-primary-border-color: @theme-color; // 基础边框颜色

@btn-ghost-font-color: @secondary-text-color; // 幽灵按钮文字颜色
@btn-ghost-background-color: transparent; // 幽灵背景颜色
@btn-ghost-border-color: @strong-border-color; //幽灵边框颜色

@btn-second-font-color: fade(@secondary-text-color, 65%); // 次要文字颜色
@btn-second-background-color: fade(@white, 65%); // 次要背景颜色
@btn-second-border-color: fade(@strong-border-color, 65%); // 次要边框颜色

@btn-link-font-color: @link-color; // 链接文字颜色

@btn-disabled-font-color: @white; // 禁用状态 文字颜色
@btn-disabled-background-color: @disabled-contain-bg; // 禁用状态 背景颜色
@btn-disabled-border-color: @strong-border-color; // 禁用状态 边框颜色

@btn-danger-font-color: @white; // 危险状态 文字颜色
@btn-danger-background-color: @error-color; // 危险状态 背景颜色
@btn-danger-border-color: @error-color; // 危险状态 边框颜色

@btn-small-font-size: @small-font-size; // 小号 文字大小
@btn-small-height: 24px; // 小号 高度
@btn-small-min-width: 60px; // 小号 最小宽度
@btn-small-padding-vertical: 3px; // 小号 内间距 纵向
@btn-small-padding-horizontal: 8px; // 小号 内间距 横向

@btn-middle-font-size: @small-font-size; // 中号 文字大小
@btn-middle-height: 28px; // 中号 高度
@btn-middle-min-width: 60px; // 中号 最小宽度
@btn-middle-padding-vertical: 5px; // 中号 内间距 纵向
@btn-middle-padding-horizontal: 8px; // 中号 内间距 纵向

@btn-large-font-size: @large-font-size; // 大号 文字大小
@btn-large-height: 32px; // 大号 高度
@btn-large-min-width: 80px; // 大号 最小宽度
@btn-large-padding-vertical: 6px; // 大号 内间距 纵向
@btn-large-padding-horizontal: 8px; // 大号 内间距 横向
@btn-transition-fn: cubic-bezier(0.075, 0.82, 0.165, 1);
/* -----------  Button  ——————---- end */

/* -----------  Collapse  ——————---- start */
@collapse-border-width: 1px;
@collapse-border-color: @strong-border-color-1;
@collapse-icon-margin-right: 6px;
@collapse-header-font-color: @primary-text-color;
@collapse-header-font-size: @font-size;
@collapse-content-font-color: @primary-text-color;
@collapse-content-font-size: @font-size;
@collapse-content-padding: 10px 0px 0px 20px;
@collapse-disabled-color: @disabled-color;

/* -----------  Collapse  ——————---- end */

/* -----------  Switch  ——————---- start */
@switch-small-font-size: @small-font-size;
@switch-small-line-height: 14px;
@switch-small-height: 14px;
@switch-small-min-width: 28px;
@switch-small-border-radius: 7px;
@switch-large-font-size: @small-font-size;
@switch-large-line-height: 20px;
@switch-large-height: 20px;
@switch-large-min-width: 40px;
@switch-large-border-radius: 10px;
@switch-on-color: @theme-color;
@switch-off-color: #999;
@switch-disabled-bg: @disabled-color;
@switch-loading-color: @ongoing-color;
@switch-font-color: @white;
@switch-inner-small-font-size: @small-font-size;
@switch-inner-margin: 0 5px 0 16px;
@switch-inner-checked-margin: 0 16px 0 5px;
@switch-inner-large-margin: 0 5px 0 21px;
@switch-inner-large-checked-margin: 0 21px 0 5px;
/* -----------  Switch  ——————---- end */

/* -----------  Input  ——————---- start */
@input-placeholder-color: @third-text-color;
@input-font-color: @secondary-text-color;
@input-focus-color: @primary-text-color;
@input-background-color: @white;
@input-border-width: 1px;
@input-width: 230px;

@input-small-font-size: @small-font-size; // 小号 文字大小
@input-small-height: 20px; // 小号 高度
@input-small-padding-vertical: 3px; // 小号 内间距 纵向
@input-small-padding-horizontal: 9px; // 小号 内间距 横向

@input-middle-font-size: @middle-font-size; // 中号 文字大小
@input-middle-height: 30px; // 中号 高度
@input-middle-padding-vertical: 5px; // 中号 内间距 纵向
@input-middle-padding-horizontal: 9px; // 中号 内间距 纵向

@input-large-font-size: @large-font-size; // 大号 文字大小
@input-large-height: 36px; // 大号 高度
@input-large-padding-vertical: 8px; // 大号 内间距 纵向
@input-large-padding-horizontal: 9px; // 大号 内间距 横向
/* -----------  Input  ——————---- end */

/* -----------  InputNumber  ——————---- start */
@inputNumber-embedStepBtn-bg-color: #f6f7f9;
/* -----------  InputNumber  ——————---- end */

/* -----------  checkbox  ——————---- start */
@checkbox-font-size: @small-font-size; //默认字体大小
@checkbox-font-color: @primary-text-color;
@checkbox-border-color: @strong-border-color;
@checkbox-checked-border-color: @theme-color-active-dark;
@checkbox-checked-font-color: @theme-color-active-dark;
@checkbox-bg-color: @bg;
@checkbox-disabled-bg-color: @disabled-color;
@checkbox-small-size-height: 32px; // 小尺寸复选框
@checkbox-middle-size-height: 36px; // 中尺寸复选框
@checkbox-large-size-height: 40px; // 大尺寸复选框
@checkbox-border-width: 1px; // 边框类型边框大小
@checkbox-group-margin-right: 8px; // 按钮组的间距
@checkbox-default-padding: 0; // 默认类型复选框内边距
@checkbox-default-input-margin-right: 8px; // 勾选输入框与右侧内容间距
@checkbox-default-input-height: 16px; // 勾选输入框高度
@checkbox-default-input-width: 16px; // 勾选输入框宽度
@checkbox-default-input-border-radius: 4px; // 勾选输入框圆角
@checkbox-default-input-border-width: 1px; // 勾选输入框边框大小
@checkbox-default-input-icon-color: #fff; // 勾选输入框边勾勾图标颜色
@checkbox-default-input-icon-size: 12px; // 勾选输入框勾勾图标大小
@checkbox-square-padding: 0 20px; // 边框类型内边距
@checkbox-square-triangle-height: 18px; // 边框类型右下角三角高度
@checkbox-square-triangle-width: 18px; // 边框类型右下角三角宽度
@checkbox-square-input-icon-color: #fff; // 边框类型三角内勾选输入框勾勾图标颜色
@checkbox-square-input-icon-size: 9px; // 边框类型三角内勾选输入框勾勾图标大小
/* -----------  checkbox  ——————---- end */

/* -----------  Radio  ——————---- start */
@radio-font-size: @small-font-size;
@radio-font-color: @primary-text-color;
@radio-border-width: 1px;
@radio-margin-right: 8px;
@radio-transition-fn: cubic-bezier(0.075, 0.82, 0.165, 1);
@radio-circle-size: 13px;
@radio-square-height: 32px;
@radio-square-padding: 0 20px;
@radio-button-height: 24px;
@radio-button-padding: 0 18px;
/* -----------  Radio  ——————---- end */

/* -----------  icon  ——————---- start */
@icon-css-prefix: kdicon;
/* -----------  icon  ——————---- end */

/* -----------  Popconfirm  ——————---- start */
@popconfirm-icon-size: 17px;
@popconfirm-min-width: 164px;
@popconfirm-max-width: 500px;
@popconfirm-min-height: 98px;
@popconfirm-max-height: 400px;
@popconfirm-title-line-height: 21px;
@popconfirm-color: @primary-text-color;
@popconfirm-font-size: @small-font-size;
@popconfirm-title-font-size: @middle-font-size;
@popconfirm-vertical-gap: 16px;
@popconfirm-horizontal-gap: 16px;
@popconfirm-background-color: @white;
@popconfirm-box-shadow-blur: 6px;
@popconfirm-transition-fn: cubic-bezier(0.25, 1, 0.5, 1);
@popconfirm-duration: 0.2s;
/* -----------  Popconfirm  ——————---- end */

/* -----------  Popover  ——————---- start */
@popover-min-width: 164px;
@popover-max-width: 500px;
@popover-min-height: 98px;
@popover-max-height: 400px;
@popover-title-line-height: 21px;
@popover-color: @primary-text-color;
@popover-font-size: @small-font-size;
@popover-title-font-size: @middle-font-size;
@popover-vertical-gap: 16px;
@popover-horizontal-gap: 16px;
@popover-background-color: @white;
@popover-box-shadow-blur: 6px;
@popover-transition-fn: cubic-bezier(0.25, 1, 0.5, 1);
@popover-duration: 0.2s;
/* -----------  Popover  ——————---- end */

/* -----------  Progress  ——————---- start */
@progress-remaining-color: #e5e5e5;
@progress-default-color: @ongoing-color;
@progress-success-color: @success-color;
@progress-failure-color: @error-color;
@progress-border-radius: 100px;
@progress-line-stroke-width: 8px;
@progress-line-text-width: 3em;
@progress-line-icon-font-size: 16px;
@progress-line-text-font-size: 16px;
@progress-line-special-text-font-size: 16px;
@progress-line-text-margin-left: 8px;
@progress-circle-stroke-width: 4px;
@progress-transition-fn: cubic-bezier(0.66, 0, 0.34, 1);
@progress-circle-text-font-size: 28px;
@progress-circle-percent-line-height: 48px;
@progress-circle-unit-line-height: 18px;
@progress-circle-unit-font-size: 12px;
@progress-circle-unit-margin-top: 18px;
@progress-circle-icon-font-size: 48px;
/* -----------  Progress  ——————---- end */

/* -----------  Pagination  ——————---- start */
@pagination-size: 24px;
@pagination-nicety-size: 30px;
@pagination-button-gap: 8px;
@pagination-hover-color: @theme-color;
@pagination-font-size: @small-font-size;
@pagination-icon-size: @large-font-size;
@pagination-font-color: @secondary-text-color;
@pagination-button-color: @secondary-text-color;
@pagination-button-disabled-color: @disabled-border-color;
@pagination-button-disabled-background-color: @disabled-contain-bg;
/* -----------  Pagination  ——————---- end */

/* -----------  Timeline  ——————---- start */
@timeline-width: 1px;
@timeline-dot-size: 12px;
@timeline-line-height: 18px;
@timeline-color: @weak-border-color;
@timeline-dot-border-width: 2px;
@timeline-dot-color: @theme-color;
@timeline-dot-bg: @white;
@timeline-item-padding-bottom: 26px;
/* -----------  Timeline  ——————---- end */

/* -----------  Tabs  ——————---- start */
@tabs-font-color: @secondary-text-color;
@tabs-border-color: @strong-border-color;
@tabPane-font-size: @font-size;
@tabPane-font-color-active: @theme-color;
@tabPane-font-color-hover: @theme-color;
@tabPane-font-color-disabled: @disabled-color;
@tab-line-color-active: @theme-color;
@tabs-card-bg: @disabled-contain-bg;
@tabs-height: 48px;
@tabs-border-width: 1px;
@tab-pane-height: 48px;
@tab-pane-line-height: 48px;
@tab-pane-margin-right: 24px;
@tab-transition-fn: cubic-bezier(0.42, 0, 1, 1);
/* -----------  Tabs  ——————---- end */

/* -----------  Select  ——————---- start */
@select-dropdown-bg: @bg;
@select-item-active-bg: #F5F5F5;
@select-dropdown-height: 22px;
@select-list-font-size: 12px;// 下拉列表文字大小
@select-large-font-size: 16px; // 大号字体
@select-middle-font-size: 14px; // 中号高度
@select-small-font-size: 12px; // 小号高度
@select-dropdown-line-height: 22px;
@select-item-selected-color: #276FF5;
@select-item-selected-bg: #F2F9FF;
@select-font-color: #212121;
@select-large-height: 36px; // 大号高度 lh:28px
@select-middle-height: 30px; // 中号高度lh:22px
@select-small-height: 20px; // 小号高度lh:12px
@select-large-line-height: 28px;
@select-middle-line-height: 22px;
@select-small-line-height: 12px;

/* -----------  Select  ——————---- end */
/* -----------  Rate  ——————---- start */
@rate-selected-color: #fdc200;
@rate-not-selected-color: #d9d9d9;
@rate-icon-margin: 10px;
@rate-small-font-size: @small-font-size;
@rate-middle-font-size: @middle-font-size;
@rate-large-font-size: @large-font-size;
/* -----------  Rate  ——————---- end */

/* -----------  Dropdown  ——————---- start */
@dropdown-menu-min-width: 136px;
@dropdown-menu-max-width: 320px;
@dropdown-menu-max-height: 336px;
@dropdown-menu-gap: 8px;
@dropdown-line-height: 18px;
@dropdown-color: @primary-text-color;
@dropdown-divided-color: @weak-border-color;
@dropdown-hover-bg-color: @disabled-contain-bg;
@dropdown-active-bg-color: @theme-color-active-light;
@dropdown-font-size: @small-font-size;
@dropdown-item-vertical-gap: 7px;
@dropdown-item-horizontal-gap: 12px;
@dropdown-box-shadow-blur: 10px;
@dropdown-transition-fn: cubic-bezier(0.25, 1, 0.5, 1);
@dropdown-duration: 0.2s;
/* -----------  Dropdown  ——————---- end */

/* -----------  Tooltip  ——————---- start */
@tooltip-width: 267px;
@tooltip-line-height: 18px;
@tooltip-color: @primary-text-color;
@tooltip-font-size: @small-font-size;
@tooltip-vertical-gap: 8px;
@tooltip-horizontal-gap: 12px;
@tooltip-background-color: @white;
@tooltip-box-shadow-blur: 6px;
/* -----------  Tooltip  ——————---- end */

/* -----------  Transfer  ——————---- start */
@transfer-disabled-bg: @disabled-contain-bg;
@transfer-border-color: @strong-border-color;
@transfer-padding-base: 14px;
@transfer-font-size-base: 12px;
@transfer-list-item-height: 32px;
@transfer-list-content-height: @transfer-list-item-height * 10;
@transfer-list-item-hover-bg: @hover-color;
@transfer-list-item-checked: @theme-color;
@transfer-list-item-disabled: @disabled-color;
@transfer-header-bg: #f5f5f5;
@transfer-header-height: 36px;
@transfer-search-height: 32px;
@transfer-search-prefix-icon-color: @theme-color;
@transfer-search-suffix-icon-color: #bbb;
@transfer-pagination-height: 36px;
/* -----------  Transfer  ——————---- end */

/* -----------  Alert  ——————---- start */
@success-alert-bg-color: @success-bg-color; // 反馈浮层成功提示的背景色
@warning-alert-bg-color: @warning-bg-color; // 反馈浮层警告提示的背景色
@error-alert-bg-color: @error-bg-color; // 反馈浮层错误提示的背景色
@info-alert-bg-color: @ongoing-bg-color; // 反馈浮层一般提示的背景色
@alert-transition-fn: cubic-bezier(0.32, 0.94, 0.6, 1);
/* -----------  Alert  ——————---- end */

/* -----------  Split-Panel ——————---- start */
@split-panel-trigger-border-color: #ccc;
@split-panel-trigger-arrow-color: #a7b5d3;
@split-panel-trigger-arrow-hover-color: @theme-color;
@split-panel-trigger-line-width: 1px;
@split-panel-trigger-line-color: @split-panel-trigger-border-color;
/* -----------  Split-Panel ——————---- end */

/* -----------  Modal  ——————---- start */
@confirm-modal-title-icon-bg: @ongoing-bg-color; // 提示弹窗的背景色
@warning-modal-title-icon-bg: @warning-bg-color; // 警告弹窗的背景色
@error-modal-title-icon-bg: @error-bg-color; // 反馈浮层错误提示的背景色
/* -----------  Modal  ——————---- end */

/* -----------  Steps  ——————---- start */
@steps-transition-fn: cubic-bezier(0.48, 0.04, 0.52, 0.96);
/* -----------  Steps  ——————---- end */
/* -----------  Tag ——————---- start */
@tag-font-size: 12px;
@tag-border-radius: 10px;
@tag-height: 18px;
@tag-process-color: @ongoing-color;
@tag-success-color: @success-color;
@tag-warning-color: @warning-color;
@tag-error-color: @error-color;
@tag-end-color: @end-color;
@tag-expired-color: @disabled-color;
/* -----------  Tag ——————---- end */

// color palettes
@blue-base: #1890ff;


@keyframes loadingcircle {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes waveEffect {
  100% {
      box-shadow: 0 0 0 6px @theme-color;
  }
}

@keyframes fadeEffect {
  100% {
      opacity: 0;
  }
}

@keyframes kdRadioEffect {
  0% {
    transform: translateY(-50%) scale(0.5);
    opacity: 0;
  }
  100% {
    transform: translateY(-50%) scale(1);
    opacity: 1;
  }
}
@keyframes kdSlideDownIn {
  0% {
    transform: scaleY(0.8);
    transform-origin: 50% 0%;
    opacity: 0;
  }
  100% {
    transform: scaleY(1);
    transform-origin: 50% 0%;
    opacity: 1;
  }
}

@keyframes kdSlideDownOut {
  0% {
    transform: scaleY(1);
    transform-origin: 50% 0%;
    opacity: 1;
  }
  100% {
    transform: scaleY(0.9);
    transform-origin: 50% 0%;
    opacity: 0;
  }
}

@keyframes kdSlideUpIn {
  0% {
    transform-origin: 50% 100%;
    opacity: 0;
  }
  5% {
    transform: scaleY(0.8);
  }
  100% {
    transform: scaleY(1);
    transform-origin: 50% 100%;
    opacity: 1;
  }
}

@keyframes kdSlideUpOut {
  0% {
    transform: scaleY(1);
    transform-origin: 50% 100%;
    opacity: 1;
  }
  100% {
    transform: scaleY(0.9);
    transform-origin: 50% 100%;
    opacity: 0;
  }
}



/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/*  normalize.css 和现有产品的结合版本， 根据兼容性进行了调整 */
/* Document
   ========================================================================== */

/* Sections
   ========================================================================== */

/**
 * Remove the margin in all browsers.
 */
 html,body {
	height: 100%;
	padding: 0;
	margin: 0;
	font-size:12px;

}

html,body,input, textarea, select, button{
	font-family:"Microsoft YaHei","PingFangSC-Regular","Helvetica Neue", Helvetica, Arial,"Hiragino Sans GB","WenQuanYi Micro Hei", sans-serif;
}

body {
	box-sizing: border-box;
}

/**
 * Remove the gray background on active links in IE 10.
 */

a {
  background-color: transparent;
}


/* Forms
   ========================================================================== */

/**
 */
input {
  padding: 0;
  margin: 0;
}
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */

button,
input,
optgroup,
select,
textarea {
  margin: 0; /* 2 */
}

/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */

button,
input { /* 1 */
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */

button,
select { /* 1 */
  text-transform: none;
}

/**
 * Correct the inability to style clickable types in iOS and Safari.
 */

button,
[type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button;
}

/**
 * Remove the inner border and padding in Firefox.
 */

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}

/**
 * Restore the focus styles unset by the previous rule.
 */

button:-moz-focusring,
[type="button"]:-moz-focusring,
[type="reset"]:-moz-focusring,
[type="submit"]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */

progress {
  vertical-align: baseline;
}

/**
 * Remove the default vertical scrollbar in IE 10+.
 */

textarea {
  overflow: auto;
}

/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */

[type="checkbox"],
[type="radio"] {
  box-sizing: border-box; /* 1 */
  padding: 0; /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */

[type="search"] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */

[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none;
}


/* Misc
   ========================================================================== */

/**
 * Add the correct display in IE 10+.
 */

template {
  display: none;
}

/**
 * Add the correct display in IE 10.
 */

[hidden] {
  display: none;
}


// Mixins
//----------------------------------------


/* 多行显示省略号 */
.multilpleEllipsis(@n: n) {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: @n;
  -webkit-box-orient: vertical;
}

/* 单行显示省略号 */
.ellipsis() {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


.overlay(@bgcolor, @isUseMaskZindex) {
  position: fixed;
  background-color: @bgcolor;
  z-index: if(boolean(@isUseMaskZindex), @zIndex-masker, auto);
  .overall-postion()
}

.overall-postion {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}

.static-overlay(@bgcolor, @isUseMaskZindex) {
  width: 100%;
  height: 100%;
  background-color: @bgcolor;
  z-index: if(boolean(@isUseMaskZindex), @zIndex-masker, auto);
}


@font-variant: tabular-nums;
@font-feature-settings: 'tnum';

.reset-component() {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
  font-variant: @font-variant;
  list-style: none;
  font-feature-settings: @font-feature-settings;
}


