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


/*! rtl:begin:ignore */
@keyframes loadingcircle {
  100% {
    transform: rotate(360deg);
  }
}

@keyframes rtlloadingcircle {
  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);
  }
  50% {
    transform: translateY(-50%) scale(1.2);
  }
  100% {
    transform: translateY(-50%) scale(1);
  }
}

@keyframes kdRadioLeaveEffect {
  50% {
    transform: translateY(-50%) scale(1.2);
  }
  100% {
    transform: translateY(-50%) scale(0);
  }
}

@keyframes kdRadioSquareEffect {
  0% {
    transform: rotate(45deg) scale(0);
  }
  50% {
    transform: rotate(45deg) scale(1.2);
  }
  100% {
    transform: rotate(45deg) scale(1);
  }
}

@keyframes kdRadioSquareLeaveEffect {
  50% {
    transform: rotate(45deg) scale(1.2);
  }
  100% {
    transform: rotate(45deg) scale(0);
  }
}

@keyframes kdZoomBounceEffect {
  0% {
    transform: scale(0);
  }
  50% {
    transform-origin: bottom right;
    transform: scale(1.2);
  }
}

@keyframes kdZoomBounceLeaveEffect {
  50% {
    transform-origin: bottom right;
    transform: scale(1.2);
  }
  100% {
    transform-origin: bottom right;
    transform: scale(0);
  }
}

@keyframes kdZoomBounceDefaultEffect {
  0% {
    transform: scale(0);
  }
  50% {
    transform-origin: 45% 77%;
    transform: scale(1.2);
  }
}

@keyframes kdZoomEffect {
  0% {
    transform: scale(0);
    transform-origin: 45% 77%;
  }
  100% {
    transform-origin: 45% 77%;
    transform: scale(1);
  }
}

@keyframes kdZoomLeaveEffect {
  0% {
    transform: scale(1);
    transform-origin: 45% 77%;
  }
  100% {
    transform-origin: 45% 77%;
    transform: scale(0);
  }
}

@keyframes kdNoticeEffect {
  0% {
    transform: translateY(-15px) scale(0.8);
    opacity: 0;
  }
}

@keyframes kdNoticeLeaveEffect {
  100% {
    transform: translateY(-15px) scale(0.8);
    opacity: 0;
  }
}

@keyframes kdModalEffect {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/*! rtl:end:ignore */
/*! rtl:begin:ignore */
.slide-motion(@className, @keyframeName, @componentName, @duration: calc(@transition-duration - 0.1s)) {
  .@{className} {
    .@{componentName}&-active {
      animation-name: ~'@{keyframeName}In';
      animation-duration: @duration;
      animation-timing-function: @ease-out;
    }
    .@{componentName}&.hidden {
      animation-name: ~'@{keyframeName}Out';
      animation-duration: 0.1s;
      animation-timing-function: @ease-in;
    }
  }
}

.slide-motion(topLeft, kdSlideDown, kd-dropdown);
.slide-motion(top, kdSlideDown, kd-dropdown);
.slide-motion(topRight, kdSlideDown, kd-dropdown);
.slide-motion(leftBottom, kdSlideDown, kd-dropdown);
.slide-motion(rightBottom, kdSlideDown, kd-dropdown);
.slide-motion(bottomRight, kdSlideDown, kd-dropdown);

.slide-motion(left, kdSlideCenter, kd-dropdown);
.slide-motion(right, kdSlideCenter, kd-dropdown);

.slide-motion(leftTop, kdSlideUp, kd-dropdown);
.slide-motion(bottomLeft, kdSlideUp, kd-dropdown);
.slide-motion(bottom, kdSlideUp, kd-dropdown);
.slide-motion(bottomRight, kdSlideUp, kd-dropdown);
.slide-motion(rightTop, kdSlideUp, kd-dropdown);

.slide-motion(topLeft, kdSlideDown, kd-cascader-menus);
.slide-motion(bottomLeft, kdSlideUp, kd-cascader-menus);
.slide-motion(bottomRight, kdSlideUp, kd-cascader-menus);
.slide-motion(bottomRight, kdSlideDown, kd-cascader-menus);

.slide-motion(topLeft, kdSlideDown, kd-select-dropdown-panel);
.slide-motion(bottomLeft, kdSlideDown, kd-select-dropdown-panel);
.slide-motion(bottomRight, kdSlideDown, kd-select-dropdown-panel);

.slide-motion(bottomLeft, kdSlideUp, kd-select-dropdown-panel);
.slide-motion(bottomRight, kdSlideUp, kd-select-dropdown-panel);

.slide-motion(topLeft, kdSlideDown, kd-date-picker-panel);
.slide-motion(bottomLeft, kdSlideDown, kd-date-picker-panel);
.slide-motion(bottomRight, kdSlideDown, kd-date-picker-panel);
.slide-motion(bottomLeft, kdSlideUp, kd-date-picker-panel);
.slide-motion(bottomRight, kdSlideUp, kd-date-picker-panel);

.slide-motion(topLeft, kdSlideDown, kd-city-picker-dropdown);
.slide-motion(bottomLeft, kdSlideUp, kd-city-picker-dropdown);
.slide-motion(bottomLeft, kdSlideDown, kd-city-picker-dropdown);
.slide-motion(bottomRight, kdSlideDown, kd-city-picker-dropdown);
.slide-motion(bottomRight, kdSlideUp, kd-city-picker-dropdown);

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

@keyframes kdSlideDownOut {
  0% {
    transform: scaleY(1);
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    transform: scaleY(0.8);
    transform-origin: 100% 100%;
    opacity: 0;
  }
}
/*! rtl:end:ignore */
/*! rtl:begin:ignore */
.zoom-motion(@className, @keyframeName, @duration: calc(@transition-duration - 0.1s)) {
  .@{className} {
    &-active {
      animation-name: ~'@{keyframeName}In';
      animation-duration: @duration;
      animation-timing-function: @ease-out;
    }
    &.hidden {
      animation-name: ~'@{keyframeName}Out';
      animation-duration: .1s;
      animation-timing-function: @ease-in;
    }
  }
}

.zoom-motion(top, kdZoomBottom);
.zoom-motion(left, kdZoomRight);
.zoom-motion(right, kdZoomLeft);
.zoom-motion(bottom, kdZoomTop);

.zoom-motion(topLeft, kdZoomLeftBottom);
.zoom-motion(rightBottom, kdZoomLeftBottom);

.zoom-motion(topRight, kdZoomRightBottom);
.zoom-motion(leftBottom, kdZoomRightBottom);

.zoom-motion(leftTop, kdZoomTopRight);
.zoom-motion(bottomRight, kdZoomTopRight);

.zoom-motion(rightTop, kdZoomTopLeft);
.zoom-motion(bottomLeft, kdZoomTopLeft);

@keyframes kdZoomBottomIn {
  0% {
    opacity: 0;
  }
  5% {
    transform: scale(0.6);
    transform-origin: 50% 100%;
  }
  100% {
    transform: scale(1);
    transform-origin: 50% 100%;
    opacity: 1;
  }
}
@keyframes kdZoomBottomOut {
  0% {
    transform: scale(1);
    transform-origin: 50% 100%;
    opacity: 1;
  }
  100% {
    transform: scale(0.6);
    transform-origin: 50% 100%;
    opacity: 0;
  }
}

@keyframes kdZoomRightIn {
  0% {
    opacity: 0;
  }
  5% {
    transform: scale(0.6);
    transform-origin: 100% 50%;
  }
  100% {
    transform: scale(1);
    transform-origin: 100% 50%;
    opacity: 1;
  }
}
@keyframes kdZoomRightOut {
  0% {
    transform: scale(1);
    transform-origin: 100% 50%;
    opacity: 1;
  }
  100% {
    transform: scale(0.6);
    transform-origin: 100% 50%;
    opacity: 0;
  }
}

@keyframes kdZoomTopIn {
  0% {
    opacity: 0;
  }
  5% {
    transform: scale(0.6);
    transform-origin: 50% 0%;
  }
  100% {
    transform: scale(1);
    transform-origin: 50% 0%;
    opacity: 1;
  }
}
@keyframes kdZoomTopOut {
  0% {
    transform: scale(1);
    transform-origin: 50% 0%;
    opacity: 1;
  }
  100% {
    transform: scale(0.6);
    transform-origin: 50% 0%;
    opacity: 0;
  }
}

@keyframes kdZoomLeftIn {
  0% {
    opacity: 0;
  }
  5% {
    transform: scale(0.6);
    transform-origin: 0% 50%;
  }
  100% {
    transform: scale(1);
    transform-origin: 0% 50%;
    opacity: 1;
  }
}
@keyframes kdZoomLeftOut {
  0% {
    transform: scale(1);
    transform-origin: 0% 50%;
    opacity: 1;
  }
  100% {
    transform: scale(0.6);
    transform-origin: 0% 50%;
    opacity: 0;
  }
}

@keyframes kdZoomLeftBottomIn {
  0% {
    opacity: 0;
  }
  5% {
    transform: scale(0.6);
    transform-origin: 0% 100%;
  }
  100% {
    transform: scale(1);
    transform-origin: 0% 100%;
    opacity: 1;
  }
}
@keyframes kdZoomLeftBottomOut {
  0% {
    transform: scale(1);
    transform-origin: 0% 100%;
    opacity: 1;
  }
  100% {
    transform: scale(0.6);
    transform-origin: 0% 100%;
    opacity: 0;
  }
}

@keyframes kdZoomRightBottomIn {
  0% {
    opacity: 0;
  }
  5% {
    transform: scale(0.6);
    transform-origin: 100% 100%;
  }
  100% {
    transform: scale(1);
    transform-origin: 100% 100%;
    opacity: 1;
  }
}
@keyframes kdZoomRightBottomOut {
  0% {
    transform: scale(1);
    transform-origin: 100% 100%;
    opacity: 1;
  }
  100% {
    transform: scale(0.6);
    transform-origin: 100% 100%;
    opacity: 0;
  }
}

@keyframes kdZoomTopRightIn {
  0% {
    opacity: 0;
  }
  5% {
    transform: scale(0.6);
    transform-origin: 100% 0%;
  }
  100% {
    transform: scale(1);
    transform-origin: 100% 0%;
    opacity: 1;
  }
}
@keyframes kdZoomTopRightOut {
  0% {
    transform: scale(1);
    transform-origin: 100% 0%;
    opacity: 1;
  }
  100% {
    transform: scale(0.6);
    transform-origin: 100% 0%;
    opacity: 0;
  }
}

@keyframes kdZoomTopLeftIn {
  0% {
    opacity: 0;
  }
  5% {
    transform: scale(0.6);
    transform-origin: 0% 0%;
  }
  100% {
    transform: scale(1);
    transform-origin: 0% 0%;
    opacity: 1;
  }
}
@keyframes kdZoomTopLeftOut {
  0% {
    transform: scale(1);
    transform-origin: 0% 0%;
    opacity: 1;
  }
  100% {
    transform: scale(0.6);
    transform-origin: 0% 0%;
    opacity: 0;
  }
}
/*! rtl:end:ignore */




/*! 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: 'Roboto', 'San Francisco', 'Helvetica Neue', Helvetica, Arial, 'PingFang SC', 'Hiragina Sans GB',
    'WenQuanYi Micro Hei', 'microsoft yahei ui', 'microsoft yahei', 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;
}

/**
 * Reset scrollbar style
 */
// ::-webkit-scrollbar {
//   width: 10px !important;
//   height: 10px !important;
// }

::-webkit-scrollbar-button {
  width: 0;
  height: 0;
}

::-webkit-scrollbar-corner {
  background: 0 0;
}

::-webkit-scrollbar-thumb {
  min-height: 28px;
  height: 5px;
  min-width: 2px;
  width: 5px;
  border-radius: 4px;
  border: dashed transparent;
  padding: 100px 0 0;
  border-width: 1px;
  background-color: #b2b2b2;
  background-clip: padding-box;
}

::-webkit-scrollbar-thumb:active {
  background-color: #999;
}

::-webkit-scrollbar-thumb:hover {
  background: #999;
  border-radius: 6;
}

::-webkit-scrollbar-track {
  border-radius: 10px;
}

@icon-prefix-cls: ~'@{kd-prefix}icon';

@font-face {
  font-family: "kdicon";
  src: url(data:font/woff;base64,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) format("woff");
}
.@{icon-prefix-cls} {
  font-family: "kdicon" !important;
  font-style:normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
.@{icon-prefix-cls}-add-child:before { content: "\e6c0"; }
.@{icon-prefix-cls}-add-indentation:before { content: "\e6a7"; }
.@{icon-prefix-cls}-add-line:before { content: "\e6c5"; }
.@{icon-prefix-cls}-add-solid:before { content: "\e643"; }
.@{icon-prefix-cls}-add-word:before { content: "\e6ed"; }
.@{icon-prefix-cls}-add:before { content: "\e628"; }
.@{icon-prefix-cls}-address:before { content: "\e6cc"; }
.@{icon-prefix-cls}-align-center:before { content: "\e69a"; }
.@{icon-prefix-cls}-align-left:before { content: "\e6af"; }
.@{icon-prefix-cls}-align-right:before { content: "\e67a"; }
.@{icon-prefix-cls}-all-border:before { content: "\e677"; }
.@{icon-prefix-cls}-allowance-workbench:before { content: "\e714"; }
.@{icon-prefix-cls}-analysis:before { content: "\e6ce"; }
.@{icon-prefix-cls}-arrow-down-solid:before { content: "\e656"; }
.@{icon-prefix-cls}-arrow-down:before { content: "\e627"; }
.@{icon-prefix-cls}-arrow-left-circle-solid:before { content: "\e720"; }
.@{icon-prefix-cls}-arrow-left-solid:before { content: "\e657"; }
.@{icon-prefix-cls}-arrow-left:before { content: "\e63f"; }
.@{icon-prefix-cls}-arrow-right-circle-solid:before { content: "\e71f"; }
.@{icon-prefix-cls}-arrow-right-solid:before { content: "\e655"; }
.@{icon-prefix-cls}-arrow-right:before { content: "\e62c"; }
.@{icon-prefix-cls}-arrow-up-solid:before { content: "\e654"; }
.@{icon-prefix-cls}-arrow-up:before { content: "\e62b"; }
.@{icon-prefix-cls}-arrow:before { content: "\e69c"; }
.@{icon-prefix-cls}-attachment:before { content: "\e694"; }
.@{icon-prefix-cls}-avatar-default:before { content: "\e717"; }
.@{icon-prefix-cls}-avatar-head-default:before { content: "\e718"; }
.@{icon-prefix-cls}-avatar-solid:before { content: "\e711"; }
.@{icon-prefix-cls}-back:before { content: "\e6cd"; }
.@{icon-prefix-cls}-bankcard:before { content: "\e705"; }
.@{icon-prefix-cls}-bellOutlined:before { content: "\e71a"; }
.@{icon-prefix-cls}-bold-solid:before { content: "\e668"; }
.@{icon-prefix-cls}-border:before { content: "\e6f9"; }
.@{icon-prefix-cls}-bottom-border:before { content: "\e704"; }
.@{icon-prefix-cls}-business-type:before { content: "\e716"; }
.@{icon-prefix-cls}-cancel:before { content: "\e68f"; }
.@{icon-prefix-cls}-cell:before { content: "\e692"; }
.@{icon-prefix-cls}-change:before { content: "\e6e2"; }
.@{icon-prefix-cls}-chart-display:before { content: "\e710"; }
.@{icon-prefix-cls}-chart:before { content: "\e6d0"; }
.@{icon-prefix-cls}-classify:before { content: "\e6d4"; }
.@{icon-prefix-cls}-close-bold:before { content: "\e647"; }
.@{icon-prefix-cls}-close-full-screen:before { content: "\e679"; }
.@{icon-prefix-cls}-close-solid:before { content: "\e644"; }
.@{icon-prefix-cls}-close:before { content: "\e62f"; }
.@{icon-prefix-cls}-cn:before { content: "\e6b5"; }
.@{icon-prefix-cls}-code:before { content: "\e6ca"; }
.@{icon-prefix-cls}-collect:before { content: "\e6ec"; }
.@{icon-prefix-cls}-comment:before { content: "\e6bc"; }
.@{icon-prefix-cls}-communication-solid:before { content: "\e65e"; }
.@{icon-prefix-cls}-contract:before { content: "\e69f"; }
.@{icon-prefix-cls}-cooperation:before { content: "\e6fb"; }
.@{icon-prefix-cls}-copy-code:before { content: "\e6e1"; }
.@{icon-prefix-cls}-copy:before { content: "\e678"; }
.@{icon-prefix-cls}-counterclockwise:before { content: "\e6e5"; }
.@{icon-prefix-cls}-customize:before { content: "\e707"; }
.@{icon-prefix-cls}-dashboard:before { content: "\e71c"; }
.@{icon-prefix-cls}-date-selection:before { content: "\e70f"; }
.@{icon-prefix-cls}-date:before { content: "\e6eb"; }
.@{icon-prefix-cls}-delete-indentation:before { content: "\e697"; }
.@{icon-prefix-cls}-delete-line:before { content: "\e68c"; }
.@{icon-prefix-cls}-delete-solid:before { content: "\e667"; }
.@{icon-prefix-cls}-delete:before { content: "\e6ee"; }
.@{icon-prefix-cls}-detail:before { content: "\e6c4"; }
.@{icon-prefix-cls}-detect:before { content: "\e68e"; }
.@{icon-prefix-cls}-division-solid:before { content: "\e65a"; }
.@{icon-prefix-cls}-double-arrow-left:before { content: "\e64a"; }
.@{icon-prefix-cls}-double-arrow-right:before { content: "\e649"; }
.@{icon-prefix-cls}-download:before { content: "\e70a"; }
.@{icon-prefix-cls}-edit-border:before { content: "\e6c8"; }
.@{icon-prefix-cls}-edit-view:before { content: "\e6c7"; }
.@{icon-prefix-cls}-edit:before { content: "\e6a6"; }
.@{icon-prefix-cls}-education:before { content: "\e69d"; }
.@{icon-prefix-cls}-eliminate-solid:before { content: "\e659"; }
.@{icon-prefix-cls}-en:before { content: "\e6b6"; }
.@{icon-prefix-cls}-enlarge:before { content: "\e6d5"; }
.@{icon-prefix-cls}-equal:before { content: "\e6a3"; }
.@{icon-prefix-cls}-exclamatory:before { content: "\e64e"; }
.@{icon-prefix-cls}-expand:before { content: "\e651"; }
.@{icon-prefix-cls}-experience:before { content: "\e6ff"; }
.@{icon-prefix-cls}-fail:before { content: "\e6a5"; }
.@{icon-prefix-cls}-feedback:before { content: "\e6d6"; }
.@{icon-prefix-cls}-female:before { content: "\e684"; }
.@{icon-prefix-cls}-filter-solid:before { content: "\e66a"; }
.@{icon-prefix-cls}-filter-switch:before { content: "\e6b1"; }
.@{icon-prefix-cls}-filter:before { content: "\e6a0"; }
.@{icon-prefix-cls}-finish:before { content: "\e6dc"; }
.@{icon-prefix-cls}-first:before { content: "\e630"; }
.@{icon-prefix-cls}-fixed-shrink:before { content: "\e693"; }
.@{icon-prefix-cls}-fixed-solid:before { content: "\e65f"; }
.@{icon-prefix-cls}-fixed-window:before { content: "\e6d1"; }
.@{icon-prefix-cls}-fixed:before { content: "\e6e3"; }
.@{icon-prefix-cls}-fold:before { content: "\e71d"; }
.@{icon-prefix-cls}-foldmenu:before { content: "\e70e"; }
.@{icon-prefix-cls}-font-background-solid:before { content: "\e673"; }
.@{icon-prefix-cls}-font-color-solid:before { content: "\e674"; }
.@{icon-prefix-cls}-forbid:before { content: "\e69b"; }
.@{icon-prefix-cls}-git:before { content: "\e6c1"; }
.@{icon-prefix-cls}-graffiti:before { content: "\e6fe"; }
.@{icon-prefix-cls}-greater-equal:before { content: "\e6d7"; }
.@{icon-prefix-cls}-have-attachment:before { content: "\e6a8"; }
.@{icon-prefix-cls}-hide:before { content: "\e6a9"; }
.@{icon-prefix-cls}-hyperlink:before { content: "\e6c9"; }
.@{icon-prefix-cls}-image:before { content: "\e687"; }
.@{icon-prefix-cls}-import:before { content: "\e6cb"; }
.@{icon-prefix-cls}-international:before { content: "\e719"; }
.@{icon-prefix-cls}-job-info:before { content: "\e68d"; }
.@{icon-prefix-cls}-last:before { content: "\e631"; }
.@{icon-prefix-cls}-left-border:before { content: "\e708"; }
.@{icon-prefix-cls}-left-extension:before { content: "\e6ae"; }
.@{icon-prefix-cls}-left-unfold-solid:before { content: "\e675"; }
.@{icon-prefix-cls}-left-unfold:before { content: "\e709"; }
.@{icon-prefix-cls}-like:before { content: "\e67f"; }
.@{icon-prefix-cls}-list:before { content: "\e6e6"; }
.@{icon-prefix-cls}-little-k:before { content: "\e700"; }
.@{icon-prefix-cls}-loadding-circle:before { content: "\e645"; }
.@{icon-prefix-cls}-loadding:before { content: "\e62d"; }
.@{icon-prefix-cls}-location-solid:before { content: "\e640"; }
.@{icon-prefix-cls}-location:before { content: "\e695"; }
.@{icon-prefix-cls}-lock-solid:before { content: "\e66b"; }
.@{icon-prefix-cls}-lock:before { content: "\e68b"; }
.@{icon-prefix-cls}-male:before { content: "\e683"; }
.@{icon-prefix-cls}-material:before { content: "\e6db"; }
.@{icon-prefix-cls}-medical-report:before { content: "\e703"; }
.@{icon-prefix-cls}-menu:before { content: "\e6d8"; }
.@{icon-prefix-cls}-merge-cell:before { content: "\e6f3"; }
.@{icon-prefix-cls}-more-info-solid:before { content: "\e660"; }
.@{icon-prefix-cls}-more-info:before { content: "\e6e4"; }
.@{icon-prefix-cls}-more-item:before { content: "\e6f4"; }
.@{icon-prefix-cls}-more:before { content: "\e6a1"; }
.@{icon-prefix-cls}-mosaic-solid:before { content: "\e663"; }
.@{icon-prefix-cls}-multiply:before { content: "\e65b"; }
.@{icon-prefix-cls}-my-receipt:before { content: "\e715"; }
.@{icon-prefix-cls}-no-border:before { content: "\e6f8"; }
.@{icon-prefix-cls}-not-equal:before { content: "\e6dd"; }
.@{icon-prefix-cls}-notice:before { content: "\e658"; }
.@{icon-prefix-cls}-oblique-solid:before { content: "\e66e"; }
.@{icon-prefix-cls}-operating-element:before { content: "\e6a4"; }
.@{icon-prefix-cls}-order-facet:before { content: "\e713"; }
.@{icon-prefix-cls}-order:before { content: "\e6d2"; }
.@{icon-prefix-cls}-ordered-list:before { content: "\e6fa"; }
.@{icon-prefix-cls}-person-solid:before { content: "\e669"; }
.@{icon-prefix-cls}-phone:before { content: "\e6d3"; }
.@{icon-prefix-cls}-platform:before { content: "\e6f1"; }
.@{icon-prefix-cls}-preview-view:before { content: "\e6ba"; }
.@{icon-prefix-cls}-preview:before { content: "\e6ac"; }
.@{icon-prefix-cls}-print:before { content: "\e690"; }
.@{icon-prefix-cls}-processing-solid:before { content: "\e665"; }
.@{icon-prefix-cls}-project:before { content: "\e681"; }
.@{icon-prefix-cls}-push-down:before { content: "\e702"; }
.@{icon-prefix-cls}-put-bottom:before { content: "\e6b4"; }
.@{icon-prefix-cls}-put-off:before { content: "\e685"; }
.@{icon-prefix-cls}-put-on:before { content: "\e6bd"; }
.@{icon-prefix-cls}-put-top:before { content: "\e6b3"; }
.@{icon-prefix-cls}-qrcode:before { content: "\e6df"; }
.@{icon-prefix-cls}-qualification-info:before { content: "\e6b2"; }
.@{icon-prefix-cls}-quit:before { content: "\e6fc"; }
.@{icon-prefix-cls}-quote-solid:before { content: "\e66d"; }
.@{icon-prefix-cls}-reduce:before { content: "\e696"; }
.@{icon-prefix-cls}-reduction:before { content: "\e6f2"; }
.@{icon-prefix-cls}-refresh-solid:before { content: "\e642"; }
.@{icon-prefix-cls}-refresh:before { content: "\e629"; }
.@{icon-prefix-cls}-report-form:before { content: "\e712"; }
.@{icon-prefix-cls}-reset:before { content: "\e6b9"; }
.@{icon-prefix-cls}-resign-report:before { content: "\e699"; }
.@{icon-prefix-cls}-return:before { content: "\e6e0"; }
.@{icon-prefix-cls}-right-bold:before { content: "\e648"; }
.@{icon-prefix-cls}-right-border:before { content: "\e67c"; }
.@{icon-prefix-cls}-right-extension:before { content: "\e6aa"; }
.@{icon-prefix-cls}-right-solid:before { content: "\e641"; }
.@{icon-prefix-cls}-right-unfold-solid:before { content: "\e672"; }
.@{icon-prefix-cls}-right-unfold:before { content: "\e6ab"; }
.@{icon-prefix-cls}-right:before { content: "\e62e"; }
.@{icon-prefix-cls}-rough-border:before { content: "\e6de"; }
.@{icon-prefix-cls}-save:before { content: "\e6c2"; }
.@{icon-prefix-cls}-scanning:before { content: "\e67d"; }
.@{icon-prefix-cls}-search-border:before { content: "\e6da"; }
.@{icon-prefix-cls}-search:before { content: "\e62a"; }
.@{icon-prefix-cls}-setting:before { content: "\e652"; }
.@{icon-prefix-cls}-share:before { content: "\e6cf"; }
.@{icon-prefix-cls}-shoppingcart:before { content: "\e6bf"; }
.@{icon-prefix-cls}-shrink:before { content: "\e6fd"; }
.@{icon-prefix-cls}-shutdown:before { content: "\e686"; }
.@{icon-prefix-cls}-sigma:before { content: "\e71b"; }
.@{icon-prefix-cls}-spin:before { content: "\e6f7"; }
.@{icon-prefix-cls}-split:before { content: "\e6c3"; }
.@{icon-prefix-cls}-star:before { content: "\e653"; }
.@{icon-prefix-cls}-stop:before { content: "\e691"; }
.@{icon-prefix-cls}-strike-solid:before { content: "\e664"; }
.@{icon-prefix-cls}-sun-solid:before { content: "\e670"; }
.@{icon-prefix-cls}-switch-down:before { content: "\e698"; }
.@{icon-prefix-cls}-switch-up:before { content: "\e680"; }
.@{icon-prefix-cls}-switch:before { content: "\e6e7"; }
.@{icon-prefix-cls}-table-setting:before { content: "\e6c6"; }
.@{icon-prefix-cls}-task-process:before { content: "\e6ea"; }
.@{icon-prefix-cls}-timezone-solid:before { content: "\e662"; }
.@{icon-prefix-cls}-tips-solid:before { content: "\e66c"; }
.@{icon-prefix-cls}-tips:before { content: "\e650"; }
.@{icon-prefix-cls}-title-solid:before { content: "\e65c"; }
.@{icon-prefix-cls}-top-border:before { content: "\e6ef"; }
.@{icon-prefix-cls}-two-window:before { content: "\e6f6"; }
.@{icon-prefix-cls}-underline-solid:before { content: "\e671"; }
.@{icon-prefix-cls}-unfold-all:before { content: "\e6ad"; }
.@{icon-prefix-cls}-unfold:before { content: "\e71e"; }
.@{icon-prefix-cls}-unfoldmenu:before { content: "\e70d"; }
.@{icon-prefix-cls}-unlock-solid:before { content: "\e666"; }
.@{icon-prefix-cls}-unlock:before { content: "\e69e"; }
.@{icon-prefix-cls}-upload-cloud:before { content: "\e632"; }
.@{icon-prefix-cls}-upload:before { content: "\e70b"; }
.@{icon-prefix-cls}-user-info:before { content: "\e682"; }
.@{icon-prefix-cls}-vertical-center:before { content: "\e6f5"; }
.@{icon-prefix-cls}-voice:before { content: "\e6d9"; }
.@{icon-prefix-cls}-waiting:before { content: "\e64b"; }
.@{icon-prefix-cls}-warning-solid:before { content: "\e64c"; }
.@{icon-prefix-cls}-warning:before { content: "\e64d"; }
.@{icon-prefix-cls}-workbench:before { content: "\e64f"; }
.@{icon-prefix-cls}-wrap:before { content: "\e6b0"; }
.@{icon-prefix-cls}-yunzhijia:before { content: "\e706"; }
.@{icon-prefix-cls}-zoom:before { content: "\e70c"; }





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



/* 多行显示省略号 */
.multipleEllipsis(@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;
}

/** 浮层箭头样式 **/
.popperArrow(@popperBg, @offset, @blur,) {
  &.arrow {
    &::before {
      position: absolute;
      z-index: -2;
      background: @popperBg;
      border-style: solid;
      border-width: var(--arrowSize);
      transform: rotate(45deg);
      content: '';
    }

    &::after {
      position: absolute;
      z-index: -1;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      content: '';
      background: @popperBg;
      border-radius: @radius-border;
    }

    &.bottomLeft,
    &.bottom,
    &.bottomRight {
      &::before {
        left: var(--arrowLeft);
        top: var(--arrowSpill);
        box-shadow: -2px -2px calc(@blur - 1px) rgba(0, 0, 0, 0.1);
        border-color: @popperBg transparent transparent @popperBg;
      }
    }

    &.topLeft,
    &.top,
    &.topRight {
      &::before {
        left: var(--arrowLeft);
        bottom: var(--arrowSpill);
        box-shadow: 3px 3px calc(@blur + 1px) rgba(0, 0, 0, 0.15);
        border-color: transparent @popperBg @popperBg transparent;
      }
    }

    &.leftTop,
    &.left,
    &.leftBottom {
      &::before {
        top: var(--arrowTop);
        right: var(--arrowSpill);
        box-shadow: 3px 0 @blur rgba(0, 0, 0, 0.12), 0 -2px @blur rgba(204, 149, 149, 0.12);
        border-color: @popperBg @popperBg transparent transparent;
      }
    }

    &.rightTop,
    &.right,
    &.rightBottom {
      &::before {
        top: var(--arrowTop);
        left: var(--arrowSpill);
        box-shadow: 0 3px @blur rgba(0, 0, 0, 0.1), -2px 0 @blur rgba(0, 0, 0, 0.1);
        border-color: transparent transparent @popperBg @popperBg;
      }
    }
  }
}



.overlay(@bgcolor, @isUseMaskZindex) {
  position: fixed;
  background-color: @bgcolor;
  z-index: if(boolean(@isUseMaskZindex), @z-index-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), @z-index-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;
}
@global-custom-prefix: '--@{kd-prefix}-g';

@color-theme: var(~'@{global-custom-prefix}-color-theme', @theme-color);
@color-theme-1: var(~'@{global-custom-prefix}-color-theme-1', @theme-color-level1);
@color-theme-2: var(~'@{global-custom-prefix}-color-theme-2', @theme-color-level2);
@color-theme-3: var(~'@{global-custom-prefix}-color-theme-3', @theme-color-level3);
@color-theme-4: var(~'@{global-custom-prefix}-color-theme-4', @theme-color-level4);
@color-theme-5: var(~'@{global-custom-prefix}-color-theme-5', @theme-color-level5);
@color-theme-6: var(~'@{global-custom-prefix}-color-theme-6', @theme-color-level6);
@color-theme-7: var(~'@{global-custom-prefix}-color-theme-7', @theme-color-level7);
@color-theme-8: var(~'@{global-custom-prefix}-color-theme-8', @theme-color-level8);
@color-theme-9: var(~'@{global-custom-prefix}-color-theme-9', @theme-color-level9);


@color-theme-disabled: @color-theme-3;
@color-theme-hover: @color-theme-5;
@color-theme-click: @color-theme-7;// 点击色
@color-theme-light-active: @color-theme-1; // 浅色选中
@color-theme-dark-active: @color-theme; // 深色选中

// hover
@color-hover: var(~'@{global-custom-prefix}-color-hover', @hover-color);
@color-background-contain-disabled: var(~'@{global-custom-prefix}-color-background-contain-disabled', @disabled-contain-bg); // 有疑问 contain

// success
@color-success: var(~'@{global-custom-prefix}-color-success', @success-color);
@color-background-success: var(~'@{global-custom-prefix}-color-background-success', @success-bg-color);
@color-border-success: var(~'@{global-custom-prefix}-color-border-success', @success-border-color);


// warning
@color-warning: var(~'@{global-custom-prefix}-color-warning', @warning-color);
@color-background-warning: var(~'@{global-custom-prefix}-color-background-warning', @warning-bg-color);
@color-border-warning: var(~'@{global-custom-prefix}-color-border-warning', @warning-border-color);

// error
@color-error: var(~'@{global-custom-prefix}-color-error', @error-color);
@color-background-error: var(~'@{global-custom-prefix}-color-background-error', @error-bg-color);
@color-border-error: var(~'@{global-custom-prefix}-color-border-error', @error-border-color);

// ongoing
@color-ongoing: var(~'@{global-custom-prefix}-color-ongoing', @ongoing-color);
@color-background-ongoing: var(~'@{global-custom-prefix}-color-background-ongoing', @ongoing-bg-color);
@color-border-ongoing: var(~'@{global-custom-prefix}-color-border-ongoing', @ongoing-border-color);

// disabled
@color-disabled: var(~'@{global-custom-prefix}-color-disabled', @disabled-color);
@color-border-disabled: var(~'@{global-custom-prefix}-color-border-disabled', @disabled-border-color);


@color-end: var(~'@{global-custom-prefix}-color-end', @end-color);

// color text-link
@color-text-link: var(~'@{global-custom-prefix}-color-text-link', @link-color);
@color-text-link-hover: var(~'@{global-custom-prefix}-color-text-link-hover', @link-color-hover);
@color-text-link-active: var(~'@{global-custom-prefix}-color-text-link-active', @link-color-active);

// color-text
@color-text-primary: var(~'@{global-custom-prefix}-color-text-primary', @primary-text-color);
@color-text-primary-2: var(~'@{global-custom-prefix}-color-text-primary-2', @primary-text-color2);


@color-text-secondary: var(~'@{global-custom-prefix}-color-text-secondary', @secondary-text-color);
@color-text-secondary-2: var(~'@{global-custom-prefix}-color-text-secondary-2', @secondary-text-color2);
@color-text-secondary-3: var(~'@{global-custom-prefix}-color-text-secondary-3', @secondary-text-color3);

@color-text-third: var(~'@{global-custom-prefix}-color-text-third', @third-text-color);
@color-text-third-2: var(~'@{global-custom-prefix}-color-text-third-2', @third-text-color2);

// placeholder 占位符文本
@color-text-placeholder: var(~'@{global-custom-prefix}-color-text-placeholder', @placeholder-text-color);
@color-text-placeholder-2: var(~'@{global-custom-prefix}-color-text-placeholder-2', @placeholder-text-color2);

 //bg -----------------
@color-background: var(~'@{global-custom-prefix}-color-background', @bg);
@color-background-2: var(~'@{global-custom-prefix}-color-background-2', @bg2);
@color-background-3: var(~'@{global-custom-prefix}-color-background-3', @bg3);


@color-background-contain: var(~'@{global-custom-prefix}-color-background-contain', @contain-bg); // 容器内的灰背景
@color-input: var(~'@{global-custom-prefix}-color-input', @input-color); // 线型录入的默认态


@color-border-strong: var(~'@{global-custom-prefix}-color-border-strong', @strong-border-color);
@color-border-strong-2: var(~'@{global-custom-prefix}-color-border-strong-2', @strong-border-color-1);
@color-border-strong-3: var(~'@{global-custom-prefix}-color-border-strong-3', @strong-border-color-2);
@color-border-weak: var(~'@{global-custom-prefix}-color-border-weak', @weak-border-color);

@color-white: var(~'@{global-custom-prefix}-color-white', @white);

// logo 颜色值
@color-logo-1: var(~'@{global-custom-prefix}-color-logo-1', @logo-color-1);
@color-logo-2: var(~'@{global-custom-prefix}-color-logo-2', @logo-color-2);
@color-logo-3: var(~'@{global-custom-prefix}-color-logo-3', @logo-color-3);
@color-logo-4: var(~'@{global-custom-prefix}-color-logo-4', @logo-color-4);
/* -----------  motion  ——————---- start */
@motion-ease-out: var(~'@{global-custom-prefix}-ease-out', @ease-out);
@motion-ease-in: var(~'@{global-custom-prefix}-ease-in', @ease-in);
@motion-ease: var(~'@{global-custom-prefix}-ease', @ease);
/* -----------  motion  ——————---- end */

/* -----------  transition  ——————---- start */
@duration-slowly: var(~'@{global-custom-prefix}-duration-slowly', @transition-duration-slowly);
@duration-promptly: var(~'@{global-custom-prefix}-duration', @transition-duration);
@duration-quickly: var(~'@{global-custom-prefix}-duration-quickly', @transition-duration-quickly);
/* -----------  transition  ——————---- end */

// font
// font-size 与 font-weight 变量名重复 去除了@font-size定义 font-weight变为font-weight-light
@font-weight-light: var(~'@{global-custom-prefix}-font-weight', @font-weight);
@font-size-small: var(~'@{global-custom-prefix}-font-size-small', @small-font-size);
@font-size-middle: var(~'@{global-custom-prefix}-font-size-middle', @middle-font-size);
@font-size-large: var(~'@{global-custom-prefix}-font-size-large', @large-font-size);
@font-size-x-large: var(~'@{global-custom-prefix}-font-size-x-large', @xlarge-font-size);
@font-size-xx-large: var(~'@{global-custom-prefix}-font-size-xx-large', @xxlarge-font-size);

@radius-border: var(~'@{global-custom-prefix}-radius-border', @radius-size); // 圆角值

/* -----------  zIndex  ——————---- start */
/*
    普通组件内部自身层级应设置在0-100间
*/
@z-index-below: var(~'@{global-custom-prefix}-z-index-below', @zIndex-below); // 置于下层
@z-index-popper: var(~'@{global-custom-prefix}-z-index-popper', @zIndex-popper); // 弹出层
@z-index-dialog: var(~'@{global-custom-prefix}-z-index-dialog', @zIndex-dialog); // 对话框
@z-index-masker: var(~'@{global-custom-prefix}-z-index-masker', @zIndex-masker); // 遮罩层 （loading等）
@z-index-apex: var(~'@{global-custom-prefix}-z-index-apex', @zIndex-apex); // 顶层 （notify）
/* -----------  zIndex  ——————---- end */

@kd-prefix: kd;

/* -----------  color  ——————---- start */
@theme-color: #5582f3; // 主题色
@theme-color-level1: rgb(242, 248, 255);
@theme-color-level2: rgb(242, 248, 255);
@theme-color-level3: rgb(227, 238, 255);
@theme-color-level4: rgb(181, 207, 255);
@theme-color-level5: rgb(135, 173, 255);
@theme-color-level6: rgb(85, 130, 243);
@theme-color-level7: rgb(55, 92, 202);
@theme-color-level8: rgb(31, 59, 161);
@theme-color-level9: rgb(13, 33, 121);
// @hsv-h: hsvhue(@theme-color); // 色相
// @hsv-s: hsvsaturation(@theme-color); // 饱和度
// @hsv-v: hsvvalue(@theme-color); // 明度

@theme-color-disabled: @theme-color-level3;
@theme-color-hover: @theme-color-level5;
@theme-color-click: @theme-color-level7; // 点击色
@theme-color-active-light: @theme-color-level1; // 浅色选中
@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: #fc808B; // 失败反馈浮层的容器边框色
@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); // 二级文本
@secondary-text-color3: rgba(102, 102, 102, 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; // 底色灰背景
@bg3: rgba(255, 255, 255, 0.65); // 次级底色背景
@contain-bg: #fafafa; // 容器内的灰背景
@input-color: #999; // 线型录入的默认态
@strong-border-color: #d9d9d9; // 强线条 --带操作
@strong-border-color-1: #d9d9d9; // 强线条 --分割内容/容器包裹线
@strong-border-color-2: rgba(217, 217, 217, 0.65); // 次级边框
@weak-border-color: #e5e5e5; // 弱线条 -- 需要多层级时
@logo-color-1: #2486ee;
@logo-color-2: #02ccfe;
@logo-color-3: #05c8c7;
@logo-color-4: #a06eff;
// @shadow-on-hover: ; // 悬停时阴影
@white: #fff;
/* -----------  color  ——————---- end */

/* -----------  motion  ——————---- start */
@ease-out: cubic-bezier(0, .4, .4, 1);
@ease-in: cubic-bezier(0.4, 0, 1, 0.6);
@ease: cubic-bezier(0.4, 0, 0.6, 1);
/* -----------  motion  ——————---- end */

/* -----------  transition  ——————---- start */
@transition-duration-slowly: 0.4s;
@transition-duration: 0.3s;
@transition-duration-quickly: 0.2s;
/* -----------  transition  ——————---- 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;
@xxlarge-font-size: 20px;
/* -----------  font  ——————---- end */

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

/* -----------  zIndex  ——————---- start */
/*
    普通组件内部自身层级应设置在0-100间
*/
@zIndex-below: -1; // 置于下层
@zIndex-popper: 1050; // 弹出层
@zIndex-dialog: 1050; // 对话框
@zIndex-masker: 3000; // 遮罩层 （loading等）
@zIndex-apex: 9999; // 顶层 （notify）
/* -----------  zIndex  ——————---- 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: @secondary-text-color3; // 次要文字颜色
@btn-second-background-color: @bg3; // 次要背景颜色
@btn-second-border-color: @strong-border-color-2; // 次要边框颜色

@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-header-padding: 12px;
@collapse-content-font-color: @primary-text-color;
@collapse-content-font-size: @font-size;
@collapse-content-padding: 0 16px;
@collapse-disabled-color: @disabled-color;
@collapse-content-bordered-padding: 12px;

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

/* -----------  Card  ——————---- start */
@card-horizontal-padding: 12px;
@card-header-height: 40px;
@card-avatar-header-height: 64px;
@card-avatar-size: 42px;
@card-actions-height: 32px;
@card-unit-space: 4px;
@card-title-color: @primary-text-color;
@card-content-color: @secondary-text-color;
@card-title-font-size: @font-size;
@card-content-font-size: @small-font-size;
/* -----------  Card  ——————---- end */

/* -----------  Carousel  ——————---- start */
@carousel-dots-margin-top: 15px; // 面板指示点到边界的边距
@carousel-dots-margin-bottom: 15px; // 面板指示点到边界的边距
@carousel-dots-margin-left: 15px; // 面板指示点到边界的边距
@carousel-dots-margin-right: 15px; // 面板指示点到边界的边距
@carousel-dots-boder-radius: 2px; // 面板指示点的圆角
@carousel-dots-width: 24px; // 面板指示点的宽度
@carousel-dots-height: 3px; // 面板指示点的高度
@carousel-dots-marigin: 3px; // 面板指示点的间距
/* -----------  Carousel  ——————---- end */

/* -----------  Cascader  ——————---- start */
@cascader-menu-height: 196px;
@cascader-menu-min-width: 116px;
@cascader-color: @primary-text-color;
@cascader-font-size: @small-font-size;
@cascader-background-color: @white;
@cascader-box-shadow-blur: 6px;
@cascader-transition-fn: cubic-bezier(0.25, 1, 0.5, 1);
/* -----------  Cascader  ——————---- 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 17px;
@switch-inner-checked-margin: 0 17px 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  ——————---- 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: 2px; // 勾选输入框圆角
@checkbox-default-input-border-width: 1px; // 勾选输入框边框大小
@checkbox-default-input-icon-color: #fff; // 勾选输入框边勾勾图标颜色
@checkbox-default-input-icon-size: 14px; // 勾选输入框勾勾图标大小
@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: 12px; // 边框类型三角内勾选输入框勾勾图标大小
/* -----------  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: 14px;
@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  ——————---- 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-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-gap: 8px;
@timeline-width: 1px;
@timeline-dot-size: 9px;
@timeline-line-height: 18px;
@timeline-label-width: 70px;
@timeline-color: @weak-border-color;
@timeline-dot-color: @theme-color;
@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);
@tab-disabled-bg: @bg2;
/* -----------  Tabs  ——————---- end */

/* -----------  Select  ——————---- start */
@select-dropdown-bg: @bg;
@select-disabled-option-bg: @disabled-contain-bg;
@select-placeholder-color: @third-text-color;
@select-item-active-bg: @hover-color;
@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: 24px; // 小号高度lh:12px
@select-large-line-height: 28px;
@select-middle-line-height: 22px;
@select-small-line-height: 14px;

/* -----------  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  ——————---- 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-transition-fn: cubic-bezier(0.25, 1, 0.5, 1);
/* -----------  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-search-suffix-icon-color-hover: #999;
@transfer-pagination-height: 36px;
/* -----------  Transfer  ——————---- end */

/* -----------  DatePicker  ——————---- start */
@date-placeholder-color: @secondary-text-color;
@date-font-color: @secondary-text-color;
@date-focus-color: @primary-text-color;
@date-background-color: @white;
@date-sizing-border: 1px;
@date-width: 230px;
@date-padding-suffix: 10px;
@date-panel-header-height: 36px;
@date-panel-horizontal-gap: 12px;
@date-panel-box-shadow-blur: 8px;

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

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

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

@date-clear-offset: 1px;
@date-range-clear-offset: 9px;
@date-ranges-width: 160px;

/* -----------  DatePicker  ——————---- end */

/* -----------  ColorPicker  ——————---- start */

/* -----------  ColorPicker  ——————---- end */

/* -----------  Tree  ——————---- start */
@tree-node-height: 28px;
@tree-font-size: @font-size;
@tree-node-hover-bg-color: @hover-color;
@tree-node-checked-bg-color: @theme-color;
@tree-expand-icon-height: 22px;
@tree-expand-icon-width: 22px;
@tree-node-icon-height: 22px;
@tree-node-icon-width: 22px;
@tree-node-margin-left: 6px;
@tree-node-disabled-color: @disabled-color;
@tree-node-disabled-border-color: @disabled-border-color;
/* -----------  Tree  ——————---- 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-border-color: @strong-border-color-1;
/* -----------  Modal  ——————---- end */

/* -----------  Steps  ——————---- start */
@steps-transition-fn: cubic-bezier(0.48, 0.04, 0.52, 0.96);
/* -----------  Steps  ——————---- end */

/* -----------  Form  ——————---- start */
@form-field-margin: 0 30px 22px 0; // item 间距
@form-field-label-font-size: 12px; // label 字体大小
@form-field-label-line-height: 18px; // label 行高
@form-field-message-font-size: 12px; // 校验信息字体大小
@form-field-message-line-height: 18px; // 校验信息行高
@form-field-message-padding: 2px 8px; // 校验信息内间距
/* -----------  Form  ——————---- end */
/* -----------  Tag ——————---- start */
@tag-font-size: @small-font-size;
@tag-border-radius: 10px;
@tag-height: 20px;
@tag-small-height: 16px;
@tag-small-padding-horizontal: 6px;
@tag-small-font-size: @small-font-size;
@tag-middle-height: 20px;
@tag-middle-padding-horizontal: 7px;
@tag-middle-font-size: @small-font-size;
@tag-large-height: 24px;
@tag-large-padding-horizontal: 8px;
@tag-large-font-size: @middle-font-size;
@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-disabled-color: @disabled-color;
/* -----------  Tag ——————---- end */

/* -----------  Menu  ——————---- start */
@menu-bg-color: #343848;
@menu-subMenu-bg-color: #21242d;
@menu-font-color: rgba(255, 255, 255, 0.65);
@menu-font-size: @small-font-size;
@menu-icon-size: @xxlarge-font-size;
@menu-item-line-height: 50px;
@menu-item-padding: 0 15px;
/* -----------  Menu  ——————---- end */

/* -----------  notice  ——————---- start */
@notice-zIndex: @zIndex-apex;
@notice-below-zIndex: @zIndex-below;
/* -----------  message  ——————---- end */

/* -----------  Spin  ——————---- start */
@spin-page-size: 15px;
@spin-container-size: 5px;
@spin-dot-color-first: @logo-color-1;
@spin-dot-color-second: @logo-color-2;
@spin-dot-color-third: @logo-color-3;
@spin-dot-color-fourth: @logo-color-4;
/* -----------  Spin  ——————---- end */

/* -----------  Spin  ——————---- start */
@empty-image-height: 96px;
@empty-font-color: @third-text-color;
@empty-font-size: @font-size;
/* -----------  Spin  ——————---- end */

/* -----------  Layout  ——————---- start */
@layout-body-background: @bg2;
@layout-header-background: @bg;
@layout-header-height: 52px;
@layout-header-padding: 0 20px 0 35px;
@layout-header-color: @primary-text-color;
@layout-footer-padding: 24px 50px;
@layout-footer-background: @layout-body-background;
@layout-sider-background: @menu-bg-color;
@layout-trigger-height: 50px;
@layout-trigger-background: @menu-bg-color;
@layout-trigger-color: @bg;
@layout-zero-trigger-width: 36px;
@layout-zero-trigger-height: 42px;
// Layout light theme
@layout-sider-background-light: @bg;
@layout-trigger-background-light: @bg;
@layout-trigger-color-light: @primary-text-color;
/* -----------  Layout  ——————---- end */

/* -----------  Typography  ——————---- start */
@typography-title-font-weight: 600;
@typography-title-margin-top: 1.2em;
@typography-title-margin-bottom: 0.5em;
@typography-paragraph-margin-bottom: 24px;
@typography-margin-bottom: 80px;
@typography-max-width: 830px;
@heading-1-size: 40px;
@heading-2-size: 28px;
@heading-3-size: 18px;
@heading-1-margin-bottom: 12px;
@heading-2-margin-bottom: 24px;
@heading-3-margin-bottom: 12px;
@heading-2-color: #276ff5;
@heading-4-size: ceil(@font-size * 1.42);
@heading-5-size: ceil(@font-size * 1.14);
/* -----------  Typography  ——————---- start */

/* -----------  Search  ——————---- start */
@search-small-width: 200px;
@search-middle-width: 260px;
@search-large-width: 320px;
@search-hover-color: #276ff5;
@quick-search-default-width: 200px;
@quick-search-default-height: 24px;
@quick-search-max-width: 400px;
@quick-search-selected-tags-del-hover-bg: #FB2323;
@quick-search-input-color: @disabled-color;
@quick-search-border-bottom-color: #d9d9d9;
@quick-search-dropdown-font-size: 12px;
@quick-search-dropdown-option-height: 32px;
@quick-search-dropdown-option-padding: 12px;
@quick-search-dropdown-selected-bg: #f2F9ff;
@quick-search-dropdown-hover-bg: @hover-color;
@quick-search-dropdown-tag-color: #666666;
@quick-search-dropdown-desc-color: #999999;
@quick-search-npl-border-color: #D8D8D8;
@quick-search-selection-placeholder-color: #bfbfbf;
@search-panel-width: 800px;
@search-panel-height: 60px;
@search-panel-hover-bg: #eef3fe;
@search-panel-hover-color: #597cfc;
@search-panel-border-color: #E6E8ED;

/* -----------  Search  ——————---- start */

/* -----------  Badge  ——————---- start */
@badge-color: #ff4d4f;
@badge-text-color: @bg;
@badge-height: 20px;
@badge-height-sm: 14px;
@badge-font-weight: normal;
@badge-font-size: @small-font-size;
@badge-font-size-sm: @small-font-size;
@badge-dot-size: 6px;
@badge-status-size: 6px;
/* -----------  Badge  ——————---- end */

/* -----------  Anchor  ——————---- start */
@anchor-bg: @bg;
@anchor-width: 120px;
@anchor-border-color: @strong-border-color;
@anchor-link-top: 7px;
@anchor-link-left: 8px;
@anchor-link-padding: @anchor-link-top @anchor-link-left @anchor-link-top @anchor-link-left;
@anchor-advanced-padding-top: 8px;
@anchor-advanced-padding-bottom: 7px;
@anchor-advanced-width: 160px;
@anchor-advanced-lock-size: 16px;
@anchor-advanced-arrows-color: #666;
@anchor-icon-font-size: 16px;
/* -----------  Anchor  ——————---- end */

/* -----------  Avatar  ——————---- start */
@avatar-size-xs: 24px;
@avatar-size-sm: 32px;
@avatar-size-base: 40px;
@avatar-size-lg: 60px;
@avatar-font-size-base: 22px;
@avatar-font-size-lg: 36px;
@avatar-font-size-sm: 18px;
@avatar-font-size-xs: 14px;
@avatar-border-radius: @radius-size;
@avatar-bg: #ccc;
/* -----------  Avatar  ——————---- end */

/* -----------  AdvancedSelector  ——————---- start */
@advancedSelector-width: 230px;
@advancedSelector-border-color: #999;
@advancedSelector-dropdown-height: 400px;
@advancedSelector-dropdown-options-height: 32px;
@advancedSelector-hover-bg: @hover-color;

/* -----------  AdvancedSelector  ——————---- end */


/*! rtl:begin:ignore */




@alert-prefix-cls: ~'@{kd-prefix}-alert';

@success: success;
@warning: warning;
@error: error;
@info: info;

.alert-bg-type-set() {
  @success: @alert-success-bg-color;
  @warning: @alert-warning-bg-color;
  @error: @alert-error-bg-color;
  @info: @alert-info-bg-color;
}

.alert-icon-type-set() {
  @success: @alert-success-icon-color;
  @warning: @alert-warning-icon-color;
  @error: @alert-error-icon-color;
  @info: @alert-info-icon-color;
}

.alert-border-type-set() {
  @success: @alert-success-border-color;
  @warning: @alert-warning-border-color;
  @error: @alert-error-border-color;
  @info: @alert-info-border-color;
}

@alert-transition-fn: cubic-bezier(0.32, 0.94, 0.6, 1);

.icon-center {
  i {
    align-self: center;
  }
}

.@{alert-prefix-cls} {
  &-container {
    z-index: @z-index-apex;
    display: none;
    padding: @alert-padding-vertical @alert-padding-horizontal;
    align-items: center;
    transition: display 3s;
    border-radius: @alert-radius-border;
    border: 1px solid;
  }
  &-banner-container {
    display: flex;
    flex-direction: column;
    position: fixed;
    z-index: @z-index-apex;
    width: 100%;
  }
  each(.alert-bg-type-set(), {
    .alert-bg-type(@key, @value);
  });
  each(.alert-border-type-set(), {
    .alert-border-type(@key, @value);
  });
  &-icon {
    display: flex;
    cursor: default;
    .icon-center();
    height: @alert-message-icon-font-size;
    margin-right: @alert-message-icon-margin-right;
    font-size: @alert-message-icon-font-size;
    each(.alert-icon-type-set(), {
      .alert-icon-type(@key, @value);
    });
  }
  &-message {
    color: @alert-message-color-text;
    font-size: @alert-message-font-size;
    line-height: 16px;
    display: flex;
    flex-grow: 1;
    cursor: default;
  }
  &-leave {
    transition: padding @duration-promptly @alert-transition-fn, opacity @duration-promptly @alert-transition-fn,
      margin @duration-promptly @alert-transition-fn, height @duration-promptly @alert-transition-fn,
      line-height @duration-promptly @alert-transition-fn;
    display: flex;
    padding: 0 @alert-padding-horizontal;
    border-width: 0;
    min-height: 0;
    margin: 0 !important;
    overflow: hidden;
    opacity: 0;

    .@{alert-prefix-cls}-icon,
    .@{alert-prefix-cls}-message,
    .@{alert-prefix-cls}-close-icon {
      height: 0;
      line-height: 0;
    }
  }
  &-close-icon {
    display: flex;
    height: @alert-message-icon-font-size;
    margin-left: @alert-close-icon-margin-left;
    color: @alert-close-icon-color;
    font-size: @alert-close-icon-font-size;
    cursor: pointer;
    &:hover {
      color: @alert-close-icon-color-hover;
    }
    &:active {
      color: @color-theme-click;
    }
    .icon-center();
  }
  &-visible {
    display: flex;
  }
  &-banner {
    position: fixed;
    animation: moveIn @duration-promptly @alert-transition-fn both;
  }
}
@keyframes moveIn {
  from {
    transform: translateY(-50px);
  }
  to {
    transform: translateY(0);
  }
}

.@{alert-prefix-cls}-rtl {
  direction: rtl;
  .@{alert-prefix-cls}-icon {
    margin-left: @alert-message-icon-margin-right;
    margin-right: 0;
  }
  .@{alert-prefix-cls}-close-icon {
    margin-right: @alert-close-icon-margin-left;
    margin-left: 0;
  }
}
/*! rtl:end:ignore */

.alert-bg-type(@type, @color) {
  &.alert-@{type}-bg-color {
    background-color: @color;
  }
}

.alert-icon-type(@type, @color) {
  &.alert-@{type}-icon-color {
    color: @color
  }
}

.alert-border-type(@type, @color) {
  &.alert-@{type}-border-color {
    border-color: @color
  }
}

.square(@side-length) {
  width: @side-length;
  height: @side-length;
}


@alert-custom-prefix: ~'--@{kd-prefix}-c-alert';

// color
@alert-success-bg-color: var(~'@{alert-custom-prefix}-color-background-success', @color-background-success); // 反馈浮层成功提示的背景色
@alert-warning-bg-color: var(~'@{alert-custom-prefix}-color-background-warning', @color-background-warning); // 反馈浮层警告提示的背景色 
@alert-error-bg-color: var(~'@{alert-custom-prefix}-color-background-error', @color-background-error); // 反馈浮层错误提示的背景色
@alert-info-bg-color: var(~'@{alert-custom-prefix}-color-background-info', @color-background-ongoing); // 反馈浮层一般提示的背景色

@alert-message-color-text: var(~'@{alert-custom-prefix}-color-text', @color-text-primary); // 反馈浮层提示的文字色
@alert-success-icon-color: var(~'@{alert-custom-prefix}-color-icon-success', @color-success); // 反馈浮层成功提示的图标颜色
@alert-warning-icon-color: var(~'@{alert-custom-prefix}-color-icon-warning', @color-warning); // 反馈浮层警告提示的图标颜色
@alert-error-icon-color: var(~'@{alert-custom-prefix}-color-icon-error', @color-error); // 反馈浮层错误提示的图标颜色
@alert-info-icon-color: var(~'@{alert-custom-prefix}-color-icon-info', @color-ongoing); // 反馈浮层一般提示的图标颜色

@alert-success-border-color: var(~'@{alert-custom-prefix}-color-border-success', #DCFAE4); // 反馈浮层成功提示的边框色
@alert-warning-border-color: var(~'@{alert-custom-prefix}-color-border-warning', #FFF1D4); // 反馈浮层警告提示的边框色 
@alert-error-border-color: var(~'@{alert-custom-prefix}-color-border-error', #FFDBE0); // 反馈浮层错误提示的边框色
@alert-info-border-color: var(~'@{alert-custom-prefix}-color-border-info', #E0EFFF); // 反馈浮层一般提示的边框色

@alert-close-icon-color: var(~'@{alert-custom-prefix}-close-icon-color-text', @color-text-secondary); 
@alert-close-icon-color-hover: var(~'@{alert-custom-prefix}-close-icon-color-text-hover', @color-theme-hover); 

// font
@alert-message-font-size: var(~'@{alert-custom-prefix}-message-font-size', @font-size-small);
@alert-message-icon-font-size: var(~'@{alert-custom-prefix}-message-icon-font-size', @font-size-middle);
@alert-close-icon-font-size: var(~'@{alert-custom-prefix}-close-icon-font-size', @font-size-middle);

// spacing
@alert-padding-vertical: var(~'@{alert-custom-prefix}-sizing-padding-vertical', 12px);
@alert-padding-horizontal: var(~'@{alert-custom-prefix}-sizing-padding-horizontal', 20px);
@alert-message-icon-margin-right: var(~'@{alert-custom-prefix}-message-icon-sizing-margin-right', 8px);
@alert-close-icon-margin-left: var(~'@{alert-custom-prefix}-close-icon-sizing-margin-left', 8px);

// radius
@alert-radius-border: var(~'@{alert-custom-prefix}-radius-border', 4px);
/*! rtl:begin:ignore */


@anchor-prefix-cls: ~'@{kd-prefix}-anchor';

.@{anchor-prefix-cls} {
  position: relative;
  padding-left: @anchor-link-left;
  box-sizing: border-box;
  background: @anchor-bg;
  z-index: @zIndex-popper;

  &-wrapper {
    overflow: auto;
    font-size: @anchor-font-size;
    width: @anchor-width;
  }

  &-menu {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    color: #666;

    &-wrapper {
      overflow: auto;
      font-size: @anchor-font-size;
    }

    &-left-arrows {
      margin-right: 10px;
      font-size: @anchor-icon-font-size;
      color: #666;
      cursor: pointer;
      &:hover:not(&-disabled) {
        color: @anchor-color-theme;
      }
      .disabled;
    }

    &-right-arrows {
      margin-left: 10px;
      font-size: @anchor-icon-font-size;
      color: #666;
      cursor: pointer;
      &:hover:not(&-disabled) {
        color: @anchor-color-theme;
      }
      .disabled;
    }

    &-wrap {
      overflow: hidden;
      position: relative;
      flex-grow: 1;
      height: 22px;
    }

    &-link-list {
      // display: flex;
      display: inline-block;
      white-space: nowrap;
      position: absolute;
      transition: all @anchor-transition-duration cubic-bezier(0.42, 0, 1, 1);
      left: 0;
      top: 0;
    }

    .@{anchor-prefix-cls}-link {
      padding: 0;
      display: inline-block;
      &-title {
        display: inline-block;
        max-width: @anchor-horizontal-link-max-width;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        padding: 0 4px;
        line-height: 1.5;
        vertical-align: middle;
      }
    }

    .@{anchor-prefix-cls}-link:not(:last-of-type)::after {
      display: inline-block;
      content: '';
      height: 0;
      width: 40px;
      border-bottom: @anchor-line-slider-width dashed @anchor-disabled-border-color;
      margin: 4px;
    }
  }

  &-advanced-arrows {
    color: @anchor-advanced-arrows-color;
    font-size: @anchor-advanced-arrows-font-size;
    cursor: pointer;
    &:hover {
      color: @anchor-color-theme;
    }
  }

  &-advanced {
    padding-top: @anchor-advanced-padding-top;
    padding-bottom: @anchor-advanced-padding-bottom;
    position: relative;
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.08);
    background: @anchor-bg;
    z-index: @zIndex-popper;

    .@{anchor-prefix-cls}-wrapper {
      width: @anchor-advanced-width;
    }

    &-lock {
      display: flex;
      justify-content: flex-end;
      padding: 0 8px 8px 0;
      font-size: @anchor-advanced-lock-size;
      color: @anchor-advanced-arrows-color;
      cursor: pointer;
    }

    .@{anchor-prefix-cls} {
      max-width: @anchor-advanced-width;
    }
  }

  &-line {
    position: absolute;
    left: @anchor-link-left;
    top: 0;
    height: 100%;
    &::before {
      position: relative;
      display: block;
      width: @anchor-line-slider-width;
      height: 100%;
      margin: 0 auto;
      background-color: @anchor-border-color;
      content: '';
    }

    &-slider {
      position: absolute;
      display: none;
      width: 0;
      height: 16px;
      border-right: @anchor-line-slider-width solid @anchor-color-theme;
      transition: top 0.3s ease-in-out;
      &.visible {
        display: inline-block;
      }
    }
  }

  &-link {
    padding: @anchor-link-padding;

    & > .@{anchor-prefix-cls}-link {
      padding: @anchor-link-secondary-padding;
    }

    &-title {
      text-decoration: none;
      color: @anchor-primary-text-color;
      margin-bottom: @anchor-link-top;
      display: block;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      line-height: 1.5;
      cursor: pointer;
      &:only-child {
        margin-bottom: 0;
      }
      &-secondary {
        color: @anchor-secondary-text-color;
        padding-left: 4px;
      }
    }

    &-title:hover {
      color: @anchor-color-theme;
    }

    &-active > &-title {
      color: @anchor-color-theme;
    }
  }

  &-lock {
    font-size: @anchor-icon-font-size;
  }

  &.hidden {
    opacity: 0;
    visibility: hidden;
    transition: all calc(@anchor-transition-duration - 0.1s) cubic-bezier(0.4, 0, 0.6, 1);
  }
}

.@{anchor-prefix-cls}-rtl {
  direction: rtl;
  .@{anchor-prefix-cls} {
    padding-right: @anchor-link-left;
    padding-left: 0;
    &-line {
      right: @anchor-link-left;
      left: auto;
    }
    &-link {
      text-align: right;
    }
  }
}
/*! rtl:end:ignore */



.disabled() {
  &-disabled {
    color: @disabled-color;
    cursor: not-allowed;
  }
}


@anchor-prefix: '--@{kd-prefix}-c-anchor';

// color
@anchor-bg: var(~'@{anchor-prefix}-color-background', @color-background);
@anchor-border-color: var(~'@{anchor-prefix}-color-border', @color-border-strong);
@anchor-advanced-arrows-color: var(~'@{anchor-prefix}-advanced-arrows-color-text', #666);
@anchor-color-theme: var(~'@{anchor-prefix}-color-theme', @color-theme);
@anchor-disabled-border-color: var(~'@{anchor-prefix}-color-border-disabled', @color-border-disabled);
@anchor-primary-text-color: var(~'@{anchor-prefix}-color-text-primary', @color-text-primary);
@anchor-secondary-text-color: var(~'@{anchor-prefix}-color-text-secondary', @color-text-secondary);

// sizing
@anchor-width: var(~'@{anchor-prefix}-sizing-width', 120px);
@anchor-advanced-width: var(~'@{anchor-prefix}-advanced-sizing-width', 160px);
@anchor-horizontal-link-max-width: var(~'@{anchor-prefix}-horizontal-link-sizing-max-width', 96px);

// spacing
@anchor-link-top: var(~'@{anchor-prefix}-spacing-vertical', 7px);
@anchor-link-left: var(~'@{anchor-prefix}-spacing-horizontal', 7px);
@anchor-link-padding: var(~'@{anchor-prefix}-spacing-padding', 7px 8px);
@anchor-link-secondary-padding: var(~'@{anchor-prefix}-secondary-spacing-padding', 12px 8px);
@anchor-advanced-padding-top: var(~'@{anchor-prefix}-advanced-spacing-padding-top', 8px);
@anchor-advanced-padding-bottom: var(~'@{anchor-prefix}-advanced-spacing-padding-bottom', 7px);
@anchor-line-slider-width: var(~'@{anchor-prefix}-line-slider-spacing-width', 1px);


// font
@anchor-advanced-lock-size: var(~'@{anchor-prefix}-advanced-lock-font-size', 16px);
@anchor-font-size: var(~'@{anchor-prefix}-font-size', @font-size-small);
@anchor-icon-font-size: var(~'@{anchor-prefix}-icon-font-size', 16px);
@anchor-advanced-arrows-font-size: var(~'@{anchor-prefix}-advanced-arrows-font-size', 24px);
// motion
@anchor-transition-duration: var(~'@{anchor-prefix}-duration-duration', @duration-promptly);



@avatar-prefix-cls: ~'@{kd-prefix}-avatar';
@icon-prefix-cls: ~'@{kd-prefix}icon';

.@{avatar-prefix-cls} {
  position: relative;
  display: inline-block;
  overflow: hidden;
  white-space: nowrap;
  text-align: center;
  vertical-align: middle;
  background: @avatar-color-background;

  &-image {
    background: transparent;
  }

  &-disabled {
    cursor: not-allowed;
  }

  &:hover:not(&-disabled) {
    cursor: pointer;
  }

  .avatar-size(@avatar-size-base, @avatar-font-size-base);

  &-lg {
    .avatar-size(@avatar-size-large, @avatar-font-size-large);
  }

  &-sm {
    .avatar-size(@avatar-size-small, @avatar-font-size-small);
  }

  &-xs {
    .avatar-size(@avatar-size-x-small, @avatar-font-size-x-small);
  }

  &-square {
    border-radius: @avatar-border-radius;
  }

  & > img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
}



.avatar-size(@size, @font-size) {
  width: @size;
  height: @size;
  line-height: @size;
  border-radius: 50%;

  &-string {
    position: absolute;
    left: 50%;
    transform-origin: 0 center;
  }

  &.@{avatar-prefix-cls}-icon {
    font-size: @font-size;

    & > .@{icon-prefix-cls} {
      vertical-align: top;
    }
  }
}
@avatar-custom-prefix: '--@{kd-prefix}-c-avatar';

// color
@avatar-color-background: var(~'@{avatar-custom-prefix}-color-background', #B2B2B2);

// font
@avatar-font-size-x-small: var(~'@{avatar-custom-prefix}-font-size-x-small', 14px);
@avatar-font-size-small: var(~'@{avatar-custom-prefix}-font-size-small', 18px);
@avatar-font-size-base: var(~'@{avatar-custom-prefix}-font-size-base', 22px);
@avatar-font-size-large: var(~'@{avatar-custom-prefix}-font-size-large', 36px);


// radius
@avatar-border-radius: var(~'@{avatar-custom-prefix}-border-radius', 2px);

// sizing
@avatar-size-x-small: var(~'@{avatar-custom-prefix}-size-x-small', 24px);
@avatar-size-small: var(~'@{avatar-custom-prefix}-size-small', 32px);
@avatar-size-base: var(~'@{avatar-custom-prefix}-size-base', 40px);
@avatar-size-large: var(~'@{avatar-custom-prefix}-size-large', 60px);






/*! rtl:begin:ignore */


@badge-prefix-cls: ~'@{kd-prefix}-badge';
.@{badge-prefix-cls} {
  position: relative;
  display: inline-block;
  line-height: 1;
  font-size: @badge-font-size-base;

  &-count {
    z-index: auto;
    min-width: @badge-size-base;
    height: @badge-size-base;
    color: @badge-color-text;
    font-weight: @badge-font-weight;
    font-size: @font-size-small;
    line-height: @badge-size-base;
    white-space: nowrap;
    text-align: center;
    background: @badge-color-background;
    border-radius: calc(@badge-size-base / 2);
  }

  &-count-sm {
    min-width: @badge-size-small;
    height: @badge-size-small;
    padding: 0;
    font-size: @badge-font-size-small;
    line-height: @badge-size-small;
    border-radius: calc(@badge-size-small / 2);
  }

  &-dot {
    z-index: auto;
    width: @badge-size-dot;
    min-width: @badge-size-dot;
    height: @badge-size-dot;
    background: @badge-color-background;
    border-radius: 100%;
  }

  &-dot,
  &-custom-component,
  &-count {
    position: absolute;
    top: 0;
    right: 0;
    transform: translate(50%, -50%);
    transform-origin: 100% 0%;
  }

  &-multiple-words {
    padding: 0 4px;
  }

  &-status {
    line-height: inherit;
    vertical-align: baseline;
    &-text {
      margin-left: 8px;
      color: @badge-color-text-primary;
      font-size: @badge-font-size-base;
    }
    &-dot {
      position: relative;
      top: -1px;
      display: inline-block;
      width: @badge-size-status;
      height: @badge-size-status;
      vertical-align: middle;
      border-radius: 50%;
    }
    &-success {
      background-color: @badge-color-success;
    }
    &-processing {
      background-color: @badge-color-ongoing;
      &::after {
        position: absolute;
        top: -1px;
        left: -1px;
        width: 100%;
        height: 100%;
        border: 1px solid @badge-color-ongoing;
        border-radius: 50%;
        animation: antStatusProcessing 1.2s infinite ease-in-out;
        content: '';
      }
    }
    &-error {
      background-color: @badge-color-error;
    }
    &-default {
      background-color: @badge-color-default;
    }
    &-warning {
      background-color: @badge-color-warning;
    }
  }

  &-not-a-wrapper {
    &:not(.@{badge-prefix-cls}-status) {
      vertical-align: middle;
    }

    .@{badge-prefix-cls}-custom-component,
    .@{badge-prefix-cls}-count {
      position: relative;
      top: auto;
      display: block;
      transform-origin: 50% 50%;
      transform: none;
    }
  }
}

@keyframes antStatusProcessing {
  0% {
    transform: scale(0.8);
    opacity: 0.5;
  }
  100% {
    transform: scale(2.4);
    opacity: 0;
  }
}

.@{badge-prefix-cls}-rtl {
  direction: rtl;
  &.@{badge-prefix-cls} {
    .@{badge-prefix-cls}-dot,
    .@{badge-prefix-cls}-custom-component,
    .@{badge-prefix-cls}-count {
      position: absolute;
      left: 0;
      right: auto;
      transform: translate(-50%, -50%);
    }
  }
}
/*! rtl:end:ignore */





@badge-prefix: '--@{kd-prefix}-c-badge';

// sizing
@badge-size-base: var(~'@{badge-prefix}-sizing-base', 16px);
@badge-size-small: var(~'@{badge-prefix}-sizing-small', 14px);
@badge-size-dot: var(~'@{badge-prefix}-sizing-dot', 8px);
@badge-size-status: var(~'@{badge-prefix}-sizing-status', 8px);

// font
@badge-font-weight: var(~'@{badge-prefix}-font-weight', 400);
@badge-font-size-base: var(~'@{badge-prefix}-font-size-base', @font-size-middle);
@badge-font-size-small: var(~'@{badge-prefix}-font-size-small', @font-size-small);

// color
@badge-color-background: var(~'@{badge-prefix}-color-background', #fb2323);
@badge-color-text: var(~'@{badge-prefix}-color', @color-background);
@badge-color-text-primary: var(~'@{badge-prefix}-color', @color-text-primary);
@badge-color-success: var(~'@{badge-prefix}-color-success', @color-success);
@badge-color-ongoing: var(~'@{badge-prefix}-color-ongoing', @color-ongoing);
@badge-color-warning: var(~'@{badge-prefix}-color-warning', @color-warning);
@badge-color-error: var(~'@{badge-prefix}-color-error', @color-error);
@badge-color-default: var(~'@{badge-prefix}-color-default', #d9d9d9);




@advancedSelector-prefix-cls: ~'@{kd-prefix}-baseData';

.@{advancedSelector-prefix-cls} {
  width: @base-data-width;
  display: flex;
  align-items: center;
  border-bottom: 1px solid @base-data-border-color;

  &-disabled {
    cursor: not-allowed;
  }

  &:not(.@{advancedSelector-prefix-cls}-disabled):hover {
    border-color: @base-data-color-border-hover;

    .@{advancedSelector-prefix-cls} {
      &-detail,
      &-suffix {
        color: @base-data-icon-text-color-hover;
      }

      &-detail {
        visibility: visible;
      }
    }
  }

  &-total {
    white-space: nowrap;
    cursor: pointer;
  }

  &-suffix,
  &-detail {
    font-size: 16px;
    margin-left: 5px;
    cursor: pointer;
  }

  &-detail {
    visibility: hidden;
  }

  &-dropdown {
    margin: 0;
    z-index: @base-data-dropdown-z-index;
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
    border-radius: @base-data-dropdown-radius-border;
    background: @base-data-dropdown-color-background;
    overflow: auto;
    max-height: @base-data-dropdown-height;
    color: @base-data-color-text;

    &-columns,
    &-options {
      display: flex;
      align-items: center;

      &.selected {
        color: @base-data-option-color-text-active;
      }

      &-item {
        flex: 1;
        padding: 0 @base-data-option-spacing-padding-vertical;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
        position: relative;
        display: flex;
        align-items: center;

        &-collect {
          position: absolute;
          right: 10px;
          visibility: hidden;

          &-icon {
            color: @base-data-dropdown-icon-text-color;

            &:hover {
              color: @base-data-dropdown-icon-text-color-hover;
            }
          }

          &-not-icon {
            color: #666;

            &:hover {
              color: @base-data-dropdown-text-color-hover;
            }
          }
        }

        &-search {
          color: @link-color-hover;
        }
      }
    }

    &-loading {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 200px;
    }

    &-columns {
      height: @base-data-dropdown-columns-height;
      background: @base-data-hover-bg;
    }

    &-options {
      height: @base-data-dropdown-options-height;
      cursor: pointer;

      &:hover {
        background: @base-data-hover-bg;

        .@{advancedSelector-prefix-cls}-dropdown-options-item-collect {
          visibility: visible;
        }
      }
    }

    &-footer {
      height: @base-data-dropdown-footer-height;
      border-top: 1px solid @base-data-footer-color-border;

      &-btn {
        color: @base-data-footer-btn-text-color;
        height: 100%;
        display: flex;
        align-items: center;

        & > span {
          flex: 1;
          text-align: center;
          cursor: pointer;
        }
      }
    }

    &-empty {
      margin: 20px 0;
    }

    // 修改tabs默认样式
    .@{kd-prefix}-tabs-tab-list {
      width: 100%;
      display: flex;
    }

    .@{kd-prefix}-tab-pane {
      flex: 1;
      margin-right: 0;
      text-align: center;
    }

    .@{kd-prefix}-tabs-right-arrows {
      display: none;
    }
  }

  .@{kd-prefix}-input {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 0;

    &-disabled {
      background: @bg;
    }
  }
}

.@{advancedSelector-prefix-cls}-dropdown-wrapper {
  &.topLeft.hidden,
  &.topRight.hidden {
    opacity: 0;
    visibility: hidden;
    transition: all calc(@transition-duration - 0.1s) @ease;
    animation-name: kdSlideDownOut;
  }

  &.topLeft,
  &.topRight {
    animation-name: kdSlideDownIn;
  }

  &.bottomLeft.hidden,
  &.bottomRight.hidden {
    opacity: 0;
    visibility: hidden;
    transition: all calc(@transition-duration - 0.1s) @ease;
    animation-name: kdSlideUpOut;
  }

  &.bottomLeft,
  &.bottomRight {
    animation-name: kdSlideUpIn;
  }
}

/*! rtl:begin:ignore */
.@{advancedSelector-prefix-cls}-rtl {
  direction: rtl;
  .@{kd-prefix}-input {
    padding-left: 0;
    padding-right: 9px;
  }
  .@{advancedSelector-prefix-cls}-suffix,
  .@{advancedSelector-prefix-cls}-detail {
    margin-left: 0;
    margin-right: 5px;
  }
}
/*! rtl:end:ignore */



@base-data-custom-prefix: ~'--@{kd-prefix}-c-base-data';

// color
@base-data-border-color: var(~'@{base-data-custom-prefix}-color-border', #999);
@base-data-hover-bg: var(~'@{base-data-custom-prefix}-color-background-hover', @color-hover);
@base-data-color-text: var(~'@{base-data-custom-prefix}-color-text', #212121);
@base-data-color-border-hover: var(~'@{base-data-custom-prefix}-border-color-hover', @color-theme);
@base-data-dropdown-color-background: var(~'@{base-data-custom-prefix}-dropdown-radius-border', @color-background);
@base-data-dropdown-icon-text-color: var(~'@{base-data-custom-prefix}-dropdown-icon-color-text', @color-warning);
@base-data-dropdown-icon-text-color-hover: var(~'@{base-data-custom-prefix}-dropdown-icon-color-text-hover', @color-warning);
@base-data-dropdown-text-color-hover: var(~'@{base-data-custom-prefix}-dropdown-color-text-hover', @color-warning);
@base-data-dropdown-search-icon-text-color: var(~'@{base-data-custom-prefix}-dropdown-search-icon-color-text', @color-text-link-hover);
@base-data-footer-color-border: var(~'@{base-data-custom-prefix}-footer-color-border', @color-border-strong);
@base-data-icon-text-color-hover: var(~'@{base-data-custom-prefix}-icon-color-text-hover', @color-theme);
@base-data-footer-btn-text-color: var(~'@{base-data-custom-prefix}-footer-btn-color-text', @color-text-link);
@base-data-option-color-text-active: var(~'@{base-data-custom-prefix}-option-color-text-active', @color-theme);

// radius
@base-data-dropdown-radius-border: var(~'@{base-data-custom-prefix}-dropdown-radius-border', @radius-border);

// sizing
@base-data-width: var(~'@{base-data-custom-prefix}-sizing-width', 230px);
@base-data-dropdown-height: var(~'@{base-data-custom-prefix}-dropdown-sizing-height', 400px);
@base-data-dropdown-options-height: var(~'@{base-data-custom-prefix}-dropdown-options-sizing-height', 32px);
@base-data-dropdown-columns-height: var(~'@{base-data-custom-prefix}-dropdown-columns-height', 36px);
@base-data-dropdown-footer-height: var(~'@{base-data-custom-prefix}-dropdown-footer-height', 40px);

// spacing
@base-data-option-spacing-padding-vertical: var(~'@{base-data-custom-prefix}-option-spacing-padding-vertical', 12px);

// z-index
@base-data-dropdown-z-index: var(~'@{base-data-custom-prefix}-dropdown-z-index', @z-index-popper);
/*! rtl:begin:ignore */


@breadcrumb-prefix-cls: ~'@{kd-prefix}-breadcrumb';

.@{breadcrumb-prefix-cls},
.@{breadcrumb-prefix-cls}-more-panel {
  .breadcrumb;

  display: flex;
  height: 22px;

  &-hide-icon {
    position: absolute;
    z-index: -999999;
    top: -999999px;
    visibility: hidden;
  }

  &-item {
    display: flex;
    cursor: text;

    &-separator {
      padding: 0 @breadcrumb-separator-spacing-padding-horizontal;
      color: @breadcrumb-separator-color-text;
    }

    &-link {
      &:hover {
        color: #3987ed;
        cursor: pointer;
      }
    }

    &-emphasize-model {
      color: @breadcrumb-color-text;
    }

    &-emphasize-model-current {
      color: @breadcrumb-active-color-text;
    }

    &-weaken-model {
      color: @breadcrumb-active-color-text;
    }

    &-weaken-model-current {
      color: @breadcrumb-color-text;
    }

    &-text {
      white-space: nowrap;

      &:last-child {
        text-overflow: ellipsis;
      }
    }

    &-icon {
      margin-right: 4px;
    }
  }

  .kd-dropdown-trigger {
    margin-left: 4px;
  }
}

.@{breadcrumb-prefix-cls}-popper.@{kd-prefix}-tooltip {
  max-width: none;
}

.@{breadcrumb-prefix-cls}-rtl {
  direction: rtl;
  &.@{breadcrumb-prefix-cls} {
    .@{breadcrumb-prefix-cls}-item {
      &-icon {
        margin-left: 4px;
        margin-right: 0;
      }
    }
  }
}
/*! rtl:end:ignore */



.breadcrumb() {
  color: @breadcrumb-color-text;
  font-size: @breadcrumb-font-size;
  font-weight: @breadcrumb-font-weight;
}



@breadcrumb-custom-prefix: ~'--@{kd-prefix}-c-breadcrumb';

// color
@breadcrumb-color-text: var(~'@{breadcrumb-custom-prefix}-color-text', #737373);
@breadcrumb-active-color-text: var(~'@{breadcrumb-custom-prefix}-active-color-text', #111111);
@breadcrumb-separator-color-text: var(~'@{breadcrumb-custom-prefix}-separator-color-text', #b2b2b2);

// font
@breadcrumb-font-size: var(~'@{breadcrumb-custom-prefix}-font-size', @font-size-middle);
@breadcrumb-font-weight: var(~'@{breadcrumb-custom-prefix}-font-weight', @font-weight-light);

// spacing
@breadcrumb-separator-spacing-padding-horizontal: var(~'@{breadcrumb-custom-prefix}-separator-spacing-padding-horizontal', 8px);

/*! rtl:begin:ignore */


@btn-prefix-cls: ~'@{kd-prefix}-btn';

.@{btn-prefix-cls} {
  .btn;

  // 按钮wave动效
  transition: color @transition-duration, background-color @transition-duration, border-color @transition-duration;
  &:not(&-text)::after {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: inherit;
    box-shadow: 0 0 0 0 @color-theme;
    opacity: 0.2;
    content: '';
    pointer-events: none;
    clear: both;
  }
  &:not(&-text)[click-animating-wave='true']::after {
    animation: fadeEffect @btn-duration-fade @ease-out forwards, waveEffect @btn-duration-wave @ease-out forwards;
  }

  // 次要按钮
  &-second {
    .btn-type(@btn-second-border-color, @btn-second-background-color, @btn-second-font-color);
    &:hover {
      &:not(.@{btn-prefix-cls}-loading) {
        background-color: @btn-second-background-color-hover;
        border-color: @btn-second-border-color-hover;
        color: @btn-second-font-color-hover;
      }
    }
    &:active {
      &:not(.@{btn-prefix-cls}-loading) {
        background-color: @btn-second-background-color-active;
        border-color: @btn-second-border-color-active;
        color: @btn-second-font-color-active;
      }
    }
    &:disabled {
      border-color: @btn-second-border-color-disabled !important;
      background-color: @btn-second-background-color-disabled !important;
      color: @btn-second-font-color-disabled !important;
    }
  }
  // 主要按钮
  &-primary {
    .btn-type(@btn-primary-border-color, @btn-primary-background-color, @btn-primary-font-color);
    &:hover:not(.@{btn-prefix-cls}-loading) {
      background-color: @btn-primary-background-color-hover;
      border-color: @btn-primary-border-color-hover;
    }
    &:active:not(.@{btn-prefix-cls}-loading) {
      border-color: @btn-primary-border-color-active;
      background-color: @btn-primary-background-color-active;
    }
    &:disabled {
      background-color: @btn-primary-background-color-disabled !important;
      border-color: @btn-primary-border-color-disabled !important;
    }
  }

  // 幽灵按钮
  &-ghost {
    .btn-type(@btn-ghost-border-color, @btn-ghost-background-color, @btn-ghost-font-color);

    &:hover:not(.@{btn-prefix-cls}-loading) {
      background-color: @btn-ghost-background-color-hover;
      border-color: @btn-ghost-border-color-hover;
      color: @btn-ghost-font-color-hover;
    }

    &:active:not(.@{btn-prefix-cls}-loading) {
      background-color: @btn-ghost-background-color-active;
      border-color: @btn-ghost-border-color-hover;
      color: @btn-ghost-font-color-active;
    }

    &:disabled {
      background-color: @btn-ghost-background-color-disabled !important;
      border-color: @btn-ghost-border-color-disabled !important;
      color: @btn-ghost-font-color-disabled !important;
    }
  }

  &-iconWrapper-left {
    display: flex;
    align-items: center;
    justify-content: center;
    float: left;
  }
  &-iconWrapper-right {
    display: flex;
    align-items: center;
    justify-content: center;
    float: right;
  }

  &-loadingIcon {
    color: @btn-g-text-color-loading;
  }

  &-primary-loadingIcon {
    color: @btn-primary-g-text-color-loading;
  }

  // 小号尺寸按钮
  &-size-small {
    .btn-size(@btn-small-height, @btn-small-font-size, @btn-small-padding-vertical, @btn-small-padding-horizontal, @btn-small-min-width, @btn-small-max-width);
    &.@{btn-prefix-cls}-icon-only {
      font-size: @btn-icon-small-font-size;
      padding: 0 @btn-icon-padding-horizontal;
      display: inline-flex;
      justify-content: center;
      align-items: center;
    }

    .@{btn-prefix-cls}-group-basic-icon {
      font-size: @btn-icon-small-font-size;
    }
  }

  // 中号尺寸按钮
  &-size-middle {
    .btn-size(@btn-middle-height, @btn-middle-font-size, @btn-middle-padding-vertical, @btn-middle-padding-horizontal, @btn-middle-min-width, @btn-middle-max-width);
    &.@{btn-prefix-cls}-icon-only {
      font-size: @btn-icon-middle-font-size;
      padding: 0 @btn-icon-padding-horizontal;
      display: inline-flex;
      justify-content: center;
      align-items: center;
    }

    .@{btn-prefix-cls}-group-basic-icon {
      font-size: @btn-icon-middle-font-size;
    }
  }

  // 大号尺寸按钮
  &-size-large {
    .btn-size(@btn-large-height, @btn-large-font-size, @btn-large-padding-vertical, @btn-large-padding-horizontal, @btn-large-min-width, @btn-large-max-width);
    &.@{btn-prefix-cls}-icon-only {
      font-size: @btn-icon-large-font-size;
      padding: 0 @btn-icon-padding-horizontal;
      display: inline-flex;
      justify-content: center;
      align-items: center;
    }

    .@{btn-prefix-cls}-group-basic-icon {
      font-size: @btn-icon-large-font-size;
    }
  }

  // 圆形按钮
  &-shape-circle {
    border-radius: 50%;
    min-width: auto;
  }

  // 圆形小号尺寸按钮宽度等同其高度
  &-shape-circle&-size-small {
    .btn-shape-circle-width(@btn-small-height);
  }
  // 圆形中号尺寸按钮宽度等同其高度
  &-shape-circle&-size-middle {
    .btn-shape-circle-width(@btn-middle-height);
  }
  // 圆形大号尺寸按钮宽度等同其高度
  &-shape-circle&-size-large {
    .btn-shape-circle-width(@btn-large-height);
  }

  // 椭圆形小号尺寸按钮border-radius等同其高度
  &-shape-round&-size-small {
    border-radius: @btn-small-height;
  }
  // 椭圆形中号尺寸按钮border-radius等同其高度
  &-shape-round&-size-middle {
    border-radius: @btn-middle-height;
  }
  // 椭圆形大号尺寸按钮border-radius等同其高度
  &-shape-round&-size-large {
    border-radius: @btn-large-height;
  }

  // 直角按钮
  &-shape-none {
    border-radius: 0;
  }

  // 文本类型按钮
  &-text {
    height: auto;
    width: auto;
    color: @btn-text-g-text-color;
    padding: 0;
    min-width: auto;

    .@{btn-prefix-cls}-iconWrapper-left {
      margin-right: @btn-text-icon-margin-right;
    }

    &:hover {
      color: @btn-text-g-text-color-hover;
    }

    &:active {
      color: @btn-text-g-text-color-active;
    }

    &[disabled] {
      color: @btn-text-g-text-color-disabled !important;
    }
  }

  // 按钮不带边框
  &-no-border {
    border: none;
  }

  // 不可用按钮部分样式
  &:disabled,
  &[disabled] {
    cursor: not-allowed;
  }
  // 按钮开启幽灵化
  &-background-ghost {
    &,
    &:hover,
    &:active {
      background-color: transparent;
    }

    &.@{btn-prefix-cls}-primary {
      color: @btn-background-ghost-g-text-color;

      &:hover {
        color: @btn-background-ghost-g-text-color-hover;
      }
    }
  }
  // 加载中按钮
  &-loading {
    cursor: default;
    display: inline-flex;
    justify-content: center;
    align-items: center;
  }
  // 按钮开启块化撑满父元素
  &-block {
    width: 100%;
  }
  // 图标与文本之间的间隔
  .btn-space {
    margin-left: 4px;
  }
}

.@{btn-prefix-cls}-group {
  display: inline-block;

  &-basic {
    .@{btn-prefix-cls} {
      padding-top: 0;
      padding-bottom: 0;
    }

    &-icon {
      margin-left: 4px;
    }
  }

  &-similar {
    .@{btn-prefix-cls}-group-trigger {
      .@{btn-prefix-cls} {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        margin-left: -1px;
        &-primary {
          background: @btn-group-trigger-color-background;
          &:hover {
            background: @btn-group-trigger-color-background-hover;
            border-color: @btn-group-trigger-color-background-hover;
          }

          &:active {
            background: @btn-group-trigger-color-background-active;
          }

          &:disabled {
            background: @btn-group-trigger-color-background-disabled !important;
          }
        }
      }
    }
    & > .@{btn-prefix-cls} {
      &:first-child {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        &:hover {
          z-index: 1;
        }
      }
    }
  }

  .@{btn-prefix-cls} {
    &-size-small,
    &-size-middle,
    &-size-large {
      min-width: unset;
    }
  }

  .@{kd-prefix}-dropdown {
    &-menu {
      padding: 0;
    }
  }

  &-dropdown {
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
    background: @btn-group-dropdown-color-background;
    color: #333333;
    min-width: @btn-group-dropdown-min-width;

    &-item {
      height: @btn-group-dropdown-item-height;
      line-height: @btn-group-dropdown-item-height;
      cursor: pointer;
      padding: 0 @btn-group-dropdown-item-horizontal;
      &:hover {
        background: @btn-group-dropdown-item-color-background-hover;
      }

      &:not(:last-child) {
        border-bottom: 1px solid @btn-group-dropdown-item-border-color;
      }
    }
  }

  &.topLeft.hidden,
  &.bottomLeft.hidden,
  &.topRight.hidden,
  &.bottomRight.hidden {
    opacity: 0;
    visibility: hidden;
    transition: all calc(@transition-duration - 0.1s) @ease;
  }
}

.@{btn-prefix-cls}-rtl {
  direction: rtl;
  .@{btn-prefix-cls}-iconWrapper-left {
    float: right;
    margin-left: 4px;
  }
  .@{btn-prefix-cls}-iconWrapper-right {
    float: left;
    margin-right: 4px;
  }
  .@{btn-prefix-cls}-group-basic {
    &-icon {
      margin-right: 5px;
      margin-left: 0;
    }
  }
  .btn-space {
    margin-left: 0;
  }
  &-similar {
    .@{btn-prefix-cls}-group-trigger {
      .@{btn-prefix-cls} {
        border-top-left-radius: @btn-g-radius-border;
        border-bottom-left-radius: @btn-g-radius-border;
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        margin-right: -1px;
      }
    }
    & > .@{btn-prefix-cls} {
      &:first-child {
        border-top-right-radius: @btn-g-radius-border;
        border-bottom-right-radius: @btn-g-radius-border;
      }
    }
  }
}

.@{btn-prefix-cls}-group-rtl {
  direction: rtl;
}
/*! rtl:end:ignore */



// 按钮默认样式Mixins
.btn() {
	padding: 0;
	position: relative;
	display: inline-block;
	vertical-align: middle;
	box-sizing: border-box;
	font-weight: @btn-g-font-weight;
	border: @btn-border-width solid transparent;
	user-select: none;
	border-radius: @btn-g-radius-border;
	text-align: center;
	background-color: transparent;
	cursor: pointer;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
  &,
  &:active,
  &:focus {
    	outline: 0;
	}
}
// 各个按钮类型的样式Mixins
.btn-type(@border-color, @background-color, @color) {
	border-color: @border-color;
	background-color: @background-color;
	color: @color;
}
// 各个按钮尺寸的样式Mixins
.btn-size(@height, @font-size, @padding-vertical, @padding-horizontal, @min-width,@max-width) {
	height: @height;
	min-width: @min-width;
	line-height: calc(@height - (@padding-vertical * 2) - (@btn-border-width * 2));
	font-size: @font-size;
	padding: @padding-vertical @padding-horizontal;
	max-width: @max-width;
}
// 圆形按钮不同尺寸的样式Mixins
.btn-shape-circle-width(@width) {
	width: @width;
	padding: 0;
}



@button-custom-prefix: ~'--@{kd-prefix}-c-button';

// color
@btn-primary-background-color: var(~'@{button-custom-prefix}-primary-color-background', @color-theme); // 基础背景颜色
@btn-primary-border-color: var(~'@{button-custom-prefix}-primary-color-border', @color-theme); // 基础边框颜色
@btn-primary-font-color: var(~'@{button-custom-prefix}-primary-color-text', @color-white); // 基础文字颜色
@btn-primary-background-color-hover: var(~'@{button-custom-prefix}-primary-color-background-hover', @color-theme-hover); // 基础hover背景颜色
@btn-primary-border-color-hover: var(~'@{button-custom-prefix}-primary-color-border-hover', @color-theme-hover); // 基础hover边框颜色
@btn-primary-background-color-active: var(~'@{button-custom-prefix}-primary-color-background-active', @color-theme-click); // 基础active背景颜色
@btn-primary-border-color-active: var(~'@{button-custom-prefix}-primary-color-border-active', @color-theme); // 基础active边框颜色
@btn-primary-background-color-disabled: var(~'@{button-custom-prefix}-primary-color-background-disabled', @color-theme-4); // 基础disabled背景颜色   禁用状态
@btn-primary-border-color-disabled: var(~'@{button-custom-prefix}-primary-color-border-disabled', @color-theme-4); // 基础disabled边框颜色

@btn-ghost-background-color: var(~'@{button-custom-prefix}-ghost-color-background', transparent); // 幽灵背景颜色
@btn-ghost-border-color: var(~'@{button-custom-prefix}-ghost-color-border', @color-theme-6); //幽灵边框颜色
@btn-ghost-font-color: var(~'@{button-custom-prefix}-ghost-color-text', @color-theme); // 幽灵按钮文字颜色
@btn-ghost-background-color-hover: var(~'@{button-custom-prefix}-ghost-color-background-hover', @color-theme-5); //幽灵hover背景颜色
@btn-ghost-border-color-hover: var(~'@{button-custom-prefix}-ghost-color-border-hover', transparent); //幽灵hover边框颜色
@btn-ghost-font-color-hover: var(~'@{button-custom-prefix}-ghost-color-text-hover',#ffffff); // 幽灵hover按钮文字颜色
@btn-ghost-font-color-active: var(~'@{button-custom-prefix}-ghost-color-text-active', #ffffff); // 幽灵active按钮文字颜色
@btn-ghost-background-color-active: var(~'@{button-custom-prefix}-ghost-color-background-active', @color-theme-7); //幽灵active背景颜色
@btn-ghost-border-color-active: var(~'@{button-custom-prefix}-ghost-color-border-active', transparent); //幽灵active边框颜色

@btn-ghost-background-color-disabled: var(~'@{button-custom-prefix}-ghost-color-background-disabled', @color-background-contain-disabled); // 幽灵disabled背景颜色
@btn-ghost-border-color-disabled: var(~'@{button-custom-prefix}-ghost-color-border-disabled', #D9D9D9); //幽灵disabled边框颜色
@btn-ghost-font-color-disabled: var(~'@{button-custom-prefix}-ghost-color-text-disabled', #B2B2B2); // 幽灵disabled按钮文字颜色

@btn-second-background-color: var(~'@{button-custom-prefix}-second-color-background', transparent); // 次要背景颜色
@btn-second-border-color: var(~'@{button-custom-prefix}-second-color-border', #D9D9D9); // 次要边框颜色
@btn-second-font-color: var(~'@{button-custom-prefix}-second-color-text', #212121); // 次要文字颜色
@btn-second-background-color-hover: var(~'@{button-custom-prefix}-second-color-background-hover', @color-white); // 次要hover背景颜色
@btn-second-border-color-hover: var(~'@{button-custom-prefix}-second-color-border-hover', @color-theme); // 次要hover边框颜色
@btn-second-font-color-hover: var(~'@{button-custom-prefix}-second-color-text-hover', @color-theme); // 次要hover文字颜色
@btn-second-background-color-active: var(~'@{button-custom-prefix}-second-color-background-active', @color-white); // 次要active背景颜色
@btn-second-border-color-active: var(~'@{button-custom-prefix}-second-color-border-active', @color-theme-click); // 次要active边框颜色
@btn-second-font-color-active: var(~'@{button-custom-prefix}-second-color-text-active', @color-theme-click); // 次要active文字颜色
@btn-second-background-color-disabled: var(~'@{button-custom-prefix}-second-color-background-disabled', @color-background-contain-disabled); // 次要disabled背景颜色
@btn-second-border-color-disabled: var(~'@{button-custom-prefix}-second-color-border-disabled', #D9D9D9); // 次要disabled边框颜色
@btn-second-font-color-disabled: var(~'@{button-custom-prefix}-second-color-text-disabled', #B2B2B2); // 次要disabled文字颜色

@btn-text-g-text-color: var(~'@{button-custom-prefix}-text-color-text', @color-theme-6);
@btn-text-g-text-color-hover: var(~'@{button-custom-prefix}-text-color-text-hover', @color-theme-5);
@btn-text-g-text-color-active: var(~'@{button-custom-prefix}-text-color-text-active', @color-theme-7);
@btn-text-g-text-color-disabled: var(~'@{button-custom-prefix}-text-color-text-disabled', @color-theme-4);

@btn-disabled-background-color: var(~'@{button-custom-prefix}-color-background-disabled', @color-background-contain-disabled); // 禁用状态 背景颜色
@btn-disabled-border-color: var(~'@{button-custom-prefix}-color-border-disabled', @color-border-strong); // 禁用状态 边框颜色
@btn-disabled-font-color: var(~'@{button-custom-prefix}-text-color-disabled', @color-white); // 禁用状态 文字颜色

@btn-danger-background-color: var(~'@{button-custom-prefix}-danger-color-background', @color-error); // 危险状态 背景颜色
@btn-danger-border-color: var(~'@{button-custom-prefix}-danger-color-border', @color-error); // 危险状态 边框颜色
@btn-danger-font-color: var(~'@{button-custom-prefix}-danger-color-text', @color-white); // 危险状态 文字颜色

@btn-g-text-color-loading: var(~'@{button-custom-prefix}-text-color-loading', @color-theme);
@btn-primary-g-text-color-loading: var(~'@{button-custom-prefix}-primary-color-text-loading', @color-white);

@btn-background-ghost-g-text-color: var(~'@{button-custom-prefix}-background-ghost-color-text', @color-theme);
@btn-background-ghost-g-text-color-hover: var(~'@{button-custom-prefix}-background-ghost-color-text-hover', @color-white);
@btn-group-dropdown-item-border-color: var(~'@{button-custom-prefix}-group-dropdown-item-border-color', #E5E5E5); // 集合按钮 下拉边框颜色
@btn-group-dropdown-item-color-background-hover: var(~'@{button-custom-prefix}-group-dropdown-item-color-background-hover', #F5F5F5); // 集合按钮 下拉hover背景颜色
@btn-group-dropdown-color-background: var(~'@{button-custom-prefix}-group-dropdown-color-background', #fff); // 集合按钮 下拉菜单背景颜色
@btn-group-trigger-color-background: var(~'@{button-custom-prefix}-group-trigger-color-background', @color-theme-7);
@btn-group-trigger-color-background-hover: var(~'@{button-custom-prefix}-group-trigger-color-background-hover', @color-theme-6);
@btn-group-trigger-color-background-active: var(~'@{button-custom-prefix}-group-trigger-color-background-active', @color-theme-8);
@btn-group-trigger-color-background-disabled: var(~'@{button-custom-prefix}-group-trigger-color-background-disabled', @color-theme-5);

// font
@btn-g-font-weight: var(~'@{button-custom-prefix}-font-weight', @font-weight-light);
@btn-small-font-size: var(~'@{button-custom-prefix}-font-size-small', @font-size-small); // 小号 文字大小
@btn-middle-font-size: var(~'@{button-custom-prefix}-font-size-middle', @font-size-small); // 中号 文字大小
@btn-large-font-size: var(~'@{button-custom-prefix}-font-size-large', @font-size-large); // 大号 文字大小

@btn-icon-small-font-size: var(~'@{button-custom-prefix}-icon-font-size-small', 14px); // 小号 图标大小
@btn-icon-middle-font-size: var(~'@{button-custom-prefix}-icon-font-size-middle', 16px); // 中号 图标大小
@btn-icon-large-font-size: var(~'@{button-custom-prefix}-icon-font-size-large', 18px); // 大号 图标大小

// motion
@btn-transition-fn: var(~'@{button-custom-prefix}-motion-timing-function', cubic-bezier(0.075, 0.82, 0.165, 1));
@btn-duration-fade: var(~'@{button-custom-prefix}-motion-duration-fade', @duration-slowly);
@btn-duration-wave: var(~'@{button-custom-prefix}-motion-duration-wave', @duration-quickly);

// radius
@btn-g-radius-border: var(~'@{button-custom-prefix}-radius-border', @radius-border); //圆角

// sizing
@btn-border-width: var(~'@{button-custom-prefix}-sizing-border', 1px);
@btn-small-height: var(~'@{button-custom-prefix}-sizing-height-small', 24px); // 小号 高度
@btn-small-min-width: var(~'@{button-custom-prefix}-sizing-min-width-small', 60px); // 小号 最小宽度
@btn-small-max-width: var(~'@{button-custom-prefix}-sizing-max-width-small'); // 小号 最大宽度
@btn-middle-height: var(~'@{button-custom-prefix}-sizing-height-middle', 28px); // 中号 高度     高度配置
@btn-middle-min-width: var(~'@{button-custom-prefix}-sizing-min-width-middle', 60px); // 中号 最小宽度
@btn-middle-max-width: var(~'@{button-custom-prefix}-sizing-max-width-middle'); // 中号 最大宽度
@btn-large-height: var(~'@{button-custom-prefix}-sizing-height-large', 32px); // 大号 高度
@btn-middle-max-width: var(~'@{button-custom-prefix}-sizing-max-width-middle'); // 中号 最大宽度
@btn-large-min-width: var(~'@{button-custom-prefix}-sizing-min-width-large', 80px); // 大号 最小宽度
@btn-large-max-width: var(~'@{button-custom-prefix}-sizing-max-width-large'); // 大号 最大宽度
@btn-group-dropdown-item-height: var(~'@{button-custom-prefix}--group-dropdown-item-height', 30px);
@btn-group-dropdown-min-width: var(~'@{button-custom-prefix}-group-dropdown-min-width', 80px);

// spacing
@btn-small-padding-vertical: var(~'@{button-custom-prefix}-spacing-padding-vertical-small', 3px); // 小号 内间距 纵向
@btn-small-padding-horizontal: var(~'@{button-custom-prefix}-spacing-padding-horizontal-small', 8px); // 小号 内间距 横向
@btn-middle-padding-vertical: var(~'@{button-custom-prefix}-spacing-padding-vertical-middle', 5px); // 中号 内间距 纵向
@btn-middle-padding-horizontal: var(~'@{button-custom-prefix}-spacing-padding-horizontal-middle', 8px); // 中号 内间距 纵向   宽度配置
@btn-large-padding-vertical: var(~'@{button-custom-prefix}-spacing-padding-vertical-large', 6px); // 大号 内间距 纵向
@btn-large-padding-horizontal: var(~'@{button-custom-prefix}-spacing-padding-horizontal-large', 8px); // 大号 内间距 横向
@btn-group-dropdown-item-horizontal: var(~'@{button-custom-prefix}-group-dropdown-item-horizonta', 12px);
@btn-icon-padding-horizontal: var(~'@{button-custom-prefix}-icon-spacing-padding-horizontal', 4px);
@btn-text-icon-margin-right: var(~'@{button-custom-prefix}-text-icon-spacing-margin-right', 4px);

/*! rtl:begin:ignore */




@card-prefix-cls: ~'@{kd-prefix}-card';

.@{card-prefix-cls} {
  position: relative;
  background-color: @card-color-background;
  box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2);

  &.hoverable:hover {
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
  }

  .@{card-prefix-cls}-header {
    height: @card-sizing-title-height;
    padding: 0 58px 0 @card-spacing-padding-horizontal;
    line-height: 40px;
    font-size: @card-title-font-size;
    color: @card-title-color;
    .ellipsis;
  }

  .@{card-prefix-cls}-avatar {
    display: flex;
    align-items: center;
    height: 64px;
    padding: 0 @card-spacing-padding-horizontal;

    .@{card-prefix-cls}-avatar-img {
      width: 42px;
      height: 42px;
      margin-right: @card-spacing-padding-vertical;
      overflow: hidden;

      &.circle {
        border-radius: 50%;
      }

      img {
        width: 100%;
        height: 100%;
      }
    }

    .@{card-prefix-cls}-avatar-title {
      font-size: @card-title-font-size;
      color: @card-title-color;
    }

    .@{card-prefix-cls}-avatar-desc {
      font-size: @card-content-font-size;
      color: @card-content-color;
    }
  }

  .@{kd-prefix}-checkbox {
    position: absolute;
    top: @card-spacing-padding-horizontal;
    right: @card-spacing-padding-horizontal;
  }

  .@{card-prefix-cls}-tags {
    padding: 4px @card-spacing-padding-horizontal;

    .@{kd-prefix}-tag:not(:last-child) {
      margin-right: @card-spacing-padding-vertical;
    }
  }

  .@{card-prefix-cls}-body {
    padding: @card-spacing-padding-vertical @card-spacing-padding-horizontal;
    font-size: @card-content-font-size;
    color: @card-content-color;
  }

  .@{card-prefix-cls}-actions {
    height: 32px;
    padding: 0 @card-spacing-padding-horizontal;
    line-height: 32px;
    text-align: right;
    background-color: #fafafa;

    > a {
      margin-left: 16px;
      font-size: @card-content-font-size;
      color: @card-actions-color;

      &:hover {
        color: @card-actions-color-hover;
      }

      &:active {
        color: @card-actions-color-active;
      }
    }
  }
}

.@{card-prefix-cls}-extra {
  position: absolute;
  top: 6px;
  right: 4px;
  i {
    font-size: 22px;
    width: 32px;
    cursor: pointer;
  }
}

.@{card-prefix-cls}-lists-icon {
  font-size: 32px;
  position: absolute;
  top: 6px;
  right: 40px;
}
.@{card-prefix-cls}-rtl {
  direction: rtl;
  text-align: right;

  .@{card-prefix-cls}-header {
    padding: 0 @card-spacing-padding-horizontal 0 58px;
  }

  .@{kd-prefix}-checkbox {
    left: @card-spacing-padding-horizontal;
    right: auto;
  }

  .@{card-prefix-cls}-avatar {
    .@{card-prefix-cls}-avatar-img {
      margin-left: @card-spacing-padding-vertical;
      margin-right: 0;
    }
  }
  .@{card-prefix-cls}-extra {
    left: 4px;
    right: auto;
  }
  .@{card-prefix-cls}-actions {
    text-align: left;
    > a {
      margin-right: 16px;
      margin-left: 0;
    }
  }
}
/*! rtl:end:ignore */


@card-prefix: '--@{kd-prefix}-c-card';


// color
@card-color-background: var(~'@{card-prefix}-color-background', @color-white);
@card-actions-color: var(~'@{card-prefix}-actions-color', @color-theme);
@card-actions-color-hover: var(~'@{card-prefix}-actions-color-hover', @color-theme-5);
@card-actions-color-active: var(~'@{card-prefix}-actions-color-active', @color-theme-7);
@card-title-color: var(~'@{card-prefix}-title-color', @color-text-primary);
@card-content-color: var(~'@{card-prefix}-content-color', @color-text-secondary);

// font
@card-title-font-size: var(~'@{card-prefix}-title-font-size', @font-size-middle);
@card-content-font-size: var(~'@{card-prefix}-content-font-size', @font-size-small);

// sizing
@card-sizing-title-height: var(~'@{card-prefix}-sizing-title-height', 40px);

// spacing
@card-spacing-padding-horizontal: var(~'@{card-prefix}-spacing-padding-horizontal', 12px);
@card-spacing-padding-vertical: var(~'@{card-prefix}-spacing-padding-vertical', 8px);








@carousel-prefix-cls: ~'@{kd-prefix}-carousel';

.@{carousel-prefix-cls} {
  &-root {
    position: relative;
    display: flex;
    width: 100%;
    flex-direction: row;
    overflow: hidden;
    flex: 1;
  }

  &-list {
    list-style: none;
    padding: 0;
    display: flex;
    flex-direction: row;
    position: relative;

    &-item {
      position: relative;
      flex-shrink: 0;
      height: 100%;
      width: 100%;
    }

    &-slide {
      width: 100%;

      .@{carousel-prefix-cls}-list-item {
        opacity: 1;
        border-radius: @carousel-boder-radius;

        &-animation {
          transition: opacity 0.3s ease;
        }

        &-none-animation {
          transition: none;
        }

        &-not-hidden {
          opacity: 1;
        }

        &-hidden {
          opacity: 0;
        }
      }
    }

    &-fade {
      flex: 1;

      .@{carousel-prefix-cls}-list-item {
        opacity: 1;

        &-animation {
          transition: opacity 0.3s ease;
        }

        &-none-animation {
          transition: none;
        }

        &-not-hidden {
          opacity: 1;
          z-index: 1;
        }

        &-hidden {
          opacity: 0;
          z-index: 0;
        }
      }
    }

    &-display {
      width: 100%;

      .@{carousel-prefix-cls}-list-item {
        display: block;

        &-not-hidden {
          display: block;
        }

        &-hidden {
          display: none;
        }
      }
    }
  }

  &-slidebar {
    position: absolute;
    list-style: none;
    padding: 0;
    z-index: 1;

    &-left {
      .vertical;
      left: @carousel-dots-margin-left;
    }

    &-right {
      .vertical;
      right: @carousel-dots-margin-right;
    }

    &-bottom {
      .horizontal;
      bottom: @carousel-dots-margin-bottom;
    }

    &-top {
      .horizontal;
      top: @carousel-dots-margin-top;
    }

    &-dot>button {
      display: block;
      border-radius: @carousel-dots-boder-radius;
      box-sizing: border-box;
      border: 0;
      height: 100%;
      padding: 0;
      width: 100%;
      cursor: pointer;
      outline: none;
      background-color: @carousel-dots-color-background;
    }

    &-dot {
      display: block;
      border-radius: @carousel-dots-boder-radius;
      box-sizing: border-box;
      border: 0;
      height: 100%;
      padding: 0;
      width: 100%;
      cursor: pointer;
      outline: none;

      &-active {
        opacity: 1;

        &>button {
          background-color: @carousel-dots-color-background-active;
          opacity: 1;
        }
      }
    }
  }

  &-jump {
    position: absolute;
    top: 50%;
    left: unset;
    right: 16px;
    transform: translateY(-50%);
    z-index: 1;

    &-left {
      left: 16px;
      right: unset;
    }

    &:not(.@{carousel-prefix-cls}-jump-disabled) {
      cursor: pointer;
    }

    >*:first-child {
      display: flex;
      align-items: center;
      justify-content: center;
    }

    &-icon {
      font-size: 20px;
      color: @carousel-jump-icon-color;

      &:hover {
        color: @carousel-jump-icon-color-hover;
      }
    }

    &-disabled {
      cursor: not-allowed;

      .@{carousel-prefix-cls}-jump-icon:hover {
        color: @carousel-jump-icon-color;
      }
    }
  }
}

.vertical {
  display: flex;
  flex-direction: column;
  top: 50%;
  transform: translateY(-50%);

  &>li {
    margin: @carousel-dots-marigin 0;
    width: @carousel-dots-height;
    height: @carousel-dots-width;
  }
}

.horizontal {
  display: flex;
  flex-direction: row;
  left: 50%;
  transform: translateX(-50%);

  &>li {
    margin: 0 @carousel-dots-marigin;
    height: @carousel-dots-height;
    width: @carousel-dots-width;
  }
}



@carousel-prefix: '--@{kd-prefix}-c-carousel';

// color
@carousel-dots-color-background: var(~'@{carousel-prefix}-dots-color-background', #D8D8D8); // 面板指示点的背景色
@carousel-dots-color-background-active: var(~'@{carousel-prefix}-dots-color-hover', #666666); // 面板指示点的背景色
@carousel-jump-icon-color: var(~'@{carousel-prefix}-jump-icon-color', #D9D9D9);
@carousel-jump-icon-color-hover: var(~'@{carousel-prefix}-jump-icon-color-hover', #666666);

// radius
@carousel-dots-boder-radius: var(~'@{carousel-prefix}-dots-border-radius', 2px); // 面板指示点的圆角
@carousel-boder-radius: var(~'@{carousel-prefix}-border-radius', 0px); // 轮播容器圆角

// sizing
@carousel-dots-width: var(~'@{carousel-prefix}-dots-sizing-width', 12px); // 面板指示点的宽度
@carousel-dots-height: var(~'@{carousel-prefix}-dots-sizing-height', 4px); // 面板指示点的高度

// spacing
@carousel-dots-margin-top: var(~'@{carousel-prefix}-spacing-margin-top', 12px); // 面板指示点到边界的边距
@carousel-dots-margin-bottom: var(~'@{carousel-prefix}-spacing-margin-bottom', 12px); // 面板指示点到边界的边距
@carousel-dots-margin-left: var(~'@{carousel-prefix}-spacing-margin-left', 12px); // 面板指示点到边界的边距
@carousel-dots-margin-right: var(~'@{carousel-prefix}-spacing-margin-right', 12px); // 面板指示点到边界的边距
@carousel-dots-marigin: var(~'@{carousel-prefix}-dots-spacing-margin', 4px); // 面板指示点的间距


/*! rtl:begin:ignore */




@cascader-picker-prefix-cls: ~'@{kd-prefix}-cascader-picker';
@cascader-menus-prefix-cls: ~'@{kd-prefix}-cascader-menus';
@cascader-menu-prefix-cls: ~'@{kd-prefix}-cascader-menu';
@icon-prefix-cls: ~'@{kd-prefix}icon';

.@{cascader-picker-prefix-cls} {
  position: relative;
  outline: none;
  cursor: pointer;
  background: @cascader-bg-color;

  &.disabled {
    .@{cascader-picker-prefix-cls}-input {
      cursor: not-allowed;
      border-color: @color-border-strong;

      .@{kd-prefix}-input-suffix,
      i[class*='@{icon-prefix-cls}'] {
        color: @cascader-disabled-color;
      }
    }
  }

  &-label {
    box-sizing: border-box;
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 20px;
    padding: 0 24px 0 0;
    line-height: 20px;
    transform: translateY(-50%);
    .ellipsis;
  }

  &-input {
    background-color: transparent;
    transition: all 0.2s;

    > input {
      color: transparent !important;
      cursor: pointer;
    }

    &.expand {
      i[class*='@{icon-prefix-cls}'] {
        transform: rotate(180deg);
      }
    }

    .@{kd-prefix}-input-suffix,
    i[class*='@{icon-prefix-cls}'] {
      transition: all 0.2s;
    }
  }

  &.allowClear:hover {
    .@{cascader-picker-prefix-cls}-close {
      opacity: 1;
      visibility: visible;
      transition: all 0.2s;
      transform: scale(1) translateY(-50%);
    }

    .@{kd-prefix}-input-suffix {
      opacity: 0;
      visibility: hidden;
      transition: all 0.1s;
    }
  }

  &-close {
    position: absolute;
    top: 50%;
    right: 0;
    opacity: 0;
    cursor: pointer;
    visibility: hidden;
    color: @cascader-clear-color;
    transition: all 0.1s;
    transform-origin: 50% 50%;
    transform: scale(0.9) translateY(-50%);

    &:hover {
      color: @cascader-clear-color-hover;
    }
  }
}

.@{cascader-menus-prefix-cls} {
  .reset-component;
  color: @cascader-color;
  border-radius: @cascader-radius-size;
  font-size: @cascader-font-size;
  font-weight: @cascader-font-weight;
  background-color: @cascader-bg-color;
  box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.3);
  opacity: 1;
  visibility: visible;
  z-index: @z-index-popper;

  &.hidden {
    opacity: 0;
    visibility: hidden;
  }

  .@{cascader-menu-prefix-cls} {
    display: inline-block;
    height: @cascader-height;
    min-width: @cascader-menu-min-width;
    margin: 0;
    padding: @cascader-menu-padding-vertical 0;
    overflow-y: auto;

    &:not(:first-child) {
      border-left: 1px solid @color-border-strong;
    }

    &-item {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 0 @cascader-menu-item-padding-horizontal;
      line-height: @cascader-menu-item-height;
      cursor: pointer;

      &:not(.disabled, .selected):hover {
        background-color: @cascader-hover-bg-color;
        transition: all calc(@duration-promptly - 0.1s) @motion-ease;
      }

      &.disabled {
        color: @cascader-disabled-color;
        cursor: not-allowed;
      }

      &.selected {
        color: @cascader-selected-color;
        background-color: @cascader-selected-bg-color;
      }

      &-label {
        width: @cascader-menu-item-label-width;
        .ellipsis;
      }

      &.last .@{cascader-menu-prefix-cls}-item-label {
        width: calc(@cascader-menu-item-label-width + 20px);
      }

      .@{kd-prefix}-cascader-checkbox {
        margin-right: 5px;
      }
    }
  }

  .@{kd-prefix}-empty {
    padding: 10px 0 20px;
  }
}

.@{kd-prefix}-cascader {
  &-bordered:not(.@{kd-prefix}-cascader-multiple) {
    .@{cascader-picker-prefix-cls}-label {
      padding-left: 9px;
    }
    .@{cascader-picker-prefix-cls}-close {
      right: 10px;
    }
  }

  &-bordered&-multiple {
    border: 1px solid #d9d9d9;
    padding-left: 8px;
    border-radius: 2px;

    .@{kd-prefix}-cascader-suffix {
      right: 9px;
      top: 50%;
      transform: translateY(-50%);
    }
  }

  &-multiple {
    transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    width: 100%;
    min-height: 30px;
    max-height: 100px;
    color: #212121;
    display: flex;
    cursor: pointer;
    box-sizing: border-box;
    overflow-x: hidden;
    position: relative;
    border-bottom: 1px solid #d9d9d9;
    background: @cascader-bg-color;

    &:not(.@{kd-prefix}-cascader-disabled):focus {
      border-color: @cascader-selected-color;
      outline: none;
    }
  }

  &-multiple-wrapper {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    width: 100%;
    padding: 1px 28px 1px 0;
    overflow-y: auto;
  }

  &-placeholder {
    position: absolute;
    font-size: @middle-font-size;
    color: @cascader-placeholder-color;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  &-suffix {
    right: 0;
    position: absolute;
    display: flex;
    flex: 0 0 auto;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin-left: 8px;
  }

  &-selection-tag {
    max-width: 100%;
  }

  &-multiple:hover &-icon-clear {
    opacity: 1;
  }

  &-icon {
    &-arrow {
      display: inline-flex;
      align-items: center;
      vertical-align: middle;
      &-up {
        transform: rotate(180deg);
        transition: transform calc(@transition-duration - 0.1s) @ease;
      }

      &-down {
        transform: rotate(0deg);
        transition: transform calc(@transition-duration - 0.1s) @ease;
      }
    }

    &-clear {
      opacity: 0;
      z-index: 1;
      position: absolute;
      background: #fff;
      transition: opacity 0.15s ease;
      color: @cascader-clear-color;
      &:hover {
        color: @cascader-clear-color-hover;
      }
    }
  }

  &-tag {
    &-describe {
      font-size: 12px;
      height: 20px;
      line-height: 18px;
      margin: 2px 8px 2px 0;
      user-select: none;

      &-content {
        display: inline-flex;
        align-items: center;
        padding: 0 7px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        border: 1px solid #ccc;
        color: #212121;
      }
    }
  }

  &-disabled {
    cursor: not-allowed;

    .@{kd-prefix}-cascader-picker-label {
      color: @cascader-disabled-color;
    }

    .@{kd-prefix}-cascader-picker-input {
      background-color: @cascader-disabled-color-background;

      > input {
        background-color: @cascader-disabled-color-background;
      }
    }

    &.@{kd-prefix}-cascader-multiple {
      background-color: @cascader-disabled-color-background;
    }

    .@{kd-prefix}-cascader-suffix {
      color: @cascader-disabled-color;
    }

    .@{kd-prefix}-cascader-tag-describe-content {
      color: @cascader-tag-disabled-color;
      border-color: @cascader-tag-disabled-color;
    }
  }

  &-picker:not(&-disabled):hover,
  &-expand {
    .kd-input-wrapper {
      border-color: @cascader-g-color-border-focus;
    }
  }

  &-multiple:not(&-disabled):hover,
  &-expand {
    border-color: @cascader-g-color-border-focus;
  }
}
.@{kd-prefix}-cascader-rtl {
  direction: rtl;
  .@{cascader-picker-prefix-cls}-label {
    right: 0;
    left: auto;
    padding: 0 0 0 24px;
  }
  .@{cascader-picker-prefix-cls}-close {
    left: 0;
    right: auto;
  }
  &.@{kd-prefix}-cascader-bordered:not(.@{kd-prefix}-cascader-multiple) {
    .@{cascader-picker-prefix-cls}-label {
      padding-left: 24px;
      padding-right: 9px;
    }
    .@{cascader-picker-prefix-cls}-close {
      left: 10px;
      right: auto;
    }
  }
  &.@{kd-prefix}-cascader-multiple {
    padding-left: 0;
    padding-right: 8px;
    .@{kd-prefix}-cascader-multiple-wrapper {
      padding: 1px 0 1px 28px;
    }
    .@{kd-prefix}-cascader-suffix {
      left: 0;
      right: auto;
      margin-right: 8px;
      margin-left: 0;
    }
  }
  &.@{kd-prefix}-cascader-bordered&.@{kd-prefix}-cascader-multiple {
    padding-right: 8px;
    padding-left: 0;
    .@{kd-prefix}-cascader-suffix {
      left: 9px;
      right: auto;
    }
  }
  .@{cascader-menu-prefix-cls} {
    &:not(:first-child) {
      border-right: 1px solid @color-border-strong;
      border-left: none;
    }
    &-item {
      .@{kd-prefix}-cascader-checkbox {
        margin-left: 5px;
        margin-right: 0;
      }
    }
  }
}
/*! rtl:end:ignore */



@cascader-prefix: '--@{kd-prefix}-c-cascader';

// sizing
@cascader-height: var(~'@{cascader-prefix}-sizing-height', 192px);
@cascader-menu-min-width: var(~'@{cascader-prefix}-menu-sizing-min-width', 116px);
@cascader-menu-item-height: var(~'@{cascader-prefix}-menu-item-sizing-height', 32px);
@cascader-menu-item-label-width: var(~'@{cascader-prefix}-menu-item-label-sizing-width', 72px);

// spacing
@cascader-menu-padding-vertical: var(~'@{cascader-prefix}-menu-spacing-padding-vertical', 8px);
@cascader-menu-item-padding-horizontal: var(~'@{cascader-prefix}-menu-item-spacing-padding-horizontal', 12px);

// colors
@cascader-color: var(~'@{cascader-prefix}-color-text', @color-text-primary);
@cascader-bg-color: var(~'@{cascader-prefix}-color-background', @color-white);
@cascader-hover-bg-color: var(~'@{cascader-prefix}-color-background-hover', @color-hover);
@cascader-selected-color: var(~'@{cascader-prefix}-color-text-selected', @color-theme);
@cascader-selected-bg-color: var(~'@{cascader-prefix}-color-background-selected', @color-background-ongoing);
@cascader-disabled-color: var(~'@{cascader-prefix}-color-text-disabled', @color-disabled);
@cascader-disabled-color-background: var(~'@{cascader-prefix}-color-background-disabled', @color-background-contain-disabled);
@cascader-clear-color: var(~'@{cascader-prefix}-clear-color-text', #d9d9d9);
@cascader-clear-color-hover: var(~'@{cascader-prefix}-icon-clear-color-text-hover', #999);
@cascader-g-color-border-focus: var(~'@{cascader-prefix}-color-border-foucs', @color-theme);
@cascader-tag-disabled-color: var(~'@{cascader-prefix}-tag-disabled-color', #d9d9d9);
@cascader-placeholder-color: var(~'@{cascader-prefix}-placeholder-color', @color-text-placeholder);

// font
@cascader-font-size: var(~'@{cascader-prefix}-font-size', @font-size-small);
@cascader-font-weight: var(~'@{cascader-prefix}-font-weight', 'normal');

// radius
@cascader-radius-size: var(~'@{cascader-prefix}-radius-border', @radius-border);

/*! rtl:begin:ignore */



@checkbox-prefix-cls: ~'@{kd-prefix}-checkbox';
@checkbox-group-prefix-cls: ~'@{kd-prefix}-group';

.@{checkbox-prefix-cls} {
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: flex-start;
  cursor: pointer;
  position: relative;
  white-space: nowrap;
  text-overflow: ellipsis;
  box-sizing: border-box;
  font-size: @checkbox-font-size;
  color: @checkbox-font-color;
  line-height: 18px;
  &-no-child {
    height: @checkbox-default-input-height;
    width: @checkbox-default-input-width;
    box-sizing: border-box;
  }
  &-group > *:not(:last-child) {
    margin-right: @checkbox-group-margin-right;
  }
  &-input {
    margin: 0;
    padding: 0;
    height: 100%;
    width: 100%;
    cursor: inherit;
    opacity: 0;
    inset: 0;
    z-index: 1;
  }
  &-children {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    z-index: 999;
    user-select: none;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: @checkbox-default-input-label-max-width;

    .kd-input-underline {
      background-color: transparent;
      border-bottom: none;
    }
  }
}
.@{checkbox-prefix-cls}-square {
  border-radius: 2px;
  border: 1px solid @checkbox-border-color;
  padding: @checkbox-square-padding-horizontal @checkbox-square-padding-vertical;
  transition: color @checkbox-transition-duration, border-color @checkbox-transition-duration;
  &:not(&-disabled)::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    border-radius: inherit;
    opacity: 0.2;
    box-shadow: 0 0 0 0 @checkbox-color-theme;
  }
  &:hover {
    color: @checkbox-checked-font-color;
    border-color: @checkbox-checked-border-color;
  }
  &-triangle,
  &-triangle-checked {
    position: absolute;
    content: '';
    height: 0;
    width: 0;
    right: 0;
    bottom: 0;
    border-style: solid;
    border-width: 0 0 @checkbox-square-triangle-height @checkbox-square-triangle-width;
    border-top-color: transparent;
    border-right-color: transparent;
    border-left-color: transparent;
    border-bottom-color: @checkbox-checked-border-color;
  }
  &-triangle {
    animation: kdZoomBounceLeaveEffect calc(@checkbox-transition-duration - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
    transition: all @checkbox-transition-duration cubic-bezier(0.4, 0, 0.6, 1);
    visibility: hidden;
    opacity: 0;
  }
  &-inner {
    position: absolute;
    height: 9px;
    width: 11px;
    color: @checkbox-square-input-icon-color;
    font-size: @checkbox-square-input-icon-size;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transform: translate(-100%, 100%);
  }
  &-inner-icon {
    font-size: inherit;
    line-height: 100%;
    animation: kdZoomLeaveEffect calc(@checkbox-transition-duration - 0.1s) cubic-bezier(0, 0.4, 0.4, 1);
  }
  &-triangle-disabled {
    border-bottom-color: @checkbox-disabled-text-color;
  }

  &-disabled,
  &-disabled:hover {
    border-color: @checkbox-border-color;
    color: @checkbox-disabled-text-color;
    background-color: @checkbox-disabled-bg-color;
    cursor: not-allowed !important;
  }
  &-checked {
    border-color: @checkbox-checked-border-color;
    &:not(&-disabled)::after {
      animation: fadeEffect calc(@checkbox-transition-duration + 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards,
        waveEffect calc(@checkbox-transition-duration - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
    }
    .@{checkbox-prefix-cls}-square-triangle-checked:not(.@{checkbox-prefix-cls}-square-disabled) {
      animation: kdZoomBounceEffect calc(@checkbox-transition-duration - 0.1s) cubic-bezier(0.4, 0, 0.6, 1);
    }
    .@{checkbox-prefix-cls}-square-inner-icon:not(.@{checkbox-prefix-cls}-square-disabled) {
      animation: kdZoomEffect calc(@checkbox-transition-duration - 0.1s) cubic-bezier(0, 0.4, 0.4, 1);
    }
  }
  &-checked-disabled {
    background-color: @checkbox-disabled-bg-color !important;
    border-color: @checkbox-disabled-bg-color !important;
    cursor: not-allowed !important;
  }
  &-wrapper {
    display: inline-flex;
    height: @checkbox-default-input-height;
    width: 0;
    box-sizing: border-box;
    opacity: 0;
  }
  &.checked {
    .@{checkbox-prefix-cls}-children {
      color: @checkbox-font-color;
    }
  }
}

.@{checkbox-prefix-cls}-default {
  border: none;
  padding: @checkbox-default-padding;
  transition: color @checkbox-transition-duration, border-color @checkbox-transition-duration;
  &:hover,
  &:hover &-wrapper {
    color: @checkbox-checked-font-color;
    border-color: @checkbox-checked-border-color;
    cursor: pointer;
  }
  &-disabled,
  &-disabled:hover,
  &-disabled:hover &-wrapper {
    color: @checkbox-disabled-text-color;
    border-color: @checkbox-border-color;
    cursor: not-allowed !important;
  }

  &-wrapper {
    position: relative;
    display: inline-flex;
    background-color: @checkbox-bg-color;
    border: @checkbox-default-input-border-width solid @checkbox-border-color;
    border-radius: @checkbox-default-input-border-radius;
    box-sizing: border-box;
    transition: color @checkbox-transition-duration, border-color @checkbox-transition-duration;
    flex-shrink: 0;
    &:not(&-disabled)::after {
      content: '';
      position: absolute;
      top: 0;
      right: 0;
      bottom: 0;
      left: 0;
      border-radius: inherit;
      opacity: 0.2;
      box-shadow: 0 0 0 0 @checkbox-color-theme;
    }
  }
  &-wrapper-size {
    height: @checkbox-default-input-height;
    width: @checkbox-default-input-width;
  }

  &-margin {
    margin-right: @checkbox-default-input-margin-right;
  }
  &-checked-disabled {
    background-color: @checkbox-default-disabled-color-bg !important;
    border-color: @checkbox-default-disabled-color-border !important;
    cursor: not-allowed !important;

    .@{checkbox-prefix-cls}-default-inner {
      color: @checkbox-disabled-text-color;
    }
  }
  &-checked {
    background-color: @checkbox-checked-border-color;
    border-color: @checkbox-checked-border-color;
    transition: background-color calc(@checkbox-transition-duration - 0.1s) cubic-bezier(0, 0.4, 0.4, 1),
      border-color calc(@checkbox-transition-duration - 0.1s) cubic-bezier(0, 0.4, 0.4, 1);
    &:not(&-disabled)::after {
      animation: fadeEffect calc(@checkbox-transition-duration + 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards,
        waveEffect calc(@checkbox-transition-duration - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
    }
    .@{checkbox-prefix-cls}-default-inner:not(&-disabled .@{checkbox-prefix-cls}-default-inner) {
      animation: kdZoomBounceDefaultEffect calc(@checkbox-transition-duration - 0.1s) cubic-bezier(0.4, 0, 0.6, 1) !important;
    }
  }
  &-inner {
    position: absolute;
    color: @checkbox-default-input-icon-color;
    font-size: @checkbox-default-input-icon-size;
    height: 100%;
    width: 100%;
    top: 5%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
  &-inner-icon {
    font-size: inherit;
    line-height: 100%;
  }
  &-indeterminate::before {
    position: absolute;
    top: 50%;
    left: 50%;
    width: @checkbox-default-indeterminate-square;
    height: @checkbox-default-indeterminate-square;
    background-color: @checkbox-checked-border-color;
    border: 0;
    transform: translate(-50%, -50%) scale(1);
    opacity: 1;
    content: ' ';
  }
  &.checked {
    .@{checkbox-prefix-cls}-children {
      color: @checkbox-font-color;
    }
  }
  &-indeterminate {
    .@{checkbox-prefix-cls}-children {
      color: @checkbox-font-color;
    }
  }
}
.@{checkbox-prefix-cls}-rtl {
  direction: rtl;
  &.@{checkbox-prefix-cls}-default {
    .@{checkbox-prefix-cls}-default-margin {
      margin-right: 0;
      margin-left: @checkbox-default-input-margin-right;
    }
  }
}
.@{checkbox-prefix-cls}-group-rtl {
  direction: rtl;
  &.@{checkbox-prefix-cls}-group {
    text-align: right;
    > .@{checkbox-prefix-cls}-rtl:not(:last-child) {
      margin-left: @checkbox-group-margin-right;
      margin-right: 0;
    }
    .@{checkbox-prefix-cls} {
      margin-left: @checkbox-group-margin-right;
      margin-right: 0;
    }
  }
  .@{checkbox-prefix-cls}-square {
    &-triangle,
    &-triangle-checked {
      position: absolute;
      content: '';
      height: 0;
      width: 0;
      right: auto;
      left: 0;
      bottom: 0;
      border-style: solid;
      border-width: 0 @checkbox-square-triangle-width @checkbox-square-triangle-height 0;
      border-top-color: transparent;
      border-right-color: transparent;
      border-left-color: transparent;
      border-bottom-color: @checkbox-checked-border-color;
    }
  }
}
/*! rtl:end:ignore */


@checkbox-prefix: '--@{kd-prefix}-c-checkbox';

// color
@checkbox-color-theme: var(~'@{checkbox-prefix}-color-theme', @color-theme);
@checkbox-font-color: var(~'@{checkbox-prefix}-color-text-primary', #212121);
@checkbox-border-color: var(~'@{checkbox-prefix}-color-border', #d9d9d9);
@checkbox-checked-border-color: var(~'@{checkbox-prefix}-color-border-active', @color-theme);
@checkbox-checked-font-color: var(~'@{checkbox-prefix}-color-text-hover', @color-theme);
@checkbox-default-input-icon-color: var(~'@{checkbox-prefix}-default-input-icon-color', #fff); // 勾选输入框边勾勾图标颜色
@checkbox-square-input-icon-color: var(~'@{checkbox-prefix}-square-input-icon-color', #fff); // 边框类型三角内勾选输入框勾勾图标颜色
@checkbox-bg-color: var(~'@{checkbox-prefix}-color-background', @color-background);
@checkbox-disabled-bg-color: var(~'@{checkbox-prefix}-color-background-disabled', @color-background-contain-disabled);
@checkbox-disabled-border-color: var(~'@{checkbox-prefix}-color-border-disabled', @color-border-disabled);
@checkbox-disabled-text-color: var(~'@{checkbox-prefix}-color-text-disabled', @color-disabled);
@checkbox-default-disabled-color-bg: var(~'@{checkbox-prefix}-default-color-background-disabled', #e5e5e5);
@checkbox-default-disabled-color-border: var(~'@{checkbox-prefix}-default-color-background-disabled', #d9d9d9);

// font
@checkbox-font-size: var(~'@{checkbox-prefix}-font-size', @font-size-small); //默认字体大小
@checkbox-default-input-icon-size: var(~'@{checkbox-prefix}-default-input-icon-font-size', 12px); // 勾选输入框勾勾图标大小
@checkbox-square-input-icon-size: var(~'@{checkbox-prefix}-default-input-icon-font-size', 12px); // 边框类型三角内勾选输入框勾勾图标大小

// motion
@checkbox-transition-duration: var(~'@{checkbox-prefix}-motion-duration', @duration-promptly);

// radius
@checkbox-default-input-border-radius: var(~'@{checkbox-prefix}-default-input-radius-border', 2px); // 勾选输入框圆角

// sizing
@checkbox-border-width: var(~'@{checkbox-prefix}-border-width', 1px); // 边框类型边框大小
@checkbox-default-input-height: var(~'@{checkbox-prefix}-default-input-sizing-height', 14px); // 勾选输入框高度
@checkbox-default-input-width: var(~'@{checkbox-prefix}-default-input-sizing-width', 14px); // 勾选输入框宽度
@checkbox-default-input-border-width: var(~'@{checkbox-prefix}-default-input-border-width', 1px); // 勾选输入框边框大小 不需要
@checkbox-default-input-label-max-width: var(~'@{checkbox-prefix}-default-input-label-max-width'); // 勾选输入框便签文本最大宽度，默认为未设置。
@checkbox-square-triangle-height: var(~'@{checkbox-prefix}-square-triangle-sizing-height', 18px); // 边框类型右下角三角高度
@checkbox-square-triangle-width: var(~'@{checkbox-prefix}-square-triangle-sizing-width', 18px); // 边框类型右下角三角宽度
@checkbox-default-indeterminate-square: var(~'@{checkbox-prefix}-default-indeterminate-sizing-square', 6px); // 半选框的大小


// spacing
@checkbox-group-margin-right: var(~'@{checkbox-prefix}-group-spacing-margin-right', 12px); // 按钮组的间距
@checkbox-default-padding: var(~'@{checkbox-prefix}-default-spacing-padding', 0); // 默认类型复选框内边距
@checkbox-default-input-margin-right: var(~'@{checkbox-prefix}-default-input-spacing-margin-right', 4px); // 勾选输入框与右侧内容间距
@checkbox-square-padding-horizontal: var(~'@{checkbox-prefix}-square-spacing-padding-horizontal', 7px); // 边框类型内边距
@checkbox-square-padding-vertical: var(~'@{checkbox-prefix}-square-spacing-padding-vertical', 12px); // 边框类型内边距


/*! rtl:begin:ignore */




@city-picker-prefix-cls: ~'@{kd-prefix}-city-picker';
@tabs-prefix-cls: ~'@{kd-prefix}-tabs';
@popper-prefix-cls: ~'@{kd-prefix}-popper';

.@{city-picker-prefix-cls} {
  position: relative;
  box-sizing: border-box;
  background-color: transparent;
  cursor: pointer;
  vertical-align: middle;
  display: flex;
  flex-direction: column;

  &-selector {
    width: 100%;
  }
  &-selector:hover {
    .@{city-picker-prefix-cls}-icon-active {
      color: #3761ca;
    }
  }

  &-description {
    color: #666666;
    font-size: 12px;
  }

  &-visible {
    .@{city-picker-prefix-cls}-icon-active {
      color: #3761ca;
    }

    & div.@{city-picker-prefix-cls}-show-search .@{city-picker-prefix-cls}-selection-item {
      color: @city-picker-placeholder-color;
    }
  }

  &-icon {
    &-arrow {
      display: inline-flex;
      align-items: center;
      vertical-align: middle;
      &-up {
        transform: rotate(180deg);
        transition: transform calc(@transition-duration - 0.1s) @ease;
      }

      &-down {
        transform: rotate(0deg);
        transition: transform calc(@transition-duration - 0.1s) @ease;
      }
    }

    &-clear {
      opacity: 0;
      z-index: 1;
      position: absolute;
      top: 0;
      bottom: 0;
      display: flex;
      align-items: center;
      background: #fff;
      transition: opacity 0.15s ease;
      font-size: @city-picker-clear-font-size;
      &:hover {
        color: @city-picker-g-color-border-hover;
      }
    }
  }

  &-placeholder {
    position: absolute;
    color: @city-picker-placeholder-color;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    right: 24px;
    left: 0;
    top: 0;
    bottom: 0;
    display: flex;
    align-items: center;
  }

  &-borderless {
    border: none;
  }

  &-underline {
    border-bottom: 1px solid @city-picker-g-color-border;
    &:hover:not(.@{city-picker-prefix-cls}-disabled) {
      border-bottom: 1px solid @city-picker-g-color-border-hover;
    }
  }

  &-bordered {
    border: 1px solid @city-picker-border-g-color-border;
    padding-left: @city-picker-bordered !important;
    border-radius: @city-picker-border-radius-border;
    &:hover:not(.@{city-picker-prefix-cls}-disabled) {
      border: 1px solid @city-picker-g-color-border-hover;
    }

    .@{city-picker-prefix-cls}-suffix {
      padding-right: 8px;
    }

    .@{city-picker-prefix-cls}-placeholder {
      padding-left: @city-picker-bordered;
    }
  }

  &-wrapper {
    transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    padding: @city-picker-wrapper-padding;
    max-width: 100%;
    color: #212121;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    cursor: pointer;
    box-sizing: border-box;
    overflow-y: auto;
    overflow-x: hidden;
    position: relative;

    .@{city-picker-prefix-cls}-icon-clear {
      color: @city-picker-clear-color;
      &:hover {
        color: @city-picker-clear-color-hover;
      }
    }
  }
  &-isNotMobile-hover {
    &:hover .@{city-picker-prefix-cls}-icon-clear {
      opacity: 1;
    }
  }
  &-isMobile-clear {
    .@{city-picker-prefix-cls}-icon-clear {
      opacity: 1;
    }
  }
  &-show-search {
    cursor: text;
  }

  &-dropdown {
    display: block;
    z-index: @city-picker-z-index;
    box-sizing: border-box;
    margin: 0;
    overflow: auto;
    font-size: @city-picker-list-font-size;
    font-variant: initial;
    background-color: @city-picker-dropdown-bg;
    border-radius: @city-picker-g-radius-border;
    outline: none;
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);

    &.@{popper-prefix-cls}-bottom-start {
      &-in {
        animation-name: kdSlideUpIn;
      }

      &-out {
        animation-name: kdSlideUpOut;
      }
    }
    // 调整tabs样式
    .@{tabs-prefix-cls}-tab-list {
      width: 100%;

      & > span {
        width: 50%;
      }

      .@{kd-prefix}-tab-pane {
        text-align: center;

        &-type-line {
          padding: 0 12px;
          font-size: 12px;

          .@{kd-prefix}-tab-pane-text {
            .over();
            width: 100%;
          }
        }
      }
    }

    .@{tabs-prefix-cls}-noContainer {
      height: unset;
    }

    .@{tabs-prefix-cls}-right-arrows {
      display: none;
    }

    &-empty {
      height: 48px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #b2b2b2;
      font-size: 14px;
    }

    &-common {
      height: 32px;
      line-height: 32px;
      padding: 0 12px;
      background: #fafafa;
      color: @city-picker-font-color;
    }

    &-loading {
      height: 48px;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    &.topLeft.hidden,
    &.bottomLeft.hidden,
    &.topRight.hidden,
    &.bottomRight.hidden {
      opacity: 0;
      visibility: hidden;
      transition: all calc(@transition-duration - 0.1s) @ease;
    }
  }

  &-list {
    padding: 8px 0;
    max-height: 320px;
    overflow-y: auto;
    box-sizing: content-box;

    // 下拉列表选项
    &-item {
      .over();
      .item();
      cursor: pointer;

      &-info {
        color: @city-picker-placeholder-color;
        white-space: nowrap;
      }

      &-active:not(&-disabled) {
        background-color: @city-picker-item-active-bg;
      }

      &-selected:not(&-disabled) {
        background-color: @city-picker-item-selected-bg;
        color: @city-picker-list-item-color-selected;

        .@{city-picker-prefix-cls}-list-item-info {
          color: @city-picker-list-item-color-selected;
        }
      }

      &-disabled {
        color: @city-picker-g-item-text-color-disabled;
        cursor: not-allowed;
        background-color: @city-picker-disabled-option-bg;
      }
    }

    & > .@{city-picker-prefix-cls}-list-item-match {
      color: @city-picker-font-color;
      .@{city-picker-prefix-cls}-list-item-info {
        color: @city-picker-placeholder-color;
      }
    }
  }

  &-highlight {
    color: @city-picker-highlight-color;
  }

  // 选择器框大小
  &-size-small {
    .select-input-size(@city-picker-small-height, @city-picker-small-height, @city-picker-small-line-height, @city-picker-small-font-size);
  }

  &-size-middle {
    .select-input-size(@city-picker-middle-height, @city-picker-middle-height, @city-picker-middle-line-height, @city-picker-middle-font-size);
  }

  &-size-large {
    .select-input-size(@city-picker-large-height, @city-picker-large-height, @city-picker-large-line-height, @city-picker-large-font-size);
  }

  &-suffix {
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    display: flex;
    flex: 0;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin-left: 8px;
    cursor: pointer;
  }

  &-focused {
    .focusColor();

    .@{city-picker-prefix-cls}-content-item:not(.@{city-picker-prefix-cls}-content-item-seleted) {
      color: @city-picker-placeholder-color;
    }
  }

  &-disabled {
    background-color: @city-picker-color-background-disabled;
    color: @city-picker-color-text-disabled;
    padding-right: 0;
    border-color: #e5e5e5;
    &:hover {
      cursor: not-allowed;
    }

    .@{city-picker-prefix-cls}-suffix {
      color: @city-picker-arrow-icon-color-text-disabled;
    }

    &.@{city-picker-prefix-cls}-bordered {
      padding-right: @city-picker-bordered;
    }
  }

  &-content {
    display: flex;
    width: 100%;
    font-size: 14px;

    &-search {
      flex: 1;
      position: relative;
      &-input {
        outline: 0;
        border-radius: 0;
        border: none;
        background: transparent;
        height: 100%;
        width: 100%;
        cursor: pointer;
      }
    }
    &-item {
      display: inline-block;
      position: absolute;
      left: 0;
      right: 0;
      .over();
    }

    &-info {
      flex: 1;
      text-align: right;
      color: @city-picker-placeholder-color;
      .over();
    }
  }
}
.@{city-picker-prefix-cls}-rtl {
  direction: rtl;
  &.@{city-picker-prefix-cls} {
    .@{city-picker-prefix-cls}-placeholder {
      left: 24px;
      right: 0;
    }

    .@{city-picker-prefix-cls}-description {
      text-align: right;
    }
    .@{city-picker-prefix-cls}-selector {
      .@{city-picker-prefix-cls}-wrapper {
        padding: @city-picker-wrapper-padding-rtl;
      }
      .@{city-picker-prefix-cls}-bordered {
        &.@{city-picker-prefix-cls}-wrapper {
          padding-left: 24px !important;
          padding-right: 8px !important;
        }
        &:hover:not(.@{city-picker-prefix-cls}-disabled) {
          border: 1px solid @city-picker-g-color-border-hover;
        }

        .@{city-picker-prefix-cls}-suffix {
          padding-right: 8px;
        }

        .@{city-picker-prefix-cls}-placeholder {
          padding-left: @city-picker-bordered;
        }
      }
    }

    .@{city-picker-prefix-cls}-bordered {
      &.@{city-picker-prefix-cls}-wrapper {
        padding-right: 0;
        padding-left: 24px;
      }
      .@{city-picker-prefix-cls}-suffix {
        padding-left: 8px;
        padding-right: 0;
      }

      .@{city-picker-prefix-cls}-placeholder {
        padding-right: @city-picker-bordered;
      }
    }

    .@{city-picker-prefix-cls}-suffix {
      left: 0;
      right: auto;
      margin-right: 8px;
      margin-left: 0;
    }
    .@{city-picker-prefix-cls}-disabled {
      &.@{city-picker-prefix-cls}-bordered {
        padding-right: 0;
        padding-left: @city-picker-bordered;
      }
    }
    .@{city-picker-prefix-cls}-content {
      &-item {
        text-align: right;
      }

      &-info {
        text-align: left;
      }
    }
  }
  &.@{city-picker-prefix-cls}-dropdown {
    &.@{popper-prefix-cls}-bottom-end {
      &-in {
        animation-name: kdSlideUpIn;
      }

      &-out {
        animation-name: kdSlideUpOut;
      }
    }
  }
}
/*! rtl:end:ignore */



.item() {
  position: relative;
  display: block;
  font-weight: normal;
  font-size: @city-picker-list-font-size;
  min-height: @city-picker-dropdown-height;
  padding: 5px 12px;
  color: @city-picker-font-color;
  line-height: @city-picker-dropdown-line-height;
}

.focusColor() {
  border-color: @city-picker-g-color-border-foucs !important;
}

.select-input-size(@height, @maxHeight, @lineHeight, @fontSize) {
  min-height: @height;
  max-height: calc(@maxHeight * 3 - 10px);
  font-size: @fontSize;
}

.over() {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}



@city-picker-custom-prefix: ~'--@{kd-prefix}-c-city-picker';

// color
@city-picker-dropdown-bg: var(~'@{city-picker-custom-prefix}-dropdown-color-background', @color-background);
@city-picker-disabled-option-bg: var(~'@{city-picker-custom-prefix}-item-color-background-disabled', #fff);
@city-picker-item-active-bg: var(~'@{city-picker-custom-prefix}-color-background', #f5f5f5);
@city-picker-item-selected-bg: var(~'@{city-picker-custom-prefix}-color-background-selected', @color-theme-3);
@city-picker-g-color-border: var(~'@{city-picker-custom-prefix}-color-border', @color-input);
@city-picker-g-color-border-foucs: var(~'@{city-picker-custom-prefix}-color-border-foucs', @color-theme);
@city-picker-g-color-border-hover: var(~'@{city-picker-custom-prefix}-color-border-hover', @color-theme);
@city-picker-border-g-color-border: var(~'@{city-picker-custom-prefix}-border-color-border', @color-border-strong);
@city-picker-placeholder-color: var(~'@{city-picker-custom-prefix}-placeholder-color-text', #b2b2b2);
@city-picker-font-color: var(~'@{city-picker-custom-prefix}-footer-color-text', @color-text-primary);
@city-picker-g-item-text-color-disabled: var(~'@{city-picker-custom-prefix}-item-color-text-disabled', @color-disabled);
@city-picker-color-background-disabled: var(~'@{city-picker-custom-prefix}-color-background-disabled', #fff);
@city-picker-color-text-disabled: var(~'@{city-picker-custom-prefix}-color-text-disabled', @color-disabled);
@city-picker-arrow-icon-color-text-disabled: var(~'@{city-picker-custom-prefix}-arrow-icon-color-text-disabled', #b2b2b2);
@city-picker-clear-color: var(~'@{city-picker-custom-prefix}-icon-clear-color-text', #666666);
@city-picker-clear-color-hover: var(~'@{city-picker-custom-prefix}-icon-clear-color-text-hover', @color-theme);
@city-picker-list-item-color-selected: var(~'@{city-picker-custom-prefix}-list-item-color-text-selected', @color-theme);
@city-picker-highlight-color: var(~'@{city-picker-custom-prefix}-highlight-color-text', @color-theme);

// font
@city-picker-list-font-size: var(~'@{city-picker-custom-prefix}-dropdown-font-size', 12px); // 下拉列表文字大小
@city-picker-large-font-size: var(~'@{city-picker-custom-prefix}-font-size-large', 16px); // 大号字体
@city-picker-middle-font-size: var(~'@{city-picker-custom-prefix}-font-size-middle', 14px); // 中号高度
@city-picker-small-font-size: var(~'@{city-picker-custom-prefix}-font-size-small', 12px); // 小号高度
@city-picker-clear-font-size: var(~'@{city-picker-custom-prefix}-icon-clear-font-size', 16px);

// line-height
@city-picker-dropdown-line-height: var(~'@{city-picker-custom-prefix}-dropdown-line-height', 22px);
@city-picker-large-line-height: var(~'@{city-picker-custom-prefix}-line-height-large', 28px);
@city-picker-middle-line-height: var(~'@{city-picker-custom-prefix}-line-height-middle', 22px);
@city-picker-small-line-height: var(~'@{city-picker-custom-prefix}-line-height-small', 14px);

// sizing
@city-picker-dropdown-height: var(~'@{city-picker-custom-prefix}-item-sizing-height', 22px);
@city-picker-large-height: var(~'@{city-picker-custom-prefix}-sizing-height-large', 36px); // 大号高度 lh:28px
@city-picker-middle-height: var(~'@{city-picker-custom-prefix}-sizing-height-middle', 30px); // 中号高度lh:22px
@city-picker-small-height: var(~'@{city-picker-custom-prefix}-sizing-height-small', 24px); // 小号高度lh:12px

// spacing
@city-picker-bordered: var(~'@{city-picker-custom-prefix}-bordered-spacing-padding-left', 8px);
@city-picker-wrapper-padding: var(~'@{city-picker-custom-prefix}-wrapper-spacing-padding', 1px 24px 1px 0);
@city-picker-wrapper-padding-rtl: var(~'@{city-picker-custom-prefix}-wrapper-spacing-padding-rtl', 1px 0 1px 24px);
// radius
@city-picker-g-radius-border: var(~'@{city-picker-custom-prefix}-radius-border', @radius-border);
@city-picker-border-radius-border: var(~'@{city-picker-custom-prefix}-bordered-radius-border', 2px);

// z-index
@city-picker-z-index: var(~'@{city-picker-custom-prefix}-z-index', @z-index-popper);



@clipboard-prefix-cls: ~'@{kd-prefix}-clipboard';

.@{clipboard-prefix-cls} {
  .clipboard;

  &-size-small {
    .clipboard-size(@clipboard-small-height, @clipboard-small-font-size, @clipboard-small-padding-vertical, @clipboard-small-padding-horizontal);
    &.@{clipboard-prefix-cls}-icon-only {
      .clipboard-icon-only(@clipboard-icon-small-font-size, @clipboard-icon-padding-horizontal);
    }
  }

  &-size-middle {
    .clipboard-size(@clipboard-middle-height, @clipboard-middle-font-size, @clipboard-middle-padding-vertical, @clipboard-middle-padding-horizontal);
    &.@{clipboard-prefix-cls}-icon-only {
      .clipboard-icon-only(@clipboard-icon-middle-font-size, @clipboard-icon-padding-horizontal);
    }
  }

  &-size-large {
    .clipboard-size(@clipboard-large-height, @clipboard-large-font-size, @clipboard-large-padding-vertical, @clipboard-large-padding-horizontal);
    &.@{clipboard-prefix-cls}-icon-only {
      .clipboard-icon-only(@clipboard-icon-large-font-size, @clipboard-icon-padding-horizontal);
    }
  }

  &:not(.@{clipboard-prefix-cls}-icon-only) > i:not(:last-child) {
    margin-right: 2px;
  }
}



.clipboard() {
  padding: 0;
  position: relative;
  display: inline-block;
  vertical-align: middle;
  box-sizing: border-box;
  font-weight: @clipboard-g-font-weight;
  color: #bbbbbb;
  cursor: pointer;
  white-space: nowrap;
  overflow: hidden;
  user-select: none;

  &:hover {
    color: #5582f3;
  }
  &:disabled,
  &[disabled] {
    color: #bbbbbb;
    cursor: not-allowed;
  }
}

.clipboard-size(@height, @font-size, @padding-vertical, @padding-horizontal) {
  height: @height;
  padding: @padding-vertical @padding-horizontal;
  font-size: @font-size;
  line-height: calc(@height - (@padding-vertical) * 2);
}

.clipboard-icon-only(@font-size, @padding-horizontal) {
  font-size: @font-size;
  padding: 0 @padding-horizontal;
  display: inline-flex;
  justify-content: center;
  align-items: center;
}



@clipboard-custom-prefix: ~'--@{kd-prefix}-c-clipboard';

// color
@clipboard-font-color: var(~'@{clipboard-custom-prefix}-color-text', @color-theme); // color-theme为全局token

// font
@clipboard-g-font-weight: var(~'@{clipboard-custom-prefix}-font-weight', @font-weight-light); // 字体粗细
@clipboard-small-font-size: var(~'@{clipboard-custom-prefix}-font-size-small', @font-size-small); // 小号 文字大小
@clipboard-middle-font-size: var(~'@{clipboard-custom-prefix}-font-size-middle', @font-size-middle); // 中号 文字大小
@clipboard-large-font-size: var(~'@{clipboard-custom-prefix}-font-size-large', @font-size-large); // 大号 文字大小

@clipboard-icon-small-font-size: var(~'@{clipboard-custom-prefix}-icon-font-size-small', 14px); // 小号 图标大小
@clipboard-icon-middle-font-size: var(~'@{clipboard-custom-prefix}-icon-font-size-middle', 16px); // 中号 图标大小
@clipboard-icon-large-font-size: var(~'@{clipboard-custom-prefix}-icon-font-size-large', 18px); // 大号 图标大小

// motion
@clipboard-duration-fade: var(~'@{clipboard-custom-prefix}-motion-duration-fade', @duration-slowly);
@clipboard-duration-wave: var(~'@{clipboard-custom-prefix}-motion-duration-wave', @duration-quickly);

// sizing
@clipboard-small-height: var(~'@{clipboard-custom-prefix}-sizing-height-small', 24px); // 小号 高度
@clipboard-middle-height: var(~'@{clipboard-custom-prefix}-sizing-height-middle', 28px); // 中号 高度
@clipboard-large-height: var(~'@{clipboard-custom-prefix}-sizing-height-large', 32px); // 大号 高度

// spacing
@clipboard-small-padding-vertical: var(
  ~'@{clipboard-custom-prefix}-spacing-padding-vertical-small',
  3px
); // 小号 内间距 纵向
@clipboard-small-padding-horizontal: var(
  ~'@{clipboard-custom-prefix}-spacing-padding-horizontal-small',
  8px
); // 小号 内间距 横向
@clipboard-middle-padding-vertical: var(
  ~'@{clipboard-custom-prefix}-spacing-padding-vertical-middle',
  5px
); // 中号 内间距 纵向
@clipboard-middle-padding-horizontal: var(
  ~'@{clipboard-custom-prefix}-spacing-padding-horizontal-middle',
  8px
); // 中号 内间距 横向
@clipboard-large-padding-vertical: var(
  ~'@{clipboard-custom-prefix}-spacing-padding-vertical-large',
  6px
); // 大号 内间距 纵向
@clipboard-large-padding-horizontal: var(
  ~'@{clipboard-custom-prefix}-spacing-padding-horizontal-large',
  8px
); // 大号 内间距 横向
@clipboard-icon-padding-horizontal: var(~'@{clipboard-custom-prefix}-icon-spacing-padding-horizontal', 4px);

/*! rtl:begin:ignore */



@collapse-prefix-cls: ~'@{kd-prefix}-collapse';
.@{collapse-prefix-cls} {
  display: flex;
  flex-direction: column;
  width: 100%;
  &-panel:last-child {
    border-top: none;
  }
  &-panel-border&-panel:first-child {
    border-top: @collapse-border-width solid @collapse-border-color;
  }
  &-panel-border&-panel:not(:nth-child(1)) {
    border-top: none;
  }
  &-panel {
    display: inline-flex;
    flex-direction: column;
    &-border {
      border: @collapse-border-width solid @collapse-border-color;
    }

    &-top {
      display: inline-flex;
      padding: @collapse-header-padding;
      background: @collapse-header-color-background;
    }
    &-no-assist {
      justify-content: space-between;
    }
    &-top-border {
      border-bottom: @collapse-border-width solid @collapse-border-color;
    }
    &-left {
      display: inline-flex;
      align-items: center;
      line-height: 1.5;
    }
    &-middle {
      display: inline-flex;
      align-items: center;
      flex: 1;
      margin-left: 22px;
      color: @collapse-header-font-color-secondary;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    &-right {
      margin-left: 40px;
      display: inline-flex;
      align-items: center;
      white-space: nowrap;
    }
    &-extra,
    &-header {
      display: inline-flex;
      align-items: center;
      color: @collapse-header-font-color;
      font-size: @collapse-header-font-size;
    }

    &-header {
      display: inline-block;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      &:hover {
        color: @collapse-header-color-text-hover;
      }
    }
    &-icon {
      align-items: center;
      display: inline-flex;
      margin-right: @collapse-icon-margin-right;
      font-size: @collapse-icon-font-size;
    }
    &-icon:hover,
    &-left:hover {
      cursor: pointer;
    }
    &-animation-expand {
      transform: rotate(0deg);
      transition: transform @collapse-transition-duration;
    }
    &-animation-collapse {
      transform: rotate(90deg);
      transition: transform @collapse-transition-duration;
    }
    &-children {
      overflow: hidden;
      opacity: 0;
      padding: @collapse-content-padding;
      color: @collapse-content-font-color;
      font-size: @collapse-content-font-size;
      transition: height @collapse-transition-duration, opacity @collapse-transition-duration;
      background: @collapse-content-color-background;
    }
    &-children-hide {
      overflow: hidden;
      opacity: 0;
      height: 0;
      padding: @collapse-content-padding;
      color: @collapse-content-font-color;
      font-size: @collapse-content-font-size;
      transition: height @collapse-transition-duration, opacity calc(@collapse-transition-duration / 2);
    }
    &-children-bordered {
      padding: @collapse-content-bordered-padding;
      overflow: hidden;
    }
    &-disabled {
      cursor: not-allowed !important;
      color: @collapse-disabled-color;
    }
  }
}
.@{collapse-prefix-cls}-rtl {
  direction: rtl;
  .@{collapse-prefix-cls}-panel {
    &-top {
      padding: 8px 28px 8px 50px;
      .@{collapse-prefix-cls}-panel-right {
        margin-right: 40px;
        margin-left: 0;
      }
    }
    &-icon {
      margin-left: @collapse-icon-margin-right;
      margin-right: 0;
    }
    &-animation-expand {
      transform: rotate(180deg);
    }
    &-children > div {
      text-align: right;
    }
    &-children-hide > div {
      text-align: right;
    }
    &-middle {
      margin-right: 22px;
      margin-left: 0;
    }
  }
}
/*! rtl:end:ignore */




@collapse-prefix: '--@{kd-prefix}-c-collapse';

// color
@collapse-border-color: var(~'@{collapse-prefix}-color-border-strong-2', @color-border-strong-2);
@collapse-header-font-color: var(~'@{collapse-prefix}-header-color-text-primary', @color-text-primary);
@collapse-header-font-color-secondary: var(~'@{collapse-prefix}-header-color-text-secondary', @color-text-secondary);
@collapse-content-font-color: var(~'@{collapse-prefix}-content-color-text-primary', @color-text-primary);
@collapse-disabled-color: var(~'@{collapse-prefix}-color-disabled', raba(178, 178, 178, 1));
@collapse-header-color-background: var(~'@{collapse-prefix}-header-color-background', rgba(0, 0, 0, 0));
@collapse-content-color-background: var(~'@{collapse-prefix}-content-color-background', rgba(0, 0, 0, 0));
@collapse-header-color-text-hover: var(~'@{collapse-prefix}-header-color-text-hover', #666666);

// font
@collapse-header-font-size: var(~'@{collapse-prefix}-header-font-size', 16px);
@collapse-content-font-size: var(~'@{collapse-prefix}-content-font-size', @font-size-middle);
@collapse-icon-font-size: var(~'@{collapse-prefix}-icon-font-size', 16px);

// motion
@collapse-transition-duration: var(~'@{collapse-prefix}-motion-duration', @duration-promptly);

// sizing
@collapse-border-width: var(~'@{collapse-prefix}-border-width', 1px);
@collapse-icon-margin-right: var(~'@{collapse-prefix}-spacing-margin-right', 6px);
@collapse-header-padding: var(~'@{collapse-prefix}-header-spacing-padding', 8px 50px 8px 28px);
@collapse-content-bordered-padding: var(~'@{collapse-prefix}-content-bordered-spacing-padding', 12px);
@collapse-content-padding: var(~'@{collapse-prefix}-content-spacing-padding', 0 50px);
/*! rtl:begin:ignore */




@color-picker-prefix-cls: ~'@{kd-prefix}-color-picker';

.@{color-picker-prefix-cls}-container {
  position: relative;
  width: @color-picker-input-sizing-width;
  height: @color-picker-input-sizing-height;

  &-pure {
    width: 28px;

    .@{kd-prefix}-input-wrapper.@{color-picker-prefix-cls}-input {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;

      .@{kd-prefix}-input-prefix {
        margin-right: 0;
      }

      .@{kd-prefix}-input-suffix {
        margin-left: 0;
      }

      .@{kd-prefix}-input {
        display: none;
      }
    }
  }

  .@{color-picker-prefix-cls}-input {
    height: 100%;
    width: 100%;
    padding: 0 8px;
    font-size: @color-picker-input-font-size;
  }

  .@{color-picker-prefix-cls}-icon-container {
    cursor: pointer;

    .@{color-picker-prefix-cls}-icon {
      display: flex;
      justify-content: center;
      align-items: center;
      width: @color-picker-input-prefix-sizing-width;
      height: @color-picker-input-prefix-sizing-height;
      border: 1px solid rgba(0, 0, 0, 0.05);
      border-radius: 2px;
      line-height: 18px;
      text-align: center;
      color: @bg;

      &-no-color-line {
        width: @color-picker-input-prefix-line-sizing-width;
        height: @color-picker-input-prefix-line-sizing-height;
        background-color: #ff2e3d;
        transform: rotate(45deg);
      }
    }
  }
  .@{color-picker-prefix-cls}-icon-container-disabled {
    cursor: not-allowed;
  }
}

.@{color-picker-prefix-cls}-pop {
  width: @color-picker-panel-sizing-width;

  &.topLeft.hidden,
  &.topRight.hidden {
    opacity: 0;
    visibility: hidden;
    transition: all calc(0.3s - 0.1s) cubic-bezier(0.4, 0, 0.6, 1);
    animation-name: kdSlideDownOut;
  }

  &.topLeft,
  &.topRight {
    animation-name: kdSlideDownIn;
  }

  &.bottomLeft.hidden,
  &.bottomRight.hidden {
    opacity: 0;
    visibility: hidden;
    transition: all calc(0.3s - 0.1s) cubic-bezier(0.4, 0, 0.6, 1);
    animation-name: kdSlideUpOut;
  }

  &.bottomLeft,
  &.bottomRight {
    animation-name: kdSlideUpIn;
  }

  .@{color-picker-prefix-cls}-panel {
    position: relative;
    box-sizing: border-box;
    width: @color-picker-panel-sizing-width;
    padding: 4px 12px 16px;
    background: #ffffff;
    box-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.15);
    border-radius: 2px;
    transform-origin: top left;
    z-index: @color-picker-panel-z-index;

    & > div {
      margin-top: 12px;
    }

    &-clear {
      display: flex;
      align-items: center;
      font-size: 12px;
      color: #666666;
      line-height: 16px;
      font-weight: 400;

      &-box {
        position: relative;
        width: 16px;
        height: 16px;
        margin-right: 4px;
        border: 1px solid rgba(217, 217, 217, 1);
        border-radius: 2px;
        cursor: pointer;
        background-color: #fff;

        &::after {
          position: absolute;
          left: 7.5px;
          top: -3.5px;
          content: '';
          width: 1px;
          height: 22.6px;
          background-color: #ff2e3d;
          transform: rotate(45deg);
        }

        .active {
          content: '';
          position: absolute;
          top: -3px;
          left: -3px;
          width: 20px;
          height: 20px;
          border: 1px solid rgba(217, 217, 217, 1);
          border-radius: 4px;
        }

        &:hover {
          &::before {
            .active;
          }
        }

        &:active {
          &::before {
            .active;
            border: 1px solid rgba(148, 148, 148, 1);
          }
        }
      }

      &-text {
        font-size: 12px;
        color: #666666;
        line-height: 16px;
        font-weight: 400;
      }
    }

    &-chrome {
      width: 278px !important;
      box-shadow: none !important;

      & > div:last-child {
        padding: 9px 0 4px !important;

        .flexbox-fix:first-child {
          display: flex;
          flex-direction: row-reverse;

          & > div:first-child {
            & > div {
              width: 28px !important;
              height: 28px !important;
              border-radius: 50% !important;
              margin-top: -1px !important;
              margin-left: 4px !important;
            }
          }

          & > div:last-child {
            .hue-horizontal {
              width: 240px !important;
              height: 12px !important;
              border-radius: 6px !important;
              padding: unset !important;

              & > div > div {
                margin-top: 1px;
              }
            }

            & > div:last-child {
              & > div {
                width: 240px !important;
                height: 12px !important;
                margin: unset;

                & > div:first-child {
                  border-radius: 6px !important;
                }

                & > div:nth-child(2) {
                  border-radius: 6px !important;
                }

                & > div:last-child {
                  margin: unset !important;

                  & > div > div {
                    margin-top: 1px;
                  }
                }
              }
            }
          }
        }

        .flexbox-fix:last-child {
          display: none !important;
        }
      }

      &-no-box {
        & > div:first-child {
          display: none;
        }
      }

      &-no-hue {
        & > div:last-child {
          .flexbox-fix:first-child {
            & > div:last-child {
              & > div:first-child {
                display: none;
              }

              & > div:last-child {
                margin-top: 8px;
              }
            }
          }
        }
      }

      &-no-opacity {
        & > div:last-child {
          .flexbox-fix:first-child {
            & > div:last-child {
              & > div:last-child {
                display: none;
              }

              & > div:first-child {
                margin-top: 8px;
              }
            }
          }
        }
      }
    }

    .@{color-picker-prefix-cls}-panel-chrome-no-box.@{color-picker-prefix-cls}-panel-chrome-no-hue.@{color-picker-prefix-cls}-panel-chrome-no-opacity {
      display: none;
    }

    .@{color-picker-prefix-cls}-panel-chrome-no-hue.@{color-picker-prefix-cls}-panel-chrome-no-opacity {
      & > div:last-child {
        display: none;
      }
    }

    &-switch {
      font-size: 12px;
      color: #666666;
      letter-spacing: 0;
      line-height: 16px;
      font-weight: 400;

      span {
        vertical-align: middle;
        margin-right: 9px;
      }
    }

    &-container {
      display: flex;
      flex-wrap: nowrap;

      &-select {
        flex: 0 0 64px;
        display: inline-block;
        position: relative;
        margin-right: 8px;
        font-size: @color-picker-panel-select-font-size;

        .@{kd-prefix}-select {
          width: 64px;

          .@{kd-prefix}-select,
          .@{kd-prefix}-select-selection-item {
            min-height: unset;
            line-height: unset;
            overflow: visible;
            text-overflow: unset;
          }

          &-suffix {
            padding-right: 4px;
            margin-left: 0;
          }
        }

        .@{kd-prefix}-select-dropdown-panel {
          margin: 0 !important;

          &.bottomLeft,
          &.topLeft {
            position: absolute;
            width: 64px !important;
            min-width: unset !important;
            background: #ffffff;
            right: 0;
            left: unset !important;
            box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
            border-radius: 2px;
          }

          .@{kd-prefix}-select-dropdown {
            .@{kd-prefix}-select-item-option {
              display: flex;
              justify-content: center;
              min-width: auto; /* IE */
              min-width: unset; /* 现代浏览器 */
            }
          }
        }

        .@{kd-prefix}-select-bordered {
          border-radius: 2px;
          width: @color-picker-panel-select-sizing-width;
          height: @color-picker-panel-select-sizing-height;
          min-height: 28px;
          padding: 0 28px 0 0;
        }

        .active-option {
          background-color: @color-picker-panel-option-color-background;
        }
      }

      &-input {
        height: 28px;
        flex: 1 1 auto;
        padding: 0 8px;
      }

      &-input-group {
        display: flex;
        align-items: center;

        &-item {
          height: 28px;
          flex: 1;

          &.active {
            z-index: 2;
          }

          &:first-child {
            border-top-right-radius: 0;
            border-bottom-right-radius: 0;
            z-index: 1;
          }

          &:nth-child(2) {
            margin-right: -1px;
            margin-left: -1px;
            border-radius: 0;

            &:hover {
              z-index: 1;
            }
          }

          &:last-child {
            border-top-left-radius: 0;
            border-bottom-left-radius: 0;
          }
        }
      }

      &-transparent {
        flex: 0 0 54px;
        height: 28px;
        margin-left: 8px;
        padding: 0;
        text-align: center;
        font-size: @color-picker-panel-alpha-font-size;
      }
    }

    &-historical-color-box {
      &-title {
        font-size: 12px;
        color: #666666;
        line-height: 18px;
        font-weight: 400;
        margin-bottom: 8px;
      }

      &-container {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        grid-column-gap: 8px;
        grid-row-gap: 8px;

        &-ie11 {
          display: flex;
          flex-wrap: wrap;

          li {
            margin-right: 8px;
            margin-top: 8px;

            &:nth-child(12n) {
              margin-right: 0;
            }

            &:nth-child(-n + 12) {
              margin-top: 0;
            }
          }
        }

        li {
          position: relative;
          box-sizing: border-box;
          width: @color-picker-panel-historical-sizing-width;
          height: @color-picker-panel-historical-sizing-height;
          border: 1px solid rgba(0, 0, 0, 0.05);
          border-radius: 2px;
          list-style: none;
          cursor: pointer;

          .square {
            display: none;
            position: absolute;
            box-sizing: inherit;
            top: -3px;
            left: -3px;
            width: calc(@color-picker-panel-historical-sizing-width + 4px);
            height: calc(@color-picker-panel-historical-sizing-height + 4px);
            border: 1px solid rgba(178, 178, 176, 1);
            border-radius: 4px;

            &-click {
              display: block;
              box-shadow: 0 0 0 1px #e5e5e5 !important;
            }
          }

          &:hover {
            .square {
              display: block;
            }
          }
        }
      }
    }

    &-color-box {
      &-title {
        font-size: 12px;
        color: #666666;
        line-height: 18px;
        font-weight: 400;
        margin-bottom: 8px;
      }

      &-container {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        grid-column-gap: 8px;
        grid-row-gap: 8px;

        &-ie11 {
          .@{color-picker-prefix-cls}-panel-color-box-container {
            display: flex;
            flex-wrap: wrap;
            width: 100%;
          }
          li {
            margin-right: 8px;
            margin-top: 8px;

            &:nth-child(12n) {
              margin-right: 0;
            }

            &:nth-child(-n + 12) {
              margin-top: 0;
            }
          }
        }

        li {
          position: relative;
          box-sizing: border-box;
          width: @color-picker-panel-preset-sizing-width;
          height: @color-picker-panel-preset-sizing-height;
          border: 1px solid rgba(0, 0, 0, 0.05);
          border-radius: 2px;
          list-style: none;
          cursor: pointer;

          .square {
            display: none;
            position: absolute;
            box-sizing: inherit;
            top: -3px;
            left: -3px;
            width: calc(@color-picker-panel-preset-sizing-width + 4px);
            height: calc(@color-picker-panel-preset-sizing-height + 4px);
            border: 1px solid rgba(178, 178, 176, 1);
            border-radius: 4px;

            &-click {
              display: block;
              box-shadow: 0 0 0 1px #e5e5e5 !important;
            }
          }

          &:hover {
            .square {
              display: block;
            }
          }
        }
      }
    }
  }
}
.@{color-picker-prefix-cls}-rtl {
  direction: rtl;
  .@{color-picker-prefix-cls}-input {
    .@{kd-prefix}-input-prefix {
      margin-right: 0;
      margin-left: 3px;
    }
    .@{kd-prefix}-input {
      direction: ltr;
      text-align: right;
    }
  }
  &.@{color-picker-prefix-cls}-pop {
    .@{color-picker-prefix-cls}-panel {
      transform-origin: top left;
      &-clear {
        &-box {
          margin-left: 4px;
          margin-right: 0;
        }
      }
      &-switch {
        span {
          margin-right: 9px;
          margin-left: 0;
        }
      }

      &-container {
        &-select {
          margin-left: 8px;
          margin-right: 0;
          .@{kd-prefix}-select-bordered {
            padding: 0 28px 0 0;
          }
        }
        &-input {
          direction: ltr;
          text-align: right;
        }

        &-input-group {
          display: flex;
          align-items: center;

          &-item {
            height: 28px;
            flex: 1;

            &.active {
              z-index: 2;
            }

            &:first-child {
              border-top-right-radius: 0;
              border-bottom-right-radius: 0;
              z-index: 1;
            }

            &:nth-child(2) {
              margin-right: -1px;
              margin-left: -1px;
              border-radius: 0;

              &:hover {
                z-index: 1;
              }
            }

            &:last-child {
              border-top-left-radius: 0;
              border-bottom-left-radius: 0;
            }
          }
        }

        &-transparent {
          flex: 0 0 54px;
          height: 28px;
          margin-right: 8px;
          margin-left: 0;
          padding: 0;
          text-align: center;
          font-size: @color-picker-panel-alpha-font-size;
        }
      }

      &-historical-color-box {
        &-title {
          font-size: 12px;
          color: #666666;
          line-height: 18px;
          font-weight: 400;
          margin-bottom: 8px;
        }

        &-container {
          display: grid;
          grid-template-columns: repeat(12, 1fr);
          grid-column-gap: 8px;
          grid-row-gap: 8px;

          &-ie11 {
            display: flex;
            flex-wrap: wrap;

            li {
              margin-right: 8px;
              margin-top: 8px;

              &:nth-child(12n) {
                margin-right: 0;
              }

              &:nth-child(-n + 12) {
                margin-top: 0;
              }
            }
          }
        }
      }
    }
  }
  
  &.@{color-picker-prefix-cls}-container-pure {
    .@{kd-prefix}-input-wrapper.@{color-picker-prefix-cls}-input {
      .@{kd-prefix}-input-prefix {
        margin-left: 0;
      }
    }
  }
  .@{color-picker-prefix-cls}-panel {
    &-chrome {
      & > div:last-child {
        .flexbox-fix:first-child {
          & > div:first-child {
            & > div {
              margin-right: 4px !important;
              margin-left: 0 !important;
            }
          }
        }
      }
    }
    &-clear {
      &-box {
        margin-left: 4px;
        margin-right: 0;
      }
    }
    &-container {
      &-select {
        .@{kd-prefix}-select-dropdown-panel {
          .@{kd-prefix}-select-dropdown {
            .@{kd-prefix}-select-item {
              justify-content: right;
            }
          }
        } 
      }
    }
  }
}
/*! rtl:end:ignore */


// code component mixin here
.test() {
  display: inline;
}



@color-picker-custom-prefix: ~'--@{kd-prefix}-c-color-picker';

// color
@color-picker-panel-option-color-background: var(~'@{color-picker-custom-prefix}-panel-option-color-background-selected', @color-theme-3);

// font
@color-picker-input-font-size: var(~'@{color-picker-custom-prefix}-input-font-size', @font-size-middle);
@color-picker-panel-select-font-size: var(~'@{color-picker-custom-prefix}-panel-select-font-size', @font-size-middle);
@color-picker-panel-alpha-font-size: var(~'@{color-picker-custom-prefix}-panel-alpha-font-size', @font-size-middle);

// sizing
@color-picker-input-sizing-width: var(~'@{color-picker-custom-prefix}-input-sizing-width', 230px);
@color-picker-input-sizing-height: var(~'@{color-picker-custom-prefix}-input-sizing-height', 28px);
@color-picker-input-prefix-sizing-width: var(~'@{color-picker-custom-prefix}-input-prefix-sizing-width', 16px);
@color-picker-input-prefix-line-sizing-width: var(~'@{color-picker-custom-prefix}-input-prefix-line-sizing-width', 1px);
@color-picker-input-prefix-line-sizing-height: var(~'@{color-picker-custom-prefix}-input-prefix-line-sizing-height', 22.6px);
@color-picker-input-prefix-sizing-height: var(~'@{color-picker-custom-prefix}-input-prefix-sizing-height', 16px);
@color-picker-panel-sizing-width: var(~'@{color-picker-custom-prefix}-panel-sizing-width', 304px);
@color-picker-panel-select-sizing-width: var(~'@{color-picker-custom-prefix}-panel-select-sizing-width', 212px);
@color-picker-panel-select-sizing-height: var(~'@{color-picker-custom-prefix}-panel-select-sizing-height', 28px);
@color-picker-panel-preset-sizing-width: var(~'@{color-picker-custom-prefix}-panel-preset-sizing-width', 16px);
@color-picker-panel-preset-sizing-height: var(~'@{color-picker-custom-prefix}-panel-preset-sizing-height', 16px);
@color-picker-panel-historical-sizing-width: var(~'@{color-picker-custom-prefix}-panel-historical-sizing-width', 16px);
@color-picker-panel-historical-sizing-height: var(~'@{color-picker-custom-prefix}-panel-historical-sizing-height', 16px);

// z-index
@color-picker-panel-z-index: var(~'@{color-picker-custom-prefix}-panel-z-index', @z-index-popper);

/*! rtl:begin:ignore */




@datePicker-prefix-cls: ~'@{kd-prefix}-date-picker';
@datePicker-prefix-cls-panel: ~'@{datePicker-prefix-cls}-panel';

@datePicker-calendar-text: 24px;
@datePicker-calendar-height: 242px;

.@{datePicker-prefix-cls} {
  .input-wrapper;
  width: @date-width;

  &-small {
    .input-size(@date-small-height, @date-small-font-size, @date-small-padding-vertical, @date-small-padding-horizontal);

    input {
      font-size: @date-small-font-size;
    }
  }

  &-large {
    .input-size(@date-large-height, @date-large-font-size, @date-small-padding-vertical, @date-small-padding-horizontal);

    input {
      font-size: @date-large-font-size;
    }
  }

  &-middle {
    .input-size(@date-middle-height, @date-middle-font-size, @date-small-padding-vertical, @date-small-padding-horizontal);

    input {
      font-size: @date-middle-font-size;
    }
  }

  &-input {
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    box-sizing: border-box;
    top: 0;

    input {
      .input;
      line-height: inherit;
      flex: auto;
      min-width: 1px;
      height: auto;
      padding: 0;
      background: transparent;
      border: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;

      &[disabled] {
        background: transparent;
      }

      &::placeholder {
        color: @date-input-color-placeholder;
      }
    }

    &-placeholder {
      > input {
        color: @date-input-color-placeholder;
      }
    }
  }

  &-range {
    display: inline-flex;
    align-items: center;
    position: relative;

    &-separator {
      display: inline-block;
      padding: 0 8px;
    }

    .@{datePicker-prefix-cls}-clear {
      right: @date-small-padding-horizontal;
    }

    .@{datePicker-prefix-cls}-active-bar {
      bottom: -1px;
      height: 2px;
      margin-left: 11px;
      background: @date-bar-color-bg-active;
      opacity: 0;
      transition: all 0.3s ease-out;
      pointer-events: none;
    }

    &.@{datePicker-prefix-cls}-focused {
      .@{datePicker-prefix-cls}-active-bar {
        opacity: 1;
      }
    }
  }

  &-suffix {
    align-self: center;
    margin-left: @date-suffix-spacing-margin-left;
    color: @date-input-color;
    line-height: 1;
    pointer-events: none;

    > * {
      vertical-align: top;
    }
  }

  &:not(.@{datePicker-prefix-cls}-disabled):hover {
    .@{datePicker-prefix-cls}-clear {
      opacity: 1;
    }
  }

  &-clear {
    position: absolute;
    top: 50%;
    right: 0;
    color: @date-icon-color;
    line-height: 1;
    background: @date-clear-background-color;
    transform: translateY(-48%);
    cursor: pointer;
    opacity: 0;

    > * {
      vertical-align: top;
    }

    &:hover {
      color: @date-icon-color-hover;
    }
  }

  .@{datePicker-prefix-cls}-range-clear {
    align-self: center;
    margin-left: @date-suffix-spacing-margin-left;
    color: @date-icon-color;
    line-height: 1;
    cursor: pointer;

    &:hover {
      color: @date-icon-color-hover;
    }
  }

  &-focused {
    .@{datePicker-prefix-cls}-suffix {
      color: @date-clear-background-color-focused;
    }
  }

  &-error {
    border-color: @color-error;
  }
}

.@{datePicker-prefix-cls-panel} {
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
  border-radius: @date-panel-border-radius;
  background-color: #fff;
  text-align: center;
  z-index: @date-panel-z-index;
  font-size: @date-panel-font-size;

  &-range {
    display: flex;
  }

  &.hidden {
    opacity: 0;
    visibility: hidden;
    transition: all calc(0.3s - 0.1s) cubic-bezier(0.4, 0, 0.6, 1);
  }

  .@{datePicker-prefix-cls}-warpper {
    font-size: 12px;
    background: @date-wrapper-color-background;

    .@{datePicker-prefix-cls}-month,
    .@{datePicker-prefix-cls}-year,
    .@{datePicker-prefix-cls}-quarter {
      width: 240px;
      padding: 8px 12px;
      box-sizing: border-box;
    }

    .@{datePicker-prefix-cls}-year-warpper,
    .@{datePicker-prefix-cls}-month-line {
      display: grid;
      grid-template-columns: 33.33% 33.33% 33.33%;
    }

    .@{datePicker-prefix-cls}-month-item,
    .@{datePicker-prefix-cls}-year-item,
    .@{datePicker-prefix-cls}-quarter-item,
    .@{datePicker-prefix-cls}-calendar-item {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 32px;
      padding-bottom: 8px;
      color: #212121;
    }

    .@{datePicker-prefix-cls}-year-text,
    .@{datePicker-prefix-cls}-month-text,
    .@{datePicker-prefix-cls}-quarter-text {
      line-height: 24px;
      display: inline-block;
      border-radius: @date-panel-border-radius;
    }

    .@{datePicker-prefix-cls}-year {
      &-warpper {
        .@{datePicker-prefix-cls}-year-item {
          overflow: hidden;
          cursor: pointer;

          &:hover {
            .@{datePicker-prefix-cls}-year-text {
              &:not(.@{datePicker-prefix-cls}-year-text-selected) {
                background: #f5f5f5;
              }
            }

            &:not(.@{datePicker-prefix-cls}-year-item-disabled) {
              .@{datePicker-prefix-cls}-year-text-selected {
                background: @date-square-item-color-selected;
              }
            }
          }

          .@{datePicker-prefix-cls}-year-text {
            position: relative;
            z-index: 2;
            width: 46px;
            padding: 2px 2px;
          }

          .@{datePicker-prefix-cls}-year-text-today {
            .today-after(@date-color-background-checked);
          }

          &-disabled {
            pointer-events: none;

            .@{datePicker-prefix-cls}-year-text {
              color: #b2b2b2;
              background: #f5f5f5;
            }
          }

          .@{datePicker-prefix-cls}-year-text-selected {
            background: @date-color-background-checked;
            color: #fff;
          }
        }
      }

      .@{datePicker-prefix-cls}-range-view,
      .@{datePicker-prefix-cls}-range-start,
      .@{datePicker-prefix-cls}-range-end {
        &::before {
          height: 28px;
        }
      }
    }

    .@{datePicker-prefix-cls}-month {
      &-warpper {
        .@{datePicker-prefix-cls}-month-item {
          overflow: hidden;
          cursor: pointer;

          &:hover {
            .@{datePicker-prefix-cls}-month-text {
              &:not(.@{datePicker-prefix-cls}-month-text-selected) {
                background: #f5f5f5;
              }
            }

            &:not(.@{datePicker-prefix-cls}-month-item-disabled) {
              .@{datePicker-prefix-cls}-month-text-selected {
                background: @date-square-item-color-selected;
              }
            }
          }

          .@{datePicker-prefix-cls}-month-text {
            position: relative;
            z-index: 2;
            width: 48px;
            padding: 2px 5px;
          }

          .@{datePicker-prefix-cls}-month-text-today {
            .today-after(@date-color-background-checked);
          }

          &-disabled {
            pointer-events: none;

            .@{datePicker-prefix-cls}-month-text {
              color: #b2b2b2;
              background: #f5f5f5;
            }
          }

          .@{datePicker-prefix-cls}-month-text-selected {
            background: @date-color-background-checked;
            color: #fff;
          }
        }
      }

      .@{datePicker-prefix-cls}-range-view,
      .@{datePicker-prefix-cls}-range-start,
      .@{datePicker-prefix-cls}-range-end {
        &::before {
          height: 28px;
        }
      }
    }

    .@{datePicker-prefix-cls}-quarter {
      &-warpper {
        display: grid;
        grid-template-columns: 25% 25% 25% 25%;

        .@{datePicker-prefix-cls}-quarter-item {
          overflow: hidden;
          padding-bottom: 0;
          cursor: pointer;

          &:hover {
            .@{datePicker-prefix-cls}-quarter-text {
              &:not(.@{datePicker-prefix-cls}-quarter-text-selected) {
                background: #f5f5f5;
              }
            }

            &:not(.@{datePicker-prefix-cls}-quarter-item-disabled) {
              .@{datePicker-prefix-cls}-quarter-text-selected {
                background: @date-square-item-color-selected;
              }
            }
          }

          .@{datePicker-prefix-cls}-quarter-text {
            position: relative;
            z-index: 2;
            width: 36px;
            padding: 0 5px;
          }

          .@{datePicker-prefix-cls}-quarter-text-today {
            .today-after(@date-color-background-checked);
          }

          &-disabled {
            pointer-events: none;

            .@{datePicker-prefix-cls}-quarter-text {
              color: #b2b2b2;
              background: #f5f5f5;
            }
          }

          .@{datePicker-prefix-cls}-quarter-text-selected {
            background: @date-color-background-checked;
            color: #fff;
          }
        }
      }
    }

    .@{datePicker-prefix-cls}-calendar {
      width: 240px;
      padding: 8px;
      box-sizing: border-box;

      .@{datePicker-prefix-cls}-weektitle {
        display: flex;

        &-item {
          flex: 1;
          height: 32px;
          line-height: 32px;
          cursor: default;
        }
      }

      .@{datePicker-prefix-cls}-calendar-line {
        display: flex;

        .@{datePicker-prefix-cls}-calendar-item {
          flex: 1;
          margin-bottom: 0;
          height: 32px;
          padding: 3px 0;
          cursor: pointer;
          overflow: hidden;
          box-sizing: border-box;
        }

        & .@{datePicker-prefix-cls}-calendar-item:not(.@{datePicker-prefix-cls}-calendar-item-disabled):hover {
          .@{datePicker-prefix-cls}-calendar-text {
            background: #f5f5f5;
          }

          .@{datePicker-prefix-cls}-calendar-text-selected {
            background: @date-square-item-color-selected !important;
          }
        }

        .@{datePicker-prefix-cls}-calendar-item-disabled {
          position: relative;
          cursor: not-allowed;

          .@{datePicker-prefix-cls}-calendar-text {
            color: #b2b2b2;
          }

          .@{datePicker-prefix-cls}-calendar-text-selected {
            color: #fff;
          }

          &::before {
            content: '';
            width: 100%;
            position: absolute;
            z-index: 1;
            background: #f5f5f5;
            height: 24px;
          }
        }
      }

      .@{datePicker-prefix-cls}-calendar-week-line {
        position: relative;
        display: flex;

        .@{datePicker-prefix-cls}-calendar-item {
          flex: 1;
          padding: 0;
          cursor: pointer;

          ::before {
            content: '';
            position: absolute;
            height: 100%;
            width: 100%;
            top: 0;
            left: 0;
            z-index: -1;
          }
        }

        &:hover {
          & .@{datePicker-prefix-cls}-calendar-item:not(.@{datePicker-prefix-cls}-calendar-item-disabled) {
            .@{datePicker-prefix-cls}-calendar-week-text::before {
              background: #f5f5f5;
            }
          }
        }

        &.@{datePicker-prefix-cls}-calendar-week-selected {
          .@{datePicker-prefix-cls}-calendar-week-text::before {
            background: @date-color-background-checked;
          }

          &:hover {
            & .@{datePicker-prefix-cls}-calendar-item:not(.@{datePicker-prefix-cls}-calendar-item-disabled) {
              .@{datePicker-prefix-cls}-calendar-week-text::before {
                background: @date-square-item-color-selected;
              }
            }
          }

          .@{datePicker-prefix-cls}-calendar-week-text {
            background: transparent !important;
            color: #fff !important;

            &-today {
              .today-after(#fff);
            }
          }
        }

        .@{datePicker-prefix-cls}-calendar-item-disabled {
          cursor: not-allowed;
          pointer-events: none;

          .@{datePicker-prefix-cls}-calendar-week-text {
            color: #b2b2b2;
            background: #f5f5f5;
          }
        }

        .@{datePicker-prefix-cls}-range-start {
          &::before {
            left: 0;
          }
        }

        .@{datePicker-prefix-cls}-range-end {
          &::before {
            right: 0;
          }
        }
      }

      .@{datePicker-prefix-cls}-calendar-text,
      .@{datePicker-prefix-cls}-calendar-week-text {
        position: relative;
        z-index: 2;
        width: @datePicker-calendar-text;
        height: @datePicker-calendar-text;
        text-align: center;
        line-height: @datePicker-calendar-text;
        display: inline-block;
        border-radius: @date-panel-border-radius;
        color: #b2b2b2;

        &-today {
          .today-after(@date-color-background-checked);
        }
      }

      .@{datePicker-prefix-cls}-calendar-week-text {
        width: 100%;
        height: @datePicker-calendar-text;
        margin: 3px 0;
      }

      .@{datePicker-prefix-cls}-calendar-current {
        .@{datePicker-prefix-cls}-calendar-text {
          color: #212121;
        }

        .@{datePicker-prefix-cls}-calendar-week-text {
          color: #212121;
        }

        .@{datePicker-prefix-cls}-calendar-text-selected {
          background: @date-color-background-checked;
          color: #fff;
        }
      }

      .@{datePicker-prefix-cls}-calendar-weeknumber,
      .@{datePicker-prefix-cls}-weektitle-weeknumber {
        width: 24px;
        height: 30px;
        text-align: center;
        line-height: 30px;
        color: #bfbfbf;
        font-weight: bold;
        cursor: default;
      }
    }
  }

  .@{datePicker-prefix-cls}-range-start {
    &::before {
      left: 50%;
    }

    .@{datePicker-prefix-cls}-calendar-text-selected {
      border-top-right-radius: 0 !important;
      border-bottom-right-radius: 0 !important;
    }
  }

  .@{datePicker-prefix-cls}-range-end {
    &::before {
      right: 50%;
    }

    .@{datePicker-prefix-cls}-calendar-text-selected {
      border-top-left-radius: 0 !important;
      border-bottom-left-radius: 0 !important;
    }
  }

  .@{datePicker-prefix-cls}-range-view,
  .@{datePicker-prefix-cls}-range-start,
  .@{datePicker-prefix-cls}-range-end {
    position: relative;

    &::before {
      content: '';
      position: absolute;
      z-index: 1;
      height: 24px;
      width: 100%;
      margin: 0 -4px;
      background: @date-range-item-color-bg;
    }
  }

  .@{datePicker-prefix-cls}-header {
    &-icon {
      min-width: 1.6em;
      font-size: 14px;
      padding: 0;
      color: rgba(0, 0, 0, 0.25);
      background: 0 0;
      border: 0;
      cursor: pointer;
      transition: color 0.3s;

      &:hover {
        color: @date-color-background-checked;
      }
    }

    &-text {
      flex: 1;

      &-inner {
        &-active {
          color: @date-color-background-checked;
        }

        &-hover:hover {
          color: @date-color-background-checked;
          cursor: pointer;
        }

        &:nth-child(2) {
          margin-left: 13px;
        }
      }
    }
  }

  .@{datePicker-prefix-cls}-time-header,
  .@{datePicker-prefix-cls}-header {
    height: @date-panel-header-height;
    line-height: @date-panel-header-height;
    background: #fafafa;
    color: #212121;
    font-size: 14px;
    padding: 7px;
    border-bottom: 1px solid #d9d9d9;
    font-weight: bold;
    display: flex;
    align-items: center;
    box-sizing: border-box;
  }

  .@{datePicker-prefix-cls}-time {
    padding-top: 4px;
    width: auto;

    .@{datePicker-prefix-cls}-content {
      display: flex;
      height: @datePicker-calendar-height;
      border-left: 1px solid #d9d9d9;
      width: 100%;
      table-layout: fixed;
      border-collapse: collapse;

      .@{datePicker-prefix-cls}-time-column {
        flex: 1 0 auto;
        width: 56px;
        margin: 0;
        padding: 10px 0 214px 0;
        text-align: left;
        transition: background 0.3s;
        overflow: hidden;

        &:not(:first-child) {
          border-left: 1px solid #d9d9d9;
        }

        &:hover {
          overflow-y: overlay;
        }

        .@{datePicker-prefix-cls}-time-cell {
          margin: 0;
          padding: 0;

          &-inner {
            display: block;
            width: 100%;
            height: 28px;
            margin: 0;
            text-align: center;
            color: rgba(0, 0, 0, 0.85);
            line-height: 28px;
            border-radius: 0;
            cursor: pointer;
            box-sizing: border-box;
            transition: background 0.3s;

            &:hover {
              background: #f5f5f5;
            }
          }
        }

        .@{datePicker-prefix-cls}-time-cell-selected {
          .@{datePicker-prefix-cls}-time-cell-inner {
            background: @date-range-item-color-bg;
          }
        }

        .@{datePicker-prefix-cls}-time-cell-disabled {
          .@{datePicker-prefix-cls}-time-cell-inner {
            color: rgba(0, 0, 0, 0.25);
            background: transparent;
            cursor: not-allowed;
          }
        }
      }
    }
  }

  .@{datePicker-prefix-cls}-datetime-panel {
    display: flex;

    .@{datePicker-prefix-cls}-time {
      padding: 0;
    }
  }

  .@{datePicker-prefix-cls}-footer {
    width: min-content;
    min-width: 100%;
    line-height: 36px;
    height: 40px;
    border-top: 1px solid #d9d9d9;
    border-bottom: 1px solid transparent;
    padding: 0 12px;
    color: @date-color-background-checked;
    font-size: 12px;
    box-sizing: border-box;
    text-align: right;
    background: @date-footer-color-background;

    &::after {
      content: '';
      vertical-align: middle;
    }

    &-extra {
      line-height: 34px;
      text-align: left;
    }

    .@{datePicker-prefix-cls}-today-btn,
    .@{datePicker-prefix-cls}-ok-btn {
      display: inline-block;
      padding: 5px 12px;
      background: @date-color-background-checked;
      color: #fff;
      border-radius: @date-panel-border-radius;
      line-height: initial;
      vertical-align: middle;
      cursor: pointer;
    }

    .@{datePicker-prefix-cls}-btn-disabled {
      background-color: #e3ebff;
      cursor: not-allowed;
    }

    .@{datePicker-prefix-cls}-btns {
      margin-bottom: 0;
      overflow: hidden;
      text-align: left;
      list-style: none;

      li {
        display: inline-block;

        &::after {
          vertical-align: middle;
        }
      }

      .@{datePicker-prefix-cls}-now {
        text-align: left;
        vertical-align: middle;
        cursor: pointer;
      }

      .@{datePicker-prefix-cls}-ok {
        float: right;
        margin-left: 8px;
        vertical-align: middle;
      }
    }
  }
}

.@{datePicker-prefix-cls}-container {
  display: flex;
  background: @date-container-color-background;

  &-date {
    display: flex;
  }

  .@{datePicker-prefix-cls}-ranges {
    width: 160px;
    color: @date-container-color;
    padding: 0 12px;
    text-align: left;
    overflow: auto;
    max-height: 276px;

    &-item {
      height: @date-panel-header-height;
      line-height: @date-panel-header-height;
      font-size: @date-container-font-size;
      border-bottom: 0.5px solid @date-container-color-border;
      cursor: pointer;
    }
  }
}
.@{datePicker-prefix-cls}-rtl {
  direction: rtl;
  .@{datePicker-prefix-cls}-input {
    .@{datePicker-prefix-cls}-suffix {
      margin-right: @date-suffix-spacing-margin-left;
      margin-left: 0;
    }
    .@{datePicker-prefix-cls}-clear {
      left: 0;
      right: auto;
    }
  }
  &.@{datePicker-prefix-cls}-panel {
    .@{datePicker-prefix-cls}-time {
      .@{datePicker-prefix-cls}-content {
        border-right: 1px solid #d9d9d9;
        border-left: none;

        .@{datePicker-prefix-cls}-time-column {
          text-align: right;
          &:not(:first-child) {
            border-right: 1px solid #d9d9d9;
            border-left: none;
          }
        }
      }
    }

    .@{datePicker-prefix-cls}-footer {
      text-align: left;
      &-extra {
        text-align: right;
      }
      .@{datePicker-prefix-cls}-btns {
        text-align: right;
        .@{datePicker-prefix-cls}-now {
          text-align: right;
        }

        .@{datePicker-prefix-cls}-ok {
          float: left;
          margin-right: 8px;
          margin-left: 0;
        }
      }
    }
  }
  .@{datePicker-prefix-cls}-suffix {
    margin-right: @date-suffix-spacing-margin-left;
    margin-left: 0;
  }
  .@{datePicker-prefix-cls}-range-clear {
    margin-right: @date-suffix-spacing-margin-left;
    margin-left: 0;
  }

  .@{datePicker-prefix-cls}-container {
    .@{datePicker-prefix-cls}-ranges {
      text-align: right;
    }
  }
  .@{datePicker-prefix-cls}-warpper {
    .@{datePicker-prefix-cls}-time {
      .@{datePicker-prefix-cls}-content {
        direction: ltr;
      }
    }
  }
}
/*! rtl:end:ignore */



@datePicker-prefix-cls: ~'@{kd-prefix}-date-picker';

.input-wrapper() {
  display: inline-flex;
  border: 1px solid @date-input-color-border;
  border-radius: @date-input-border-radius;
  box-sizing: border-box;
  background-color: @date-input-color-background;
  &-borderless {
    border: 0;
  }
  &-underline {
    border: none;
    border-bottom: 1px solid @date-input-underline-color;
    border-radius: 0;
    padding-left: 0;
    padding-right: 0;
  }
  &-disabled {
    background-color: @date-input-color-background-disabled !important;
    border-color: @date-input-color-border !important;
    color: @date-input-color-disabled !important;
    cursor: not-allowed !important;
    input {
      cursor: not-allowed !important;
    }
  }
  &-underline&-disabled,
  &-borderless&-disabled {
    background-color: @date-input-color-background;
    border-color: @date-input-color-border;
  }

  &-focused {
    box-shadow: none;
    outline: none;
    border-color: @date-color-background-checked;
  }

  &:hover {
    border-color: @date-color-background-checked;
  }

  &:not(&-disabled) input:focus {
    color: @date-input-color-focus;
  }
}

.input() {
  width: 100%;
  min-width: 0;
  color: @date-input-color;
  &::-webkit-input-placeholder {
    color: @date-input-color-placeholder;
  }
  &::-moz-input-placeholder {
    color: @date-input-color-placeholder;
  }
  &::-ms-input-placeholder {
    color: @date-input-color-placeholder;
  }
  &:focus {
    box-shadow: none;
    outline: none;
    border-color: @date-color-background-checked;
  }
}

.input-size(@height, @fonSize, @padding-vertical, @padding-horizontal) {
  height: @height;
  line-height: calc(@height - (@padding-vertical * 2) - 2);
  font-size: @fonSize;
  padding: @padding-vertical @padding-horizontal;

  &.@{datePicker-prefix-cls}-underline {
    padding: @padding-vertical 0;
  }
}

.today-after(@background) {
  position: relative;
  &::after {
    position: absolute;
    width: 6px;
    height: 6px;
    border-radius: 6px;
    background: @background;
    content: '';
    bottom: 0;
    left: calc(50% - 3px);
  }
}



@date-picker-custom-prefix: ~'--@{kd-prefix}-c-date-picker';

// color
@date-color-background-checked: var(~'@{date-picker-custom-prefix}-color-background-checked', @color-theme);
@date-wrapper-color-background: var(~'@{date-picker-custom-prefix}-wrapper-color-background', @color-background);
@date-input-color: var(~'@{date-picker-custom-prefix}-input-color', @color-text-primary);
@date-input-color-placeholder: var(~'@{date-picker-custom-prefix}-input-color-placeholder', #f2f2f2);
@date-input-underline-color: var(~'@{date-picker-custom-prefix}-input-underline-color', #999);
@date-input-color-border: var(~'@{date-picker-custom-prefix}-input-color-border', @color-border-strong);
@date-input-color-disabled: var(~'@{date-picker-custom-prefix}-input-color-disabled', @color-disabled);
@date-input-color-background: var(~'@{date-picker-custom-prefix}-input-color-background', @color-white);
@date-input-color-background-disabled: var(~'@{date-picker-custom-prefix}-input-color-background-disabled', @color-background-contain-disabled);
@date-input-color-focus: var(~'@{date-picker-custom-prefix}-input-color-focused', @color-text-primary);
@date-icon-color: var(~'@{date-picker-custom-prefix}-icon-color', #d9d9d9);
@date-icon-color-hover: var(~'@{date-picker-custom-prefix}-icon-color-hover', #999);
@date-clear-background-color: var(~'@{date-picker-custom-prefix}-clear-color-background', @color-background);
@date-clear-background-color-hover: var(~'@{date-picker-custom-prefix}-clear-color-background-hover', @color-theme-5);
@date-clear-background-color-focused: var(~'@{date-picker-custom-prefix}-clear-color-background-focused', @color-theme);
@date-container-color: var(~'@{date-picker-custom-prefix}-container-color', @color-text-primary);
@date-container-color-border: var(~'@{date-picker-custom-prefix}-container-color-border', @color-border-weak);
@date-container-color-background: var(~'@{date-picker-custom-prefix}-container-color-background', @color-background-2);
@date-footer-color-background: var(~'@{date-picker-custom-prefix}-footer-color-background', @color-background);
@date-bar-color-bg-active: var(~'@{date-picker-custom-prefix}-bar-color-bg-active', @color-theme);
@date-square-item-color-selected: var(~'@{date-picker-custom-prefix}-square-item-color-selected', @color-theme-hover);
@date-range-item-color-bg: var(~'@{date-picker-custom-prefix}-range-item-color-bg', @color-theme-1);

// sizing
@date-width: var(~'@{date-picker-custom-prefix}-sizing-width', 230px);
@date-large-height: var(~'@{date-picker-custom-prefix}-large-sizing-height', 36px);
@date-middle-height: var(~'@{date-picker-custom-prefix}-middle-sizing-height', 30px);
@date-small-height: var(~'@{date-picker-custom-prefix}-small-sizing-height', 20px);
@date-panel-header-height: var(~'@{date-picker-custom-prefix}-panel-header-sizing-height', 36px);

// spacing
@date-small-padding-vertical: var(~'@{date-picker-custom-prefix}-small-spacing-padding-vertical', 4px);
@date-small-padding-horizontal: var(~'@{date-picker-custom-prefix}-small-spacing-padding-horizontal', 9px);
@date-middle-padding-vertical: var(~'@{date-picker-custom-prefix}-middle-spacing-padding-vertical', 5px);
@date-middle-padding-horizontal: var(~'@{date-picker-custom-prefix}-middle-spacing-padding-horizontal', 9px);
@date-large-padding-vertical: var(~'@{date-picker-custom-prefix}-large-spacing-padding-vertical', 8px);
@date-large-padding-horizontal: var(~'@{date-picker-custom-prefix}-large-spacing-padding-horizontal', 9px);
@date-suffix-spacing-margin-left: var(~'@{date-picker-custom-prefix}-suffix-spacing-margin-left', 10px);

// font
@date-container-font-size: var(~'@{date-picker-custom-prefix}-container-font-size', @font-size-small);
@date-panel-font-size: var(~'@{date-picker-custom-prefix}-panel-font-size', @font-size-middle);
@date-small-font-size: var(~'@{date-picker-custom-prefix}-small-font-size', @font-size-small);
@date-middle-font-size: var(~'@{date-picker-custom-prefix}-middle-font-size', @font-size-middle);
@date-large-font-size: var(~'@{date-picker-custom-prefix}-large-font-size', @font-size-large);

// radius
@date-input-border-radius: var(~'@{date-picker-custom-prefix}-input-radius-border', @radius-border);
@date-panel-border-radius: var(~'@{date-picker-custom-prefix}-panel-radius-border', @radius-border);

// z-index
@date-panel-z-index: var(~'@{date-picker-custom-prefix}-panel-z-index', @z-index-popper);



@divider-prefix-cls: ~'@{kd-prefix}-divider';

.@{divider-prefix-cls} {
  .divider;

  width: 900px;
  padding: @divider-spacing-padding-horizontal;
  border-top: 1px solid @color-border-strong;

  &-vertical {
    display: inline-block;
    border-left: 1px solid @color-border-strong;
    width: 0;
    height: 1em;
  }

  &-solid {
    .borderStyle(solid)
  }

  &-dashed {
    .borderStyle(dashed)
  }

  &-dotted {
    .borderStyle(dotted)
  }

  &-with-text {
    border: unset;

    .@{divider-prefix-cls}-inner-text {
      display: flex;
      align-items: center;

      &::before {
        content: '';
        width: 74px;
        margin-right: 8px;
        border-top-width: 1px;
        border-top-color: @color-border-strong;
      }

      &::after {
        content: '';
        width: calc(100% - 74px);
        margin-left: 8px;
        border-top-width: 1px;
        border-top-color: @color-border-strong ;
      }
    }
  }

  &-with-text-center {
    .@{divider-prefix-cls}-inner-text {

      &::before,
      &::after {
        width: 50%;
      }
    }
  }

  &-with-text-right {
    .@{divider-prefix-cls}-inner-text {

      &::before {
        width: calc(100% - 74px);

      }

      &::after {
        width: 74px;
      }
    }
  }

  &-margin-left {
    .@{divider-prefix-cls}-inner-text {

      &::before {
        width: 0;

      }

      &::after {
        width: 100%;
      }
    }
  }

  &-margin-right {
    .@{divider-prefix-cls}-inner-text {

      &::before {
        width: 100%;

      }

      &::after {
        width: 0;
      }
    }
  }
}



.divider() {
  color: @divider-color-text;
  font-size: @divider-font-size;
}

.borderStyle(@border-style) {
  border-top-style: @border-style;
  border-left-style: @border-style;

  .@{divider-prefix-cls}-inner-text {

    &::before,
    &::after {
      border-block-start-style: @border-style
    }
  }
}



@divider-custom-prefix: ~'--@{kd-prefix}-c-divider';

// color
@divider-color-text: var(~'@{divider-custom-prefix}-color-text', @color-text-primary);

// font
@divider-font-size: var(~'@{divider-custom-prefix}-font-size', @font-size-small);

// spacing
@divider-spacing-padding-horizontal: var(~'@{divider-custom-prefix}-spacing-padding-horizontal', 0px);

/*! rtl:begin:ignore */





@drawer-prefix-cls: ~'@{kd-prefix}-drawer';

.@{drawer-prefix-cls} {
  display: flex;
  z-index: @z-index-dialog;
  &-active {
    .@{drawer-prefix-cls}-mask {
      opacity: 1;
      visibility: visible;
      transition: all calc(@duration-promptly - 0.1s) @motion-ease-out;
    }
  }
  &-hide {
    visibility: hidden;
    transition: visibility calc(@duration-promptly - 0.1s) @motion-ease-out;
  }
  position: fixed;
  .overall-postion();
  &-mask {
    .overlay(rgba(55, 55, 55, 0.5), 0);
    opacity: 0;
    transition: opacity calc(@duration-promptly - 0.1s) @motion-ease-out;
  }
  &-not-at-body {
    position: absolute;
    .@{drawer-prefix-cls}-mask {
      position: absolute;
    }
  }
  &-container-left,
  &-container-right {
    .drawer-container-placement-horizontal();
  }
  &-container-top,
  &-container-bottom {
    .drawer-container-placement-vertical();
    .@{drawer-prefix-cls}-body {
      max-height: @drawer-body-max-height-vertical;
      overflow-y: auto;
    }
  }

  &-container-box {
    display: flex;
    position: absolute;
    flex-direction: column;
    background: @drawer-bg;
    box-shadow: -4px 0 10px 0 rgba(0, 0, 0, 0.1);
    transition: all calc(@duration-promptly - 0.1s) @motion-ease-out;
    .@{drawer-prefix-cls}-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: @drawer-header-padding-vertical @drawer-header-padding-horizontal;
      border-bottom: @drawer-dividing-width solid @drawer-dividing-color;
      .@{drawer-prefix-cls}-title {
        letter-spacing: 0;
        line-height: 26px;
        font-size: @drawer-title-font-size;
        color: @drawer-title-font-color;
      }
      .@{drawer-prefix-cls}-close-icon {
        i {
          color: @drawer-close-icon-color;
          font-size: @drawer-close-icon-font-size;
        }
        cursor: pointer;
      }
    }
    .@{drawer-prefix-cls}-body {
      display: flex;
      flex-grow: 1;
      flex-direction: column;
      padding: @drawer-body-padding;
      font-size: @font-size-middle;
      color: @color-text-primary;
    }
    .@{drawer-prefix-cls}-footer {
      display: flex;
      min-height: 40px;
      font-size: @font-size-small;
      color: @color-text-primary;
    }
  }
}
.@{drawer-prefix-cls}-rtl {
  direction: rtl;
}
/*! rtl:end:ignore */

.drawer-container-placement-horizontal {
  top: 0;
  bottom: 0;
}

.drawer-container-placement-vertical {
  left: 0;
  right: 0;
}




@drawer-custom-prefix: ~'--@{kd-prefix}-c-drawer';

// color
@drawer-bg: var(~'@{drawer-custom-prefix}-color-background', @color-background);
@drawer-title-font-color: var(~'@{drawer-custom-prefix}-title-color-text', @color-text-primary);
@drawer-dividing-color: var(~'@{drawer-custom-prefix}-dividing-color-border', @color-border-disabled);
@drawer-close-icon-color: var(~'@{drawer-custom-prefix}-close-icon-color-text', @color-text-secondary);

// font
@drawer-title-font-size: var(~'@{drawer-custom-prefix}-title-font-size', @font-size-x-large);
@drawer-close-icon-font-size: var(~'@{drawer-custom-prefix}-close-icon-font-size', @font-size-large);

// sizing
@drawer-body-max-height-vertical: var(~'@{drawer-custom-prefix}-body-max-height-vertical', 470px);
@drawer-dividing-width: var(~'@{drawer-custom-prefix}-dividing-sizing-width', 1px);

// spacing
@drawer-header-padding-vertical: var(~'@{drawer-custom-prefix}-header-sizing-padding-vertical', 12px);
@drawer-header-padding-horizontal: var(~'@{drawer-custom-prefix}-header-sizing-padding-horizontal', 16px);
@drawer-body-padding: var(~'@{drawer-custom-prefix}-body-sizing-padding', 16px);
/*! rtl:begin:ignore */




@dropdown-prefix-cls: ~'@{kd-prefix}-dropdown';
@dropdown-trigger-prefix-cls: ~'@{dropdown-prefix-cls}-trigger';

@dropdown-line-height: 18px;

.@{dropdown-trigger-prefix-cls} {
  outline: none;

  &-container {
    display: inline-block;
  }
}

.@{dropdown-prefix-cls} {
  .reset-component;
  opacity: 1;
  visibility: visible;
  z-index: @z-index-popper;
  background-color: @dropdown-color-background;
  border-radius: @radius-border;
  min-width: @dropdown-menu-min-width;
  max-width: @dropdown-menu-max-width;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);

  &.hidden {
    opacity: 0;
    visibility: hidden;
  }

  // 箭头样式
  .popperArrow(@dropdown-color-background, @dropdown-item-horizontal-gap, @dropdown-box-shadow-blur);

  &-menu {
    max-height: @dropdown-menu-max-height;
    padding: @dropdown-menu-padding-vertical 0;
    overflow-y: auto;
    &-item {
      position: relative;
      padding: @dropdown-item-vertical-gap @dropdown-item-horizontal-gap;
      color: @dropdown-color;
      font-size: @dropdown-font-size;
      line-height: @dropdown-line-height;
      overflow: hidden;
      cursor: pointer;

      &.disabled,
      &.disabled > a {
        color: @dropdown-item-color-disabled;
        cursor: not-allowed;
      }
      transition: background-color @duration-promptly;
      &:not(.disabled):hover {
        background-color: @dropdown-item-hover-bg-color;

        > a {
          color: @dropdown-item-hover-color-text;
        }
      }

      &:not(.disabled):active,
      &:not(.disabled).selected {
        color: @dropdown-item-active-color;

        > a {
          color: @dropdown-item-active-color;
        }
      }

      &.divided::before {
        content: '';
        position: absolute;
        top: 0;
        left: @dropdown-item-horizontal-gap;
        right: @dropdown-item-horizontal-gap;
        height: @dropdown-divided-height;
        background-color: @dropdown-divided-color-bg;
      }

      &.danger,
      &.danger > a {
        color: @dropdown-item-color-text-danger;

        transition: color @duration-promptly, background-color @duration-promptly;
        &:hover {
          color: @color-white;
          background-color: @dropdown-item-color-background-danger-hover;
        }
      }

      > a {
        display: block;
        margin: calc(-1 * @dropdown-item-vertical-gap) calc(-1 * @dropdown-item-horizontal-gap);
        padding: @dropdown-item-vertical-gap @dropdown-item-horizontal-gap;
        color: @dropdown-color;
        font-size: @dropdown-font-size;
        line-height: @dropdown-line-height;
        transition: color @duration-promptly;

        &:hover {
          color: @dropdown-color;
        }
      }

      span {
        .multipleEllipsis(2);
      }
    }
  }
  .@{dropdown-prefix-cls}-menu-rtl {
    direction: rtl;
    [dir='auto'] {
      text-align: right;
    }
    .@{dropdown-prefix-cls}-menu-item {
      > span {
        text-align: right;
      }
    }
  }
}

.@{dropdown-prefix-cls}-mobile {
  max-width: 100vw;
  display: flex;
  min-width: auto;
  .@{dropdown-prefix-cls}-menu {
    flex: 1;
    .@{dropdown-prefix-cls}-menu-item {
      span {
        -webkit-line-clamp: 1;
      }
    }
  }
}
/*! rtl:end:ignore */



@dropdown-custom-prefix: ~'--@{kd-prefix}-c-dropdown';

// color
@dropdown-item-hover-bg-color: var(~'@{dropdown-custom-prefix}-item-color-background-hover', @color-hover);
@dropdown-item-active-color: var(~'@{dropdown-custom-prefix}-item-color-text-active', @color-theme);
@dropdown-item-color-disabled: var(~'@{dropdown-custom-prefix}-item-color-text-disabled', @color-disabled);
@dropdown-item-color-text-danger: var(~'@{dropdown-custom-prefix}-item-color-text-danger', @color-error);
@dropdown-item-color-background-danger-hover: var(~'@{dropdown-custom-prefix}-item-color-background-danger-hover', @color-error);
@dropdown-item-hover-color-text: var(~'@{dropdown-custom-prefix}-item-color-text-hover', @color-text-primary);
@dropdown-divided-color-bg: var(~'@{dropdown-custom-prefix}-divided-color-background', @color-border-weak);
@dropdown-color: var(~'@{dropdown-custom-prefix}-menu-item-color-text', @color-text-primary);
@dropdown-color-background: var(~'@{dropdown-custom-prefix}-menu-color-background', @color-background);

// sizing
@dropdown-menu-min-width: var(~'@{dropdown-custom-prefix}-menu-sizing-min-width', 64px);
@dropdown-menu-max-width: var(~'@{dropdown-custom-prefix}-menu-sizing-max-width', 600px);
@dropdown-menu-max-height: var(~'@{dropdown-custom-prefix}-menu-sizing-max-height', 328px);
@dropdown-divided-height: var(~'@{dropdown-custom-prefix}-divided-sizing-height', 1px);

// spacing
@dropdown-menu-padding-vertical: var(~'@{dropdown-custom-prefix}-menu-spacing-padding-vertical', 4px);
@dropdown-item-vertical-gap: var(~'@{dropdown-custom-prefix}-item-spacing-padding-vertical', 7px);
@dropdown-item-horizontal-gap: var(~'@{dropdown-custom-prefix}-item-spacing-padding-horizontal', 12px);

// font
@dropdown-font-size: var(~'@{dropdown-custom-prefix}-font-size', @font-size-small);



@empty-prefix-cls: ~'@{kd-prefix}-empty';

.@{empty-prefix-cls} {
  display: flex;
  flex-direction: column;
  align-items: center;

  &-image {
    height: @empty-image-height;

    + .@{empty-prefix-cls}-description {
      margin-top: 8px;
    }
  }

  &-description {
    font-size: @empty-font-size;
    color: @empty-font-color;
  }
}



@empty-custom-prefix: ~'--@{kd-prefix}-c-empty';

// color
@empty-font-color: var(~'@{empty-custom-prefix}-color-text', @color-text-third);

// font
@empty-font-size: var(~'@{empty-custom-prefix}-font-size', @font-size-middle);

// sizing
@empty-image-height: var(~'@{empty-custom-prefix}-image-sizing-height', 96px);

/*! rtl:begin:ignore */




@filter-prefix-cls: ~'@{kd-prefix}-filter';
@filter-header-prefix-cls: ~'@{kd-prefix}-filter-header';
@filter-body-prefix-cls: ~'@{kd-prefix}-filter-body';

.@{filter-prefix-cls} {
  .@{filter-header-prefix-cls} {
    z-index: 1;
    display: flex;
    position: relative;
    align-items: flex-end;
    padding: 9px 124px 9px 0;

    &-title {
      white-space: nowrap;
      color: @filter-header-title-color;
      font-size: @filter-header-title-font-size;
    }

    &-condition {
      display: flex;
      flex: 1 1 auto;
      align-items: flex-end;
      margin: 0 8px 0 40px;

      &-label {
        padding-right: 8px;
        font-size: @filter-condition-label-font-size;
        white-space: nowrap;
        color: @filter-condition-label-color;
      }

      &-item-text {
        max-width: 224px;
        .ellipsis;
        display: block;
      }
    }

    &-search {
      min-width: 200px;
    }

    &-handle {
      .reset-component;
      position: absolute;
      right: 0;
      bottom: -1px;
      width: 100px;
      height: 44px;
      line-height: 44px;
      text-align: center;
      color: @filter-handle-color;
      font-size: @filter-handle-font-size;
      cursor: pointer;
      user-select: none;
      border: 1px solid transparent;
      border-bottom: none;

      > i {
        transition: transform 0.2s linear;
      }

      &.spread {
        border-radius: 4px 4px 0 0;
        background-color: @filter-handle-spread-bg-color;
        border-color: @filter-handle-spread-border-color;

        > i {
          transform: rotate(180deg);
        }
      }
    }
  }
  .@{filter-body-prefix-cls} {
    position: relative;
    height: 0;
    overflow: hidden;

    &.spread {
      height: auto;
      overflow: visible;
      padding: 8px 20px;
      border-radius: 4px 0 4px 4px;
      background-color: @filter-body-bg-color;
      border: 1px solid @filter-body-border-color;
    }

    &-tabs {
      border-bottom: 1px solid @filter-body-tabs-border-color;

      &-item {
        padding: 10px 0;
        font-size: @filter-body-tabs-item-font-size;
        color: @filter-body-tabs-item-color;
        cursor: pointer;

        &:hover,
        &.active {
          color: @filter-body-tabs-item-active-color;
        }
      }

      &-split {
        width: 1px;
        height: 16px;
        background-color: @color-border-strong;
      }
    }

    &-conditions {
      display: none;

      &.active {
        display: block;
      }
    }

    &-condition {
      display: flex;
      font-size: @font-size-small;

      &:not(:last-child) {
        border-bottom: 1px solid @color-border-weak;
      }

      &-label {
        padding: 11px 0 10px;
        color: @color-text-third;
        line-height: 18px;
        width: @filter-body-condition-label-width;
      }

      &-options {
        display: flex;
        align-items: flex-start;
        flex-wrap: wrap;
        flex: 1;
        max-height: 64px;
        margin-left: 24px;
        padding: 8px 0 4px;
        overflow: auto;
      }

      &-option {
        margin-bottom: 4px;
        padding: 0 12px;
        color: @color-text-secondary;
        vertical-align: middle;
        line-height: 22px;
        font-size: @font-size-small;
        border-radius: @radius-border;
        border: 1px solid transparent;
        cursor: pointer;
        white-space: nowrap;
        max-width: @filter-body-condition-option-max-width;
        overflow: hidden;
        display: inline-block;
        text-overflow: ellipsis;

        &:not(:last-child) {
          margin-right: 24px;
        }

        &.active {
          color: @ongoing-color;
          border-color: @ongoing-color;
          background-color: @color-background;
        }

        &-customer {
          margin-left: -20px;
        }
      }

      &-addition {
        margin-left: 24px;
        line-height: 40px;
      }
    }

    &-scheme {
      display: none;

      &.active {
        display: block;
      }

      > li {
        position: relative;
        display: flex;
        line-height: 40px;
      }

      &-label {
        width: 96px;
        color: @color-text-third;
        font-size: @font-size-small;
        .ellipsis;
      }

      &-list {
        display: flex;
      }

      &-item {
        font-size: @font-size-small;
        color: @color-text-secondary;
        cursor: pointer;

        &:not(:last-child) {
          margin-right: 48px;
        }

        &.active {
          color: @ongoing-color;
        }
      }

      &-action {
        position: absolute;
        right: 0;
      }

      &-detail {
        list-style: none;
        > li {
          line-height: normal;
          padding: 7px 0 5px 0;
          color: @color-text-primary;
          font-size: @font-size-small;

          > span {
            display: inline-block;

            &:not(:last-child) {
              margin-right: 12px;
            }
          }
        }

        &-field {
          width: 100px;
        }

        &-operator {
          width: 140px;
        }

        &-value {
          width: 220px;
        }

        &-and {
          font-size: @font-size-middle;
        }

        &-delete {
          color: @color-disabled;
          font-size: @font-size-xx-large;
          cursor: pointer;

          &:hover {
            color: @color-error;
          }
        }
      }
    }
  }
}
.@{filter-prefix-cls}-rtl {
  direction: rtl;
  .@{filter-header-prefix-cls} {
    padding: 9px 0 9px 124px;
    &-handle {
      left: 0;
      right: auto;
    }
    &-condition {
      margin: 0 40px 0 8px;
      &-label {
        padding-left: 8px;
        padding-right: 0;
      }
    }
  }
  .@{filter-body-prefix-cls} {
    &.spread {
      border-radius: 4px 4px 4px 0;
    }
    &-condition {
      &-options {
        margin-right: 24px;
        margin-left: 0;
      }

      &-option {
        &:not(:last-child) {
          margin-left: 24px;
          margin-right: 0;
        }

        &.active {
          color: @ongoing-color;
          border-color: @ongoing-color;
          background-color: @color-background;
        }

        &-customer {
          margin-left: -20px;
        }
      }

      &-addition {
        margin-left: 24px;
        line-height: 40px;
      }
    }
    &-scheme {
      &-label {
        text-align: right;
      }
      &-action {
        left: 0;
      }
      &-item {
        &:not(:last-child) {
          margin-left: 48px;
          margin-right: 0;
        }
      }
      &-detail {
        > li {
          text-align: right;
            span:not(:last-child) {
              margin-left: 12px;
              margin-right: 0;
            }
          }
        }
      }
    }
  }
/*! rtl:end:ignore */



@filter-custom-prefix: ~'--@{kd-prefix}-c-filter';

// color
@filter-header-title-color: var(~'@{filter-custom-prefix}-header-title-color-text', @color-text-primary);

@filter-condition-label-color: var(~'@{filter-custom-prefix}-condition-label-color-text', @color-text-third);

@filter-handle-color: var(~'@{filter-custom-prefix}-handle-color-text', @color-ongoing);

@filter-handle-spread-bg-color: var(~'@{filter-custom-prefix}-handle-color-background-spread', @color-background-contain);
@filter-handle-spread-border-color: var(~'@{filter-custom-prefix}-handle-color-border-spread', @color-border-strong);

@filter-body-bg-color: var(~'@{filter-custom-prefix}-body-color-background', @color-background-contain);
@filter-body-border-color: var(~'@{filter-custom-prefix}-body-color-border', @color-border-strong);

@filter-body-tabs-border-color: var(~'@{filter-custom-prefix}-body-tabs-color-border', @color-border-weak);

@filter-body-tabs-item-color: var(~'@{filter-custom-prefix}-body-tabs-item-color-text', @color-text-third);

@filter-body-tabs-item-active-color: var(~'@{filter-custom-prefix}-body-tabs-item-color-text-active', @color-ongoing);

// font
@filter-header-title-font-size: var(~'@{filter-custom-prefix}-header-title-font-size', @font-size-large);
@filter-condition-label-font-size: var(~'@{filter-custom-prefix}-condition-label-font-size', @font-size-middle);
@filter-handle-font-size: var(~'@{filter-custom-prefix}-handle-font-size', @font-size-middle);
@filter-body-tabs-item-font-size: var(~'@{filter-custom-prefix}-body-tabs-item-font-size', @font-size-middle);

//sizing
@filter-body-condition-label-width: var(~'@{filter-custom-prefix}-body-condition-label-width');
@filter-body-condition-option-max-width: var(~'@{filter-custom-prefix}-body-condition-option-max-width');

/*! rtl:begin:ignore */





@form-prefix-cls: ~'@{kd-prefix}-form';
@field-prefix-cls: ~'@{form-prefix-cls}-field';
@field-label-cls: ~'@{field-prefix-cls}-label';
@field-wrapper-cls: ~'@{field-prefix-cls}-wrapper';

.@{form-prefix-cls} {
  .reset-component;

  &-horizontal,
  &-vertical {
    .@{field-prefix-cls} {
      display: flex;
    }
  }

  &-horizontal {
    .@{field-label-cls} {
      flex-shrink: 0;
    }
  }

  &-inline {
    .@{field-prefix-cls} {
      display: inline-flex;
    }
  }
}

.@{field-prefix-cls} {
  align-items: center;
  margin: 0 @form-field-spacing-margin-right @form-field-spacing-margin-bottom 0;

  &-vertical {
    align-items: flex-start;
    flex-direction: column;

    .@{field-label-cls} {
      margin-bottom: @form-field-label-spacing-margin-bottom;
    }
  }

  &-hidden {
    display: none !important;
  }

  &-extra {
    margin-bottom: calc(@form-field-spacing-margin-bottom * 2);
  }
}

.@{field-label-cls} {
  font-size: @form-field-label-font-size;
  line-height: @form-field-label-line-height;
  color: @form-field-color;
  text-align: left;
  margin-right: 30px;
  &-right {
    text-align: right;
  }

  &-required-mark {
    position: relative;
  }

  &-required-mark::after {
    content: '*';
    position: absolute;
    top: -1px;
    right: -9px;
    width: 5px;
    height: 5px;
    font-family: SimSun, sans-serif;
    line-height: 1;
    color: @form-error-color;
  }
}

.@{field-wrapper-cls} {
  position: relative;

  &-message,
  &-extra {
    position: absolute;
    left: -7px;
    right: 0;
    padding: @form-field-message-spacing-padding-horizontal @form-field-message-spacing-padding-vertical;
    font-size: @form-field-message-font-size;
    line-height: @form-field-message-line-height;
    color: @form-error-color;
    word-break: break-word;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }

  &-extra {
    &-message {
      color: @form-error-color;
    }

    &-text {
      color: @form-extra-color;
    }
  }
}
.@{form-prefix-cls}-rtl {
  direction: rtl;
  text-align: right;
  .@{field-prefix-cls} {
    margin: 0 0 @form-field-spacing-margin-bottom @form-field-spacing-margin-right;
  }
  .@{field-label-cls} {
    text-align: right;
    margin-left: 30px;
    margin-right: 0;
    &-right {
      text-align: right;
    }
    &-required-mark::after {
      left: -9px;
      right: auto;
    }
  }
}
/*! rtl:end:ignore */



@form-prefix: '--@{kd-prefix}-c-form';

// color
@form-field-color: var(~'@{form-prefix}-field-color', @color-text-secondary);
@form-error-color: var(~'@{form-prefix}-error-color', @color-error);
@form-extra-color: var(~'@{form-prefix}-extra-color', @color-text-third);

// font
@form-field-label-font-size: var(~'@{form-prefix}-field-label-font-size',12px);
@form-field-message-font-size: var(~'@{form-prefix}-field-message-font-size', 12px);

// line-height
@form-field-label-line-height: var(~'@{form-prefix}-field-label-line-height', 18px);
@form-field-message-line-height: var(~'@{form-prefix}-field-message-line-height', 18px);

// spacing
@form-field-spacing-margin-right: var(~'@{form-prefix}-field-spacing-margin-right', 30px);
@form-field-spacing-margin-bottom: var(~'@{form-prefix}-field-spacing-margin-bottom', 22px);
@form-field-message-spacing-padding-horizontal: var(~'@{form-prefix}-field-message-spacing-padding-horizontal', 2px);
@form-field-message-spacing-padding-vertical: var(~'@{form-prefix}-field-message-spacing-padding-vertical', 8px);
@form-field-label-spacing-margin-bottom: var(~'@{form-prefix}-field-label-spacing-margin-bottom', 5px);

/*! rtl:begin:ignore */


@geo-zone-picker-prefix-cls: ~'@{kd-prefix}-geo-zone-picker';

.@{geo-zone-picker-prefix-cls} {
  display: flex;
  width: 230px;
  height: @geo-zone-picker-sizing-height;
  border-bottom: 1px solid #949494;
  box-sizing: border-box;
  &:hover {
    border-color: @geo-zone-picker-color-border-hover;
  }
  &-active {
    border-color: @geo-zone-picker-color-border-active;
  }
  .@{geo-zone-picker-prefix-cls}-country-input {
    &:hover {
      border-bottom: 1px solid @geo-zone-picker-color-border-hover;
    }
    &-active {
      border-bottom: 1px solid @geo-zone-picker-color-border-active;
    }
  }
  .@{geo-zone-picker-prefix-cls}-region-input {
    &:hover {
      border-bottom: 1px solid @geo-zone-picker-color-border-hover;
    }
    &-active {
      border-bottom: 1px solid @geo-zone-picker-color-border-active;
    }
  }
}

.@{geo-zone-picker-prefix-cls}-country {
  display: flex;
  color: @geo-zone-picker-color-text;
  min-width: 68px;
  max-width: 33.3%;
  height: calc(@geo-zone-picker-sizing-height - 1px);
  box-sizing: border-box;
  overflow: hidden;
  &-input {
    width: calc(100% - 30px);
    height: 100%;
    padding: 8px 0;
    box-sizing: border-box;
  }
  &-input-text {
    width: 100%;
    font-size: @geo-zone-picker-font-size;
    line-height: @geo-zone-picker-input-line-height;
    height: 16px;
    .ellipsis;
    cursor: pointer;
  }
  &-arrow {
    box-sizing: border-box;
    width: 30px;
    font-size: 14px;
    line-height: calc(@geo-zone-picker-sizing-height - 1px);
    height: calc(@geo-zone-picker-sizing-height - 1px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    transform: rotate(0deg);
    transition: transform calc(@transition-duration - 0.1s) @ease;
    cursor: pointer;
    &-up {
      transform: rotate(180deg);
      transition: transform calc(@transition-duration - 0.1s) @ease;
    }
  }
  .@{geo-zone-picker-prefix-cls}-clear-icon {
    box-sizing: border-box;
    width: 30px;
    font-size: 14px;
    line-height: calc(@geo-zone-picker-sizing-height - 1px);
    height: calc(@geo-zone-picker-sizing-height - 1px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 8px;
    cursor: pointer;
  }
}

.@{geo-zone-picker-prefix-cls}-country-panel {
  background: @geo-zone-picker-dropdown-color-background;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
  border-radius: 4px;
  z-index: @geo-zone-picker-z-index;
  &-search {
    padding: 0 8px;
    padding-top: 8px;
  }
  .@{geo-zone-picker-prefix-cls}-country {
    &-list {
      padding: 8px 0;
      &-item {
        height: 32px;
        padding: 0 12px;
        font-size: @geo-zone-picker-font-size;
        line-height: 32px;
        color: #111111;
        cursor: pointer;
        .ellipsis;
      }
      &-item:hover {
        background: @geo-zone-picker-country-item-color-bg-hover;
      }
      &-item-active {
        background: @geo-zone-picker-country-item-color-bg-active;
      }
      &-empty {
        font-size: 14px;
        color: #b2b2b2;
        text-align: center;
        padding: 7px 0 4px 0;
      }
    }
  }

  &-highlight-text {
    color: @geo-zone-picker-highlight-color-text;
  }
}

.@{geo-zone-picker-prefix-cls}-region {
  display: flex;
  flex: 2;
  height: calc(@geo-zone-picker-sizing-height - 1px);
  color: @geo-zone-picker-color-text;
  overflow: hidden;
  box-sizing: border-box;
  &-input {
    width: calc(100% - 30px);
    height: 100%;
    flex: 1;
    padding: 8px 0;
    box-sizing: border-box;
    &-placeholder {
      line-height: 16px;
      height: 16px;
      font-size: @geo-zone-picker-font-size;
      color: #b2b2b2;
    }
  }
  &-input-text {
    font-size: @geo-zone-picker-font-size;
    line-height: @geo-zone-picker-input-line-height;
    height: 16px;
    cursor: pointer;
    .ellipsis;
  }

  &-arrow {
    width: 30px;
    font-size: 14px;
    line-height: calc(@geo-zone-picker-sizing-height - 1px);
    height: calc(@geo-zone-picker-sizing-height - 1px);
    display: flex;
    align-items: center;
    justify-content: center;
    transform: rotate(0deg);
    transition: transform calc(@transition-duration - 0.1s) @ease;
    &-up {
      transform: rotate(180deg);
      transition: transform calc(@transition-duration - 0.1s) @ease;
    }
  }
  .@{geo-zone-picker-prefix-cls}-clear-icon {
    width: 30px;
    font-size: 14px;
    display: flex;
    line-height: calc(@geo-zone-picker-sizing-height - 1px);
    height: calc(@geo-zone-picker-sizing-height - 1px);
    align-items: center;
    justify-content: center;
    cursor: pointer;
  }
}

.@{geo-zone-picker-prefix-cls}-region-panel {
  width: 464px;
  min-height: 112px;
  max-height: 312px;
  overflow-y: auto;
  background: @geo-zone-picker-dropdown-color-background;
  box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
  &-tabs {
    height: 32px;
    box-sizing: border-box;
    overflow: hidden;
    padding: 0 16px;
    position: sticky;
    top: 0;
    background: #ffffff;
    .kd-tab-pane-type-line {
      padding: 0 33px;
    }
  }
  &-province-container {
    margin: 8px;
  }
  &-province {
    &-group {
      color: #b2b2b2;
      font-size: 12px;
      margin: 3px 8px;
      height: 18px;
      line-height: 18px;
    }
    &-list {
      display: flex;
      flex-wrap: wrap;
    }
    &-item {
      width: 112px;
      height: 32px;
      padding: 8px;
      box-sizing: border-box;
      color: #111111;
      font-size: 12px;
      line-height: 18px;
      cursor: pointer;
      .ellipsis;
    }
    &-item-active {
      background: #edf6ff;
    }
    &-item:hover {
      background: #f5f5f5;
    }
  }
  &-city {
    display: flex;
    flex-wrap: wrap;
    margin: 8px;
    &-item {
      width: 112px;
      height: 32px;
      padding: 8px;
      box-sizing: border-box;
      color: #111111;
      font-size: 12px;
      line-height: 18px;
      .ellipsis;
      cursor: pointer;
    }
    &-item-active {
      background: #edf6ff;
    }
    &-item:hover {
      background: #f5f5f5;
    }
  }
  &-district {
    display: flex;
    flex-wrap: wrap;
    margin: 8px;
    &-item {
      width: 112px;
      height: 32px;
      padding: 8px;
      box-sizing: border-box;
      color: #111111;
      font-size: 12px;
      line-height: 18px;
      border-radius: 2px;
      cursor: pointer;
      .ellipsis;
    }
    &-item-active {
      background: #edf6ff;
    }
    &-item:hover {
      background: #f5f5f5;
    }
  }
}

.@{geo-zone-picker-prefix-cls}-bordered {
  border: none;
  & > .@{geo-zone-picker-prefix-cls}-country {
    border: 1px solid #d9d9d9;
    border-radius: 2px 0 0 2px;
  }
  .@{geo-zone-picker-prefix-cls}-country-input {
    padding-left: 8px;
    &:hover {
      border: none;
    }
    &-active {
      border: none;
    }
  }
  & > .@{geo-zone-picker-prefix-cls}-country-hovered {
    border-color: @geo-zone-picker-color-border-hover;
  }
  & > .@{geo-zone-picker-prefix-cls}-country-border-right-active {
    border-right-color: @geo-zone-picker-color-border-active;
  }
  & > .@{geo-zone-picker-prefix-cls}-region {
    border: 1px solid #d9d9d9;
    border-left: none;
    border-radius: 0 2px 2px 0;
  }
  .@{geo-zone-picker-prefix-cls}-region-input {
    padding-left: 8px;
    &:hover {
      border: none;
    }
    &-active {
      border: none;
    }
  }
  .@{geo-zone-picker-prefix-cls}-region-hovered {
    border-color: @geo-zone-picker-color-border-hover;
  }
}
.@{geo-zone-picker-prefix-cls}-disabled {
  border-color: @geo-zone-picker-color-border-disabled;
  &:hover {
    border-color: @geo-zone-picker-color-border-disabled;
  }
  .@{geo-zone-picker-prefix-cls}-country {
    cursor: not-allowed;
    &-input {
      &:hover {
        border: none;
      }
      &-text {
        cursor: not-allowed;
      }
    }

    &-arrow {
      color: @geo-zone-picker-color-border-disabled;
      cursor: not-allowed;
    }
  }
  .@{geo-zone-picker-prefix-cls}-region {
    cursor: not-allowed;
    &-input {
      &:hover {
        border: none;
      }
      &-text {
        cursor: not-allowed;
      }
    }

    &-arrow {
      color: @geo-zone-picker-color-border-disabled;
      cursor: not-allowed;
    }
  }
}

.@{geo-zone-picker-prefix-cls}-country-dropdown {
  z-index: @geo-zone-picker-z-index;
}
.@{geo-zone-picker-prefix-cls}-region-dropdown {
  z-index: @geo-zone-picker-z-index;
}
.@{geo-zone-picker-prefix-cls}-rtl {
  direction: rtl;
  &.@{geo-zone-picker-prefix-cls}-bordered {
    .@{geo-zone-picker-prefix-cls}-country {
      border: 1px solid #d9d9d9;
      border-radius: 0 2px 2px 0;
    }
    .@{geo-zone-picker-prefix-cls}-country-hovered {
      border-color: @geo-zone-picker-color-border-hover;
    }
    .@{geo-zone-picker-prefix-cls}-country-input {
      padding-right: 8px;
      padding-left: 0;
    }
    .@{geo-zone-picker-prefix-cls}-country-border-right-active {
      border: 1px solid #d9d9d9;
    }
    & > .@{geo-zone-picker-prefix-cls}-region {
      border: 1px solid #d9d9d9;
      border-right: none;
      border-left: 1px solid #d9d9d9;
      border-radius: 2px 0 0 2px;
    }
    .@{geo-zone-picker-prefix-cls}-region-input {
      padding-right: 8px;
      padding-left: 0;
      &:hover {
        border: none;
      }
      &-active {
        border: none;
      }
    }
    .@{geo-zone-picker-prefix-cls}-region-hovered {
      border-color: @geo-zone-picker-color-border-hover;
      border-right: 1px solid @geo-zone-picker-color-border-hover;
    }
  }
  .@{geo-zone-picker-prefix-cls}-country {
    &-input {
      text-align: right;
    }
  }
  .@{geo-zone-picker-prefix-cls}-region {
    &-input {
      text-align: right;
    }
  }
}

/*! rtl:end:ignore */



.geo-zone-picker() {
  color: @geo-zone-picker-color-text;
  font-size: @geo-zone-picker-font-size;
}

.ellipsis() {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}


@geo-zone-picker-custom-prefix: ~'--@{kd-prefix}-c-geo-zone-picker';

// color
@geo-zone-picker-color-text: var(~'@{geo-zone-picker-custom-prefix}-color-text', @color-text-primary);
@geo-zone-picker-color-border: var(~'@{geo-zone-picker-custom-prefix}-color-border', #949494);
@geo-zone-picker-color-border-active: var(~'@{geo-zone-picker-custom-prefix}-color-border-active', #0a48c4);
@geo-zone-picker-color-border-hover: var(~'@{geo-zone-picker-custom-prefix}-color-border-hover', #0a48c4);
@geo-zone-picker-color-border-disabled: var(~'@{geo-zone-picker-custom-prefix}-color-border-disabled', @color-disabled);
@geo-zone-picker-dropdown-color-background: var(~'@{geo-zone-picker-custom-prefix}-dropdown-color-background', @color-background);
@geo-zone-picker-highlight-color-text: var(~'@{geo-zone-picker-custom-prefix}-highlight-color-text', #0a48c4);
@geo-zone-picker-country-item-color-bg-active: var(~'@{geo-zone-picker-custom-prefix}-country-item-color-bg-active', #edf6ff);
@geo-zone-picker-country-item-color-bg-hover: var(~'@{geo-zone-picker-custom-prefix}-country-item-color-bg-hover', #f5f5f5);
// font
@geo-zone-picker-font-size: var(~'@{geo-zone-picker-custom-prefix}-font-size', 12px); // 组件级token

// line-height
@geo-zone-picker-input-line-height: var(~'@{geo-zone-picker-custom-prefix}-input-line-height', 16px);

// motion

// sizing
@geo-zone-picker-sizing-height: var(~'@{geo-zone-picker-custom-prefix}-sizing-height', 32px);

// z-index
@geo-zone-picker-z-index: var(~'@{geo-zone-picker-custom-prefix}-z-index', 1050);



@row-prefix-cls: ~'@{kd-prefix}-row';
@col-prefix-cls: ~'@{kd-prefix}-col';

.@{row-prefix-cls} {
  display: flex;
  flex-flow: row wrap;
  row-gap: var(--rgap);
  margin: 0 calc(-1 * var(--cgap) / 2);

  &.nowrap {
    flex-wrap: nowrap;
  }

  &.sogou-row {
    margin-bottom: calc(-1 * var(--rgap));
  }
}

.@{col-prefix-cls} {
  position: relative;
  box-sizing: border-box;
  padding: 0 calc(var(--cgap) / 2);

  &.sogou-col {
    margin-bottom: var(--rgap);
  }
}


@icon-prefix-cls: ~'@{kd-prefix}icon';

[class^='@{icon-prefix-cls}'] {
  display: inline-block;
  text-align: center;
  vertical-align: middle;
}

.icon-spin::before,
.icon-spin {
  animation: loadingcircle 2s infinite linear;
}
.kd-icon-rtl {
  direction: rtl;
  &.icon-spin,
  &.icon-spin::before {
    animation: rtlloadingcircle 2s infinite linear;
  }
  &.@{icon-prefix-cls}-tips {
    transform: scaleX(-1);
  }
}

/*! rtl:begin:ignore */




@image-prefix-cls: ~'@{kd-prefix}-image';
@image-preview-prefix-cls: ~'@{image-prefix-cls}-preview';

.@{image-prefix-cls} {
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: @image-border-radius;

  &:not(.error):hover {
    .@{image-prefix-cls}-action {
      opacity: 1;
      transform: translateY(0);
      transition-timing-function: ease-in;
    }
  }

  &.error {
    .@{image-prefix-cls}-img {
      cursor: auto;
    }
  }

  &-img {
    display: block;
    width: 100%;
    height: auto;
    cursor: pointer;
  }

  &-action {
    position: absolute;
    bottom: 0;
    height: @image-action-height;
    width: @image-action-width;
    text-align: center;
    opacity: 0;
    transform: translateY(100%);
    transition: all 0.2s ease-out;
    background-color: @image-action-background-color;

    > * {
      color: @image-icon-color;
      cursor: pointer;
      display: inline-block;
      font-size: @image-font-size-x-large;

      &:not(:first-child) {
        margin-left: 20px;
      }
    }
  }
}

.@{image-preview-prefix-cls} {
  z-index: 3000;
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  opacity: 0;
  transform: scale(0.15);
  visibility: hidden;
  transition: all 0.2s cubic-bezier(0.4, 0, 1, 0.6);
  -webkit-overflow-scrolling: touch;

  &.show {
    opacity: 1;
    transform: scale(1);
    visibility: visible;
    transition: all 0.2s cubic-bezier(0, 0.4, 0.4, 1);
  }

  &-mask {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    content: '';
    background-color: rgba(0, 0, 0, 0.5);
  }

  &-close {
    position: absolute;
    top: 18px;
    right: 18px;
    width: calc(@image-preview-close-font-size - 10px);
    height: calc(@image-preview-close-font-size - 10px);
    font-size: @image-preview-close-font-size;
    color: @image-close-color-background;
    cursor: pointer;
    background-color: @image-icon-color;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;

    &:hover,
    &:active {
      color: #5582f3;
    }
  }

  &-wrap {
    position: absolute;
    top: 68px;
    right: 0;
    bottom: 30px;
    left: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1) 0s;
  }

  &-img {
    max-width: 100%;
    max-height: 100%;
    cursor: grab;
  }

  &-action {
    position: absolute;
    left: 50%;
    bottom: 40px;
    width: 240px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 20px;
    background-color: rgba(0, 0, 0, 0.5);
    transform: translateX(-50%);

    i {
      color: @image-icon-color;
      font-size: @image-icon-font-size;
      cursor: pointer;

      &:hover,
      &:active {
        opacity: 0.65;
      }

      &:not(:first-child) {
        margin-left: 20px;
      }

      &.disabled {
        opacity: 0.4;
        cursor: not-allowed;
      }
    }
  }

  &-previous,
  &-next {
    position: absolute;
    top: 50%;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    color: @image-icon-color;
    background-color: rgba(0, 0, 0, 0.6);
    transform: translateY(-50%);
    cursor: pointer;
  }

  &-previous {
    left: 60px;
  }

  &-next {
    right: 60px;
  }

  &-topbar {
    position: absolute;
    top: 0;
    width: 100%;
    height: 40px;
    color: @image-icon-color;
    line-height: 40px;
    background-color: rgba(0, 0, 0, 0.9);
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.15);

    &-info {
      position: absolute;
      left: 40px;

      &-size {
        padding-left: 12px;
        opacity: 0.65;
      }
    }

    &-action {
      position: absolute;
      right: 40px;

      > * {
        display: inline-block;
        margin-left: 20px;
        cursor: pointer;

        i {
          margin-right: 2px;
          font-size: 18px;
        }
      }
    }
  }
}
.@{image-prefix-cls}-rtl {
  direction: rtl;
  .@{image-preview-prefix-cls}-close {
    left: 18px;
    right: auto;
  }
  .@{image-preview-prefix-cls}-action {
    i {
      &:not(:first-child) {
        margin-right: 20px;
        margin-left: 0;
      }
    }
  }
}
/*! rtl:end:ignore */



@image-prefix: '--@{kd-prefix}-c-image';

// color
@image-icon-color: var(~'@{image-prefix}-icon-color', @color-white); //图片预览 图标颜色
@image-close-color-background: var(~'@{image-prefix}-close-color-background', #666666); //删除图标 背景色
@image-action-background-color: var(~'@{image-prefix}-action-color-background', rgba(0, 0, 0, 0.5));
// font
@image-icon-font-size: var(~'@{image-prefix}-icon-font-size', 26px); //图片预览 图标大小
@image-preview-close-font-size: var(~'@{image-prefix}-preview-font-size', 28px);
@image-font-size-x-large: var(~'@{image-prefix}-font-size-x-large', @font-size-x-large);
// radius
@image-border-radius: var(~'@{image-prefix}-radius-border', @radius-border);
// sizing
@image-action-width: var(~'@{image-prefix}-action-sizing-width', 100%);
@image-preview-close-width: var(~'@{image-prefix}-preview-sizing-width', 18px);
@image-preview-close-height: var(~'@{image-prefix}-preview-sizing-height', 18px);
@image-action-height: var(~'@{image-prefix}-action-sizing-height', 28px);




@image-cropper-prefix-cls: ~'@{kd-prefix}-image-cropper';

.@{image-cropper-prefix-cls}-container {
  width: 100%;
  height: 100%;
}

.@{image-cropper-prefix-cls}-modal-body-container {
  padding: 28px !important;
  padding-bottom: 24px !important;
}

.@{image-cropper-prefix-cls}-bar-container {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 44px;
  background: @bg2;
  border-radius: 4px;

  .@{image-cropper-prefix-cls}-btn-container {
    padding-left: 28px;
    font-size: 24px;
    display: flex;
    align-items: center;

    &.default {
      border-right: 1px solid #ccc;
    }

    & > i,
    & > .@{kd-prefix}-upload {
      margin-right: 20px;
      cursor: pointer;
    }

    .@{kd-prefix}-upload {
      display: flex;

      &-handle {
        display: flex;
      }
    }
  }

  .ok-btn {
    height: 100%;
  }

  &-slider {
    display: flex;
    align-items: center;
    margin-left: 20px;
    margin-right: 20px;
  }
}

/*!
* 禁止更新
* Cropper.js v1.5.7
* https://fengyuanchen.github.io/cropperjs
 *
 * Copyright 2015-present Chen Fengyuan
 * Released under the MIT license
 *
 * Date: 2020-05-23T05:22:57.283Z
 */

.cropper-container {
  direction: ltr;
  font-size: 0;
  height: 100%;
  line-height: 0;
  position: relative;
  -ms-touch-action: none;
  touch-action: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.cropper-container img {
  display: block;
  height: 100%;
  image-orientation: 0deg;
  max-height: none !important;
  max-width: none !important;
  min-height: 0 !important;
  min-width: 0 !important;
  width: 100%;
}

.cropper-wrap-box,
.cropper-canvas,
.cropper-drag-box,
.cropper-crop-box,
.cropper-modal {
  bottom: 0;
  left: 0;
  position: absolute;
  right: 0;
  top: 0;
}

.cropper-wrap-box,
.cropper-canvas {
  overflow: hidden;
}

.cropper-drag-box {
  background-color: #fff;
  opacity: 0;
}

.cropper-modal {
  background-color: #000;
  opacity: 0.5;
}

.cropper-view-box {
  display: block;
  height: 100%;
  outline: 1px solid #39f;
  outline-color: rgba(51, 153, 255, 0.75);
  overflow: hidden;
  width: 100%;
}

.cropper-dashed {
  border: 0 dashed #eee;
  display: block;
  opacity: 0.5;
  position: absolute;
}

.cropper-dashed.dashed-h {
  border-bottom-width: 1px;
  border-top-width: 1px;
  height: calc(100% / 3);
  left: 0;
  top: calc(100% / 3);
  width: 100%;
}

.cropper-dashed.dashed-v {
  border-left-width: 1px;
  border-right-width: 1px;
  height: 100%;
  left: calc(100% / 3);
  top: 0;
  width: calc(100% / 3);
}

.cropper-center {
  display: block;
  height: 0;
  left: 50%;
  opacity: 0.75;
  position: absolute;
  top: 50%;
  width: 0;
}

.cropper-center::before,
.cropper-center::after {
  background-color: #eee;
  content: ' ';
  display: block;
  position: absolute;
}

.cropper-center::before {
  height: 1px;
  left: -3px;
  top: 0;
  width: 7px;
}

.cropper-center::after {
  height: 7px;
  left: 0;
  top: -3px;
  width: 1px;
}

.cropper-face,
.cropper-line,
.cropper-point {
  display: block;
  height: 100%;
  opacity: 0.1;
  position: absolute;
  width: 100%;
}

.cropper-face {
  background-color: #fff;
  left: 0;
  top: 0;
}

.cropper-line {
  background-color: @theme-color;
}

.cropper-line.line-e {
  cursor: ew-resize;
  right: -3px;
  top: 0;
  width: 5px;
}

.cropper-line.line-n {
  cursor: ns-resize;
  height: 5px;
  left: 0;
  top: -3px;
}

.cropper-line.line-w {
  cursor: ew-resize;
  left: -3px;
  top: 0;
  width: 5px;
}

.cropper-line.line-s {
  bottom: -3px;
  cursor: ns-resize;
  height: 5px;
  left: 0;
}

.cropper-point {
  background-color: #fff;
  border: 1px solid #5582f3;
  height: 5px;
  opacity: 0.75;
  width: 5px;

  &:hover {
    background-color: #5582f3;
  }
}

.cropper-point.point-e {
  cursor: ew-resize;
  margin-top: -3px;
  right: -3px;
  top: 50%;
}

.cropper-point.point-n {
  cursor: ns-resize;
  left: 50%;
  margin-left: -3px;
  top: -3px;
}

.cropper-point.point-w {
  cursor: ew-resize;
  left: -3px;
  margin-top: -3px;
  top: 50%;
}

.cropper-point.point-s {
  bottom: -3px;
  cursor: s-resize;
  left: 50%;
  margin-left: -3px;
}

.cropper-point.point-ne {
  cursor: nesw-resize;
  right: -3px;
  top: -3px;
}

.cropper-point.point-nw {
  cursor: nwse-resize;
  left: -3px;
  top: -3px;
}

.cropper-point.point-sw {
  bottom: -3px;
  cursor: nesw-resize;
  left: -3px;
}

.cropper-point.point-se {
  bottom: -3px;
  cursor: nwse-resize;
  right: -3px;
}

.cropper-invisible {
  opacity: 0;
}

.cropper-bg {
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQAQMAAAAlPW0iAAAAA3NCSVQICAjb4U/gAAAABlBMVEXMzMz////TjRV2AAAACXBIWXMAAArrAAAK6wGCiw1aAAAAHHRFWHRTb2Z0d2FyZQBBZG9iZSBGaXJld29ya3MgQ1M26LyyjAAAABFJREFUCJlj+M/AgBVhF/0PAH6/D/HkDxOGAAAAAElFTkSuQmCC');
}

.cropper-hide {
  display: block;
  height: 0;
  position: absolute;
  width: 0;
}

.cropper-hidden {
  display: none !important;
}

.cropper-move {
  cursor: move;
}

.cropper-crop {
  cursor: crosshair;
}

.cropper-disabled .cropper-drag-box,
.cropper-disabled .cropper-face,
.cropper-disabled .cropper-line,
.cropper-disabled .cropper-point {
  cursor: not-allowed;
}

/*! rtl:begin:ignore */



@input-prefix-cls: ~'@{kd-prefix}-input';
@wrapper-prefix-cls: ~'@{input-prefix-cls}-wrapper';

textarea {
  margin: 0;
  padding: 0;
  color: inherit;
  font-size: inherit;
  font-family: inherit;
  line-height: inherit;
  -webkit-appearance: none;
  overflow: auto;
  resize: vertical;
}

.@{input-prefix-cls} {
  .input(@input-prefix-cls);

  transition: border-color @transition-duration-inner;

  &-countWrapper {
    position: relative;
    display: inline-block;
    width: 100%;
  }

  &-textarea {
    .input(@input-prefix-cls);
    transition: border-color @transition-duration-inner;
    max-width: 100%;
    height: auto;
    vertical-align: bottom;

    &-mark {
      position: absolute;
      right: 0;
      top: ~'calc(100% + 1px)';
      z-index: 1;
      color: @input-placeholder-color-inner;
      font-size: @input-small-font-size-inner;
      line-height: 18px;
      background-color: #fff;

      &-inner {
        top: auto;
        bottom: 5px;
        right: 8px;
      }

      &-error {
        color: @input-error-color;
      }
    }
  }

  &-no-resize {
    resize: none;
  }

  &-borderless {
    border: 0;

    &:focus {
      border: 0;
    }
  }

  &-underline {
    border: none;
    border-bottom: 1px solid @input-color-border;
    border-radius: 0;
    padding-left: 0 !important;
  }

  &-disabled {
    background-color: @input-background-color-disabled-inner;
    border-color: @input-border-color-disabled-inner;
    color: @color-text-primary;
    cursor: not-allowed;
  }

  &-underline&-disabled {
    color: @input-color-disabled-inner;
    background-color: @input-background-color-inner;
    border-color: @input-underline-border-color-disabled-inner;
  }

  &-size-small {
    .input-size(@input-small-height-inner, @input-small-font-size-inner, @input-small-padding-vertical-inner, @input-small-padding-horizontal-inner);
  }

  &-size-middle {
    .input-size(@input-middle-height-inner, @input-middle-font-size-inner, @input-small-padding-vertical-inner, @input-small-padding-horizontal-inner);
  }

  &-size-large {
    .input-size(@input-large-height-inner, @input-large-font-size-inner, @input-small-padding-vertical-inner, @input-small-padding-horizontal-inner);
  }

  &-wrapper {
    padding-left: @input-wrapper-padding-left;
    .input(@wrapper-prefix-cls);
    transition: border-color @transition-duration-inner;
    display: inline-flex;
    position: relative;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    overflow: hidden;

    .@{input-prefix-cls} {
      border: none;
      padding-left: @input-padding-left;
      padding-right: 0;
      height: 100%;

      &-suffix,
      &-prefix {
        display: flex;
        flex: 0;
        align-items: center;
        justify-content: center;
        word-break: keep-all;
        color: @input-affix-color;
      }
    }

    &-size-small {
      .input-size(@input-small-height-inner, @input-small-font-size-inner, @input-small-padding-vertical-inner, @input-small-padding-horizontal-inner);
    }

    &-size-middle {
      .input-size(@input-middle-height-inner, @input-middle-font-size-inner, @input-small-padding-vertical-inner, @input-middle-padding-horizontal-inner);
    }

    &-size-large {
      .input-size(@input-large-height-inner, @input-large-font-size-inner, @input-small-padding-vertical-inner, @input-large-padding-horizontal-inner);
    }

    &-borderless {
      .border-less;
    }

    &-underline {
      .underline;
    }

    &-focused:not(.@{input-prefix-cls}-error) {
      border-color: @input-border-color-focused;
    }

    &-disabled {
      border-color: @input-border-color-disabled-inner;
      cursor: not-allowed;

      &:not(.@{input-prefix-cls}-wrapper-underline) {
        background-color: @input-background-color-disabled-inner;
      }

      .@{input-prefix-cls}-suffix,
      .@{input-prefix-cls}-prefix {
        color: @input-color-disabled-inner;
      }
    }
  }

  &-wrapper-textarea {
    .input(@input-prefix-cls);
    border: none !important;
    padding: 0 !important;
    position: relative;
    display: inline-block;

    .@{input-prefix-cls} {
      &-textarea-clear-icon {
        position: absolute;
        z-index: 2;
        right: 8px;
        top: 3px;
      }
    }
  }

  &-clear-icon,
  &-textarea-clear-icon {
    .input-clear-icon;
  }

  &-clear-icon-hidden {
    visibility: hidden;
    display: none;
  }

  &-clear-icon-rightSpace {
    margin-right: 4px;
  }

  &-group-wrapper {
    display: inline-block;
    width: 100%;
    text-align: start;
    vertical-align: top;

    .@{input-prefix-cls} {
      &-group {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
        color: rgba(0, 0, 0, 0.85);
        font-size: 14px;
        font-variant: tabular-nums;
        list-style: none;
        font-feature-settings: 'tnum';
        position: relative;
        display: flex;
        width: 100%;
        border-collapse: separate;
        border-spacing: 0;

        & > .@{input-prefix-cls}-wrapper {
          &:not(:first-child):not(:last-child) {
            border-radius: 0;
          }

          &:first-child:not(:last-child) {
            border-top-right-radius: 0;
            border-bottom-right-radius: 0;
          }

          &:not(:first-child):last-child {
            border-top-left-radius: 0;
            border-bottom-left-radius: 0;
          }
        }

        .@{input-prefix-cls}-group-addon {
          position: relative;
          color: @input-affix-color;
          padding: 0 9px;
          font-weight: 400;
          font-size: 14px;
          text-align: center;
          border: 1px solid @input-border-color-disabled-inner;
          border-radius: @input-border-radius-inner;
          white-space: nowrap;
          box-sizing: border-box;
          display: flex;
          align-items: center;
          height: @input-middle-height-inner;

          &:first-child {
            border-top-right-radius: 0;
            border-bottom-right-radius: 0;
            border-right: none;
          }

          &:last-child {
            border-top-left-radius: 0;
            border-bottom-left-radius: 0;
            border-left: none;
          }

          &-borderless {
            .border-less;
          }

          &-underline {
            .underline;
          }

          &-disabled {
            background-color: @input-background-color-disabled-inner;
            border-color: @input-border-color-disabled-inner;
            color: @input-color-disabled-inner;
            cursor: not-allowed;
          }
        }
      }

      &-group-size-small {
        .@{input-prefix-cls}-group-addon {
          height: @input-small-height-inner;
        }
      }

      &-group-middle-small {
        .@{input-prefix-cls}-group-addon {
          height: @input-middle-height-inner;
        }
      }

      &-group-large-small {
        .@{input-prefix-cls}-group-addon {
          height: @input-large-height-inner;
        }
      }
    }
  }

  &-allowClear-spacing {
    padding-right: 20px;
  }

  &-input-mark-inner {
    color: @input-placeholder-color-inner;
  }

  &-error:not(.@{input-prefix-cls}-disabled):not(.@{input-prefix-cls}-wrapper-disabled):not(
      .@{input-prefix-cls}-group-addon-disabled
    ) {
    border-color: @input-error-color;
  }
}
.@{input-prefix-cls}-rtl {
  direction: rtl;
  &.@{input-prefix-cls}-group {
    .@{input-prefix-cls}-group-addon {
      &:first-child {
        border-top-left-radius: 0;
        border-bottom-left-radius: 0;
        border-top-right-radius: @input-border-radius-inner;
        border-bottom-right-radius: @input-border-radius-inner;
        border-left: none;
        border-right: 1px solid @input-border-color-disabled-inner;
      }
      &:last-child {
        border-top-right-radius: 0;
        border-bottom-right-radius: 0;
        border-top-left-radius: @input-border-radius-inner;
        border-bottom-left-radius: @input-border-radius-inner;
        border-right: none;
        border-left: 1px solid @input-border-color-disabled-inner;
      }
    }
  }
  &.@{input-prefix-cls}-wrapper {
    .@{input-prefix-cls}-prefix {
      margin-right: 0;
      margin-left: calc(@input-small-padding-vertical-inner * 2);
    }
    .@{input-prefix-cls}-suffix {
      margin-left: 0;
      margin-right: calc(@input-small-padding-vertical-inner * 2);
    }
    .@{input-prefix-cls}-clear-icon-rightSpace {
      margin-left: 4px;
      margin-right: 0;
    }
  }
  .@{input-prefix-cls}-textarea-mark {
    right: auto;
    left: 2px;
    &-inner {
      top: auto;
      left: 8px;
      right: auto;
    }
  }
  .@{input-prefix-cls}-textarea-clear-icon {
    left: 8px;
    right: auto;
  }
  &.@{input-prefix-cls}-allowClear-spacing {
    padding-right: @input-small-padding-horizontal-inner;
    padding-left: 20px;
  }
}
/*! rtl:end:ignore */


@input-prefix-cls: ~'@{kd-prefix}-input';

.input(@prefix) {
  @disabled-prefix-cls: ~'@{prefix}-disabled';
  @error-prefix-cls: ~'@{input-prefix-cls}-error';
  width: 100%;
  min-width: 0;
  border: @input-border-width-inner solid @input-border-color-disabled-inner;
  border-radius: @input-border-radius-inner;
  color: @input-font-color-inner;
  box-sizing: border-box;
  background-color: @input-background-color-inner;
  display: inline-block;
  font-variant: tabular-nums;
  list-style: none;
  background-image: none;
  font-feature-settings: 'tnum';

  &::-webkit-input-placeholder {
    color: @input-placeholder-color-inner !important;
  }
  &::-moz-input-placeholder {
    color: @input-placeholder-color-inner !important;
  }
  &::-ms-input-placeholder {
    color: @input-placeholder-color-inner !important;
  }
  &:focus {
    box-shadow: none;
    outline: none;
  }
  &:not(.@{disabled-prefix-cls}):not(.@{error-prefix-cls}):hover {
    border-color: @input-border-color-focused;
  }
  &:not(.@{disabled-prefix-cls}):not(.@{error-prefix-cls}):focus {
    color: @input-focus-color;
    border-color: @input-border-color-focused;
  }
}

.input-size(@height, @fonSize, @padding-vertical, @padding-horizontal) {
  height: @height;
  line-height: calc(@height - (@padding-vertical * 2) - (@input-border-width * 2));
  font-size: @fonSize;
  padding: @padding-vertical @padding-horizontal;

  .@{input-prefix-cls}-suffix {
    margin-left: calc(@padding-vertical * 2);
  }

  .@{input-prefix-cls}-prefix {
    margin-right: calc(@padding-vertical * 2);
  }

  &.@{input-prefix-cls}-underline {
    padding-right: 0;
    padding-left: 0;
  }

  &.@{input-prefix-cls}-wrapper-underline {
    padding-right: 0;
    padding-left: 0;
  }
}

.input-clear-icon() {
  cursor: pointer;
  color: @input-clear-color;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  &:hover {
    color: @input-clear-color-hover;
  }

  i {
    vertical-align: middle;
    font-size: 16px;
  }
}

.border-less() {
  border: none !important;
}

.underline() {
  border: none;
  border-bottom: 1px solid @input-color-border;
  border-radius: 0 !important;
  padding-left: 0;
}



@input-prefix: '--@{kd-prefix}-c-input';

// color
@input-font-color-inner: var(~'@{input-prefix}-color-text', @color-text-primary);
@input-placeholder-color-inner: var(~'@{input-prefix}-placeholder-color-text', @color-text-placeholder);
@input-color-border: var(~'@{input-prefix}-color-border', #999);
@input-clear-color: var(~'@{input-prefix}-clear-color', #d9d9d9);
@input-clear-color-hover: var(~'@{input-prefix}-clear-color-hover', #999);
@input-background-color-inner: var(~'@{input-prefix}-color-background', @color-white);
@input-background-color-disabled-inner: var(~'@{input-prefix}-color-background-disabled', @color-background-contain-disabled);
@input-border-color-focused: var(~'@{input-prefix}-color-border-focused', @color-theme);
@input-border-color-disabled-inner: var(~'@{input-prefix}-color-border-disabled', @color-border-strong);
@input-underline-border-color-disabled-inner: var(~'@{input-prefix}-underline-color-border-disabled', @color-border-weak);
@input-color-disabled-inner: var(~'@{input-prefix}-color-disabled', @color-disabled);
@input-affix-color: var(~'@{input-prefix}-affix-color-text', #999);
@input-error-color: var(~'@{input-prefix}-color-error', @color-error);

// font
@input-small-font-size-inner: var(~'@{input-prefix}-font-size-small', @font-size-small);
@input-middle-font-size-inner: var(~'@{input-prefix}-font-size-middle', @font-size-middle);
@input-large-font-size-inner: var(~'@{input-prefix}-font-size-large', @font-size-large);

// motion
@transition-duration-inner: var(~'@{input-prefix}-motion-duration', @duration-promptly);

// radius
@input-border-radius-inner: var(~'@{input-prefix}-radius-border', @radius-border);

// sizing
@input-small-height-inner: var(~'@{input-prefix}-sizing-height-small', 20px);
@input-middle-height-inner: var(~'@{input-prefix}-sizing-height-middle', 30px);
@input-large-height-inner: var(~'@{input-prefix}-sizing-height-large', 36px);
@input-border-width-inner: var(~'@{input-prefix}-sizing-border', 1px);
@input-wrapper-padding-left: var(~'@{input-prefix}-wrapper-padding-left', 0px);
@input-padding-left: var(~'@{input-prefix}-padding-left', 0px);

// spacing
@input-small-padding-vertical-inner: var(~'@{input-prefix}-spacing-padding-vertical-small', 3px);
@input-small-padding-horizontal-inner: var(~'@{input-prefix}-spacing-padding-horizontal-small', 9px);
@input-middle-padding-vertical-inner: var(~'@{input-prefix}-spacing-padding-vertical-middle', 5px);
@input-middle-padding-horizontal-inner: var(~'@{input-prefix}-spacing-padding-horizontal-middle', 9px);
@input-large-padding-vertical-inner: var(~'@{input-prefix}-spacing-padding-vertical-large', 8px);
@input-large-padding-horizontal-inner: var(~'@{input-prefix}-spacing-padding-horizontal-large', 9px);



@inputNumber-prefix-cls: ~'@{kd-prefix}-inputNumber';
.@{inputNumber-prefix-cls} {
  &-baseStep {
	  display: flex;
	  justify-content: center;
    align-items: center;
		box-sizing: border-box;
		height: 100%;
		cursor: pointer;
		&-small {
			.base-step-size(@input-number-small-height);
		}
		&-middle {
			.base-step-size(@input-number-middle-height);
		}
		&-large {
			.base-step-size(@input-number-large-height);
		}
		.@{inputNumber-prefix-cls}-icon {
			color: @input-number-color-text-baseStep;
			transition: color @duration-promptly;
		}
		&:hover .@{inputNumber-prefix-cls}-icon {
			color:@input-number-color-theme-5;
		}
	}
	&-baseStep-decrease {
		.step-style(right, left);
	}
	&-baseStep-increase {
		.step-style(left, right);
	}
	&-embedStep {
		display: flex;
		flex-direction: column;
		justify-content: center;
		height: 100%;
		border-radius: 0 1px 1px 0;
		background-color: @input-number-color-text;
		overflow: hidden;
		.step-style(left, right);
		border: none;
		span {
			height: 50%;
			display: flex;
			align-items: center;
			justify-content: center;
			border-left: 1px solid @input-number-color-border-strong;
			border-bottom: 1px solid @input-number-color-border-strong;
			cursor: pointer;
			font-size: 12px;
			.@{inputNumber-prefix-cls}-icon {
				transition: color @duration-promptly;
				line-height: 1;
			}
			&:hover .@{inputNumber-prefix-cls}-icon {
				color:@input-number-color-theme-5;
			}
			&:last-child {
				border-bottom: none;
			}
		}
	}
}



.base-step-size(@width) {
	width: @width;
}
.step-style(@borderDirection, @marginDirection) {
	border-@{borderDirection}: 1px solid @input-number-color-border-strong;
	&.@{inputNumber-prefix-cls}-baseStep-small, &.@{inputNumber-prefix-cls}-embedStep-small {
		margin-@{marginDirection}: -@input-small-padding-horizontal;
	}
	&.@{inputNumber-prefix-cls}-baseStep-middle, &.@{inputNumber-prefix-cls}-embedStep-middle {
		margin-@{marginDirection}: -@input-middle-padding-horizontal;
	}
	&.@{inputNumber-prefix-cls}-baseStep-large, &.@{inputNumber-prefix-cls}-embedStep-large {
		margin-@{marginDirection}: -@input-large-padding-horizontal;
	}
}




@input-number-prefix: '--@{kd-prefix}-c-input-number';

// color
@input-number-color-border-strong: var(~'@{input-number-prefix}-color-border-strong', @color-border-strong);
@input-number-color-theme-5: var(~'@{input-number-prefix}-color-theme-5', @color-theme-5);
@input-number-color-text: var(~'@{input-number-prefix}-color-text', #f6f7f9);
@input-number-color-text-baseStep: var(~'@{input-number-prefix}-color-text-baseStep',@color-text-secondary);
@input-number-color-text-baseStep-hover: var(~'@{input-number-prefix}-color-text-baseStep-hover',@color-text-secondary);

// sizing
@input-number-small-height: var(~'@{input-number-prefix}-sizing-height-small', 20px);
@input-number-middle-height: var(~'@{input-number-prefix}-sizing-height-middle', 30px);
@input-number-large-height: var(~'@{input-number-prefix}-sizing-height-large', 36px);









@layout-prefix-cls: ~'@{kd-prefix}-layout';

.@{layout-prefix-cls} {
  position: relative;
  display: flex;
  flex: auto;
  flex-direction: column;
  min-height: 0;
  background: @layout-body-background;

  &,
  * {
    box-sizing: border-box;
  }

  &-has-sider {
    flex-direction: row;

    > .@{layout-prefix-cls},
    > .@{layout-prefix-cls}-content {
      width: 0; 
    }
  }

  &-header,
  &-footer {
    flex: 0 0 auto;
  }

  &-header {
    height: @layout-header-height;
    padding: @layout-header-padding;
    color: @layout-header-color;
    line-height: @layout-header-height;
    background: @layout-header-background;
  }

  &-footer {
    padding: @layout-footer-padding;
    color: @color-text-primary;
    font-size: @font-size-middle;
    background: @layout-footer-background;
  }

  &-content {
    flex: auto;
    min-height: 0;
  }

  &-sider {
    position: relative;
    min-width: 0;
    background: @layout-sider-background;
    transition: all 0.2s;

    &-children {
      height: 100%;
      margin-top: -0.1px;
      padding-top: 0.1px;
    }

    &-has-trigger {
      padding-bottom: @layout-trigger-height;
    }

    &-right {
      order: 1;
    }

    &-trigger {
      position: absolute;
      bottom: 0;
      z-index: 1;
      padding: 0 16px;
      color: @layout-trigger-color;
      height: @layout-trigger-height;
      line-height: calc(@layout-trigger-height - 4px);
      font-size: 20px;
      background: @layout-trigger-background;
      cursor: pointer;
      transition: all 0.2s;
      border-top: 1px solid rgba(218,222,237,.1);
    }

    &-zero-width {
      > * {
        overflow: hidden;
      }

      &-trigger {
        position: absolute;
        top: @layout-header-height;
        right: calc(-1 * @layout-zero-trigger-width);
        z-index: 1;
        width: @layout-zero-trigger-width;
        height: @layout-zero-trigger-height;
        color: @layout-trigger-color;
        font-size: calc(@layout-zero-trigger-width / 2);
        line-height: @layout-zero-trigger-height;
        text-align: center;
        background: @layout-sider-background;
        border-radius: 0 @radius-border @radius-border 0;
        cursor: pointer;
        transition: background 0.3s ease;

        &::after {
          position: absolute;
          top: 0;
          right: 0;
          bottom: 0;
          left: 0;
          background: transparent;
          transition: all 0.3s;
          content: '';
        }

        &:hover::after {
          background: rgba(255, 255, 255, 0.1);
        }

        &-right {
          left: calc(-1 * @layout-zero-trigger-width);
          border-radius: @radius-border 0 0 @radius-border;
        }
      }
    }
  }
}


.@{layout-prefix-cls}-sider-light {
  background: @layout-sider-background-light;
  .@{layout-prefix-cls}-sider-trigger {
    color: @layout-trigger-color-light;
    background: @layout-trigger-background-light;
  }
  .@{layout-prefix-cls}-sider-zero-width-trigger {
    color: @layout-trigger-color-light;
    background: @layout-trigger-background-light;
  }
}


@layout-custom-prefix: ~'--@{kd-prefix}-c-layout';

// color
@layout-body-background: var(~'@{layout-custom-prefix}-body-color-background', @color-background-2);

@layout-header-background: var(~'@{layout-custom-prefix}-header-color-background', @color-background);
@layout-header-color: var(~'@{layout-custom-prefix}-header-color-text', @color-text-primary);

@layout-footer-background: var(~'@{layout-custom-prefix}-footer-color-background', @color-background-2);

@layout-sider-background: var(~'@{layout-custom-prefix}-sider-color-background', #343848);

@layout-trigger-background: var(~'@{layout-custom-prefix}-trigger-color-background', #343848);
@layout-trigger-color: var(~'@{layout-custom-prefix}-trigger-color-text', @color-white);

@layout-sider-background-light: var(~'@{layout-custom-prefix}-sider-color-background-light', @color-background);
@layout-trigger-background-light: var(~'@{layout-custom-prefix}-trigger-color-background-light', @color-background);
@layout-trigger-color-light: var(~'@{layout-custom-prefix}-trigger-color-text-light', @color-text-primary);

// sizing
@layout-header-height: var(~'@{layout-custom-prefix}-header-sizing-height', 52px);
@layout-trigger-height: var(~'@{layout-custom-prefix}-trigger-sizing-height', 50px);
@layout-zero-trigger-width: var(~'@{layout-custom-prefix}-trigger-sizing-width', 36px);
@layout-zero-trigger-height: var(~'@{layout-custom-prefix}-trigger-sizing-height', 42px);

// spacing
@layout-header-padding: var(~'@{layout-custom-prefix}-header-spacing-padding', 0 20px 0 35px);
@layout-footer-padding: var(~'@{layout-custom-prefix}-footer-spacing-padding', 24px 50px);

/*! rtl:begin:ignore */



@wrapper-prefix-cls: ~'@{kd-prefix}-link-wrapper';
@link-prefix-cls: ~'@{kd-prefix}-link';

.@{link-prefix-cls} {
  cursor: pointer;
  display: inline-block;
  color: @link-color-text;

  .@{link-prefix-cls}-text {
    height: auto;
    width: auto;
    padding: 0;
    min-width: auto;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    color: inherit;
    font-weight: @link-g-font-weight;
    &:not(.@{link-prefix-cls}-disabled):hover {
      color: @link-color-text-hover;
    }
    &:not(.@{link-prefix-cls}-disabled):active {
      color: @link-color-text-active;
    }
  }

  // 小号尺寸链接
  &-size-small {
    .link-size(@link-small-font-size, @link-small-height);
  }
  // 中号尺寸链接
  &-size-middle {
    .link-size(@link-middle-font-size, @link-middle-height);
  }
  // 大号尺寸链接
  &-size-large {
    .link-size(@link-large-font-size, @link-large-height);
  }

  &-underscore {
    border-bottom: 1px solid;
  }

  &-disabled {
    color: @link-color-text-disabled !important;
    cursor: not-allowed;
  }

  &-prefix {
    display: inline-block;
    margin-right: @link-prefix-horizontal;
  }

  &-suffix {
    display: inline-block;
    margin-left: @link-suffix-horizontal;
  }
}
.@{link-prefix-cls}-rtl {
  direction: rtl;
  .@{link-prefix-cls} {
    &-prefix {
      margin-right: 0;
      margin-left: @link-prefix-horizontal;
    }
    &-suffix {
      margin-left: 0;
      margin-right: @link-suffix-horizontal;
    }
  }
} 
/*! rtl:end:ignore */


.link-size(@font-size, @height,) {
  height: @height;
  line-height: @height;
  font-size: @font-size;
}



@link-custom-prefix: ~'--@{kd-prefix}-c-link';

// color
@link-color-text: var(~'@{link-custom-prefix}-color-text', @color-text-link);
@link-color-text-hover: var(~'@{link-custom-prefix}-color-text-link-hover', #87A9FF);
@link-color-text-active: var(~'@{link-custom-prefix}-color-text-link-active', #3761CA);
@link-color-text-disabled: var(~'@{link-custom-prefix}-color-text-link-disabled', #9EBFEF);

// font
@link-g-font-weight: var(~'@{link-custom-prefix}-font-weight', @font-weight-light);
@link-small-font-size: var(~'@{link-custom-prefix}-font-size-small', @font-size-small); // 小号 文字大小
@link-middle-font-size: var(~'@{link-custom-prefix}-font-size-middle', @font-size-middle); // 中号 文字大小
@link-large-font-size: var(~'@{link-custom-prefix}-font-size-large', @font-size-large); // 大号 文字大小

// sizing
@link-small-height: var(~'@{link-custom-prefix}-sizing-height-small', 18px); // 小号 高度
@link-middle-height: var(~'@{link-custom-prefix}-sizing-height-middle', 21px); // 中号 高度
@link-large-height: var(~'@{link-custom-prefix}-sizing-height-large', 24px); // 大号 高度

// spacing
@link-prefix-horizontal: var(~'@{link-custom-prefix}-prefix-horizontal', 4px); // 前缀图标间隔
@link-suffix-horizontal: var(~'@{link-custom-prefix}-suffix-horizontal', 4px); // 后缀图标间隔
/*! rtl:begin:ignore */




@menu-prefix-cls: ~'@{kd-prefix}-menu';
@menuitem-prefix-cls: ~'@{menu-prefix-cls}-item';
@menu-dark-prefix-cls: ~'@{menu-prefix-cls}-dark';
@menu-light-prefix-cls: ~'@{menu-prefix-cls}-light';
@menu-vertical-prefix-cls: ~'@{menu-prefix-cls}-vertical';
@menu-inline-prefix-cls: ~'@{menu-prefix-cls}-inline';
@menu-popper-prefix-cls: ~'@{menu-prefix-cls}-popper';
@submenu-prefix-cls: ~'@{menu-prefix-cls}-submenu';

.@{menu-prefix-cls} {
  .menu;

  &-inline {
    .@{menuitem-prefix-cls} {
      .ellipsis();
    }

    .@{submenu-prefix-cls} {
      padding-right: 0;
    }
  }

  &-collapsed {
    width: 50px;
    min-width: auto;
  }
}

.@{menuitem-prefix-cls} {
  .menuItem(relative);

  transition: color, background-color;
  transition-duration: calc(@menu-motion-duration - 0.1s);
  transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
}

.@{submenu-prefix-cls} {
  .menuItem();

  transition: color, background-color;
  transition-duration: calc(@menu-motion-duration - 0.1s);
  transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);

  &-sub {
    line-height: @menu-item-height;
  }

  &-thrid {
    display: flex;
    max-width: 810px;
    max-height: 492px;
    padding-left: 24px;
    background: @menu-sub-color-background;
    flex-wrap: wrap;
    overflow-y: auto;
    cursor: default;
    z-index: @menu-z-index;

    &-item {
      margin-right: 40px;
    }

    &-title {
      line-height: 50px;
      font-size: 12px;
      color: #ffffff;
      display: flex;
      flex-grow: 0;
      flex-shrink: 0;
      align-items: center;
      border-bottom: 1px solid rgba(255, 255, 255, 0.3);
      .ellipsis();

      & > span {
        .ellipsis();
      }
    }

    &-list {
      list-style-type: none;
      padding: 0;
      display: flex;
      flex-direction: column;
      flex-wrap: wrap;
      margin-bottom: 20px;
      margin-top: 10px;
      height: 180px;

      & > li {
        width: 160px;
        margin: 8px 0;
        font-size: 12px;
        line-height: 18px;
        color: rgba(255, 255, 255, 0.65);
        display: flex;
        align-items: center;
        justify-content: space-between;
        cursor: pointer;
        .ellipsis();

        &:hover {
          color: @menu-sub-color-active;
        }

        & > span {
          .ellipsis();
        }

        .@{menuitem-prefix-cls}-title {
          height: auto;
        }
      }

      & > .@{menuitem-prefix-cls}-active {
        color: @menu-sub-color-active;
      }
    }
  }
}

// dark
.@{menu-dark-prefix-cls} {
  .@{submenu-prefix-cls}-sub {
    color: @menu-sub-color;
    background: @menu-sub-inline-color-background;
  }

  .@{submenu-prefix-cls}-sub-second,
  .@{submenu-prefix-cls}-sub-third {
    background: @menu-sub-color-background;
  }

  .@{menuitem-prefix-cls} {
    &:not(.@{menuitem-prefix-cls}-disabled):not(.@{menuitem-prefix-cls}-active):hover {
      .menu-dark-hover();
    }

    &-active {
      .menu-dark-active();
    }
  }

  .@{menuitem-prefix-cls}-active,
  .@{submenu-prefix-cls}-active {
    .menu-dark-active();
  }

  .@{menuitem-prefix-cls}-hover,
  .@{submenu-prefix-cls}-hover {
    .menu-dark-hover();
  }
}

.@{menu-inline-prefix-cls}.@{menu-dark-prefix-cls} {
  .@{menuitem-prefix-cls}-active,
  .@{submenu-prefix-cls}-active {
    .@{submenu-prefix-cls}-title {
      .menu-dark-active-inline-title();
    }
  }

  .@{submenu-prefix-cls}:not(.@{submenu-prefix-cls}-disabled):not(.@{submenu-prefix-cls}-active) {
    > .@{submenu-prefix-cls}-title:hover {
      .menu-dark-active-inline-title();
    }
  }
}

// light
.@{menu-light-prefix-cls} {
  .menu-light-base();
}

.@{menu-inline-prefix-cls}.@{menu-light-prefix-cls} {
  .@{menuitem-prefix-cls}-active,
  .@{submenu-prefix-cls}-active {
    .@{submenu-prefix-cls}-title {
      .menu-light-active-inline-title();
    }
  }
}

.@{menu-popper-prefix-cls} {
  .@{submenu-prefix-cls}:not(.@{submenu-prefix-cls}-disabled):not(.@{submenu-prefix-cls}-active):hover,
  .@{submenu-prefix-cls}-hover {
    .menu-dark-hover();
  }

  &.hidden {
    .menu-hidden();
  }

  .@{submenu-prefix-cls} {
    padding-right: 0;

    &-sub {
      color: @menu-sub-color;
      background: @menu-sub-inline-color-background;
      box-shadow: 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 6px 16px 0 rgba(0, 0, 0, 0.08),
        0 9px 28px 8px rgba(0, 0, 0, 0.05);

      .@{menuitem-prefix-cls} {
        &:not(.@{menuitem-prefix-cls}-disabled):not(.@{menuitem-prefix-cls}-active):hover,
        &-active {
          .menu-dark-hover();
        }
      }

      &-second,
      &-third {
        animation: kdZoomTopLeftIn calc(@menu-motion-duration - 0.1s) cubic-bezier(0, 0.4, 0.4, 1) forwards;
        opacity: 1;
        visibility: visible;
        transition: opacity, visibility;
        transition-duration: calc(@menu-motion-duration - 0.1s);
        transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
      }

      &-hide {
        .menu-hidden();
      }
    }
  }

  &.light {
    .menu-light-base();
  }
}
.@{menu-prefix-cls}-rtl {
  direction: rtl;
  .@{submenu-prefix-cls} {
    direction: rtl;
    .@{submenu-prefix-cls}-title {
      .@{submenu-prefix-cls}-arrow {
        margin-left: 0;
        margin-right: auto;
      }
    }
  }
}
/*! rtl:end:ignore */




@menu-prefix-cls: ~'@{kd-prefix}-menu';
@menuitem-prefix-cls: ~'@{menu-prefix-cls}-item';
@menu-vertical-prefix-cls: ~'@{menu-prefix-cls}-vertical';
@submenu-prefix-cls: ~'@{menu-prefix-cls}-submenu';

// 菜单默认样式
.menu() {
  position: relative;
  width: 100%;
  height: 100%;
  min-width: @menu-min-width;
  max-width: @menu-max-width;
  background-color: @menu-color-background;
  color: @menu-sub-color;
}

.menuItem(@positionStyle: static) {
  position: @positionStyle;
  cursor: pointer;

  &-title {
    display: flex;
    align-items: center;
    height: 50px;
    .ellipsis();

    & > span {
      .ellipsis();
      opacity: 1;
      transition: opacity calc(@menu-motion-duration - 0.1s) cubic-bezier(0, .4, .4, 1);
    }
  }

  &-collapsed {
    padding: 0;
    margin: 0;
    text-align: center;

    .@{menuitem-prefix-cls}-title,
    .@{submenu-prefix-cls}-title {
      // display: block;
      & > p {
        margin: 0 auto;
      }

      & > span {
        opacity: 0;
        transition: opacity calc(@menu-motion-duration - 0.1s) cubic-bezier(0, .4, .4, 1);
      }
    }
  }

  &-icon {
    margin: 0 15px;
    font-size: @menu-icon-font-size;
  }

  &-disabled {
    cursor: not-allowed;
    color: @menu-color-disabled;
    background-color: @menu-color-background;
  }

  &-arrow {
    margin-left: auto;
    font-size: 16px;

    &-up {
      transform: rotate(180deg);
      transition: transform calc(@menu-motion-duration - 0.1s) cubic-bezier(0, .4, .4, 1);
    }

    &-down {
      transform: rotate(0deg);
      transition: transform calc(@menu-motion-duration - 0.1s) cubic-bezier(0.4, 0, 0.6, 1);
    }
  }
}

.menu-hidden {
  display: none;
  opacity: 0;
  visibility: hidden;
  animation: kdZoomTopLeftOut calc(@menu-motion-duration - 0.1s) cubic-bezier(0, .4, .4, 1) forwards;
  animation-delay: 0.1s;
  transition: opacity, visibility;
  transition-duration: calc(@menu-motion-duration - 0.1s);
  transition-timing-function: cubic-bezier(0.4, 0, 0.6, 1);
}

.menu-dark-hover {
  background-color: @menu-sub-color-background;
  color: @menu-sub-color-hover;
}

.menu-dark-active {
  background-color: @menu-sub-color-background;
  color: @menu-sub-color-hover;
}

.menu-dark-active-inline-title {
  color: @menu-sub-color-hover;
  background: @menu-color-background;
  border: none;
}

.menu-light-base {
  .menu-light-default();

  .@{menuitem-prefix-cls}-disabled, .@{submenu-prefix-cls}-disabled {
    background-color: #fff;
  }

  .@{submenu-prefix-cls}-sub {
    color: @menu-light-color;
    background: #fafafa;
  }

  .@{submenu-prefix-cls}:not(.@{submenu-prefix-cls}-disabled):not(.@{submenu-prefix-cls}-active):hover,
  .@{submenu-prefix-cls}-hover {
    .menu-light-hover();
  }

  .@{menuitem-prefix-cls}:not(.@{menuitem-prefix-cls}-disabled):not(.@{menuitem-prefix-cls}-active):hover {
    .menu-light-hover();
  }

  .@{menuitem-prefix-cls}-hover, .@{submenu-prefix-cls}-hover {
    .menu-light-hover();
  }

  .@{menuitem-prefix-cls}-active, .@{submenu-prefix-cls}-active {
    .menu-light-active();
  }
}

.menu-light-default {
  color: @menu-light-color;
  background: #ffffff;
}

.menu-light-hover {
  background-color: @menu-light-color-background-hover;
  color: @menu-light-color-hover;
  border: none;
}

.menu-light-active {
  background-color: @menu-light-color-background-active;
  color: @menu-light-color-active;
  border: none;
}

.menu-light-active-inline-title {
  color: @menu-light-color-active;
  background: #ffffff;
  border: none;
}





@menu-prefix: '--@{kd-prefix}-c-menu';

// color
@menu-color-disabled: var(~'@{menu-prefix}-color-disabled', @color-disabled);
@menu-sub-color: var(~'@{menu-prefix}-sub-color-text', rgba(255, 255, 255, 0.65));
@menu-sub-color-hover: var(~'@{menu-prefix}-sub-color-text-hover', @color-white);
@menu-sub-color-active: var(~'@{menu-prefix}-sub-color-text-active', @color-white);
@menu-sub-color-background: var(~'@{menu-prefix}-sub-color-background', #121319);
@menu-sub-inline-color-background: var(~'@{menu-prefix}-sub-inline-color-background', #1f212b);
@menu-inline-color-active: var(~'@{menu-prefix}-inline-color-active', @color-white);
@menu-color-background: var(~'@{menu-prefix}-color-background', #343848);

@menu-light-color: var(~'@{menu-prefix}-light-color-text', @color-text-primary);
@menu-light-color-hover: var(~'@{menu-prefix}-light-color-text-hover', @color-text-primary);
@menu-light-color-active: var(~'@{menu-prefix}-light-color-text-active', @color-theme);
@menu-light-color-background-hover: var(~'@{menu-prefix}-light-color-background-hover', #f5f5f5);
@menu-light-color-background-active: var(~'@{menu-prefix}-light-color-background-active', #e3ebff);

// font
@menu-icon-font-size: var(~'@{menu-prefix}-icon-font-size', @font-size-xx-large);

// motion
@menu-motion-duration: var(~'@{menu-prefix}-motion-duration', @duration-promptly);

// sizing
@menu-max-width: var(~'@{menu-prefix}-sizing-max-width');
@menu-min-width: var(~'@{menu-prefix}-sizing-min-width',138px);
@menu-item-height: var(~'@{menu-prefix}-item-sizing-height', 50px);

// z-index
@menu-z-index: var(~'@{menu-prefix}-z-index', @z-index-dialog);

/*! rtl:begin:ignore */



@msg-prefix-cls: ~'@{kd-prefix}-message';

.@{msg-prefix-cls}-box {
  position: fixed;
  width: 100%;
  text-align: center;
  display: flex;
  flex-direction: column;
  pointer-events: none;
  z-index: @message-z-index;
}

.@{msg-prefix-cls} {
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  min-width: @message-sizing-min-width;
  max-width: @message-sizing-max-width;
  margin: 0 auto @message-spacing-margin-bottom;
  padding: @message-spacing-padding-horizontal @message-spacing-padding-vertical;
  color: @message-info-text-color;
  border: 1px solid @message-info-color-border;
  border-radius: @message-border-radius;
  background-color: @message-info-color-background;
  pointer-events: all;
  animation: kdNoticeEffect calc(@transition-duration - 0.2s) @ease-out forwards;

  &-content {
    display: flex;
    justify-content: space-between;
    font-size: @message-font-size;
    line-height: @messgae-line-height;

    &-main {
      display: flex;
    }

    &-icon-wrapper {
      font-size: @message-icon-font-size;
      margin-right: @message-icon-spacing-margin-right;
      align-self: flex-start;
      display: inline-flex;
      align-items: center;
    }

    &-text {
      max-height: @message-text-sizing-max-height;
      overflow: auto;
    }

    &-close {
      cursor: pointer;
      color: @message-close-color-text;
      font-size: @message-close-font-size;
      margin-left: @message-close-spacing-margin-left;
      display: inline-flex;

      &:hover {
        color: @message-icon-text-color-hover;
      }
    }
  }

  &-success {
    color: @message-success-text-color;
    background: @message-success-color-background;
    border: 1px solid @message-success-color-border;
  }

  &-warning {
    color: @message-warning-text-color;
    background: @message-warning-color-background;
    border: 1px solid @message-warning-color-border;
  }

  &-error {
    color: @message-error-text-color;
    background: @message-error-color-background;
    border: 1px solid @message-error-color-border;
  }

  &-leave {
    animation: kdNoticeLeaveEffect calc(@transition-duration - 0.2s) @ease-out forwards;
  }

  &-leave-after {
    padding: 0;
    margin: 0;
    opacity: 0;
    transition: all calc(@transition-duration - 0.2s) @ease-out;

    &.@{msg-prefix-cls}-success,
    &.@{msg-prefix-cls}-warning,
    &.@{msg-prefix-cls}-error {
      transition: all calc(@transition-duration - 0.2s) @ease-out;
      border: none;
    }

    & div,
    & i {
      transition: all calc(@transition-duration - 0.2s) @ease-out;
      height: 0;
      font-size: 0;
    }
  }
}
.@{msg-prefix-cls}-rtl {
  direction: rtl;
  &.@{msg-prefix-cls}-content {
    .@{msg-prefix-cls}-content-close {
      margin-left: 0;
      margin-right: @message-close-spacing-margin-left;
    }
    .@{msg-prefix-cls}-content-icon-wrapper {
        margin-right: 0;
        margin-left: @message-icon-spacing-margin-right;
        align-self: flex-end;
      }
  }
}
/*! rtl:end:ignore */



@message-custom-prefix: ~'--@{kd-prefix}-c-message';

// color
@message-info-color-background: var(~'@{message-custom-prefix}-info-color-background', #e0efff);
@message-info-color-border: var(~'@{message-custom-prefix}-info-color-border', #b3d5ff);
@message-info-text-color: var(~'@{message-custom-prefix}-info-color-text', #0e5fd8);
@message-success-color-background: var(~'@{message-custom-prefix}-success-color-background', #dcfae4);
@message-success-color-border: var(~'@{message-custom-prefix}-success-color-border', #a1e6b5);
@message-success-text-color: var(~'@{message-custom-prefix}-success-color-text', #1BA854);
@message-warning-color-background: var(~'@{message-custom-prefix}-warning-color-background', #fff1d4);
@message-warning-color-border: var(~'@{message-custom-prefix}-warning-color-border', #ffe0a6);
@message-warning-text-color: var(~'@{message-custom-prefix}-warning-color-text', #FF991C);
@message-error-color-background: var(~'@{message-custom-prefix}-error-color-background', #ffdbe0);
@message-error-color-border: var(~'@{message-custom-prefix}-error-color-border', #ffadb6);
@message-error-text-color: var(~'@{message-custom-prefix}-error-color-text', #FB2323);
@message-close-color-text: var(~'@{message-custom-prefix}-close-color-text', #666);
@message-icon-text-color-hover: var(~'@{message-custom-prefix}-close-color-text-hover', @color-theme-hover);

// font
@message-font-size: var(~'@{message-custom-prefix}-font-size', 14px);
@message-icon-font-size: var(~'@{message-custom-prefix}-icon-font-size', 16px);
@message-close-font-size: var(~'@{message-custom-prefix}-font-size', 16px);

// line-height
@messgae-line-height: var(~'@{message-custom-prefix}-line-height', 20px);

// radius
@message-border-radius: var(~'@{message-custom-prefix}-border-radius', 4px);

// sizing
@message-sizing-max-width: var(~'@{message-custom-prefix}-sizing-max-width', 1000px);
@message-sizing-min-width: var(~'@{message-custom-prefix}-sizing-min-width', 280px);
@message-text-sizing-max-height: var(~'@{message-custom-prefix}-text-sizing-max-height', 160px);

// spacing
@message-spacing-margin-bottom: var(~'@{message-custom-prefix}-spacing-margin-bottom', 16px);
@message-spacing-padding-horizontal: var(~'@{message-custom-prefix}-spacing-padding-horizontal', 10px);
@message-spacing-padding-vertical: var(~'@{message-custom-prefix}-spacing-padding-vertical', 20px);
@message-icon-spacing-margin-right: var(~'@{message-custom-prefix}-icon-spacing-margin-right', 8px);
@message-close-spacing-margin-left: var(~'@{message-custom-prefix}-close-spacing-margin-left', 12px);

// z-index
@message-z-index: var(~'@{message-custom-prefix}-z-index', @z-index-apex);

/*! rtl:begin:ignore */



@modal-prefix-cls: ~'@{kd-prefix}-modal';

@confirm: confirm;
@warning: warning;
@error: error;

@modal-bg-type-set: {
  @confirm: @modal-color-ongoing;
  @warning: @modal-color-warning;
  @error: @modal-color-error;
};

@modal-footer-type-set: {
  @confirm: space-around;
  @warning: normal;
  @error: normal;
};

.@{modal-prefix-cls} {
  &-container {
    position: relative;
    z-index: @modal-z-index-dialog;

    &-ie {
      position: absolute;
    }

    &-show {
      animation: kdModalEffect calc(@transition-duration - 0.1s) @ease both;
    }

    &-hidden {
      display: none;
    }
  }
  &-mask {
    .overlay(@modal-mask-color-background, 0);
  }

  &-has-container-box {
    position: fixed;
    left: 50%;
    top: 50%;
  }
  &-container-box {
    display: flex;
    width: 460px;
    height: 340px;
    flex-direction: column;
    background: #ffffff;
    box-shadow: @modal-shadow;
    border-radius: @modal-radius;
    outline: none;
    .@{modal-prefix-cls}-header {
      display: flex;
      justify-content: space-between;
      padding: @modal-header-sizing-padding-vertical @modal-header-sizing-padding-horizontal;
      align-items: center;
      height: @modal-header-sizing-height;
      flex-shrink: 0;
      .@{modal-prefix-cls}-title-container {
        display: flex;
        justify-content: center;
        align-items: center;
        .@{modal-prefix-cls}-title-icon {
          .modal-title-icon-type(@icon-circle-radiu);
          margin-right: @modal-title-icon-sizing-margin-right;
        }
        each(@modal-bg-type-set, {
          .modal-title-icon-bgcolor-type(@key, @value)
        });
        .@{modal-prefix-cls}-title {
          min-width: 72px;
          min-height: 27px;
          font-size: @modal-title-font-size;
          color: @modal-title-font-color;
          line-height: 27px;
        }
        &:active {
          cursor: auto;
        }
      }
      .@{modal-prefix-cls}-close-icon {
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: @modal-close-icon-size;
        color: @modal-close-icon-color-text;
        cursor: pointer;
        &:hover {
          color: @modal-theme-color-hover;
        }
        &:active {
          color: @modal-theme-color-active;
        }
      }
      &:active {
        cursor: move;
      }
    }

    .@{modal-prefix-cls}-body {
      display: block;
      flex-grow: 1;
      padding: @modal-body-sizing-padding;
      font-size: @modal-body-font-size;
      color: @modal-body-font-color;
    }
    .@{modal-prefix-cls}-footer {
      height: @modal-footer-sizing-height;
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: @modal-footer-font-size;
      color: @modal-footer-font-color;
      flex-shrink: 0;
    }

    .@{modal-prefix-cls}-resise {
      &-handle {
        position: absolute;
      }

      &-n {
        top: 0;
        left: 0;
        width: 100%;
        height: 6px;
        cursor: ns-resize;
      }
      &-e {
        top: 0;
        right: 0;
        height: 100%;
        width: 6px;
        cursor: ew-resize;
      }
      &-s {
        bottom: 0;
        left: 0;
        height: 6px;
        width: 100%;
        cursor: ns-resize;
      }
      &-w {
        left: 0;
        top: 0;
        height: 100%;
        width: 6px;
        cursor: ew-resize;
      }
      &-ne {
        top: 0;
        right: 0;
        width: 6px;
        height: 6px;
        cursor: nesw-resize;
      }
      &-se {
        bottom: 0;
        right: 0;
        width: 6px;
        height: 6px;
        cursor: nwse-resize;
      }
      &-sw {
        bottom: 0;
        left: 0;
        width: 6px;
        height: 6px;
        cursor: nesw-resize;
      }
      &-nw {
        top: 0;
        left: 0;
        width: 6px;
        height: 6px;
        cursor: nwse-resize;
      }
    }
  }

  &-margin-btn {
    margin-right: @modal-footer-button-spacing;
  }

  &-wrapper {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: auto;
    text-align: center;

    &::before {
      display: inline-block;
      width: 0;
      height: 100%;
      vertical-align: middle;
      content: '';
    }

    &-resizable {
      text-align: unset;
      &::before {
        height: 0;
      }
    }
  }
  &-dialog {
    display: inline-block;
    vertical-align: middle;
    max-width: calc(100vw);
  }
}

.@{modal-prefix-cls}-showline {
  .@{modal-prefix-cls}-header {
    border-bottom: @modal-border-width solid @modal-border-color;
  }
  .@{modal-prefix-cls}-footer {
    border-top: @modal-border-width solid @modal-border-color;
  }
}
.@{modal-prefix-cls}-rtl {
  direction: rtl;
  .@{modal-prefix-cls}-container-box {
    .@{modal-prefix-cls}-header {
      .@{modal-prefix-cls}-title-container {
        .@{modal-prefix-cls}-title-icon {
          margin-right: 0;
          margin-left: @modal-title-icon-sizing-margin-right;
        }
      }
    }
    .@{modal-prefix-cls}-footer {
      .@{modal-prefix-cls}-cancel-node {
        .@{modal-prefix-cls}-margin-btn {
          margin-left: @modal-footer-button-spacing;
          margin-right: 0;
        }
      }
    }
  }
  .@{modal-prefix-cls}-has-container-box {
    right: 50%;
    left: auto;
  }
}
/*! rtl:end:ignore */



.modal-title-icon-type(@squareWidth) {
  border-radius: 50% 50%;
  width: @squareWidth;
  height: @squareWidth;
}

.modal-title-icon-bgcolor-type(@type, @bgcolor) {
  & .modal-@{type}-title-icon-bgcolor {
    background-color: @bgcolor;
  }
}



@modal-prefix: '--@{kd-prefix}-c-modal';

// color
@modal-primary-text-color: var(~'@{modal-prefix}-color-text-primary', @color-text-primary);
@modal-secondary-text-color: var(~'@{modal-prefix}-color-text-secondary', @color-text-secondary);
@modal-color-ongoing: var(~'@{modal-prefix}-color-ongoing', @color-ongoing);
@modal-color-warning: var(~'@{modal-prefix}-color-warning', @color-warning);
@modal-color-error: var(~'@{modal-prefix}-color-error', @color-error);
@modal-footer-font-color: var(~'@{modal-prefix}-footer-text-color', @color-text-secondary);
@modal-body-font-color: var(~'@{modal-prefix}-body-text-color', @color-text-primary);
@modal-title-font-color: var(~'@{modal-prefix}-title-text-color', @color-text-primary);
@modal-border-color: var(~'@{modal-prefix}-color-border', @color-border-strong-2);
@modal-theme-color-hover: var(~'@{modal-prefix}-color-theme-hover', @color-theme-5);
@modal-theme-color-active: var(~'@{modal-prefix}-color-theme-active', @color-theme-7);
@modal-mask-color-background: var(~'@{modal-prefix}-mask-color-background', rgba(55, 55, 55, 0.5));
@modal-close-icon-color-text: var(~'@{modal-prefix}-close-icon-color-text', #666666);
@confirm-modal-title-icon-bg: var(~'@{modal-prefix}-title-icon-color-backround-ongoing', @color-ongoing); // 弹出框的背景色
@warning-modal-title-icon-bg: var(~'@{modal-prefix}-title-icon-color-backround-warning', @color-warning); // 警告弹出框的背景色
@error-modal-title-icon-bg: var(~'@{modal-prefix}-title-icon-color-backround-warning', @color-warning); // 反馈浮层错误提示的背景色

// z-index
@modal-z-index-dialog: var(~'@{modal-prefix}-z-index', @z-index-dialog);

// font
@modal-footer-font-size: var(~'@{modal-prefix}-footer-font-size', 14px);
@modal-body-font-size: var(~'@{modal-prefix}-body-font-size', 16px);
@modal-title-font-size: var(~'@{modal-prefix}-title-font-size', 18px);

// shadow
@modal-shadow: var(~'@{modal-prefix}-box-shadow', 0 4px 10px 0 rgba(0, 0, 0, 0.2));

// radius
@modal-radius: var(~'@{modal-prefix}-boeder-radius', 2px);

// sizing
@icon-circle-radiu: var(~'@{modal-prefix}-icon-circle-sizing', 6px);
@modal-border-width: var(~'@{modal-prefix}-sizing-border', 1px);
@modal-close-icon-size: var(~'@{modal-prefix}-close-icon-font-size', 16px);
@modal-header-sizing-height: var(~'@{modal-prefix}-header-sizing-height', 50px);
@modal-footer-sizing-height: var(~'@{modal-prefix}-footer-sizing-height', 50px);

// spacing
@modal-footer-button-spacing: var(~'@{modal-prefix}-footer-button-spacing', 12px);
@modal-title-icon-sizing-margin-right: var(~'@{modal-prefix}-title-icon-sizing-margin-right', 8px);
@modal-header-sizing-padding-horizontal: var(~'@{modal-prefix}-header-sizing-padding-horizontal', 20px);
@modal-header-sizing-padding-vertical: var(~'@{modal-prefix}-header-sizing-padding-vertical', 0px);
@modal-body-sizing-padding: var(~'@{modal-prefix}-body-sizing-padding', 20px);

/*! rtl:begin:ignore */



@notice-prefix-cls: ~'@{kd-prefix}-notice';
@notice-box: ~'@{notice-prefix-cls}-box';

.@{notice-box}-topRight,
.@{notice-box}-topLeft,
.@{notice-box}-bottomLeft,
.@{notice-box}-bottomRight {
  position: fixed;
  z-index: @notice-z-index;
}

.@{notice-prefix-cls} {
  position: relative;
  display: block;
  box-sizing: border-box;
  width: 320px;
  margin: 0 auto 16px;
  box-shadow: 0 1px 6px 0 rgba(0, 0, 0, 0.15);
  border-radius: 2px;
  background-color: @notice-content-color-background;
  animation: kdNoticeEffect @notice-motion-duration cubic-bezier(0, 0.4, 0.4, 1) forwards;

  &-content {
    width: 100%;

    &-title {
      height: 40px;
      line-height: 40px;
      white-space: nowrap;
      padding: 0 20px;
      display: flex;
      font-size: @notice-font-size;
      align-content: center;
      justify-content: space-between;

      &-left {
        flex: 1;
        margin-right: 20px;
        display: flex;
        align-items: center;

        &-icon {
          margin-right: 5px;
          font-size: 17px;
        }

        &-text {
          flex: 1;
          font-weight: 600;
          overflow: hidden;
          text-overflow: ellipsis;
        }
      }

      &-close {
        cursor: pointer;
      }
    }

    &-description {
      height: 46px;
      padding: 10px 20px;
      font-size: 12px;
      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
    }

    &-footer {
      display: flex;
      align-items: center;
      padding: 0 20px 15px 20px;
      font-size: 12px;
      color: @notice-footer-color;
      cursor: pointer;

      > div {
        margin-right: 10px;

        &:hover {
          color: @notice-footer-color-hover;
        }
      }
    }
  }

  &-info {
    .@{notice-prefix-cls}-content-title {
      color: @notice-info-color;
      background: @notice-info-header-color-background;

      &-left-icon {
        color: @notice-icon-color;
      }

      &-close {
        color: @notice-icon-color;

        &:hover {
          color: @notice-icon-color-hover;
        }
      }
    }
  }

  &-primary {
    .@{notice-prefix-cls}-content-title {
      color: @notice-header-color;
      background: @notice-header-color-background;

      &-close {
        color: @notice-header-color;

        &:hover {
          color: @notice-icon-color-hover;
        }
      }
    }
  }

  &-leave {
    animation: kdNoticeLeaveEffect @notice-motion-duration cubic-bezier(0, 0.4, 0.4, 1) forwards;
  }

  &-leave-after {
    padding: 0;
    margin: 0;
    opacity: 0;
    transition: all @notice-motion-duration cubic-bezier(0, 0.4, 0.4, 1);

    &.@{notice-prefix-cls}-success,
    &.@{notice-prefix-cls}-warning,
    &.@{notice-prefix-cls}-error {
      transition: all @notice-motion-duration cubic-bezier(0, 0.4, 0.4, 1);
      border: none;
    }

    & div,
    & i {
      transition: all @notice-motion-duration cubic-bezier(0, 0.4, 0.4, 1);
      height: 0;
      font-size: 0;
    }
  }
}
.@{notice-prefix-cls}-rtl {
  direction: rtl;
  .@{notice-prefix-cls}-content-title {
    &-left {
      margin-left: 20px;
      margin-right: 0;
      &-icon {
        margin-right: 0;
        margin-left: 5px;
      }
    }
  }
  &.@{notice-prefix-cls}-content {
    .@{notice-prefix-cls}-content-footer {
      padding: 0 20px 15px 20px;
      > div {
        margin-right: 0;
        margin-left: 10px;
      }
    }
  }
}
/*! rtl:end:ignore */



@notice-prefix: '--@{kd-prefix}-c-notice';

// shadow
// color
@notice-icon-color: var(~'@{notice-prefix}-icon-color', @color-theme);
@notice-icon-color-hover: var(~'@{notice-prefix}-icon-color-hover', @color-border-ongoing);
@notice-header-color: var(~'@{notice-prefix}-header-color', @color-white);
@notice-header-color-background: var(~'@{notice-prefix}-header-color-background', @color-theme);
@notice-content-color-background: var(~'@{notice-prefix}-content-color-background', @color-white);
@notice-info-color: var(~'@{notice-prefix}-info-color', @color-text-primary);
@notice-info-header-color-background: var(~'@{notice-prefix}-info-header-color-background', @color-white);
@notice-footer-color: var(~'@{notice-prefix}-footer-color', @color-text-link);
@notice-footer-color-hover: var(~'@{notice-prefix}-footer-color-hover', @color-text-link-hover);

// sizing
// spacing
// motion
@notice-motion-duration: var(~'@{notice-prefix}-motion-duration', @duration-quickly);

// font
@notice-font-size: var(~'@{notice-prefix}-title-font-size', @font-size-middle);

// radius
// line-height
// z-index
@notice-z-index: var(~'@{notice-prefix}-z-index', @z-index-apex);

/*! rtl:begin:ignore */




@pagination-prefix-cls: ~'@{kd-prefix}-pagination';
@dropdown-prefix-cls: ~'@{kd-prefix}-dropdown';
@pagination-action-prefix-cls: ~'@{pagination-prefix-cls}-action';
@pagination-selector-prefix-cls: ~'@{pagination-prefix-cls}-selector';
@pagination-pages-prefix-cls: ~'@{pagination-prefix-cls}-pages';
@pagination-jumper-prefix-cls: ~'@{pagination-prefix-cls}-jumper';
@pagination-options-prefix-cls: ~'@{pagination-prefix-cls}-options';

.@{pagination-prefix-cls} {
  .reset-component;
  color: @pagination-text-color;
  font-size: @pagination-font-size;
  display: flex;
  align-items: center;

  .@{pagination-prefix-cls}-total {
    display: inline-flex;
    align-items: center;
    margin-right: 12px;
  }

  .@{pagination-prefix-cls}-current {
    display: inline-flex;
    align-items: center;
    margin-right: 12px;

    .@{pagination-prefix-cls}-current-input {
      box-sizing: border-box;
      width: 44px;
      height: @pagination-size;
      margin: 0 3px;
      padding: 0;
      outline: none;
      text-align: center;
      background: @color-background;
      color: @color-text-primary;
      font-size: @pagination-font-size;
      border-radius: @radius-border;
      border: @pagination-border-size solid @color-border-strong;
      transition: border-color @duration-promptly;

      &:hover,
      &:active,
      &:focus {
        border-color: @pagination-border-hover-color;
      }

      &:disabled {
        color: @pagination-disabled-color;
        border: @pagination-border-size solid @pagination-border-disabled-color;
        background: @pagination-button-disabled-background-color;
        cursor: not-allowed;
      }
    }
  }

  .@{pagination-action-prefix-cls} {
    .reset-component;
    display: inline-flex;
    align-items: center;

    .@{pagination-action-prefix-cls}-item {
      .reset-component;
      display: inline-flex;
      align-items: center;

      &.bordered {
        margin-right: calc(2 * @pagination-button-spacing);

        &:last-child {
          margin-right: 0;
        }

        button {
          border: @pagination-border-size solid @pagination-border-color;

          &:disabled {
            background-color: @pagination-button-disabled-background-color;
          }
        }
      }

      button {
        box-sizing: border-box;
        position: relative;
        width: @pagination-size;
        height: @pagination-size;
        border: none;
        background-color: @color-background;
        border-radius: @radius-border;
        cursor: pointer;
        outline: none;
        transition: border-color @duration-promptly;

        &:hover,
        &:active {
          &:not(:disabled) {
            border-color: @pagination-border-hover-color;
          }

          i {
            color: @pagination-hover-color;
          }
        }

        &[disabled] {
          cursor: not-allowed;

          i {
            color: @pagination-disabled-color;
          }
        }

        i {
          position: absolute;
          top: 0;
          right: 0;
          bottom: 0;
          left: 0;
          margin: auto;
          display: flex;
          align-items: center;
          justify-content: center;
          font-size: @pagination-icon-size;
          color: @pagination-icon-color;
          transition: color @duration-promptly;
        }
      }
    }
  }

  .@{pagination-selector-prefix-cls} {
    .reset-component;
    position: relative;
    display: inline-flex;
    align-items: center;
    margin-left: 20px;
    outline: none;
    height: @pagination-size;

    .@{pagination-selector-prefix-cls}-size {
      box-sizing: border-box;
      display: inline-flex;
      align-items: center;
      padding: 0;
      line-height: @pagination-size;
      color: @color-text-primary;
      border-radius: @radius-border;
      background: @color-background;
      cursor: pointer;
      border: none;
      outline: none;

      &:hover,
      &:active {
        i {
          color: @pagination-hover-color;
        }
      }

      &.disabled,
      &.disabled > i {
        cursor: not-allowed;
        color: @pagination-disabled-color;
      }

      i {
        margin-left: 4px;
        line-height: @pagination-size;
        font-size: @pagination-icon-size;
        color: @pagination-text-color;
      }
    }

    .@{dropdown-prefix-cls}-menu-item {
      text-align: right;
      padding-right: @pagination-dropdown-item-spacing-horizontal;
      padding-left: @pagination-dropdown-item-spacing-horizontal;

      span {
        white-space: nowrap;
      }
    }
  }

  // 简化版分页
  &.simple {
    .@{pagination-prefix-cls}-action {
      display: inline-flex;
      justify-content: space-around;
      align-items: center;
      height: @pagination-size;
      border-radius: @radius-border;
      border: @pagination-border-size solid transparent;

      &.bordered {
        border-color: @pagination-border-color;
        transition: border-color @duration-promptly;

        &:active:not(.disabled) {
          border-color: @pagination-border-hover-color;
        }

        &.disabled,
        &.disabled > .@{pagination-prefix-cls}-item > button {
          background-color: @pagination-button-disabled-background-color;
        }
      }

      &.disabled > .@{pagination-prefix-cls}-action-item {
        color: @pagination-disabled-color;
      }

      &-item {
        .reset-component;
        height: @pagination-size;
        overflow: hidden;
        margin: 0 8px;
        display: inline-flex;
        align-items: center;
        color: @color-text-primary;

        &:first-child,
        &:last-child {
          margin: 0;
        }

        .@{pagination-prefix-cls}-current {
          margin-right: 2px;

          .@{pagination-prefix-cls}-current-input {
            margin: 0;

            &:disabled {
              color: @pagination-disabled-color;
              cursor: not-allowed;
            }
          }
        }

        .@{pagination-prefix-cls}-total {
          margin-right: 0;
          margin-left: 2px;
        }

        &.bordered > button {
          border: none;
        }

        button {
          box-sizing: border-box;
          position: relative;
          width: calc(@pagination-size - 2px);
          height: calc(@pagination-size - 2px);
          border: none;
          background-color: @color-background;
          border-radius: @radius-border;
          cursor: pointer;
          outline: none;
          display: inline-flex;
          align-items: center;
          justify-content: center;
          transition: border-color @duration-promptly;

          &:hover,
          &:active {
            &:not(:disabled) {
              border-color: @pagination-border-hover-color;
            }

            i {
              color: @pagination-hover-color;
            }
          }

          &:disabled {
            cursor: not-allowed;

            i {
              color: @pagination-disabled-color;
            }
          }

          i {
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            left: 0;
            margin: auto;
            line-height: calc(@pagination-size - 2px);
            font-size: @pagination-icon-size;
            color: @pagination-icon-color;
            transition: color @duration-promptly;
          }
        }
      }
    }
  }

  // 精细版分页
  &.less {
    .@{pagination-pages-prefix-cls} {
      .reset-component;
      display: inline-block;

      &-item {
        .reset-component;
        position: relative;
        display: inline-flex;
        align-items: center;
        margin-right: @pagination-button-spacing;

        &:last-child {
          margin-right: 0;
        }

        &.active > button:disabled {
          background-color: @color-background-contain;
        }

        &:hover,
        &:active,
        &.active {
          button {
            color: @color-theme;
          }
        }

        &:first-child,
        &:last-child {
          button {
            width: @pagination-size;
            padding: 0;
            border-radius: @radius-border;
            border: @pagination-border-size solid @pagination-border-color;

            &:hover,
            &:active {
              border-color: @pagination-border-hover-color;

              &:disabled {
                border-color: @pagination-border-disabled-color;
              }
            }
          }
        }

        button {
          .reset-component;
          min-width: @pagination-size;
          height: @pagination-size;
          padding: 0 4px;
          color: @color-text-primary;
          font-size: @pagination-font-size;
          cursor: pointer;
          outline: none;
          border: none;
          background: @color-background;
          transition: color @duration-promptly, border-color @duration-promptly;
          display: inline-flex;
          align-items: center;
          justify-content: center;

          &:disabled {
            cursor: not-allowed;
            color: @pagination-disabled-color;
          }
        }
      }
    }
  }

  // 精细版分页
  &.nicety {
    .@{pagination-pages-prefix-cls} {
      .reset-component;
      display: inline-flex;
      align-items: center;

      &-item {
        .reset-component;
        position: relative;
        display: inline-flex;
        align-items: center;
        margin-right: @pagination-button-spacing;

        &:last-child {
          margin-right: 0;
        }

        &:hover,
        &:active,
        &.active {
          button {
            border-color: @pagination-border-hover-color;

            &:disabled {
              border-color: @pagination-border-disabled-color;
            }
          }
        }

        &.active > button:disabled {
          background-color: @color-background-contain;
        }

        &.active,
        &:hover {
          button {
            color: @color-theme;

            &:not(:disabled) > .@{pagination-pages-prefix-cls}-jumper-icon {
              opacity: 1;
            }
          }
        }

        &:first-child,
        &:last-child {
          button {
            width: @pagination-size;
            padding: 0;
            line-height: calc(@pagination-size - 2px);
          }
        }

        button {
          .reset-component;
          min-width: @pagination-size;
          height: @pagination-size;
          padding: 0 6px;
          cursor: pointer;
          outline: none;
          display: inline-flex;
          align-items: center;
          justify-content: center;
          font-size: @pagination-font-size;
          color: @color-text-primary;
          border-radius: @radius-border;
          border: @pagination-border-size solid @pagination-border-color;
          background: @color-background;
          transition: color @duration-promptly, border-color @duration-promptly, background-color @duration-promptly;

          &:disabled {
            cursor: not-allowed;
            color: @pagination-disabled-color;
          }

          > i {
            font-size: 16px;
          }

          .@{pagination-pages-prefix-cls}-jumper-icon {
            position: absolute;
            top: 0;
            left: 0;
            opacity: 0;
            width: 100%;
            height: 100%;
            color: @color-theme;
            line-height: @pagination-size;
            background-color: @color-background;
            transition: opacity @duration-promptly;
          }
        }
      }
    }

    .@{pagination-jumper-prefix-cls} {
      display: inline-flex;
      align-items: center;
      margin-left: 4px;

      .@{pagination-jumper-prefix-cls}-input {
        box-sizing: border-box;
        width: 40px;
        height: @pagination-size;
        padding: 0;
        outline: none;
        text-align: center;
        background: @color-background;
        color: @color-text-primary;
        font-size: @pagination-font-size;
        border-radius: @radius-border;
        border: @pagination-border-size solid @color-border-strong;
        transition: border-color @duration-promptly;

        &:hover,
        &:active,
        &:focus {
          border-color: @pagination-border-hover-color;
        }

        &:disabled {
          color: @pagination-disabled-color;
          border: @pagination-border-size solid @pagination-border-disabled-color;
          background: @pagination-button-disabled-background-color;
          cursor: not-allowed;
        }
      }

      .@{pagination-jumper-prefix-cls}-button {
        .reset-component;
        padding: 0 @pagination-jumper-spacing;
        height: @pagination-size;
        margin-left: @pagination-button-spacing;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        outline: none;
        color: @color-text-primary;
        font-size: @pagination-font-size;
        border-radius: @radius-border;
        border: @pagination-border-size solid @color-border-strong;
        background: @color-background;
        transition: border-color @duration-promptly;

        &:hover,
        &:active {
          color: @color-theme;
          border-color: @pagination-border-hover-color;

          &:disabled {
            border-color: @pagination-border-disabled-color;
          }
        }

        &:disabled {
          color: @pagination-disabled-color;
          cursor: not-allowed;
        }
      }
    }

    .@{pagination-options-prefix-cls} {
      .reset-component;
      position: relative;
      display: inline-flex;
      align-items: center;
      margin-left: 22px;
      outline: none;
      height: @pagination-size;
      color: @color-text-primary;

      .@{pagination-options-prefix-cls}-size {
        position: relative;
        box-sizing: border-box;
        display: inline-flex;
        align-items: center;
        min-width: 64px;
        height: @pagination-size;
        margin-right: 8px;
        padding: 0 24px 0 4px;
        font-size: @pagination-font-size;
        color: @color-text-primary;
        border-radius: @radius-border;
        border: @pagination-border-size solid @color-border-strong;
        background: @color-background;
        cursor: pointer;
        outline: none;
        transition: border-color @duration-promptly;

        &:hover,
        &:active {
          border-color: @pagination-border-hover-color;

          &.disabled {
            border-color: @color-border-strong;
          }
        }

        &.disabled,
        &.disabled > i {
          cursor: not-allowed;
          color: @pagination-disabled-color;
        }

        i {
          position: absolute;
          top: 50%;
          right: 5px;
          line-height: calc(@pagination-size - 2px);
          font-size: @pagination-icon-size;
          transform: translateY(-50%);
        }

        &:hover {
          i {
            color: @pagination-hover-color;
          }
        }

        &.@{pagination-prefix-cls}-options-dropdown-open {
          i {
            transform: rotate(180deg) translateY(50%);
          }
        }
      }
    }
  }

  &-options-dropdown {
    &-text {
      white-space: nowrap;
    }
    i {
      transition: transform @duration-promptly;
    }

    &-open {
      i {
        transform: rotate(180deg);
      }
    }
  }
}
.@{pagination-prefix-cls}-rtl {
  direction: rtl;
  .@{pagination-prefix-cls}-total {
    margin-left: 12px;
    margin-right: 0;
  }
  .@{pagination-prefix-cls}-current {
    margin-right: 0;
    margin-left: 12px;
  }
  .@{pagination-action-prefix-cls} {
    .@{pagination-action-prefix-cls}-item {
      &.bordered {
        margin-left: calc(2 * @pagination-button-spacing);
        margin-right: 0;
        &:last-child {
          margin-left: 0;
        }
      }
    }
  }
  .@{pagination-selector-prefix-cls} {
    margin-right: 20px;
    margin-left: 0;
    .@{pagination-selector-prefix-cls}-size {
      i {
        margin-left: 0;
        margin-right: 4px;
      }
    }
  }
  &.simple {
    .@{pagination-prefix-cls}-action {
      &-item {
        .@{pagination-prefix-cls}-current {
          margin-right: 0;
          margin-left: 2px;
        }
        .@{pagination-prefix-cls}-total {
          margin-left: 0;
          margin-right: 2px;
        }
      }
    }
  }
  &.less {
    .@{pagination-pages-prefix-cls} {
      &-item {
        margin-left: @pagination-button-spacing;
        margin-right: 0;
        &:last-child {
          margin-left: 0;
        }
      }
    }
  }
  &.nicety {
    .@{pagination-pages-prefix-cls} {
      &-item {
        margin-left: @pagination-button-spacing;
        margin-right: 0;
        &:last-child {
          margin-left: 0;
        }
      }
    }
    .@{pagination-jumper-prefix-cls} {
      margin-right: @pagination-button-spacing;
      margin-left: 0;
      .@{pagination-jumper-prefix-cls}-button {
        margin-right: @pagination-button-spacing;
        margin-left: 0;
      }
    }
    .@{pagination-options-prefix-cls} {
      margin-right: 22px;
      margin-left: 0;
      .@{pagination-options-prefix-cls}-size {
        margin-right: 0;
        margin-left: 8px;
        padding: 0 4px 0 24px;
        i {
          left: 5px;
          right: auto;
        }
      }
      .@{kd-prefix}-dropdown {
        &-menu {
          &-item {
            & > span {
              text-align: right;
            }
          }
        }
      }
    }
  }
}
/*! rtl:end:ignore */



@pagination-custom-prefix: ~'--@{kd-prefix}-c-pagination';

// color
@pagination-text-color: var(~'@{pagination-custom-prefix}-text-color', @color-text-secondary);
@pagination-hover-color: var(~'@{pagination-custom-prefix}-color-text-hover', @color-theme);
@pagination-icon-color: var(~'@{pagination-custom-prefix}-button-color', @color-text-secondary);
@pagination-disabled-color: var(~'@{pagination-custom-prefix}-color-disabled', @color-disabled);
@pagination-border-color: var(~'@{pagination-custom-prefix}-color-border', @color-border-strong);
@pagination-border-hover-color: var(~'@{pagination-custom-prefix}-color-border-hover', @color-theme-7);
@pagination-border-disabled-color: var(~'@{pagination-custom-prefix}-color-border-disabled', @color-border-strong);
@pagination-button-disabled-background-color: var(~'@{pagination-custom-prefix}-button-color-background-disabled', @color-background-contain-disabled);

// font
@pagination-font-size: var(~'@{pagination-custom-prefix}-font-size', @font-size-small);
@pagination-icon-size: var(~'@{pagination-custom-prefix}-icon-font-size', @font-size-large);


// sizing
@pagination-size: var(~'@{pagination-custom-prefix}-sizing-square', 24px);
@pagination-border-size: var(~'@{pagination-custom-prefix}-sizing-border-width', 1px);

// spacing
@pagination-button-spacing: var(~'@{pagination-custom-prefix}-button-spacing', 4px);
@pagination-dropdown-item-spacing-horizontal: var(~'@{pagination-custom-prefix}-dropdown-item-spacing-padding-horizontal', 24px);
@pagination-jumper-spacing: var(~'@{pagination-custom-prefix}-jumper-spacing-padding-horizontal', 4px);





/*! rtl:begin:ignore */




@popconfirm-prefix-cls: ~'@{kd-prefix}-popconfirm';

@popconfirm-title-line-height: 21px;
@popconfirm-box-shadow-blur: 16px;

.showdow(@x, @y) {
  box-shadow: @x @y @popconfirm-box-shadow-blur 3px rgba(0, 0, 0, 0.08);
}

.@{popconfirm-prefix-cls} {
  .reset-component;
  border-radius: @popconfirm-border-radius;
  background-color: @popconfirm-background-color;
  opacity: 1;
  z-index: @z-index-popper;
  visibility: visible;

  &.hidden {
    opacity: 0;
    visibility: hidden;
  }

  &[class*='top'] {
    .showdow(0, 6px);
  }

  &[class*='bottom'] {
    .showdow(0, -6px);
  }

  &[class*='left'] {
    .showdow(6px, 0);
  }

  &[class*='right'] {
    .showdow(-6px, 0);
  }

  // 箭头样式
  .popperArrow(@popconfirm-background-color, @popconfirm-horizontal-gap, @popconfirm-box-shadow-blur);

  &-content {
    .reset-component;
    width: @popconfirm-width;
    padding: @popconfirm-vertical-gap @popconfirm-horizontal-gap;
  }

  &-title {
    line-height: @popconfirm-title-line-height;
    color: @popconfirm-title-color;
    font-size: @popconfirm-title-font-size;

    i {
      margin-right: @popconfirm-title-icon-margin-right;
      vertical-align: top;
      line-height: @popconfirm-title-line-height;
      color: @popconfirm-icon-color;
      font-size: @popconfirm-icon-size;
    }
  }

  &-message {
    color: @popconfirm-message-color;
    font-size: @popconfirm-message-font-size;
    line-height: 18px;
    margin: @popconfirm-message-margin-top 0 @popconfirm-message-margin-bottom;
  }

  &-interaction {
    text-align: right;

    button:not(:last-child) {
      margin-right: @popconfirm-button-spacing;
    }
  }
  
  .arrow::before {
    border-color: @tooltip-background-color;
  }
}
.@{popconfirm-prefix-cls}-rtl {
  direction: rtl;

  .@{popconfirm-prefix-cls}-interaction {
    text-align: left;

    button:not(:last-child) {
      margin-left: @popconfirm-button-spacing;
      margin-right: 0;
    }
  }
  .@{popconfirm-prefix-cls}-title {
    i {
      margin-left: @popconfirm-title-icon-margin-right;
      margin-right: 0;
    }
  }
}
/*! rtl:end:ignore */



@popconfirm-custom-prefix: ~'--@{kd-prefix}-c-popconfirm';

// spacing
@popconfirm-vertical-gap: var(~'@{popconfirm-custom-prefix}-spacing-padding-vertical', 16px);
@popconfirm-horizontal-gap: var(~'@{popconfirm-custom-prefix}-spacing-padding-horizontal', 16px);
@popconfirm-title-icon-margin-right: var(~'@{popconfirm-custom-prefix}-title-icon-spacing-margin-right', 6px);
@popconfirm-message-margin-top: var(~'@{popconfirm-custom-prefix}-message-spacing-margin-top', 6px);
@popconfirm-message-margin-bottom: var(~'@{popconfirm-custom-prefix}-message-spacing-margin-bottom', 18px);
@popconfirm-button-spacing: var(~'@{popconfirm-custom-prefix}-button-spacing', 12px);

// sizing
@popconfirm-width: var(~'@{popconfirm-custom-prefix}-sizing-min-width', 240px);
@popconfirm-icon-size: var(~'@{popconfirm-custom-prefix}-icon-sizing-square', 17px);

// color
@popconfirm-title-color: var(~'@{popconfirm-custom-prefix}-title-color-text', @color-text-primary);
@popconfirm-message-color: var(~'@{popconfirm-custom-prefix}-message-color-text', @color-text-primary);
@popconfirm-icon-color: var(~'@{popconfirm-custom-prefix}-icon-color-text', @color-warning);
@popconfirm-background-color: var(~'@{popconfirm-custom-prefix}-color-background', @color-background);

// font
@popconfirm-title-font-size: var(~'@{popconfirm-custom-prefix}-title-font-size', @font-size-middle);
@popconfirm-message-font-size: var(~'@{popconfirm-custom-prefix}-message-font-size', @font-size-small);

// radius
@popconfirm-border-radius: var(~'@{popconfirm-custom-prefix}-radius-border', @radius-border);



@popper-prefix-cls: ~'@{kd-prefix}-popper';

.@{popper-prefix-cls} {
  opacity: 1;
  z-index: @z-index-popper;
  visibility: visible;

  &.hidden {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
  }

  .arrow {
    visibility: hidden;

    &::before {
      visibility: visible;
      position: absolute;
      border-style: solid;
      border-width: var(--arrowSize);
      content: '';
      transform: rotate(45deg);
    }
  }

  &[data-popper-placement^='top'] .arrow {
    bottom: calc(1.07 * var(--arrowSize));

    &.transparent {
      bottom: calc(0.96 * var(--arrowSize));
    }

    &::before {
      left: calc(-1 * var(--arrowSize));
      border-top-color: transparent;
      border-left-color: transparent;
    }
  }

  &[data-popper-placement^='bottom'] .arrow {
    top: calc(-0.75 * var(--arrowSize));

    &.transparent {
      top: calc(-0.85 * var(--arrowSize));
    }

    &::before {
      left: calc(-1 * var(--arrowSize));
      border-bottom-color: transparent;
      border-right-color: transparent;
    }
  }

  &[data-popper-placement^='left'] .arrow {
    right: calc(1.07 * var(--arrowSize));

    &.transparent {
      right: calc(0.9 * var(--arrowSize));
    }

    &::before {
      top: calc(-1 * var(--arrowSize));
      border-left-color: transparent;
      border-bottom-color: transparent;
    }
  }

  &[data-popper-placement^='right'] .arrow {
    left: calc(-0.75 * var(--arrowSize));

    &.transparent {
      left: calc(-0.85 * var(--arrowSize));
    }

    &::before {
      top: calc(-1 * var(--arrowSize));
      border-top-color: transparent;
      border-right-color: transparent;
    }
  }
}

.popper-motion(@className, @keyframeName, @duration: calc(@transition-duration - 0.1s)) {
  .@{className} {
    animation-duration: @duration;

    &-in {
      animation-name: ~'@{keyframeName}In';
      animation-timing-function: @ease-out;
    }

    &-out {
      animation-name: ~'@{keyframeName}Out';
      animation-timing-function: @ease-in;
    }
  }
}

.@{popper-prefix-cls}-rtl {
  direction: rtl;
  text-align: right
}

.popper-motion(~'@{popper-prefix-cls}-top', kdSlideDown);
.popper-motion(~'@{popper-prefix-cls}-left', kdZoomRight);
.popper-motion(~'@{popper-prefix-cls}-right', kdZoomLeft);
.popper-motion(~'@{popper-prefix-cls}-bottom', kdSlideUp);
.popper-motion(~'@{popper-prefix-cls}-top-start', kdSlideDown);
.popper-motion(~'@{popper-prefix-cls}-right-end', kdZoomLeftBottom);
.popper-motion(~'@{popper-prefix-cls}-top-end', kdSlideDown);
.popper-motion(~'@{popper-prefix-cls}-left-end', kdZoomRightBottom);
.popper-motion(~'@{popper-prefix-cls}-left-start', kdZoomTopRight);
.popper-motion(~'@{popper-prefix-cls}-bottom-end', kdSlideUp);
.popper-motion(~'@{popper-prefix-cls}-right-start', kdZoomTopLeft);
.popper-motion(~'@{popper-prefix-cls}-bottom-start', kdSlideUp);

/*! rtl:begin:ignore */


@progress-prefix-cls: ~'@{kd-prefix}-progress';

.@{progress-prefix-cls} {
  .progress;
  line-height: 1;
  font-size: 0;
  vertical-align: top;

  &-show-info {
    font-size: @progress-line-text-font-size;
  }

  &-type-line {
    width: 100%;
    color: @progress-line-font-color;

    .@{progress-prefix-cls}-special-text {
      margin-top: @progress-line-text-margin-top;
      line-height: 24px;
    }
  }

  &-type-circle {
    color: @progress-circle-font-color;

    .@{progress-prefix-cls}-special-text {
      margin-top: @progress-circle-text-margin-top;
      padding: 0;
      line-height: 24px;
    }
  }

  &-outer {
    display: inline-block;
    vertical-align: middle;
    box-sizing: border-box;
    width: 100%;
    margin-right: 0;
    padding-right: 0;
    font-size: 0;

    .@{progress-prefix-cls}-show-info:not(.@{progress-prefix-cls}-position-bottom) & {
      margin-right: calc(-1 * @progress-line-text-font-size * 2 - 8px);
      padding-right: calc(@progress-line-text-font-size * 2 + 8px);
    }
  }

  &-inner {
    position: relative;
    display: inline-block;
    width: 100%;
    overflow: hidden;
    vertical-align: middle;
    font-size: 0;
    border-radius: @progress-border-radius;
    background-color: @progress-remaining-color;
  }

  &-success-bg,
  &-bg {
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    border-radius: @progress-border-radius;
    background-color: @progress-default-color;
    height: @progress-line-stroke-width;
    // -------------------------UPDATE-------------------
    transition: all @transition-duration @progress-transition-fn;
    // -------------------------UPDATE-------------------
  }

  &-success-bg {
    position: absolute;
    top: 0;
    left: 0;
    background-color: @progress-success-color;
  }

  &-text {
    display: inline-block;
    box-sizing: border-box;
    width: calc(@progress-line-text-font-size*2);
    margin-left: @progress-line-text-margin-left;
    // font-size: @progress-line-text-font-size;
    // line-height: 1;
    white-space: nowrap;
    text-align: left;
    vertical-align: middle;
    word-break: normal;
  }

  &-special-text {
    font-size: @progress-line-special-text-font-size;
    text-align: center;
    overflow: hidden;
    padding-right: calc(@progress-line-text-font-size*2 + 8px);

    .@{progress-prefix-cls}-position-bottom & {
      padding-right: 0;
    }
  }

  &-status-success {
    .@{progress-prefix-cls}-bg {
      background-color: @progress-success-color;
    }

    .@{progress-prefix-cls}-text,
    .@{progress-prefix-cls}-special-text {
      color: @progress-success-color;
    }

    .@{progress-prefix-cls}-text {
      font-size: 0;
    }
    .@{progress-prefix-cls}-icon {
      font-size: @progress-line-icon-font-size;
      color: @progress-success-color;
    }

    .@{progress-prefix-cls}-circle-box:not(.@{progress-prefix-cls}-circle-gradient) {
      .@{progress-prefix-cls}-circle-path {
        stroke: @progress-success-color;
      }
    }
  }

  &-status-failure {
    .@{progress-prefix-cls}-bg {
      background-color: @progress-failure-color;
    }

    .@{progress-prefix-cls}-text,
    .@{progress-prefix-cls}-special-text {
      color: @progress-failure-color;
    }

    .@{progress-prefix-cls}-text {
      font-size: 0;
    }
    .@{progress-prefix-cls}-icon {
      font-size: @progress-line-icon-font-size;
      color: @progress-failure-color;
    }

    .@{progress-prefix-cls}-circle-box:not(.@{progress-prefix-cls}-circle-gradient) {
      .@{progress-prefix-cls}-circle-path {
        stroke: @progress-failure-color;
      }
    }
  }

  &-circle-box {
    position: relative;

    .@{progress-prefix-cls}-circle-trail {
      stroke: @progress-remaining-color;
    }

    .@{progress-prefix-cls}-circle-path {
      transition: stroke-dasharray @transition-duration @progress-transition-fn,
        stroke-dashoffset @transition-duration @progress-transition-fn;
    }

    .@{progress-prefix-cls}-text {
      position: absolute;
      width: auto;
      text-align: center;
      font-size: @progress-circle-text-font-size;
      margin: 0;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);

      &-percent,
      &-unit {
        display: inline-block;
        vertical-align: top;
      }

      &-percent {
        line-height: @progress-circle-percent-line-height;
      }

      &-unit {
        line-height: @progress-circle-unit-line-height;
        font-size: @progress-circle-unit-font-size;
        margin-top: @progress-circle-unit-margin-top;
      }
    }

    .@{progress-prefix-cls}-icon {
      font-size: @progress-circle-icon-font-size;
    }
  }

  &-circle-box:not(.@{progress-prefix-cls}-circle-gradient) {
    .@{progress-prefix-cls}-circle-path {
      stroke: @progress-default-color;
      transition: stroke-dasharray @transition-duration @progress-transition-fn,
        stroke-dashoffset @transition-duration @progress-transition-fn;
    }
  }
}

.@{progress-prefix-cls}-rtl {
  direction: rtl;
  &.@{progress-prefix-cls}-show-info & .@{progress-prefix-cls}-position-bottom {
    .@{progress-prefix-cls}-outer {
      margin-left: calc(-1 * @progress-line-text-font-size * 2 - 8px);
      margin-right: 0;
      padding-right: 0;
      padding-left: calc(@progress-line-text-font-size * 2 + 8px);
    }
  }
  // .@{progress-prefix-cls}-inner {
  //   // transform: rotateY(180deg);
  // }
  .@{progress-prefix-cls}-text {
    margin-right: @progress-line-text-margin-left;
    margin-left: 0;
    text-align: right;
    right: auto !important;
    transform: translate(-50%, -50%) !important;
  }
  // .@{progress-prefix-cls}-circle {
  //   transform: rotateY(180deg);
  // }
}
/*! rtl:end:ignore */


.progress() {
  display: inline-block;
  font-variant: tabular-nums;
  box-sizing: border-box;
}


@progress-prefix: '--@{kd-prefix}-c-progress';
@progress-transition-fn:  cubic-bezier(0.66, 0, 0.34, 1);

// color
@progress-remaining-color: var(~'@{progress-prefix}-color-remaining', #e5e5e5);//背景色
@progress-line-font-color: var(~'@{progress-prefix}-line-color-font', #212121);
@progress-circle-font-color: var(~'@{progress-prefix}-circle-color-font', #666);
@progress-default-color: var(~'@{progress-prefix}-color-default', #5582f3);//进度条 默认色
@progress-success-color: var(~'@{progress-prefix}-color-success', @color-success);//进度条 成功
@progress-failure-color: var(~'@{progress-prefix}-color-failure', @color-error);//进度条 失败

// font
@progress-line-icon-font-size: var(~'@{progress-prefix}-line-icon-font-size', 16px); //线性进度条 icon 大小
@progress-line-text-font-size: var(~'@{progress-prefix}-line-text-font-size', 16px);//线性进度条 数值文本
@progress-line-special-text-font-size: var(~'@{progress-prefix}-line-special-text-font-size', 16px);// 圆形进度条 状态文本

// line-height
@progress-circle-percent-line-height: var(~'@{progress-prefix}-circle-percent-line-height', 48px);
@progress-circle-unit-line-height: var(~'@{progress-prefix}-circle-unit-line-height', 18px);

//radius
@progress-border-radius: var(~'@{progress-prefix}-radius-border', 100px);//线性进度条圆角


// sizing
@progress-line-stroke-width: var(~'@{progress-prefix}-line-stroke-sizing-width', 8px);
@progress-circle-stroke-width: var(~'@{progress-prefix}-circle-stroke-sizing-width', 4px);


// spacing
@progress-circle-unit-margin-top: var(~'@{progress-prefix}-circle-unit-spacing-margin-top', 18px); // 百分比符号距离顶部的距离
@progress-line-text-margin-left: var(~'@{progress-prefix}-line-text-spacing-margin-left', 8px); //进度与文字或者图标的间距
@progress-line-text-margin-top: var(~'@{progress-prefix}-line-text-spacing-margin-top', 12px);
@progress-circle-text-margin-top: var(~'@{progress-prefix}-circle-text-spacing-margin-top', 8px);


/*! rtl:begin:ignore */


@qrcode-prefix-cls: ~'@{kd-prefix}-qrcode';
@qrcode-prefix-icon-cls: ~'@{kd-prefix}-icon';
@--kd-c-spin-page-dot-spin-sizing-square: 30px;

.@{qrcode-prefix-cls} {
  .qrcode;
  position: relative;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  border-radius: @qrcode-border-radius;
  border: @qrcode-size-boder solid @qrcode-color-border;
  padding: @qrcode-spacing-padding-horizontal;
  font-size: @qrcode-font-size;
  list-style: none;
  overflow: hidden;

  &-expired {
    margin-bottom: @qrcode-spacing-margin-vertical;
  }

  &-mask {
    position: absolute;
    z-index: 10;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 100%;
    height: 100%;
    color: @qrcode-color-text;
    background: @qrcode-color-background;
    text-align: center;
  }
  &-borderless {
    border: none;
  }
}
.@{qrcode-prefix-cls}-rtl {
  direction: rtl;
}
/*! rtl:end:ignore */



.qrcode() {
  // color: @qrcode-color-text;
  // font-size: @qrcode-font-size;
}


@qrcode-custom-prefix: ~'--@{kd-prefix}-c-qrcode';
// color
@qrcode-color-text: var(~'@{qrcode-custom-prefix}-color-text', #111111);
@qrcode-color-border: var(~'@{qrcode-custom-prefix}-color-border',rgba(5, 5, 5, 0.06));
@qrcode-color-background: var(~'@{qrcode-custom-prefix}-color-background',rgba(255, 255, 255, 0.96));
// font
@qrcode-font-size: var(~'@{qrcode-custom-prefix}-font-size', 12px); // 组件级token

// line-height

// motion

// radius
@qrcode-border-radius: var(~'@{qrcode-custom-prefix}-border-radius', 2px);
// shadow

// sizing
@qrcode-size-boder: var(~'@{qrcode-custom-prefix}-size-border',1px);
@qrcode-size-spin: var(--kd-c-spin-page-dot-spin-sizing-square,28px);
// spacing
@qrcode-spacing-padding-horizontal: var(~'@{qrcode-custom-prefix}-spacing-padding-horizontal', 8px);
@qrcode-spacing-margin-vertical: var(~'@{qrcode-custom-prefix}-spacing-margin-vertical',4px);
// z-index

/*! rtl:begin:ignore */



@radio-prefix-cls: ~'@{kd-prefix}-radio';
@radio-square-prefix-cls: ~'@{radio-prefix-cls}-square';
@radio-button-prefix-cls: ~'@{radio-prefix-cls}-button';
@radio-group-prefix-cls: ~'@{radio-prefix-cls}-group';
@radio-focus-shadow: 0 0 0 3px rgba(85, 130, 243, 10%);

// 默认类型（单选项）
.@{radio-prefix-cls} {
  .reset-component();

  // 默认状态
  position: relative;
  display: inline-block;
  padding-left: @radio-circle-size;
  margin-right: @radio-margin-right;
  white-space: nowrap;
  text-overflow: ellipsis;
  cursor: pointer;
  vertical-align: middle;
  color: @radio-font-color;
  font-size: @radio-font-size;
  max-width: @radio-default-label-max-width;
  // overflow: hidden;
  min-height: @radio-circle-size;

  &::before {
    position: absolute;
    top: 50%;
    left: 0;
    height: @radio-circle-size;
    width: @radio-circle-size;
    content: '';
    border-radius: 50%;
    box-sizing: border-box;
    border: @radio-border-width solid @radio-color-border;
    background-color: @radio-color-background;
    transform: translateY(-50%);
    transition: border-color @transition-duration, box-shadow @transition-duration;
  }

  &::after {
    position: absolute;
    top: 50%;
    left: 2px;
    width: calc(@radio-circle-size - 4px);
    height: calc(@radio-circle-size - 4px);
    content: '';
    border-radius: 50%;
    background-color: @radio-color-theme;
    transform: translateY(-50%);
    animation: kdRadioLeaveEffect calc(@transition-duration - 0.1s) @ease both;
    transition: all @transition-duration @ease;
    visibility: hidden;
    opacity: 0;
  }

  &-input {
    position: absolute;
    opacity: 0;
    left: 0;
  }

  & > span {
    padding: 0 6px 0 @radio-padding-left;
  }

  // 悬停状态
  &:hover {
    color: @radio-color-theme;
    &::before {
      border-color: @radio-color-theme;
    }
  }

  // 选中状态
  &-checked {
    &::before {
      border-color: @radio-color-theme;
    }

    &:focus-within::before {
      box-shadow: @radio-focus-shadow;
    }

    &::after {
      position: absolute;
      top: 50%;
      left: 2px;
      width: calc(@radio-circle-size - 4px);
      height: calc(@radio-circle-size - 4px);
      content: '';
      border-radius: 50%;
      background-color: @radio-color-theme;
      transform: translateY(-50%);
      animation: kdRadioEffect calc(@transition-duration - 0.1s) @ease both;
      transition: all calc(@transition-duration - 0.1s) @ease;
      opacity: 1;
      visibility: visible;
    }
  }

  // 禁用状态
  &-disabled,
  &-disabled:hover {
    cursor: not-allowed;
    color: @radio-color-disabled;

    &::before {
      border-color: @radio-color-disabled;
      background-color: @radio-color-background-disabled;
      box-shadow: none;
    }

    &::after {
      background-color: @radio-color-disabled;
      animation: none;
    }

    &.@{radio-prefix-cls}-checked {
      color: @radio-font-color;
    }
  }

  &-text {
    line-height: 1.5;
  }
}

// 方框类型（单选框）
.@{radio-square-prefix-cls} {
  .reset-component();

  .ellipsis();

  // 默认状态
  position: relative;
  display: inline-block;
  height: @radio-square-height;
  padding-top: @radio-square-padding-vertical;
  padding-right: @radio-square-padding-horizontal;
  padding-bottom: @radio-square-padding-vertical;
  padding-left: @radio-square-padding-horizontal;
  margin-right: @radio-margin-right;
  // line-height: calc(@radio-square-height - @radio-border-width * 2);
  line-height: calc(@radio-square-height - (@radio-square-padding-vertical * 2) - (@radio-border-width * 2));
  vertical-align: middle;
  color: @radio-font-color;
  font-size: @radio-font-size;
  cursor: pointer;
  background-color: @radio-color-background;
  overflow: hidden;
  border-radius: @radius-size;
  border: @radio-border-width solid @radio-color-border;
  transition: all @transition-duration;
  max-width: @radio-square-label-max-width;

  &::after {
    position: absolute;
    right: calc(-1 * (@radio-square-height - 10px) / 2);
    bottom: calc(-1 * (@radio-square-height - 10px) / 2);
    width: calc(@radio-square-height - 10px);
    height: calc(@radio-square-height - 10px);
    content: '';
    background-color: @radio-color-theme;
    transform: rotate(45deg);
    animation: kdRadioSquareLeaveEffect calc(@transition-duration - 0.1s) @ease both;
    transition: all @transition-duration @ease;
    opacity: 0;
    visibility: hidden;
  }

  &-input {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    cursor: pointer;
    opacity: 0;
    width: 100%;
    height: 100%;

    &[disabled] {
      cursor: not-allowed;
    }
  }

  // 悬停状态
  &:hover {
    color: @radio-color-theme;
    border-color: @radio-color-theme;
  }

  // 选中状态
  &-checked {
    border-color: @radio-color-theme;

    &:focus-within {
      box-shadow: @radio-focus-shadow;
    }

    &::after {
      position: absolute;
      right: calc(-1 * (@radio-square-height - 10px) / 2);
      bottom: calc(-1 * (@radio-square-height - 10px) / 2);
      width: calc(@radio-square-height - 10px);
      height: calc(@radio-square-height - 10px);
      content: '';
      background-color: @radio-color-theme;
      transform: rotate(45deg);
      animation: kdRadioSquareEffect calc(@transition-duration - 0.1s) @ease both;
      transition: all calc(@transition-duration - 0.1s) @ease;
      opacity: 1;
      visibility: visible;
    }
  }

  &-disabled,
  &-disabled:hover {
    color: @radio-color-disabled;
    border-color: @radio-color-border-disabled;
    background-color: @radio-color-background-disabled;
    box-shadow: none;
    cursor: not-allowed;

    &::after {
      background-color: @radio-color-disabled;
      animation: none;
    }

    &.@{radio-square-prefix-cls}-checked {
      color: @radio-font-color;
    }
  }

  &-text {
    line-height: 1.5;
  }
}

// 按钮类型（切换按钮）
.@{radio-button-prefix-cls} {
  .reset-component();
  .ellipsis();
  // 默认状态
  position: relative;
  display: inline-block;
  height: @radio-square-height;
  padding-top: @radio-square-padding-vertical;
  padding-right: @radio-square-padding-horizontal;
  padding-bottom: @radio-square-padding-vertical;
  padding-left: @radio-square-padding-horizontal;
  line-height: calc(@radio-square-height - (@radio-square-padding-vertical * 2) - (@radio-border-width * 2));
  vertical-align: middle;
  color: @radio-font-color;
  font-size: @radio-font-size;
  cursor: pointer;
  background-color: @radio-color-background;
  border: @radio-border-width solid @radio-color-border;
  border-left: none;
  transition: all @transition-duration;
  max-width: @radio-button-label-max-width;

  &:first-child {
    border-radius: @radius-size 0 0 @radius-size;
    border-left: @radio-border-width solid @radio-color-border;

    &::before {
      content: none;
    }
  }

  &:last-child {
    border-radius: 0 @radius-size @radius-size 0;
  }

  &::before {
    z-index: 10;
    position: absolute;
    top: calc(-1 * @radio-border-width);
    left: calc(-1 * @radio-border-width);
    height: @radio-square-height;
    width: @radio-border-width;
    content: '';
    background-color: @radio-color-border;
  }

  &-input {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1;
    cursor: pointer;
    opacity: 0;

    &[disabled] {
      cursor: not-allowed;
    }
  }

  // 悬停状态
  &:hover {
    color: @radio-color-theme;
    // border-color: @radio-color-theme;
  }

  // 选中状态
  &-checked {
    z-index: 1;
    color: @radio-color-background;
    border-color: @radio-color-theme;
    background-color: @radio-color-theme;

    &:focus-within {
      box-shadow: @radio-focus-shadow;
    }

    &:hover {
      color: @radio-color-background;
    }

    &:not(.@{radio-button-prefix-cls}-disabled)::before {
      background-color: @radio-color-theme;
    }

    &:first-child {
      border-left-color: @radio-color-theme;

      &::before {
        content: none;
      }
    }

    & + .@{radio-button-prefix-cls} {
      &::before {
        content: none;
      }
    }

    &.@{radio-button-prefix-cls}-disabled {
      background-color: @radio-color-border;
      border-left-color: @radio-color-border;
      box-shadow: none;
    }
  }

  &-disabled,
  &-disabled:hover {
    color: @radio-color-disabled;
    border-color: @radio-color-border;
    // background-color: @radio-color-background-disabled;
    cursor: not-allowed;
  }

  &-text {
    .ellipsis();
    display: block;
    line-height: 1.5;
  }
}
.@{radio-prefix-cls}-rtl {
  direction: rtl;
  &.@{radio-prefix-cls} {
    text-align: right;
    padding-right: @radio-circle-size;
    padding-left: 0;
    margin-left: @radio-margin-right;
    margin-right: 0;
    .@{radio-prefix-cls}-input {
      right: 0;
      left: auto;
    }
    .@{radio-prefix-cls}-checked {
      &::after {
        right: 2px;
        left: auto;
      }
    }
  }
  &.@{radio-prefix-cls}::before {
    right: 0;
    left: auto;
  }

  &.@{radio-prefix-cls}::after {
    right: 2px;
    left: auto;
  }
}

.@{radio-button-prefix-cls}-rtl {
  direction: rtl;
  &.@{radio-button-prefix-cls} {
    border: @radio-border-width solid @radio-color-border;
    border-right: none;
    &.@{radio-button-prefix-cls}:first-child {
      border-radius: 0 @radius-size @radius-size 0;
      border-right: @radio-border-width solid @radio-color-border;
      &::before {
        content: none;
      }
    }

    &.@{radio-button-prefix-cls}:last-child {
      border-radius: @radius-size 0 0 @radius-size;
    }
  }
}

.@{radio-square-prefix-cls}-rtl {
  direction: rtl;
  &.@{radio-square-prefix-cls} {
    margin-left: @radio-margin-right;
    margin-right: 0;
    &.@{radio-square-prefix-cls}::after {
      left: calc(-1 * (@radio-square-height - 10px) / 2);
      right: auto;
    }
    &.@{radio-square-prefix-cls}-checked {
      .@{radio-square-prefix-cls}-checked::after {
        left: calc(-1 * (@radio-square-height - 10px) / 2);
        right: auto;
      }
    }
  }
}

.@{radio-group-prefix-cls}-rtl {
  direction: rtl;
}
/*! rtl:end:ignore */



@radio-prefix: '--@{kd-prefix}-c-radio';
@radio-transition-fn:  cubic-bezier(0.075, 0.82, 0.165, 1);

// color
@radio-font-color: var(~'@{radio-prefix}-color-font', @color-text-primary);//单选项字体颜色
@radio-color-theme: var(~'@{radio-prefix}-color-theme', @color-theme);//悬停/选中跟随主题色
@radio-color-border: var(~'@{radio-prefix}-color-border', @color-border-strong);//边框色
@radio-color-disabled: var(~'@{radio-prefix}-color-disabled', @color-disabled);//禁用色（全局）
@radio-color-background-disabled: var(~'@{radio-prefix}-color-background-disabled', @color-background-contain-disabled);//禁用色（全局）
@radio-color-border-disabled: var(~'@{radio-prefix}-color-border-disabled', @color-border-strong);//禁用边框色
@radio-color-background: var(~'@{radio-prefix}-color-background', @color-white);// 基础颜色

// font
@radio-font-size: var(~'@{radio-prefix}-font-size', @font-size-small);//单选项字体大小

//radius
@radio-border-width:   var(~'@{radio-prefix}-radius-border-width',1px);

// sizing
@radio-circle-size:var(~'@{radio-prefix}-square-sizing-width-height',14px);//单选图标大小
@radio-square-height:  var(~'@{radio-prefix}-square-sizing-height',32px);//单选框 高度
@radio-default-label-max-width:  var(~'@{radio-prefix}-default-label-max-width');//单选默认模式 最大宽度
@radio-square-label-max-width:  var(~'@{radio-prefix}-square-label-max-width');//单选框模式 最大宽度
@radio-button-label-max-width:  var(~'@{radio-prefix}-button-label-max-width');//单选按 最大宽度

// spacing
@radio-margin-right:   var(~'@{radio-prefix}-spacing-margin-right',8px);
@radio-square-padding-vertical: var(~'@{radio-prefix}-square-spacing-padding-vertical',6px); //内间距 纵向
@radio-square-padding-horizontal: var(~'@{radio-prefix}-square-spacing-padding-horizontal',12px);//内间距 横向   /单选框 宽度
@radio-padding-left: var(~'@{radio-prefix}-spacing-padding-left',4px);//图标与文字间距


/*! rtl:begin:ignore */




@rate-prefix-cls: ~'@{kd-prefix}-rate';
@rate-icon-prefix-cls: ~'@{rate-prefix-cls}-icon';
.@{rate-prefix-cls} {
  .reset-component;
  display: inline-flex;
  justify-content: flex-start;
  &-size-large {
    font-size: @rate-large-font-size;
  }
  &-size-middle {
    font-size: @rate-middle-font-size;
  }
  &-size-small {
    font-size: @rate-small-font-size;
  }
}
.@{rate-prefix-cls}-item {
  display: inline-flex;
  height: 100%;
  justify-content: center;
  align-items: center;
  line-height: 100%;
  margin-right: @rate-icon-margin;
  .@{rate-icon-prefix-cls} {
    &-view {
      position: relative;
      display: inline-flex;
      transition: transform @rate-transition-duration;
    }
    &-view:hover {
      transform: scale(1.2);
    }
    &-wrapper {
      display: inline-flex;
    }
    &-first {
      display: inline-flex;
      position: absolute;
      top: 0;
      left: 0;
      width: 50%;
      overflow: hidden;
      color: @rate-not-selected-color;
      opacity: 1;
      cursor: pointer;
      transition: color @rate-transition-duration;
    }
    &-first:hover {
      color: @rate-selected-color;
    }
    &-second {
      display: inline-flex;
      color: @rate-not-selected-color;
      opacity: 1;
      cursor: pointer;
      transition: color @rate-transition-duration;
      &-content {
        display: inline-flex;
      }
    }
    &-second:hover {
      color: @rate-selected-color;
    }
    &-selected {
      color: @rate-selected-color;
      opacity: 1;
    }
  }
}
.@{rate-prefix-cls}-item:last-child {
  margin-right: 0;
}

.@{rate-prefix-cls}-disabled {
  pointer-events: none;
}
.@{rate-prefix-cls}-rtl {
  direction: rtl;
  .@{rate-prefix-cls}-item {
    direction: rtl;
    margin-right: 0;
    margin-left: @rate-icon-margin;
    .@{rate-icon-prefix-cls}-view {
      .@{rate-icon-prefix-cls}-first {
        left: auto;
        right: 0;
        .@{rate-icon-prefix-cls}-wrapper {
          .@{kd-prefix}-image {
            position: absolute;
            left: 0;
          }
        }
      }
    }
  }
  .@{rate-prefix-cls}-item:last-child {
    margin-left: 0;
  }
}
/*! rtl:end:ignore */



@rate-prefix: '--@{kd-prefix}-c-rate';

// color
@rate-selected-color: var(~'@{rate-prefix}-color-text-selected', #FEC104); 
@rate-not-selected-color: var(~'@{rate-prefix}-color-text-not-selected', #E5E5E5);

// font
@rate-small-font-size: var(~'@{rate-prefix}-font-size-small', 12px);
@rate-middle-font-size: var(~'@{rate-prefix}-font-size-middle', 16px);
@rate-large-font-size: var(~'@{rate-prefix}-font-size-large', 20px);

// motion
@rate-transition-duration: var(~'@{rate-prefix}-motion-duration', @duration-promptly);

// spacing
@rate-icon-margin: var(~'@{rate-prefix}-spacing-margin-right', 8px);

/*! rtl:begin:ignore */



@quick-search-prefix-cls: ~'@{kd-prefix}-quick-search';
@search-panel-prefix-cls: ~'@{kd-prefix}-search-panel';
@search-prefix-cls: ~'@{kd-prefix}-search';

.@{search-prefix-cls} {
  border-bottom: @search-sizing-border-width solid @quick-search-border-bottom-color;
  &-size-small {
    width: @search-small-width;
  }
  &-size-middle {
    width: @search-middle-width;
  }
  &-size-large {
    width: @search-large-width;
  }

  &-disabled {
    cursor: not-allowed;
  }

  &-borderless {
    border: none !important;
  }

  &-border {
    border: @search-sizing-border-width solid @quick-search-border-bottom-color;
    border-radius: @search-border-radius;
  }

  &-prefix,
  &-suffix {
    font-size: @search-icon-font-size;
    color: @search-icon-color;
  }

  &-focused,
  &:not(.@{search-prefix-cls}-disabled):hover {
    border-color: @search-color-theme;
    .@{search-prefix-cls}-prefix {
      color: @search-color-theme;
    }

    .@{search-prefix-cls}-suffix {
      color: @search-color-theme;
    }
  }
}

.@{quick-search-prefix-cls} {
  display: inline-block;
  max-width: @quick-search-max-width;
  width: @quick-search-default-width;
  height: @quick-search-default-height;
  position: relative;
  border-bottom: @search-sizing-border-width solid @quick-search-border-bottom-color;
  transition: all calc(@search-transition-duration - 0.1s) cubic-bezier(0.4, 0, 0.6, 1);
  &-borderless {
    border: none !important;
  }
  &-border {
    border: @search-sizing-border-width solid @quick-search-border-bottom-color;
    border-radius: @search-border-radius;
  }
  &:hover:not(&-disabled) {
    border-color: @search-color-theme;
    .@{quick-search-prefix-cls}-prefix {
      color: @search-color-theme;
    }
  }
  &-focused:not(&-disabled) {
    max-width: @quick-search-max-width;
    width: 100% !important;
    border-color: @search-color-theme;
    .@{quick-search-prefix-cls}-prefix {
      color: @search-color-theme;
    }
  }
  &-disabled {
    cursor: not-allowed;
  }
  &-prefix {
    margin-right: 4px;
    align-self: center;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    line-height: 1;
    font-size: @search-icon-font-size;
    color: @search-icon-color;
  }
  &-selector {
    cursor: text;
    padding-left: 24px;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    &-disabled {
      cursor: not-allowed;
    }
  }
  &-selection-overflow {
    position: relative;
    display: flex;
    flex: auto;
    flex-wrap: wrap;
    max-width: 100%;
    &-item {
      display: flex;
      position: relative;
      border-radius: 2px;
      border: 1px solid @search-end-color;
      margin: 2px 12px 2px 0;
      cursor: pointer;
      max-width: 100%;
      height: 20px;
      &:hover {
        .@{quick-search-prefix-cls}-selection-overflow-item-del {
          display: block;
        }
      }
      &-tag {
        padding: 0 4px 0 4px;
        flex-shrink: 0;
        max-width: 170px;
        background: @search-end-color;
        line-height: 20px;
        font-size: @quick-search-dropdown-font-size;
        color: @white;
        .ellipsis();
      }
      &-label {
        font-size: @quick-search-dropdown-font-size;
        color: #212121;
        letter-spacing: 0;
        padding: 0 4px;
        align-self: center;
        .ellipsis();
        max-width: @search-tag-max-width;
      }
      &-del {
        height: 14px;
        width: 14px;
        line-height: 1;
        font-size: @search-middle-font-size;
        border-radius: 50%;
        position: absolute;
        right: -7px;
        top: -6px;
        display: none;
        background: @search-color-background;
        &:hover {
          color: @quick-search-selected-tags-del-hover-bg;
        }
      }
    }
  }

  &-selection {
    &-placeholder {
      position: absolute;
      top: 50%;
      left: 0;
      transform: translateY(-50%);
      color: @quick-search-selection-placeholder-color;
      font-size: @search-placeholder-font-size;
      .ellipsis();
    }

    &-search {
      position: relative;
      max-width: 100%;
      margin-top: 2px;
      margin-bottom: 2px;

      &-mirror {
        position: absolute;
        top: 0;
        left: 0;
        z-index: 999;
        white-space: pre;
        visibility: hidden;
      }
    }
  }

  &-input {
    outline: 0;
    border-radius: 0;
    border: none;
    width: 100%;
    background: transparent;
    font-size: @search-input-font-size;
    color: @search-color-text-primary;
    &::placeholder {
      font-size: 12px;
      color: @quick-search-input-color;
      letter-spacing: 0;
    }
  }

  &-dropdown {
    padding: 8px 0;
    margin: 0;
    z-index: @zIndex-popper;
    font-size: @quick-search-dropdown-font-size;
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
    border-radius: @search-dropdown-border-radius;
    background: @search-color-background;
    overflow: auto;
    &-scroll {
      overflow-y: auto;
    }
    &-empty {
      padding: 5px 12px;
    }
    &-desc {
      .dropdown-option();
      .ellipsis();
      color: @quick-search-dropdown-desc-color;
      font-size: @search-dropdown-desc-font-size;
    }
  }

  &-option {
    .dropdown-option();
    .ellipsis();
    cursor: pointer;
    color: @search-color-text-primary;

    &-tag {
      margin-right: 12px;
    }

    &:hover:not(&-selected) {
      background: @search-disabled-contain-bg;
    }
    &-selected:not(&-disabled) {
      background: @quick-search-dropdown-selected-bg;
      .@{quick-search-prefix-cls}-option-tag {
        color: @search-hover-color;
      }
      .@{quick-search-prefix-cls}-option-content {
        color: @search-hover-color;
      }
    }
  }

  &-npl {
    border-top: 1px solid @quick-search-npl-border-color;
    &-loading {
      height: @quick-search-dropdown-option-height;
      line-height: @quick-search-dropdown-option-height;
      display: flex;
      align-items: center;
      overflow: hidden;
      padding-left: @quick-search-dropdown-option-padding-horizontal;
      &-item {
        width: 4px;
        height: 4px;
        margin-right: 5px;
        border-radius: 50% 50% 50% 50%;
        animation: animate_loading 1s infinite;
      }

      &-item:nth-child(1) {
        background-color: @search-dot-color-first;
      }
      &-item:nth-child(2) {
        background-color: @spin-dot-color-second;
      }
      &-item:nth-child(3) {
        background-color: @spin-dot-color-third;
      }
      &-item:nth-child(4) {
        background-color: @spin-dot-color-fourth;
      }
    }
  }
}

.@{search-panel-prefix-cls} {
  width: @search-panel-width;
  border-radius: 4px;
  background: @search-color-background;

  &-wrapper {
    display: flex;
    align-items: center;
    height: @search-panel-height;
    border-radius: 4px;
  }

  &-recommend {
    display: flex;
    align-items: center;
    padding-left: 24px;

    &-icon {
      font-size: 18px;
      margin: 0 8px;
      transition: all calc(@search-transition-duration - 0.1s) cubic-bezier(0.4, 0, 0.6, 1);
    }
  }

  &-type {
    width: 230px;
    max-height: 400px;
    overflow: auto;
    &-list {
      line-height: 30px;
      display: block;
      padding-left: 24px;
      &:hover {
        background: @search-panel-hover-bg;
        color: @search-panel-hover-color;
      }
      &-active {
        color: @search-panel-hover-color;
      }
    }
  }

  &-dropDown {
    height: 400px;
    display: flex;
    border-top: 1px solid @search-panel-border-color;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px;
    transition: all calc(@search-transition-duration - 0.1s) cubic-bezier(0.4, 0, 0.6, 1);

    &-result {
      width: 300px;
      height: 400px;
      border-right: 1px solid @search-panel-border-color;
      &-wrapper {
        max-height: 330px;
        overflow: auto;
        border-bottom: 1px solid @search-panel-border-color;
      }

      &-list {
        display: flex;
        align-items: flex-start;
        height: 48px;
        padding: 5px 13px 2px 17px;
        font-size: 12px;
        line-height: 20px;
        cursor: pointer;
        box-sizing: border-box;

        &:hover {
          background: @search-panel-hover-bg;
        }

        &-active {
          background: @search-panel-hover-bg;
        }

        &-title {
          overflow: hidden;
          display: -webkit-box;
          -webkit-box-orient: vertical;
          white-space: normal;
          text-overflow: ellipsis;
          word-break: break-all;
          -webkit-line-clamp: 1;
        }

        &-type {
          color: @search-color-text-third;
        }

        &-sub-title {
          color: @search-color-text-third;
          white-space: nowrap;
          overflow: hidden;
          text-overflow: ellipsis;
          max-width: 95px;
        }

        img {
          height: 18px;
          width: 18px;
          margin-right: 4px;
          margin-top: 2px;
        }
      }
    }

    &-summary {
      flex: 1;
      align-items: center;
      padding-top: 50px;
      display: flex;
      flex-direction: column;

      &-pic {
        user-select: none;
        position: relative;
        margin-bottom: 20px;
      }
      &-icon {
        position: absolute;
        width: 48px;
        height: 48px;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
      }

      &-title {
        margin-bottom: 10px;
        font-size: @search-middle-font-size;
        color: @search-color-text-primary;
      }

      &-list {
        margin-top: 4px;
        color: @search-color-text-secondary;
        font-size: @search-small-font-size;
        line-height: 20px;
      }
    }

    &-search {
      height: 48px;
      display: flex;
      align-items: center;
      padding-left: 17px;
      font-size: @search-middle-font-size;
      cursor: pointer;

      &:hover {
        background: @search-panel-hover-bg;
      }

      &-active {
        background: @search-panel-hover-bg;
      }

      &-value {
        .ellipsis();
      }
    }

    &-loading {
      margin-left: 30px;
      margin-top: 10px;
      display: flex;
    }
  }

}

.@{search-panel-prefix-cls}-tooltip::before {
  display: none;
}

.@{search-panel-prefix-cls}-tooltip-content {
  height: 100%;
  display: flex;
  align-items: center;
  cursor: pointer;

  &:hover {
    background: @search-panel-hover-bg;
  }
}

.@{quick-search-prefix-cls}-dropdown-wrapper {
  &.topLeft,
  &.bottomLeft {
    &.hidden {
      opacity: 0;
      visibility: hidden;
      transition: all calc(@search-transition-duration - 0.1s) cubic-bezier(0.4, 0, 0.6, 1);
    }
  }

  &.bottomLeft-active {
    padding: 10px 0;
  }
}
/*! rtl:end:ignore */


.dropdown-option() {
  padding-left: @quick-search-dropdown-option-padding-horizontal;
  padding-right: @quick-search-dropdown-option-padding-horizontal;
  line-height: @quick-search-dropdown-option-height;
}

.ellipsis() {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@keyframes SlideDownIn {
  0% {
    transform: scaleY(0.8);
    transform-origin: 0% 0%;
    opacity: 0;
  }
  100% {
    transform: scaleY(1);
    transform-origin: 0% 0%;
    opacity: 1;
  }
}
@keyframes SlideDownOut {
  0% {
    transform: scaleY(1);
    transform-origin: 0% 0%;
    opacity: 1;
  }
  100% {
    transform: scaleY(0.8);
    transform-origin: 0% 0%;
    opacity: 0;
  }
}

@keyframes animate_loading {
  50% {
    transform: scale(1.5, 1.5);
  }

  100% {
    transform: scale(1, 1);
  }
}



@search-prefix: '--@{kd-prefix}-c-search';

// sizing
@search-icon-font-size: var(~'@{search-prefix}-icon-font-size', 16px);
@search-small-width: var(~'@{search-prefix}-sizing-width-small', 200px);
@search-middle-width: var(~'@{search-prefix}-sizing-width-middle', 260px);
@search-large-width: var(~'@{search-prefix}-sizing-width-large', 320px);
@quick-search-default-width: var(~'@{search-prefix}-sizing-width-default', 200px);
@quick-search-default-height: var(~'@{search-prefix}-sizing-height-default', 24px);
@quick-search-max-width: var(~'@{search-prefix}-sizing-width-max', 400px);
@search-panel-width: var(~'@{search-prefix}-panel-sizing-width', 800px);
@search-panel-height: var(~'@{search-prefix}-panel-sizing-height', 60px);
@quick-search-dropdown-option-height: var(~'@{search-prefix}-dropdown-option-sizing-height', 32px);
@search-sizing-border-width: var(~'@{search-prefix}-sizing-border-width', 1px);
@search-tag-max-width: var(~'@{search-prefix}-tag-sizing-max-width');

// color
@search-icon-color: var(~'@{search-prefix}-icon-color', #B2B2B2);
@search-color-theme: var(~'@{search-prefix}-color-theme', @color-theme);
@search-hover-color: var(~'@{search-prefix}-color-hover', #5582F3);
@quick-search-input-color: var(~'@{search-prefix}-input-color-text', @color-disabled);
@quick-search-border-bottom-color: var(~'@{search-prefix}-color-border', @color-border-strong-2);
@quick-search-dropdown-desc-color: var(~'@{search-prefix}-dropdown-desc-color-text', #999999);
@quick-search-npl-border-color: var(~'@{search-prefix}-npl-color-border', #D8D8D8);
@quick-search-selection-placeholder-color: var(~'@{search-prefix}-selection-placeholder-color-text', #B2B2B2);
@search-panel-hover-color: var(~'@{search-prefix}-panel-color-hover', #597cfc);
@search-panel-border-color: var(~'@{search-prefix}-panel-color-border', #E6E8ED);
@search-end-color: var(~'@{search-prefix}-color-end', @color-end);
@search-color-text-primary: var(~'@{search-prefix}-color-text-primary', @color-text-primary);
@search-color-text-secondary: var(~'@{search-prefix}-color-text-secondary', @color-text-secondary);
@search-color-text-third: var(~'@{search-prefix}-color-text-third', @color-text-third);
@search-dot-color-first: var(~'@{search-prefix}-dot-color-first', @color-logo-1);
@search-dot-color-second: var(~'@{search-prefix}-dot-color-second', @color-logo-2);
@search-dot-color-third: var(~'@{search-prefix}-dot-color-third', @color-logo-3);
@search-dot-color-fourth: var(~'@{search-prefix}-dot-color-fourth', @color-logo-4);
@search-placeholder-color-text: var(~'@{search-prefix}-placeholder-color-text', #B2B2B2);
@quick-search-selected-tags-del-hover-bg: var(~'@{search-prefix}-selected-tags-del-color-background-hover', #999999);
@quick-search-dropdown-selected-bg: var(~'@{search-prefix}-dropdown-tags-color-background-selected', #F2F6FF);
@quick-search-dropdown-hover-bg: var(~'@{search-prefix}-dropdown-color-background-hover', @color-hover);
@search-panel-hover-bg: var(~'@{search-prefix}-panel-color-background-hover', #eef3fe);
@search-color-background: var(~'@{search-prefix}-color-background', @color-background);
@search-disabled-contain-bg: var(~'@{search-prefix}-color-background-contain-disabled', @color-background-contain-disabled);

// font
@quick-search-dropdown-font-size: var(~'@{search-prefix}-dropdown-font-size', 12px);
@search-middle-font-size: var(~'@{search-prefix}-font-size-middle', @font-size-middle);
@search-small-font-size: var(~'@{search-prefix}-font-size-small', @font-size-small);
@search-placeholder-font-size: var(~'@{search-prefix}-placeholder-font-size', 12px);
@search-dropdown-desc-font-size: var(~'@{search-prefix}-dropdown-desc-font-size', 12px);
@search-input-font-size: var(~'@{search-prefix}-input-font-size', 12px);

// spacing
@quick-search-dropdown-option-padding-horizontal: var(~'@{search-prefix}-dropdown-option-spacing-padding-horizontal', 12px);

// motion
@search-transition-duration: var(~'@{search-prefix}-motion-duration', @duration-promptly);

// radius
@search-dropdown-border-radius: var(~'@{search-prefix}-dropdown-radius-border', @radius-border);
@search-border-radius: var(~'@{search-prefix}-radius-border', @radius-border);
/*! rtl:begin:ignore */




@select-prefix-cls: ~'@{kd-prefix}-select';

.@{select-prefix-cls} {
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  background-color: transparent;
  cursor: pointer;
  vertical-align: middle;

  &-selector:hover {
    .@{select-prefix-cls}-icon-active {
      color: #3761ca;
    }
  }
  &-visible {
    .@{select-prefix-cls}-icon-active {
      color: #3761ca;
    }

    & div.@{select-prefix-cls}-show-search .@{select-prefix-cls}-selection-item {
      color: @select-placeholder-color;
    }
  }

  &-icon {
    &-arrow {
      display: inline-flex;
      align-items: center;
      vertical-align: middle;
      &-up {
        transform: rotate(180deg);
        transition: transform calc(@transition-duration - 0.1s) @ease;
      }

      &-down {
        transform: rotate(0deg);
        transition: transform calc(@transition-duration - 0.1s) @ease;
      }
    }

    &-clear {
      opacity: 0;
      z-index: 1;
      top: 0;
      bottom: 0;
      display: flex;
      align-items: center;
      position: absolute;
      background: #fff;
      transition: opacity 0.15s ease;
      &:hover {
        color: @select-g-color-border-hover;
      }
    }
  }

  &-focused:not(.@{select-prefix-cls}-error) {
    .focusColor();
  }
  &-placeholder {
    position: absolute;
    color: @select-placeholder-color;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    right: 28px;
    left: 0;
    top: 0;
    bottom: 0;
    pointer-events: none;
    display: flex;
    align-items: center;
  }

  &-borderless {
    border: none;
  }

  &-underline {
    border-bottom: 1px solid @select-g-color-border;
    &:hover:not(.@{select-prefix-cls}-multiple-disabled):not(.@{select-prefix-cls}-single-disabled):not(
        .@{select-prefix-cls}-error
      ) {
      border-bottom: 1px solid @select-g-color-border-hover;
    }
  }

  &-bordered {
    border: 1px solid @select-border-g-color-border;
    padding-left: @select-bordered !important;
    border-radius: @select-border-radius-border;
    &:hover:not(.@{select-prefix-cls}-multiple-disabled):not(.@{select-prefix-cls}-single-disabled):not(
        .@{select-prefix-cls}-error
      ) {
      border: 1px solid @select-g-color-border-hover;
    }

    .@{select-prefix-cls}-suffix {
      padding-right: 8px;
    }

    &.@{select-prefix-cls}-single {
      .@{select-prefix-cls}-selection-search {
        padding-left: @select-bordered;
      }
    }

    .@{select-prefix-cls}-placeholder {
      padding-left: @select-bordered;
    }
  }

  &-wrapper {
    transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    padding: @select-wrapper-padding;
    max-width: 100%;
    color: #212121;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    cursor: pointer;
    box-sizing: border-box;
    overflow-y: auto;
    overflow-x: hidden;
    position: relative;
  }

  &-show-search {
    cursor: text;

    &.@{select-prefix-cls}-single .@{select-prefix-cls}-selection-search {
      .@{select-prefix-cls}-selection-search-input {
        cursor: text;
      }
    }
  }

  &-dropdown {
    display: block;
    left: 0;
    z-index: @select-z-index;
    box-sizing: border-box;
    padding: @select-dropdown-padding-vertical 0;
    margin: 0;
    overflow: auto;
    font-size: @select-list-font-size;
    font-variant: initial;
    background-color: @select-dropdown-bg;
    border-radius: @select-g-radius-border;
    outline: none;
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);

    &-scroll {
      overflow-y: auto;
    }

    &-empty {
      padding: 5px 12px;
    }

    // 搜索框
    &-search {
      padding: 5px 6px;
      &-hidden {
        display: none;
      }
    }
  }

  &-multiple-dropdown-panel {
    .@{select-prefix-cls}-dropdown:not(.@{select-prefix-cls}-dropdown-no-data) {
      padding-bottom: 0;
    }
  }

  // 下拉列表选项
  &-item {
    .item();
    cursor: pointer;
    transition: background 0.3s ease;

    &-option {
      display: flex;
      min-width: 75px;

      &-content {
        max-width: @select-item-max-width;
        .over();

        .@{kd-prefix}-checkbox {
          width: 100%;
          display: flex;

          .@{kd-prefix}-checkbox-children {
            display: inline-block;
          }
        }
      }

      &-active:not(&-disabled) {
        background-color: @select-item-active-bg;
      }

      &-selected:not(&-disabled) {
        color: @select-item-selected-color;
        background-color: @select-item-selected-bg;
      }

      &-disabled {
        color: @select-g-item-text-color-disabled;
        cursor: not-allowed;
        background-color: @select-disabled-option-bg;
      }
    }
  }

  // 选择器框大小
  &-size-small {
    .select-input-size(@select-small-height, @select-small-height, @select-small-line-height, @select-small-font-size);
  }

  &-size-middle {
    .select-input-size(@select-middle-height, @select-middle-height, @select-middle-line-height, @select-middle-font-size);
  }

  &-size-large {
    .select-input-size(@select-large-height, @select-large-height, @select-large-line-height, @select-large-font-size);
  }

  &-suffix {
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    display: flex;
    flex: 0;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin-left: 8px;
  }
  .@{select-prefix-cls}-single {
    .@{select-prefix-cls}-selection {
      &-search {
        position: absolute;
        right: 28px;
        left: 0;
        height: 100%;
        top: 0;
        bottom: 0;
        display: flex;
        align-items: center;
        &-input {
          outline: 0;
          border-radius: 0;
          border: none;
          background: transparent;
          height: 100%;
          width: 100%;
          cursor: pointer;
        }
      }
      &-item {
        display: inline-block;
        .over();
      }
    }
    &-focused:not(.@{select-prefix-cls}-error) {
      .focusColor();
    }
    &-disabled {
      background-color: @select-color-background-disabled;
      color: @select-color-text-disabled;
      &:hover {
        cursor: not-allowed;
      }

      .@{select-prefix-cls}-suffix {
        color: @select-arrow-icon-color-text-disabled;
      }
    }

    .@{select-prefix-cls}-icon-clear {
      color: @select-clear-color;
      &:hover {
        color: @select-clear-color-hover;
      }
    }
    &-text {
      color: @select-single-color-text;
      .over();
    }
    &-disabled-text {
      color: @select-color-text-disabled;
    }
  }

  .@{select-prefix-cls}-single-isnotMobile:hover .@{select-prefix-cls}-icon-clear {
    opacity: 1;
  }

  .@{select-prefix-cls}-single-isMobile {
    .@{select-prefix-cls}-icon-clear {
      opacity: 1;
    }
  }
  .@{select-prefix-cls}-selection-item {
    display: inline-flex;
    box-sizing: border-box;
    align-items: center;
    vertical-align: middle;
    max-width: 100%;
    cursor: default;
    user-select: none;
    &.@{select-prefix-cls}-selection-item-small {
      height: 20px;
      line-height: 18px;
      font-size: 12px;
    }

    &.@{select-prefix-cls}-selection-item-middle {
      font-size: 12px;
      height: 20px;
      line-height: 18px;
    }

    &.@{select-prefix-cls}-selection-item-large {
      font-size: 14px;
      line-height: 22px;
      height: 22px;
    }

    &-content {
      display: inline-flex;
      align-items: center;
      vertical-align: middle;
      padding: 0 7px;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      border: 1px solid #ccc;
      color: #212121;
    }

    &-span {
      position: relative;
      margin-left: 0.5px;
      box-sizing: border-box;
    }
    &-input {
      cursor: text;
      margin: 0;
      padding: 0;
      background: 0 0;
      border: none;
      outline: none;
      appearance: none;
      width: 100%;
      min-width: 20px;
    }
  }

  // 多选
  &-multiple {
    .@{select-prefix-cls}-selection {
      &-tag {
        max-width: calc(100% - 5px);

        .@{kd-prefix}-tag {
          margin: 2px 8px 2px 0;
          max-width: 100%;
        }
      }
      &-search {
        position: relative;
        max-width: 100%;
        &-input {
          outline: 0;
          border-radius: 0;
          border: none;
          background: transparent;
          width: 100%;
        }
        &-mirror {
          position: absolute;
          top: 0;
          left: 0;
          z-index: 999;
          white-space: pre;
          visibility: hidden;
        }
      }
    }
    &-disabled {
      cursor: not-allowed;
      background-color: @select-color-background-disabled;
      color: @select-color-text-disabled;

      .@{select-prefix-cls}-suffix {
        color: @select-arrow-icon-color-text-disabled;
      }
    }
    &:hover .@{select-prefix-cls}-icon-clear {
      opacity: 1;
    }
    .@{select-prefix-cls}-icon-clear {
      color: @select-clear-color;
      &:hover {
        color: @select-clear-color-hover;
      }
    }
    &-selector {
      position: relative;
      cursor: text;
      padding-right: 24px;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
    }
    .@{select-prefix-cls}-wrapper {
      &:hover:not(.@{select-prefix-cls}-multiple-disabled) {
        border-bottom: 1px solid @select-g-color-border-hover;
      }
    }

    &-footer {
      color: @select-font-color;
      display: inline-flex;
      align-items: center;
      width: 100%;
      padding: 0 12px;
      height: 40px;
      line-height: 30px;
      border-top: 1px solid #d9d9d9;
      box-sizing: border-box;

      &-hadSelected {
        color: #999999;
        padding-left: 12px;
        &-number {
          color: @select-footer-g-text-color-selected;
          padding: 0 2px;
        }
      }
    }
  }

  &-error:not(.@{select-prefix-cls}-single-disabled):not(.@{select-prefix-cls}-multiple-disabled) {
    border-color: @select-error-color;
  }

  &-dropdown-panel {
    &.topLeft.hidden,
    &.bottomLeft.hidden,
    &.topRight.hidden,
    &.bottomRight.hidden {
      opacity: 0;
      visibility: hidden;
      transition: all calc(@transition-duration - 0.1s) @ease;
    }
  }
}
.@{select-prefix-cls}-rtl {
  direction: rtl;
  .@{select-prefix-cls}-selector {
    .@{select-prefix-cls}-wrapper {
      padding: 1px 0 1px 28px;
      .@{select-prefix-cls}-suffix {
        position: absolute;
        right: auto;
        left: 0;
        margin-left: 0;
        margin-right: 8px;
      }
      .@{select-prefix-cls}-placeholder {
        right: 0;
        left: 28px;
      }
      &.@{select-prefix-cls}-single {
        .@{select-prefix-cls}-selection-search {
          padding-left: auto;
          position: absolute;
          left: 28px;
          right: 0;
          height: 100%;
          top: 0;
          bottom: 0;
        }
      }
    }
    .@{select-prefix-cls}-multiple {
      .@{select-prefix-cls}-selection-tag {
        .@{kd-prefix}-tag {
          margin: 2px 0 2px 8px;
          &-closeWrapper {
            margin-right: 4px;
            margin-left: 0;
          }
        }
      }
    }
    .@{select-prefix-cls}-bordered {
      padding-left: auto !important;
      padding-right: @select-bordered !important;
      .@{select-prefix-cls}-suffix {
        padding-left: 8px;
      }

      &.@{select-prefix-cls}-single {
        .@{select-prefix-cls}-selection-search {
          padding-right: @select-bordered;
        }
      }

      .@{select-prefix-cls}-placeholder {
        padding-right: @select-bordered;
      }
    }
  }
  .@{select-prefix-cls}-dropdown {
    .@{select-prefix-cls}-multiple-footer {
      &-hadSelected {
        padding-right: 12px;
        padding-left: 0;
      }
      .@{kd-prefix}-checkbox {
        &-default-margin {
          margin-right: 0;
          margin-left: 4px;
        }
      }
    }
  }
}

.@{select-prefix-cls}-item-rtl {
  direction: rtl;
  &.@{select-prefix-cls}-item {
    .@{select-prefix-cls}-item-option-content {
      .@{kd-prefix}-checkbox {
        &-default-margin {
          margin-right: 0;
          margin-left: 4px;
        }
      }
    }
  }
}
/*! rtl:end:ignore */



.item() {
  position: relative;
  display: block;
  font-weight: normal;
  font-size: @select-list-font-size; // update
  min-height: @select-dropdown-height; // update
  padding: 5px 12px; // update
  color: @select-font-color; // update
  line-height: @select-dropdown-line-height; // update
}

.focusColor() {
  border-color: @select-g-color-border-foucs !important;
}

.select-input-size(@height, @maxHeight, @lineHeight, @fontSize) {
  min-height: @height;
  max-height: calc(@maxHeight * 3 - 10px);
  font-size: @fontSize;

  .@{select-prefix-cls}-selection-item {
    min-height: calc(@height - 4px);
    line-height: calc(@height - 4px);
  }
}

.over() {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

@keyframes SlideDownIn {
  0% {
    transform: scaleY(0.8);
    transform-origin: 0% 0%;
    opacity: 0;
  }
  100% {
    transform: scaleY(1);
    transform-origin: 0% 0%;
    opacity: 1;
  }
}
@keyframes SlideDownOut {
  0% {
    transform: scaleY(1);
    transform-origin: 0% 0%;
    opacity: 1;
  }
  100% {
    transform: scaleY(0.8);
    transform-origin: 0% 0%;
    opacity: 0;
  }
}

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

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



@select-custom-prefix: ~'--@{kd-prefix}-c-select';

// color
@select-dropdown-bg: var(~'@{select-custom-prefix}-dropdown-color-background', @color-background);
@select-disabled-option-bg: var(~'@{select-custom-prefix}-item-color-background-disabled', #fff);
@select-item-active-bg: var(~'@{select-custom-prefix}-color-background', #f5f5f5);
@select-item-selected-bg: var(~'@{select-custom-prefix}-color-background-selected', @color-theme-3);
@select-g-color-border: var(~'@{select-custom-prefix}-color-border', @color-input);
@select-g-color-border-foucs: var(~'@{select-custom-prefix}-color-border-foucs', @color-theme);
@select-g-color-border-hover: var(~'@{select-custom-prefix}-color-border-hover', @color-theme);
@select-border-g-color-border: var(~'@{select-custom-prefix}-border-color-border', @color-border-strong);
@select-placeholder-color: var(~'@{select-custom-prefix}-placeholder-color-text', #b2b2b2);
@select-item-selected-color: var(~'@{select-custom-prefix}-item-color-text-selected', @color-theme);
@select-font-color: var(~'@{select-custom-prefix}-footer-color-text', @color-text-primary);
@select-footer-g-text-color-selected: var(~'@{select-custom-prefix}-footer-color-text-selected', #0e5fd8);
@select-g-item-text-color-disabled: var(~'@{select-custom-prefix}-item-color-text-disabled', @color-disabled);
@select-color-background-disabled: var(~'@{select-custom-prefix}-color-background-disabled', #f5f5f5);
@select-color-text-disabled: var(~'@{select-custom-prefix}-color-text-disabled', @color-disabled);
@select-arrow-icon-color-text-disabled: var(~'@{select-custom-prefix}-arrow-icon-color-text-disabled', #b2b2b2);
@select-single-color-text: var(~'@{select-custom-prefix}-single-color-text', @color-text-primary);
@select-clear-color: var(~'@{select-custom-prefix}-icon-clear-color-text', #666);
@select-clear-color-hover: var(~'@{select-custom-prefix}-icon-clear-color-text-hover', @color-theme);
@select-error-color: var(~'@{select-custom-prefix}-color-error', @color-error);

// font
@select-list-font-size: var(~'@{select-custom-prefix}-dropdown-font-size', 12px); // 下拉列表文字大小
@select-large-font-size: var(~'@{select-custom-prefix}-font-size-large', 16px); // 大号字体
@select-middle-font-size: var(~'@{select-custom-prefix}-font-size-middle', 14px); // 中号高度
@select-small-font-size: var(~'@{select-custom-prefix}-font-size-small', 12px); // 小号高度

// line-height
@select-dropdown-line-height: var(~'@{select-custom-prefix}-dropdown-line-height', 22px);
@select-large-line-height: var(~'@{select-custom-prefix}-line-height-large', 28px);
@select-middle-line-height: var(~'@{select-custom-prefix}-line-height-middle', 22px);
@select-small-line-height: var(~'@{select-custom-prefix}-line-height-small', 14px);

// sizing
@select-dropdown-height: var(~'@{select-custom-prefix}-item-sizing-height', 22px);
@select-large-height: var(~'@{select-custom-prefix}-sizing-height-large', 36px); // 大号高度 lh:28px
@select-middle-height: var(~'@{select-custom-prefix}-sizing-height-middle', 30px); // 中号高度lh:22px
@select-small-height: var(~'@{select-custom-prefix}-sizing-height-small', 24px); // 小号高度lh:12px
@select-item-max-width: var(~'@{select-custom-prefix}-item-sizing-max-width');

// spacing
@select-bordered: var(~'@{select-custom-prefix}-bordered-spacing-padding-left', 8px);
@select-wrapper-padding: var(~'@{select-custom-prefix}-wrapper-spacing-padding', 1px 28px 1px 0);
@select-dropdown-padding-vertical: var(~'@{select-custom-prefix}-dropdown-spacing-padding-vertical', 8px);

// radius
@select-g-radius-border: var(~'@{select-custom-prefix}-radius-border', @radius-border);
@select-border-radius-border: var(~'@{select-custom-prefix}-bordered-radius-border', 2px);

// z-index
@select-z-index: var(~'@{select-custom-prefix}-z-index', @z-index-popper);

/*! rtl:begin:ignore */


@signature-prefix-cls: ~'@{kd-prefix}-signature';
@signature-board-prefix-cls: ~'@{kd-prefix}-signature-drawing-board';

.@{signature-prefix-cls} {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  &-image {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    img {
      width: 100%;
      height: 100%;
    }
  }
  &-empty {
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    border: 1px dashed #e5e5e5;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    background: @signature-bg-color;
    color: @signature-color-text;
    font-size: @signature-font-size;
    cursor: pointer;
    border-radius: @signature-border-radius;
    transition: border-color @signature-transition-duration, background-color @signature-transition-duration;
    &:hover {
      border-color: @signature-border-color-hover;
      background-color: @signature-bg-color-hover;
    }
  }
}
.@{signature-prefix-cls}.@{signature-prefix-cls}-disabled {
  cursor: not-allowed;
  border: 1px solid @color-border-disabled;
  background: @signature-bg-color;
  color: @signature-color-text;
}

.@{signature-board-prefix-cls} {
  width: 100%;
  height: 100%;
  border: 1px solid #e5e5e5;
  box-sizing: border-box;
  background: @signature-drawing-board-bg-color;
  position: relative;
  &-operation {
    display: flex;
    align-items: center;
    position: absolute;
    top: 9px;
    right: 9px;
    color: #b2b2b2;
    z-index: 9999;
    & > * {
      cursor: pointer;
    }
    & > *:not(:last-child) {
      margin-right: 13px;
    }
    span:nth-of-type(2) {
      transform: scaleX(-1) !important;
    }
  }
  &-operation.enabled {
    color: #666666;
  }
  &-tip {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: @signature-board-tip-color;
    font-size: 12px;
    user-select: none;
  }
}
.@{signature-prefix-cls}-modal {
  .kd-modal-header {
    position: relative;
  }
  &-footer {
    .kd-btn:not(:last-child) {
      margin-right: 12px;
    }
  }
  .kd-modal-expand-icon {
    position: absolute;
    right: 43.5px;
    font-size: 14px;
    cursor: pointer;
  }
}
.@{signature-prefix-cls}-modal.@{signature-prefix-cls}-modal-fullscreen {
  .kd-modal-container-box {
    width: 90vw !important;
    height: 90vh !important;
    top: 5vh;
    left: 5vw;
    transform: none !important;
  }
}
.@{signature-prefix-cls}-rtl {
  direction: rtl;
  &.@{signature-prefix-cls}-modal {
    .@{signature-prefix-cls}-modal-footer {
      .kd-btn:not(:last-child) {
        margin-right: 0;
        margin-left: 12px;
      }
    }
    .kd-modal-expand-icon {
      left: 43.5px;
      right: auto;
    }
  }
  .@{signature-board-prefix-cls} {
    &-operation {
      top: 9px;
      left: 9px;
      right: auto;
      & > * {
        cursor: pointer;
      }
      & > *:not(:last-child) {
        margin-left: 13px;
        margin-right: 0;
      }
    }
  }
}
/*! rtl:end:ignore */



.signature() {
  color: @signature-color-text;
  font-size: @signature-font-size;
}



@signature-custom-prefix: ~'--@{kd-prefix}-c-signature';

// color
@signature-color-text: var(~'@{signature-custom-prefix}-color-text', #999999);
@signature-bg-color: var(~'@{signature-custom-prefix}-bg-color', #fafafa);
@signature-border-color: var(~'@{signature-custom-prefix}-border-color-hover', @color-theme-hover);
@signature-border-color-hover: var(~'@{signature-custom-prefix}-border-color-hover', @color-theme-hover);
@signature-border-color-disabled: var(~'@{signature-custom-prefix}-border-color-disabled', @color-border-disabled);
@signature-bg-color-hover: var(~'@{signature-custom-prefix}-bg-color-hover', @color-theme-1);
@signature-drawing-board-bg-color:var(~'@{signature-custom-prefix}-drawing-board-bg-color', #fafafa);
@signature-board-tip-color: var(~'@{signature-custom-prefix}-board-tip-color', #b2b2b2);
// font
@signature-font-size: var(~'@{signature-custom-prefix}-font-size', 12px);

// motion
@signature-transition-duration: var(~'@{signature-custom-prefix}-motion-duration', @duration-promptly);

// radius
@signature-border-radius: var(~'@{signature-custom-prefix}-border-radius', @radius-border);


/*! rtl:begin:ignore */


@slider-prefix-cls: ~'@{kd-prefix}-slider';

.@{slider-prefix-cls} {
  .slider();

  &-rail {
    position: absolute;
    width: 100%;
    height: 4px;
    background-color: @slider-trail-color-background;
    border-radius: 2px;
  }
  
  &-track {
    position: absolute;
    height: 4px;
    background-color: @slider-track-color-background;
  }
  
  &-step {
    position: absolute;
    width: 100%;
  }
  
  &-dot {
    .slider-dot();
  }

  &-dot.@{slider-prefix-cls}-dot-actived {
    border-color: @slider-dot-color-border-actived;
  }

  &-handle {
    .slider-handle();
  }

  &-mark {
    position: absolute;
    width: 100%;
    top: 14px;
  }

  &-mark-text {
    position: absolute;
    display: inline-block;
    color: @slider-mark-text-color;
    word-break: keep-all;
    cursor: pointer;
    user-select: none;
    transform: translateX(-50%);
  }

  &-mark-text.@{slider-prefix-cls}-mark-text-actived {
    color: @slider-mark-text-color-actived;
  }

  &:hover > &-rail{
    background-color: #e1e1e1;
  }

  &:not(&-disabled):hover > &-handle{
    border-color: @slider-handle-color-border-hover;
  }

  &:not(&-disabled):hover &-track{
    background-color: @slider-track-color-background-hover;
  }

  &-reverse {
    .@{slider-prefix-cls}-dot {
      top: -2px;
      margin-right: -4px;
      margin-left: 0;
    }

    .@{slider-prefix-cls}-mark-text {
      transform: translateX(50%);
    }
  }

  &-reverse.@{slider-prefix-cls}-handle {
    top: -1px;
    margin-right: -7px;
    margin-left: 0;
  }

  &-vertical {
    .slider-vertical();

    .@{slider-prefix-cls}-rail {
      width: 4px;
      height: 100%;
    }

    .@{slider-prefix-cls}-track {
      width: 4px;
    }

    .@{slider-prefix-cls}-step {
      width: 4px;
      height: 100%;
    }

    .@{slider-prefix-cls}-dot {
      top: auto;
      margin-left: 0;
      left: -2px;
      margin-bottom: -4px;
    }

    .@{slider-prefix-cls}-mark {
      width: 4px;
      height: 100%;
      top: auto;
      left: 14px;
    }

    .@{slider-prefix-cls}-mark-text {
      transform: translate(0, -50%);
    }

    .@{slider-prefix-cls}-handle {
      left: -1px;
      margin-left: 0;
      margin-bottom: -7px;
    }

    
    .@{slider-prefix-cls}-reverse {
      .@{slider-prefix-cls}-dot {
        top: auto;
        margin-left: 0;
        left: -2px;
        margin-top: -4px;
      }
      
      .@{slider-prefix-cls}-mark-text {
        transform: translate(0, 50%);
      }
    }

    .@{slider-prefix-cls}-reverse.@{slider-prefix-cls}-handle {
      margin-left: 0;
      margin-top: -7px;
    }
  }

  &-disabled {
    cursor: not-allowed;

    .@{slider-prefix-cls}-track {
      background-color: @slider-track-color-background-disabled;
    }

    .@{slider-prefix-cls}-dot {
      border-color: @slider-dot-color-border-disabled;
      cursor: not-allowed;
    }

    .@{slider-prefix-cls}-handle {
      border-color: @slider-handle-color-border-disabled;
      cursor: not-allowed;
    }
  }
}
.@{slider-prefix-cls}-rtl {
  direction: rtl;
}
/*! rtl:end:ignore */


.slider {
  position: relative;
  box-sizing: border-box;
  height: 12px;
  margin: 10px 6px;
  padding: 4px 0;
  cursor: pointer;
  touch-action: none;
}
.slider-vertical {
  width: 12px;
  height: 100%;
  margin: 6px 10px;
  padding: 0 4px;
}
.slider-dot {
  position: absolute;
  top: -2px;
  margin-left: -4px;
  display: block;
  box-sizing: border-box;
  width: 8px;
  height: 8px;
  background-color: #fff;
  border: 2px solid #f0f0f0;
  border-radius: 50%;
  cursor: pointer;
}
.slider-handle {
  position: absolute;
  top: -1px;
  margin-left: -7px;
  width: 14px;
  height: 14px;
  box-sizing: border-box;
  background-color: #fff;
  border: 2px solid @slider-handle-color-border;
  border-radius: 50%;
  cursor: pointer;
}


@slider-custom-prefix: ~'--@{kd-prefix}-c-slider';

// color
@slider-trail-color-background: var(~'@{slider-custom-prefix}-trail-color-background', @color-border-weak);
@slider-track-color-background: var(~'@{slider-custom-prefix}-track-color-background', @color-theme);
@slider-track-color-background-hover: var(~'@{slider-custom-prefix}-track-color-background-hover', @color-theme-hover);
@slider-track-color-background-disabled: var(~'@{slider-custom-prefix}-track-color-background-hover', @color-disabled);
@slider-handle-color-border: var(~'@{slider-custom-prefix}-handle-color-border', @color-theme);
@slider-handle-color-border-hover: var(~'@{slider-custom-prefix}-handle-color-border-hover', @color-theme-hover);
@slider-handle-color-border-disabled: var(~'@{slider-custom-prefix}-handle-color-border-hover', @color-disabled);
@slider-dot-color-border: var(~'@{slider-custom-prefix}-dot-color-border', @color-theme);
@slider-dot-color-border-actived: var(~'@{slider-custom-prefix}-dot-color-border-actived', @color-theme);
@slider-dot-color-border-disabled: var(~'@{slider-custom-prefix}-dot-color-border-actived', @color-disabled);
@slider-mark-text-color: var(~'@{slider-custom-prefix}-mark-color-text', @color-text-primary);
@slider-mark-text-color-actived: var(~'@{slider-custom-prefix}-mark-color-text-actived', @color-text-primary-2);

/*! rtl:begin:ignore */



@space-prefix-cls: ~'@{kd-prefix}-space';

.@{space-prefix-cls} {
  display: flex;
  row-gap: var(--rgap);

  &.@{space-prefix-cls}-horizontal {
    > *:not(:last-child) {
      margin-right: var(--cgap);
    }
  }

  &.@{space-prefix-cls}-vertical {
    flex-direction: column;
    > *:not(:last-child) {
      margin-bottom: var(--cgap);
    }
  }

  &.@{space-prefix-cls}-wrap {
    flex-wrap: wrap;
  }

  &.@{space-prefix-cls}-align-start {
    align-items: flex-start;
  }

  &.@{space-prefix-cls}-align-center {
    align-items: center;
  }

  &.@{space-prefix-cls}-align-end {
    align-items: flex-end;
  }

  &.@{space-prefix-cls}-align-baseline {
    align-items: baseline;
  }
}
.@{space-prefix-cls}-rtl {
  direction: rtl;
  &.@{space-prefix-cls}-horizontal {
    > *:not(:last-child) {
      margin-left: var(--cgap);
      margin-right: 0;
    }
  }
}
/*! rtl:end:ignore */

/*! rtl:begin:ignore */



@spin-prefix-cls: ~'@{kd-prefix}-spin';

.@{spin-prefix-cls} {
  // 页面加载动画
  &-page {
    // position: absolute;
    // top: 0;
    // left: 0;
    // bottom: 0;
    // right: 0;

    .@{spin-prefix-cls}-dot-spin {
      width: @spin-page-dot-spin-sizing;
      height: @spin-page-dot-spin-sizing;
      padding: @spin-page-dot-spin-spacing-padding;
      // background: @logo-color-1;
      box-sizing: border-box;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      align-content: space-between;
    }

    .@{spin-prefix-cls}-dot-item {
      .dot(@spin-page-dot-item-sizing, @spin-dot-color-first);

      &:nth-child(2n+1) {
        animation: pageLoading 1s .3s ease-in-out infinite
      }

      &:nth-child(2n+2) {
        background-color: @spin-dot-color-second;
        animation: pageLoading 1s .2s ease-in-out infinite
      }

      &:nth-child(2n+3) {
        background-color: @spin-dot-color-third;
        animation: pageLoading 1s .1s ease-in-out infinite
      }

      &:nth-child(2n+4) {
        background-color: @spin-dot-color-fourth;
        animation: pageLoading 1s ease-in-out infinite
      }

      @keyframes pageLoading {
        50% {
          transform: scale(1.25);
        }
        100% {
          transform: scale(1);
        }
      }
    }
  }

  // 容器加载动画
  &-container {
    .@{spin-prefix-cls}-dot-spin {
      display: flex;
      height: 15px;
      width: 35px;
      justify-content: space-between;
      align-items: flex-end;

      .@{spin-prefix-cls}-dot-item {
        .dot(@spin-container-size, @spin-dot-color-first);

        &:nth-child(2n+1) {
          animation: containerLoading 1s .6s ease-in-out infinite
        }

        &:nth-child(2n+2) {
          background-color: @spin-dot-color-second;
          animation: containerLoading 1s .45s ease-in-out infinite
        }

        &:nth-child(2n+3) {
          background-color: @spin-dot-color-third;
          animation: containerLoading 1s .3s ease-in-out infinite
        }

        &:nth-child(2n+4) {
          background-color: @spin-dot-color-fourth;
          animation: containerLoading 1s .15s ease-in-out infinite
        }

        @keyframes containerLoading {
          50% {
            transform: translateY(-10px);
          }
          100% {
            transform: translateY(0);
          }
        }
      }
    }
  }

  // 组件加载动画
  &-component {
    .@{spin-prefix-cls}-dot-spin {
      width: @spin-component-spin-size;
      height: @spin-component-spin-size;
      border: @spin-component-spin-border solid @spin-component-dot-color-border;
      border-radius: 50%;
      position: relative;
      box-sizing: border-box;

      .@{spin-prefix-cls}-dot-item {
        width: @spin-component-spin-size;
        height: @spin-component-spin-size;
        box-sizing: border-box;
        border: @spin-component-spin-border solid transparent;
        // border-top-color: #5582f3;
        border-right-color: @spin-component-dot-item-color-border;
        border-radius: 50%;
        position: absolute;
        top: calc(-1 * @spin-component-spin-border);
        left: calc(-1 * @spin-component-spin-border);
        transform: rotate(-45deg);
        animation: componentRotate 1s linear infinite;

        @keyframes componentRotate {
          0% {
            transform: rotate(-45deg);
          }
          100% {
            transform: rotate(315deg);
          }
        }
      }
    }
  }

  // 内容内嵌
  &-children-wrapper {
    position: relative;
  }

  &-has-children {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1;
  }

  &-children-container {
    opacity: .5;
    user-select: none;
    pointer-events: none;
  }

  // 带提示文字时居中显示
  &-indicator-container {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
}
.@{spin-prefix-cls}-rtl {
  // direction: rtl;
  &.@{spin-prefix-cls} {
    &.@{spin-prefix-cls}-container {
      .@{spin-prefix-cls}-dot-spin {
       
        .@{spin-prefix-cls}-dot-item {
  
          &:nth-child(2n+1) {
            animation: containerLoading 1s .15s ease-in-out infinite
          }
  
          &:nth-child(2n+2) {
            background-color: @spin-dot-color-second;
            animation: containerLoading 1s .3s ease-in-out infinite
          }
  
          &:nth-child(2n+3) {
            background-color: @spin-dot-color-third;
            animation: containerLoading 1s .45s ease-in-out infinite
          }
  
          &:nth-child(2n+4) {
            background-color: @spin-dot-color-fourth;
            animation: containerLoading 1s .6s ease-in-out infinite
          }
  
          @keyframes containerLoading {
            50% {
              transform: translateY(-10px);
            }
            100% {
              transform: translateY(0);
            }
          }
        }
      }
    }
  }
  &.@{spin-prefix-cls}-component {
    .@{spin-prefix-cls}-dot-spin {
      .@{spin-prefix-cls}-dot-item {
        right: calc(-1 * @spin-component-spin-border);
        left: calc(-1 * @spin-component-spin-border);
        animation: rtlComponentRotate 1s linear infinite;

        @keyframes rtlComponentRotate {
          0% {
            transform: rotate(315deg);
          }
          100% {
            transform: rotate(-45deg);
          }
        }
      }
    }
  }
}
/*! rtl:end:ignore */


// code component mixin here
.dot(@size, @color) {
  width: @size;
  height: @size;
  background-color: @color;
  border-radius: 50%;
}



@spin-custom-prefix: ~'--@{kd-prefix}-c-spin';

// color
@spin-dot-color-first: var(~'@{spin-custom-prefix}-dot-color-backgroung-first', @color-logo-1);
@spin-dot-color-second: var(~'@{spin-custom-prefix}-dot-color-backgroung-second', @color-logo-2);
@spin-dot-color-third: var(~'@{spin-custom-prefix}-dot-color-backgroung-third', @color-logo-3);
@spin-dot-color-fourth: var(~'@{spin-custom-prefix}-dot-color-backgroung-fourth', @color-logo-4);
@spin-component-dot-color-border: var(~'@{spin-custom-prefix}-component-dot-color-border', #ebebeb);
@spin-component-dot-item-color-border: var(~'@{spin-custom-prefix}-component-dot-item-color-border', @color-theme);

// sizing
@spin-page-dot-item-sizing: var(~'@{spin-custom-prefix}-page-dot-item-sizing-square', 16px);
@spin-page-dot-spin-sizing: var(~'@{spin-custom-prefix}-page-dot-spin-sizing-square', 48px);
@spin-container-size: var(~'@{spin-custom-prefix}-dot-container-sizing-square', 5px);
@spin-component-spin-size: var(~'@{spin-custom-prefix}-dot-component-sizing-square', 24px);
@spin-component-spin-border: var(~'@{spin-custom-prefix}-dot-component-sizing-border', 2px);

// spacing
@spin-page-dot-spin-spacing-padding: var(~'@{spin-custom-prefix}-page-dot-spin-spacing-padding', 4px);






@split-prefix-cls: ~'@{kd-prefix}-split';
@split-panel-padding-base: calc(@split-panel-trigger-line-width / 2);

.@{split-prefix-cls} {
    &-wrapper {
        position: relative;
        width: 100%;
        height: 100%;
        border: @split-panel-wrapper-border-width solid @split-panel-trigger-border-color;
        overflow: hidden;
    }
    &-panel {
        position: absolute;
        overflow: hidden;
        &.left-panel, &.right-panel {
            top: 0;
            bottom: 0;
        }
        &.left-panel {
            left: 0;
            margin-right: @split-panel-padding-base;
        }
        &.right-panel {
            right: 0;
            margin-left: @split-panel-padding-base;
        }
        &.top-panel, &.bottom-panel {
            left: 0;
            right: 0;
        }
        &.top-panel {
            top: 0;
            margin-bottom: @split-panel-padding-base;
        }
        &.bottom-panel {
            bottom: 0;
            margin-top: @split-panel-padding-base;
        }
        &-moving {
          -webkit-user-select: none;
          -moz-user-select: none;
          -ms-user-select: none;
          user-select: none;
        }
    }
    &-trigger {
        &-con {
          position: absolute;
          transform: translate(-50%, -50%);
          z-index: 10;
          &.is-active {
            .@{split-prefix-cls}-trigger-arrow {
              border-color: @split-panel-trigger-arrow-color;
              background: @split-panel-trigger-arrow-color;
              color: white;
            }
          }
          &.can-drag{
            .@{split-prefix-cls}-trigger-vertical {
              cursor: col-resize;
            }
            .@{split-prefix-cls}-trigger-horizontal {
              cursor: row-resize;
            }
          }
          &.is-disabled{
            .@{split-prefix-cls}-trigger-vertical {
              cursor: not-allowed;
            }
          }
          &:not(.is-disabled) {
            &:hover{
              .@{split-prefix-cls}-trigger-arrow {
                border-color: @split-panel-trigger-arrow-color;
              }
            }
            .@{split-prefix-cls}-trigger-arrow:hover {
              cursor: pointer;
              background: #fff !important;
              color: @split-panel-trigger-arrow-hover-color !important;
              border-color: @split-panel-trigger-arrow-hover-color !important;
            }
          }
        }
        &-arrow {
          position: absolute;
          color: @split-panel-trigger-arrow-color;
          display: inline-flex;
          align-items: center;
          justify-content: center;
          box-sizing: border-box;
          border: @split-panel-arrow-border-width solid transparent;
          .@{kd-prefix}icon {
            font-size: 12px;
          }
          &.is-vertical {
              width: @split-panel-arrow-vertical-width;
              height: @split-panel-arrow-vertical-height;
              top: 50%;
              transform: translate(0, -50%);
          }
          &.is-horizontal {
              width: @split-panel-arrow-horizontal-width;
              height: @split-panel-arrow-horizontal-height;
              left: 50%;
              transform: translate(-50%, 0);
          }
          &.top {
            bottom: 100%;
            border-bottom: none;
            border-radius: @split-panel-arrow-vertical-radius @split-panel-arrow-vertical-radius 0 0;
          }
          &.bottom {
            top: 100%;
            border-top: none;
            border-radius: 0 0 @split-panel-arrow-vertical-radius @split-panel-arrow-vertical-radius;
          }
          &.left {
            right: 100%;
            border-right: none;
            border-radius: @split-panel-arrow-horizontal-radius 0 0 @split-panel-arrow-horizontal-radius;
          }
          &.right {
            left: 100%;
            border-left: none;
            border-radius: 0 @split-panel-arrow-horizontal-radius @split-panel-arrow-horizontal-radius 0;
          }
        }
        &-vertical {
          width: @split-panel-trigger-line-width;
          height: 100%;
          background: @split-panel-trigger-line-color;
          border-top: none;
          border-bottom: none;
        }
        &-horizontal {
          height: @split-panel-trigger-line-width;
          width: 100%;
          background: @split-panel-trigger-line-color;
          border-left: none;
          border-right: none;
        }
        &.is-disabled{
          cursor: not-allowed;
        }
    }
    &-horizontal {
        > .@{split-prefix-cls}-trigger-con {
            top: 50%;
            height: 100%;
        }
    }
    &-vertical {
        > .@{split-prefix-cls}-trigger-con {
            left: 50%;
            width: 100%;
        }
    }
    .no-select {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }
}



@split-panel-custom-prefix: ~'--@{kd-prefix}-c-split-panel';

// color
@split-panel-trigger-border-color: var(~'@{split-panel-custom-prefix}-color-border', #d9d9d9);
@split-panel-trigger-arrow-color: var(~'@{split-panel-custom-prefix}-arrow-color-background', #999);
@split-panel-trigger-arrow-hover-color: var(~'@{split-panel-custom-prefix}-arrow-color-background-hover', @color-theme);
@split-panel-trigger-line-color: var(~'@{split-panel-custom-prefix}-line-color-background', #d9d9d9);

// radius
@split-panel-arrow-vertical-radius: var(~'@{split-panel-custom-prefix}-arrow-radius-border-vertical', 8px);
@split-panel-arrow-horizontal-radius: var(~'@{split-panel-custom-prefix}-arrow-radius-border-horizontal', 8px);

// sizing
@split-panel-wrapper-border-width: var(~'@{split-panel-custom-prefix}-wrapper-sizing-border', 1px);
@split-panel-trigger-line-width: var(~'@{split-panel-custom-prefix}-line-sizing-border', 1px);
@split-panel-arrow-border-width: var(~'@{split-panel-custom-prefix}-arrow-sizing-border', 1px);
@split-panel-arrow-vertical-width: var(~'@{split-panel-custom-prefix}-arrow-sizing-width-vertical', 16px);
@split-panel-arrow-vertical-height: var(~'@{split-panel-custom-prefix}-arrow-sizing-height-vertical', 16px);
@split-panel-arrow-horizontal-width: var(~'@{split-panel-custom-prefix}-arrow-sizing-width-horizontal', 16px);
@split-panel-arrow-horizontal-height: var(~'@{split-panel-custom-prefix}-arrow-sizing-height-horizontal', 16px);


/*! rtl:begin:ignore */



@inputNumber-prefix-cls: ~'@{kd-prefix}-inputNumber-stepper';
@inputWrapper-prefix-cls: ~'@{kd-prefix}-wrapper';
.@{inputNumber-prefix-cls} {
  width: 100px;

  &.@{kd-prefix}-input-wrapper {
    padding-left: @stepper-input-wrapper-padding-left !important;

    .@{kd-prefix}-input {
      padding-left: @stepper-input-padding-left;
    }

    &-size-middle {
      height: @stepper-middle-height;
      line-height: @stepper-middle-height;
    }
  }
  input {
    text-align: center;
    color: @stepper-input-color;
    margin: 0 4px;
    font-size: @stepper-input-font-size;
  }

  &-icon {
    font-size: 14px;
  }

  &-baseStep {
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    height: 100%;
    cursor: pointer;

    &-small {
      .base-step-size(@stepper-input-small-sizing-height);
    }

    &-middle {
      .base-step-size(@stepper-input-middle-sizing-height);
    }

    &-large {
      .base-step-size(@stepper-input-large-sizing-height);
    }

    .@{inputNumber-prefix-cls}-icon {
      color: @stepper-icon-color;
      transition: color @stepper-motion-duration;
      font-size: 16px;

      &:hover {
        color: @stepper-icon-color-hover;
      }
    }

    &:hover:not(&-disabled) .@{inputNumber-prefix-cls}-icon {
      color: @stepper-icon-color-hover;
    }

    &-disabled {
      cursor: not-allowed;
      color: @stepper-icon-color-disabled;

      .@{inputNumber-prefix-cls}-icon {
        color: unset !important;
      }
    }
  }

  &-baseStep-decrease {
    .step-style(right, left);
  }

  &-baseStep-increase {
    .step-style(left, right);
  }

  &-embedStep {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 100%;
    border-radius: 0 1px 1px 0;
    background-color: @stepper-embed-icon-color-background;
    overflow: hidden;
    .step-style(left, right);
    border: none;

    span {
      height: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      border-left: 1px solid @stepper-color-border-strong;
      border-bottom: 1px solid @stepper-color-border-strong;
      cursor: pointer;
      font-size: 12px;

      .@{inputNumber-prefix-cls}-icon {
        transition: color @stepper-motion-duration;
      }

      &:hover .@{inputNumber-prefix-cls}-icon {
        color: @stepper-icon-color-hover;
      }

      &:last-child {
        border-bottom: none;
      }
    }

    &-disabled {
      cursor: not-allowed !important;
      color: @stepper-icon-color-disabled;

      .@{inputNumber-prefix-cls}-icon {
        color: unset !important;
      }
    }
  }
}

/*! rtl:end:ignore */



.base-step-size(@width) {
	width: @width;
}
.step-style(@borderDirection, @marginDirection) {
	border-@{borderDirection}: 1px solid @stepper-color-border-strong;
	&.@{inputNumber-prefix-cls}-baseStep-small, &.@{inputNumber-prefix-cls}-embedStep-small {
		margin-@{marginDirection}: calc(-1 * @stepper-input-spacing-padding-horizontal);
	}
	&.@{inputNumber-prefix-cls}-baseStep-middle, &.@{inputNumber-prefix-cls}-embedStep-middle {
		margin-@{marginDirection}: calc(-1 * @stepper-input-spacing-padding-horizontal);
	}
	&.@{inputNumber-prefix-cls}-baseStep-large, &.@{inputNumber-prefix-cls}-embedStep-large {
		margin-@{marginDirection}: calc(-1 * @stepper-input-spacing-padding-horizontal);
	}
}


@stepper-prefix: '--@{kd-prefix}-c-stepper';

// color
@stepper-input-color: var(~'@{stepper-prefix}-input-color', @color-text-primary);
@stepper-icon-color: var(~'@{stepper-prefix}-icon-color', @color-text-secondary);
@stepper-icon-color-hover: var(~'@{stepper-prefix}-icon-color-hover', @color-theme);
@stepper-color-border-strong: var(~'@{stepper-prefix}-color-border-strong', @color-border-strong);
@stepper-embed-icon-color-background: var(~'@{stepper-prefix}-embed-icon-color-background', transparent);
@stepper-icon-color-disabled: var(~'@{stepper-prefix}-icon-color-disabled', @color-disabled);

// font
@stepper-input-font-size: var(~'@{stepper-prefix}-input-font-size', 12px);

// motion
@stepper-motion-duration: var(~'@{stepper-prefix}-motion-duration', @duration-promptly);

// sizing
@stepper-input-small-sizing-height: var(~'@{stepper-prefix}-input-small-sizing-height', 20px);
@stepper-input-middle-sizing-height: var(~'@{stepper-prefix}-input-middle-sizing-height', 28px);
@stepper-input-large-sizing-height: var(~'@{stepper-prefix}-input-large-sizing-height', 36px);
@stepper-input-wrapper-padding-left: var(~'@{stepper-prefix}-padding-left', 9px);
@stepper-input-padding-left: var(~'@{stepper-prefix}-input-padding-left', 0px);
@stepper-middle-height: var(~'@{stepper-prefix}-sizing-height', 28px);

// spacing
@stepper-input-spacing-padding-horizontal: var(~'@{stepper-prefix}-input-spacing-padding-horizontal', 9px);


/*! rtl:begin:ignore */



@steps-prefix-cls: ~'@{kd-prefix}-steps';

.@{steps-prefix-cls} {
  display: flex;
  justify-content: space-between;

  .@{steps-prefix-cls}-icon {
    border: 2px solid;
    padding-top: 1px;
  }

  .@{kd-prefix}icon-exclamatory {
    font-size: 30px;
  }

  &-item {
    flex-grow: 1;
    display: flex;
    justify-content: center;
    width: 0;

    &-clickable {
      cursor: pointer;

      .@{steps-prefix-cls}-item-iconContainer-icon {
        .@{steps-prefix-cls}-icon {
          background-color: @steps-color-white;
        }
      }
    }

    &-clickable&-wait {
      .@{steps-prefix-cls}-icon,
      .@{steps-prefix-cls}-item-title {
        transition: all @steps-duration-promptly;
      }

      &:hover {
        .@{steps-prefix-cls}-icon {
          background-color: @steps-color-white;
          color: @steps-color-hover;
          border-color: @steps-color-hover;
        }

        .@{steps-prefix-cls}-item-title,
        .@{steps-prefix-cls}-item-description {
          color: @steps-color-hover;
        }
      }
    }

    &-clickable&-finish {
      .@{steps-prefix-cls}-item-title {
        transition: all @steps-duration-promptly ease;
      }

      &:hover {
        .@{steps-prefix-cls}-item-title {
          color: @steps-color-completed;
        }
      }
    }

    &-container {
      width: 100%;
      display: flex;
      flex-direction: column;
    }

    &-iconContainer {
      display: flex;
      justify-content: center;
      position: relative;

      &::after {
        content: '';
        width: 100%;
        height: @steps-line-sizing-height;
        border-bottom: 1px dashed @steps-color-wait;
        border-left: 1px dashed @steps-color-wait;
        position: absolute;
        left: 50%;
        top: calc(50% - @steps-line-sizing-height / 2);
        transition: width @steps-duration-promptly cubic-bezier(0.48, 0.04, 0.52, 0.96),
          background-color @steps-duration-promptly cubic-bezier(0.48, 0.04, 0.52, 0.96);
      }

      &:last-child {
        &::after {
          display: none;
        }
      }

      &-icon {
        z-index: 1;
        width: @steps-icon-sizing-width;
        height: @steps-icon-sizing-width;
        display: flex;
        justify-content: center;
        align-items: center;

        .@{steps-prefix-cls}-icon {
          width: @steps-icon-sizing-width;
          height: @steps-icon-sizing-width;
          display: flex;
          justify-content: center;
          align-items: center;
          background-color: @steps-color-white;
          color: @steps-color-wait;
          font-size: calc(@steps-icon-sizing-width - 13px);
          border-radius: 50%;
          border-color: @steps-color-wait;
          box-sizing: border-box;
        }
      }
    }

    &-content {
      text-align: center;

      .@{steps-prefix-cls}-item-title {
        line-height: 20px;
        font-size: @steps-font-size;
        color: @steps-color-wait;
      }

      .@{steps-prefix-cls}-item-description {
        line-height: 20px;
        font-size: @steps-font-size;
        color: @steps-color-wait;
        width: @steps-vertical-description-sizing-width;
      }
    }

    &-process {
      color: @steps-color-hover;

      .@{steps-prefix-cls}-icon {
        background-color: @steps-color-white;
        color: @steps-color-hover;
        border-color: @steps-color-hover;
      }

      .@{steps-prefix-cls}-item-title,
      .@{steps-prefix-cls}-item-description {
        color: @steps-color-hover;
      }
    }

    &:last-child {
      .@{steps-prefix-cls}-item-iconContainer {
        &::after {
          display: none;
        }
      }
    }

    &-finish {
      .@{steps-prefix-cls}-icon {
        background-color: @steps-color-white;
        color: @steps-color-completed;
        border-color: @steps-color-completed;
        box-sizing: border-box;
      }

      .@{steps-prefix-cls}-item-content {
        .@{steps-prefix-cls}-item-title,
        .@{steps-prefix-cls}-item-description {
          color: @steps-color-completed;
        }
      }
    }

    &-error {
      .@{steps-prefix-cls}-icon {
        color: @steps-color-error;
        border-color: @steps-color-error;
      }

      .@{steps-prefix-cls}-item-content {
        .@{steps-prefix-cls}-item-title,
        .@{steps-prefix-cls}-item-description {
          color: @steps-color-error;
        }
      }
    }
  }

  &-bottomLable {
    .@{steps-prefix-cls}-item-iconContainer {
      margin-bottom: 4px;
    }
  }

  &-horizontal {
    .@{steps-prefix-cls}-item {
      min-width: 88px;
      box-sizing: content-box;
      padding: 0 22px;

      &:first-child {
        padding-left: 0;
      }

      &:last-child {
        padding-right: 0;
      }

      .@{steps-prefix-cls}-item-description {
        height: @steps-horizontal-description-sizing-height;
        width: auto;
      }

      &-iconContainer::after {
        width: ~'calc(100% + 44px)';
      }
    }
  }

  &-vertical {
    flex-direction: column;

    .@{steps-prefix-cls}-item {
      width: 100%;
      min-height: 68px;
      box-sizing: content-box;
      padding: 22px 0;

      &:first-child {
        padding-top: 0;
      }

      &:last-child {
        padding-bottom: 0;
      }

      &-container {
        flex-direction: row;
        justify-content: flex-start;
      }

      &-iconContainer {
        margin-bottom: 0;
        margin-right: 4px;

        &::after {
          width: @steps-line-sizing-height;
          height: calc(100% + 44px);
          top: 2px;
          left: calc(50% - @steps-line-sizing-height / 2);
        }
      }

      &-content {
        text-align: left;
        margin-top: 1px;
      }
    }
  }
}
.@{steps-prefix-cls}-rtl {
  direction: rtl;
  .@{steps-prefix-cls}-item:first-child {
    .@{steps-prefix-cls}-item-iconContainer {
      &::before {
        display: none;
      }
    }
  }
  &.@{steps-prefix-cls}-horizontal {
    &:first-child {
      padding-right: 0;
    }

    &:last-child {
      padding-right: 0;
      padding-left: 0;
    }
    .@{steps-prefix-cls}-item {
      .@{steps-prefix-cls}-item-container {
        .@{steps-prefix-cls}-item-iconContainer {
          &::after {
            display: none;
          }
          &::before {
            content: '';
            width: ~'calc(100% + 35px)';
            height: @steps-line-sizing-height;
            border-bottom: 1px dashed @steps-color-wait;
            border-left: 1px dashed @steps-color-wait;
            position: absolute;
            left: 50%;
            top: calc(50% - @steps-line-sizing-height / 2);
            transition: width @steps-duration-promptly cubic-bezier(0.48, 0.04, 0.52, 0.96),
              background-color @steps-duration-promptly cubic-bezier(0.48, 0.04, 0.52, 0.96);
            
          }
        }
      }
    }
  }
  &.@{steps-prefix-cls}-vertical {
    .@{steps-prefix-cls}-item {
      &-iconContainer {
        margin-left: 4px;
        margin-right: 0;
      }
      &-content {
        text-align: right;
      }
    }
  }
}
/*! rtl:end:ignore */


@steps-prefix: '--@{kd-prefix}-c-steps';

// color
@steps-color-completed: var(~'@{steps-prefix}-color-completed', @color-success);//已经完成
@steps-color-hover: var(~'@{steps-prefix}-color-hover', @color-theme);
@steps-color-error: var(~'@{steps-prefix}-color-error', @color-error);
@steps-color-wait:  var(~'@{steps-prefix}-color-wait', #999);//未开始  等待
@steps-color-white: var(~'@{steps-prefix}-color-white',@color-white);
@steps-color-background-process-icon: var(~'@{steps-prefix}-icon-color-background', @color-theme);//图标的颜色

// font
@steps-font-size: var(~'@{steps-prefix}-font-size', @font-size-small); // 文字大小

// motion
@steps-duration-promptly: var(~'@{steps-prefix}-motion-duration', @duration-promptly);

// sizing
@steps-icon-sizing-width: var(~'@{steps-prefix}-icon-sizing-width', 28px);//图标的大小
@steps-line-sizing-height: var(~'@{steps-prefix}-line-sizing-height', 1px);//连接线高度
@steps-horizontal-description-sizing-height: var(~'@{steps-prefix}-horizontal-description-sizing-height', 60px);//内容部分高度 横向
@steps-vertical-description-sizing-width: var(~'@{steps-prefix}-vertical-description-sizing-width', 200px);//内容部分宽度    纵向






/*! rtl:begin:ignore */



@switch-prefix-cls: ~'@{kd-prefix}-switch';
@icon-prefix-cls: ~'@{kd-prefix}icon';

.@{switch-prefix-cls} {
  .switch;

  .@{switch-prefix-cls}-inner {
    .switch-inner;
    user-select: none;
  }

  .@{switch-prefix-cls}-loading-icon {
    color: @disabled-color;
    position: absolute;
    box-sizing: border-box;
    display: inline-block;
    left: 1px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10;

    .@{icon-prefix-cls}-loadding-circle {
      animation: loadingcircle 1s infinite;
      animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
      font-size: @switch-small-font-size;
      line-height: 1;
      vertical-align: baseline;
    }
  }

  &-disabled {
    background-color: @switch-off-disabled-bg;
    cursor: not-allowed;
  }

  &-checked {
    background-color: @switch-on-color;
    text-align: right;

    &::after {
      left: 100%;
      margin-left: -1px;
      transform: translateX(-100%);
    }

    .@{switch-prefix-cls}-loading-icon {
      left: unset;
      right: 1px;
      color: @switch-loading-color;
    }

    &.@{switch-prefix-cls}-disabled {
      background-color: @switch-on-disabled-bg;
    }

    .@{switch-prefix-cls}-inner {
      margin: @switch-inner-checked-margin;
    }

    &.@{switch-prefix-cls}-size-large {
      .@{switch-prefix-cls}-inner {
        margin: @switch-inner-large-checked-margin;
      }
    }
  }

  &-size-small {
    .switch-size(@switch-small-height, @switch-small-line-height, @switch-small-font-size, @switch-small-min-width, @switch-small-border-radius);
  }

  &-size-large {
    .switch-size(@switch-large-height, @switch-large-line-height, @switch-large-font-size, @switch-large-min-width, @switch-large-border-radius);

    .@{switch-prefix-cls}-inner {
      margin: @switch-inner-large-margin;
    }
  }
}
.@{switch-prefix-cls}-rtl {
  direction: rtl;
  .@{switch-prefix-cls}-inner {
    margin: @switch-inner-checked-margin;
    .@{switch-prefix-cls}-loading-icon {
      right: 0;
      left: unset;
      .@{icon-prefix-cls}-loadding-circle {
        animation: rtlloadingcircle 2s infinite;
      }
    }
  }
  &.@{switch-prefix-cls}::after {
    right: 1px;
    left: unset;
  }
  &.@{switch-prefix-cls}-checked {
    text-align: left;
    .@{switch-prefix-cls}-inner {
      margin: @switch-inner-margin;
      .@{switch-prefix-cls}-loading-icon {
        left: 1px;
        right: unset;
        .@{icon-prefix-cls}-loadding-circle {
          animation: rtlloadingcircle 2s infinite;
        }
      }
    }
    &.@{switch-prefix-cls}-size-large {
      .@{switch-prefix-cls}-inner {
        margin: @switch-inner-large-margin;
      }
    }
  }
  &.@{switch-prefix-cls}-checked::after {
    right: 100%;
    margin-right: -1px;
    margin-left: 0;
    transform: translateX(100%);
  }
  &.@{switch-prefix-cls}-size-large {
    .switch-size(@switch-large-height, @switch-large-line-height, @switch-large-font-size, @switch-large-min-width, @switch-large-border-radius);
    .@{switch-prefix-cls}-inner {
      margin: @switch-inner-large-checked-margin;
    }
  }
}
/*! rtl:end:ignore */

.switch() {
  padding: 0;
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  background-color: @switch-off-color;
  cursor: pointer;
  transition: all calc(@transition-duration - 0.1s ) @ease-out;
  &::after {
    content: '';
    position: absolute;
    top: 1px;
    left: 1px;
    border-radius: 50%;
    background-color: @bg;
    transition: all calc(@transition-duration - 0.1s ) @ease-out;
  }
}
.switch-inner() {
  color: @switch-font-color;
  font-size: @switch-inner-small-font-size;
  margin: @switch-inner-margin;
  transition: all calc(@transition-duration - 0.1s ) @ease-out;
}
.switch-size(@height, @line-height, @font-size, @min-width, @border-radius) {
	height: @height;
	min-width: @min-width;
	line-height: @line-height;
	font-size: @font-size;
  border-radius: @border-radius;
  &::after {
    width: calc( @height - 2px);
    height:calc( @height - 2px);
  }
  .@{switch-prefix-cls}-loading-icon {
    width: calc( @height - 2px);
    height: calc( @height - 2px);
  }
}



@switch-prefix: '--@{kd-prefix}-c-switch';

// color
@switch-on-color: var(~'@{switch-prefix}-color-on', @color-theme-6);
@switch-off-color: var(~'@{switch-prefix}-color-off', #B2B2B2);
@switch-on-disabled-bg: var(~'@{switch-prefix}-color-on-background-disabled', @color-theme-4);
@switch-off-disabled-bg: var(~'@{switch-prefix}-color-off-background-disabled', #D9D9D9);
@switch-loading-color: var(~'@{switch-prefix}-color-loading', @color-ongoing);
@switch-font-color: var(~'@{switch-prefix}-color-font', @color-white);

// font
@switch-small-font-size: var(~'@{switch-prefix}-small-font-size', @font-size-small);
@switch-large-font-size: var(~'@{switch-prefix}-large-font-size', @font-size-small);
@switch-inner-small-font-size: var(~'@{switch-prefix}-inner-font-size-small', @font-size-small);

// line-height
@switch-large-line-height: var(~'@{switch-prefix}-large-line-height', 20px);
@switch-small-line-height: var(~'@{switch-prefix}-small-line-height', 16px);

//radius
@switch-small-border-radius: var(~'@{switch-prefix}-small-radius-border', 8px);

// sizing
@switch-small-height: var(~'@{switch-prefix}-small-sizing-height', 16px);
@switch-small-min-width: var(~'@{switch-prefix}-small-sizing-width', 32px);
@switch-large-height: var(~'@{switch-prefix}-large-sizing-height', 20px);
@switch-large-min-width: var(~'@{switch-prefix}-large-sizing-width', 40px);
@switch-large-border-radius: var(~'@{switch-prefix}-large-sizing-border-radius', 10px);

// spacing
@switch-inner-margin: var(~'@{switch-prefix}-inner-spacing-margin', 0 5px 0 17px);
@switch-inner-checked-margin: var(~'@{switch-prefix}-inner-spacing-margin-checked', 0 17px 0 5px);
@switch-inner-large-margin: var(~'@{switch-prefix}-inner-spacing-margin-large', 0 5px 0 21px);
@switch-inner-large-checked-margin: var(~'@{switch-prefix}-inner-spacing-margin-large-checked', 0 21px 0 5px);




@table-prefix: ~'@{kd-prefix}-table';

.@{table-prefix}-wrapper {
    display: flex;
}
// code component mixin here
/*! rtl:begin:ignore */


@tabs-prefix-cls: ~'@{kd-prefix}-tabs';
@tabPane-prefix-cls: ~'@{kd-prefix}-tab-pane';
@line-prefix-cls: ~'@{kd-prefix}-active-line';
@arrowBtn-prefix-cls: ~'@{kd-prefix}-arrow-button';
@icon-prefix-cls: ~'@{kd-prefix}icon';

.@{tabs-prefix-cls} {
  .tabs;
  &-noContainer {
    height: @tabs-height;
  }
  &-tab-wrap {
    position: relative;
    height: ~'calc(100% + 1px)';
    overflow: hidden;
    flex-grow: 1;
    font-size: 0;
  }
  &-tab-list {
    display: inline-block;
    position: absolute;
    white-space: nowrap;
    top: 0;
    left: 0;
    transition: all @tab-g-motion-duration @tab-transition-fn;
  }
  &-tab-list-mobile {
    transition: all 0.05s @tab-transition-fn;
  }
  &-bottom {
    flex-direction: column-reverse;
  }
  &-left {
    flex-direction: row;
  }
  &-right {
    flex-direction: row-reverse;
  }

  &-left-arrows {
    box-shadow: 2px 0 2px rgba(0, 0, 0, 0.08);
    height: 100%;
    display: flex;
    align-items: center;
    &-line {
      background-color: #fff;
    }
    &-noshadow {
      box-shadow: unset;
    }
  }
  &-right-arrows {
    box-shadow: -2px 0 2px rgba(0, 0, 0, 0.08);
    height: 100%;
    display: flex;
    align-items: center;
    &-line {
      background-color: #fff;
      .@{tabs-prefix-cls}-more-btn {
        width: 24px;
      }
    }
    &-grid {
      background-color: #fff;
      box-shadow: unset;
      border: 1px solid @tabs-border-color;
      .@{tabs-prefix-cls}-more-btn {
        line-height: 22px;
      }
    }
    &-noshadow {
      box-shadow: unset;
    }
    .@{icon-prefix-cls} {
      font-size: 14px;
    }
  }
  &-left-operations {
    position: relative;
    margin-right: 2px;
    &-item {
      padding: 0 12px;
      cursor: pointer;
    }
  }
  &-right-operations {
    position: relative;
    padding-right: 18px;
    &-item {
      padding-left: 12px;
      cursor: pointer;
    }
  }

  &-more-btn {
    display: inline-block;
    box-sizing: border-box;
    width: 48px;
    text-align: center;
    cursor: pointer;
    &:hover {
      color: @tabPane-font-color-hover;
    }
    &-disabled {
      color: @tabPane-font-color-disabled;
      cursor: not-allowed;
      &:hover {
        color: @tabPane-font-color-disabled;
      }
    }
  }
}

.@{tabs-prefix-cls}-navs {
  .tabNavs;
  &-line {
    &.@{tabs-prefix-cls}-navs-middle {
      height: @tab-pane-type-line-height-middle;
    }
    &.@{tabs-prefix-cls}-navs-small {
      height: @tab-pane-type-line-height-small !important;
    }
    .@{tabPane-prefix-cls}-middle {
      line-height: @tab-pane-type-line-height-middle;
      height: @tab-pane-type-line-height-middle;
    }
    .@{tabPane-prefix-cls}-small {
      line-height: @tab-pane-type-line-height-small;
      height: @tab-pane-type-line-height-small;
    }
    &.@{tabs-prefix-cls}-navs-bottom {
      border-top: 1px solid @tabs-border-color;
      border-bottom: unset;
      .@{tabs-prefix-cls}-tab-wrap {
        margin-top: -1px;
      }
      .@{tabs-prefix-cls}-tab-list {
        top: -1px;
      }
      .@{line-prefix-cls} {
        top: 1px;
        bottom: unset;
      }
    }
  }
  &-card {
    border-top: 1px solid @tabs-border-color;
    background-color: @tabs-card-bg;
    .@{tabs-prefix-cls}-tab-wrap {
      top: -1px;
      height: ~'calc(100% + 2px)';
    }
    &.@{tabs-prefix-cls}-navs-left,
    &.@{tabs-prefix-cls}-navs-right {
      min-width: 120px;
      height: 100%;
      font-size: 0;
      border-top: 1px solid transparent;
      &::before,
      &::after {
        position: absolute;
        content: '';
        display: inline-block;
        width: 1px;
        height: 100%;
        background-color: @tabs-border-color;
      }
      &::before {
        left: 0;
      }
      &::after {
        right: 0;
      }
      .@{tabs-prefix-cls}-tab-wrap {
        box-sizing: border-box;
        min-width: 120px;
        width: 100%;
        z-index: 2;
      }
      .@{tabs-prefix-cls}-tab-list {
        display: flex;
        flex-direction: column;
        white-space: normal;
        width: 100%;
        height: 100%;
        min-width: 120px;
        max-height: 100%;
        overflow: auto;
      }
    }
  }
  &-grid {
    height: 24px;
    border-bottom: unset;
  }
  &-dynamic {
    background-color: @tabs-card-bg;
    border-bottom: unset;
    height: @tab-pane-type-dynamic-height;
    .@{tabs-prefix-cls}-tab-wrap {
      height: @tab-pane-type-dynamic-height;
    }
    .@{tabs-prefix-cls}-more-btn {
      line-height: @tab-pane-type-dynamic-height;
    }
  }
  &-small:not(.@{tabs-prefix-cls}-navs-left):not(.@{tabs-prefix-cls}-navs-right) {
    height: 36px;
    &.@{tabs-prefix-cls}-card-more {
      padding-right: 36px;
    }
  }
}

.@{tabPane-prefix-cls} {
  .tabPane;
  &-text {
    display: inline-block;
    transition: color @tab-g-motion-duration;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: @tab-pane-text-max-width;
    &-active,
    &-notMobile:hover {
      color: @tabPane-font-color-active;
    }
    &-disabled {
      &:hover {
        color: @tabPane-font-color-disabled;
      }
    }
  }

  &-disabled {
    color: @tabPane-font-color-disabled;
    cursor: not-allowed;
    &:hover {
      color: @tabPane-font-color-disabled;
    }
  }
  &-type-line {
    padding: 0 @tab-pane-line-paddinng-horizontal;
  }
  &-type-card {
    margin-right: 0;
    padding: 0 @tab-pane-card-paddinng-horizontal;
    border: 1px solid transparent;
    &.@{tabPane-prefix-cls}-box-active {
      background-color: #fff;
      border: 1px solid @tabs-border-color;
      border-top: 2px solid;
      border-color: @tab-line-color-active @tabs-border-color transparent @tabs-border-color;
      transition: background-color 0.2s @tab-transition-fn;
      &:first-of-type {
        border-left-color: transparent;
      }
    }
    &.@{tabPane-prefix-cls}-left {
      border-left: 2px solid transparent;
      &.@{tabPane-prefix-cls}-box-active {
        border-left: 2px solid;
        border-color: @tabs-border-color transparent transparent @tab-line-color-active;
      }
    }
    &.@{tabPane-prefix-cls}-right {
      border-right: 1px solid transparent;
      &.@{tabPane-prefix-cls}-box-active {
        border-right: 2px solid @tab-line-color-active;
        border-left: 1px solid transparent;
      }
    }
    &.@{tabPane-prefix-cls}-left,
    &.@{tabPane-prefix-cls}-right {
      width: 100%;
      border-top: 1px solid @tabs-border-color;
      &:last-of-type {
        border-bottom: 1px solid @tabs-border-color;
      }
    }
    &.@{tabPane-prefix-cls}-bottom {
      border-top: 1px solid transparent;
      border-bottom: 2px solid transparent;
      &.@{tabPane-prefix-cls}-box-active {
        border-bottom: 2px solid;
        border-color: transparent @tabs-border-color @tab-line-color-active @tabs-border-color;
        &:first-of-type {
          border-left-color: transparent;
        }
      }
    }
    &.@{tabPane-prefix-cls}-top {
      border-top: 2px solid transparent;
      &.@{tabPane-prefix-cls}-box-active {
        border-top: 2px solid;
        border-color: @tab-line-color-active @tabs-border-color transparent @tabs-border-color;
        &:first-of-type {
          border-left-color: transparent;
        }
      }
    }
  }
  &-type-dynamic {
    height: @tab-pane-type-dynamic-height;
    line-height: @tab-pane-type-dynamic-height;
    margin: 0 0 0 4px;
    display: inline-flex;
    align-items: center;
    .@{tabPane-prefix-cls}-operations .@{icon-prefix-cls} {
      font-size: 16px;
    }
    &.@{tabPane-prefix-cls}-box-active {
      &.@{tabPane-prefix-cls}-isMobile:not(.@{tabPane-prefix-cls}-disabled):hover {
        .@{tabPane-prefix-cls}-operations {
          span:first-child {
            opacity: 1;
            cursor: pointer;
          }
        }
      }
    }
  }
  &-type-dynamic-notMobile {
    &:not(.@{tabPane-prefix-cls}-disabled):hover {
      .@{tabPane-prefix-cls}-operations {
        span:first-child {
          opacity: 1;
          cursor: pointer;
        }
      }
    }
  }
  &-type-grid {
    height: 24px;
    line-height: 22px;
    padding: 0 @tab-pane-grid-paddinng-horizontal;
    border: 1px solid @tabs-border-color;
    margin-right: -1px;
    &:first-of-type {
      border-radius: 2px 0 0 2px;
    }
    &:last-of-type {
      border-radius: 0 2px 2px 0;
    }
    &.@{tabPane-prefix-cls}-box-active {
      position: relative;
      z-index: 2;
      background-color: @tab-line-color-active;
      border: 1px solid @tab-line-color-active;
      transition: background-color 0.2s @tab-transition-fn;
      .@{tabPane-prefix-cls}-text-active {
        color: #fff;
      }
    }
    &.@{tabPane-prefix-cls}-disabled {
      background-color: @tab-disabled-bg;
    }
  }
  &-notMobile {
    &:hover {
      color: @tabPane-font-color-active;
    }
  }
  &-operations {
    position: relative;
    display: inline-block;
    line-height: 1;
    padding: 0 4px;
    span:first-child {
      display: inline-block;
      vertical-align: top;
      font-size: 0;
      opacity: 0;
    }
  }
  &-small {
    height: 36px;
    line-height: 36px;
  }
}

.@{line-prefix-cls} {
  position: absolute;
  display: inline-block;
  box-sizing: border-box;
  width: auto;
  left: 0;
  bottom: 0;
  height: 2px;
  background-color: @tab-line-color-active;
  transition: all @tab-g-motion-duration @tab-transition-fn;
}

.@{arrowBtn-prefix-cls} {
  display: inline-block;
  box-sizing: border-box;
  width: 48px;
  text-align: center;
  cursor: pointer;
  &:hover {
    color: @tabPane-font-color-hover;
  }
  &-line {
    width: 24px;
  }
  &-dynamic {
    width: 24px;
    line-height: @tab-pane-type-dynamic-height;
  }
  &-disabled {
    color: @tabPane-font-color-disabled;
    cursor: not-allowed;
    &:hover {
      color: @tabPane-font-color-disabled;
    }
  }
  .@{icon-prefix-cls} {
    font-size: 14px;
  }
}
.@{tabs-prefix-cls}-rtl {
  direction: rtl;
  .@{tabs-prefix-cls}-tab-wrap {
    .@{tabs-prefix-cls}-tab-list {
      left: auto;
    }
  }
  .@{tabs-prefix-cls}-right-operations {
    padding-left: 18px;
    padding-right: 0;
    &-item {
      padding-right: 12px;
      padding-left: 0;
    }
  }
  .@{tabs-prefix-cls}-left-operations {
    margin-left: 2px;
    margin-right: 0;
  }
}
/*! rtl:end:ignore */



.tabs() {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  height: 100%;
}
.tabNavs() {
  position: relative;
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  box-sizing: border-box;
  align-items: center;
  height: @tabs-height;
  border-bottom: @tabs-border-width solid @tabs-border-color;
}
.tabPane() {
  display: inline-block;
  vertical-align: middle;
  box-sizing: border-box;
  font-size: @tabPane-font-size;
  color: @tabs-font-color;
  height: @tab-pane-height;
  line-height: @tab-pane-line-height;
  cursor: pointer;
}


@tabs-custom-prefix: ~'--@{kd-prefix}-c-tabs';

// color
@tabs-border-color: var(~'@{tabs-custom-prefix}-color-border', @color-border-strong);
@tab-line-color-active: var(~'@{tabs-custom-prefix}-line-color-active', @color-theme);
@tabs-card-bg: var(~'@{tabs-custom-prefix}-card-color-background', @color-background-contain-disabled);
@tab-disabled-bg: var(~'@{tabs-custom-prefix}-color-background-disabled', transparent);
@tabs-font-color: var(~'@{tabs-custom-prefix}-color-text', @color-text-secondary);
@tabPane-font-color-active: var(~'@{tabs-custom-prefix}-color-text-active', @color-theme);
@tabPane-font-color-hover: var(~'@{tabs-custom-prefix}-color-text-hover', @color-theme);
@tabPane-font-color-disabled: var(~'@{tabs-custom-prefix}-color-text-disabled', @color-disabled);

// font
@tabPane-font-size: var(~'@{tabs-custom-prefix}-pane-font-size', @font-size-middle);

// line-height
@tab-pane-line-height: var(~'@{tabs-custom-prefix}-pane-height', 48px);

// motion
@tab-transition-fn: var(~'@{tabs-custom-prefix}-motion-timing-function', cubic-bezier(0.42, 0, 1, 1));
@tab-g-motion-duration: var(~'@{tabs-custom-prefix}-motion-duration', @duration-promptly);

// sizing
@tabs-height: var(~'@{tabs-custom-prefix}-sizing-height', 48px);
@tabs-border-width: var(~'@{tabs-custom-prefix}-sizing-border', 1px);
@tab-pane-height: var(~'@{tabs-custom-prefix}-pane-sizing-height', 48px);
@tab-pane-type-line-height-small: var(~'@{tabs-custom-prefix}-pane-type-line-sizing-height-small', 32px);
@tab-pane-type-line-height-middle: var(~'@{tabs-custom-prefix}-pane-type-line-sizing-height-middle', 32px);
@tab-pane-type-dynamic-height: var(~'@{tabs-custom-prefix}-pane-type-dynamic-sizing-height', 32px);
@tab-pane-text-max-width: var(~'@{tabs-custom-prefix}-pane-text-sizing-max-width');


// spacing
@tab-pane-line-paddinng-horizontal: var(~'@{tabs-custom-prefix}-pane-line-paddinng-horizontal', 20px);
@tab-pane-card-paddinng-horizontal: var(~'@{tabs-custom-prefix}-pane-card-paddinng-horizontal', 18px);
@tab-pane-grid-paddinng-horizontal: var(~'@{tabs-custom-prefix}-pane-grid-paddinng-horizontal', 20px);

/*! rtl:begin:ignore */


@tag-prefix-cls: ~'@{kd-prefix}-tag';

@types: process, success, warning, error, end, expired;
@colors: @tag-process-color, @tag-success-color, @tag-warning-color, @tag-error-color, @tag-end-color, @tag-expired-color;

.@{tag-prefix-cls} {
  &-ellipsis {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  &-size-small {
    .tag-size(@tag-small-font-size, @tag-small-height, @tag-small-padding-horizontal, @tag-max-width, @tag-min-width);
  }

  &-size-middle {
    .tag-size(@tag-middle-font-size, @tag-middle-height, @tag-middle-padding-horizontal, @tag-max-width, @tag-min-width);
  }

  &-size-large {
    .tag-size(@tag-large-font-size, @tag-large-height, @tag-large-padding-horizontal, @tag-max-width, @tag-min-width);
  }

  transition: all @tag-g-motion-duration;
  // 状态标签
  &-shape-status {
    .tag-status(@tag-process-color)
  }
  each(@types, {
      &-shape-status.@{tag-prefix-cls}-@{value} {
        .tag-status(extract(@colors, @index))
      }
  })

  // 属性标签
  &-shape-attribute {
    .tag-attribute(@tag-process-color)
  }
  each(@types, {
    &-shape-attribute.@{tag-prefix-cls}-@{value} {
      .tag-attribute(extract(@colors, @index))
    }
  })
  // 文本标签
  &-shape-text {
    .tag-text-color(@tag-process-color);
  }
  each(@types, {
    &-shape-text.@{tag-prefix-cls}-@{value} {
      .tag-text-color(extract(@colors, @index))
    }
    &-shape-text.@{tag-prefix-cls}-@{value}.@{tag-prefix-cls}-size-middle {
      .tag-text-color(extract(@colors, @index))
    }
    &-shape-text.@{tag-prefix-cls}-@{value}.@{tag-prefix-cls}-size-large {
      .tag-text-color(extract(@colors, @index))
    }
  })

  // 可关闭的标签
  &-shape-edit {
    border: 1px solid @tag-edit-g-color-border;
    border-radius: 2px;
    line-height: @tag-middle-height;
    padding-left: 6px;
    padding-right: 6px;
    color: @tag-edit-g-text-color;
    &:not(.@{tag-prefix-cls}-closable-disabled):hover {
      border-color: @tag-edit-g-color-border-hover;
      .@{tag-prefix-cls}-closeWrapper {
        // background-color: @tag-edit-cloesWrapper-g-color-background-hover;
        color: @tag-edit-cloesWrapper-g-text-color-hover;
      }
    }

    &.@{tag-prefix-cls}-closable {
      padding-right: 8px;
    }
  }

  // 可点击的标签
  &-clickable {
    cursor: pointer;
  }

  // 自定义标签颜色
  &-has-color {
    color: @tag-attribute-g-text-color;
  }

  // 图标设置外边距
  &-text {
    margin-left: 6px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  &-closable-disabled {
    background-color: @tag-edit-g-color-background-disabled;
    border-color: @tag-edit-g-color-border-disabled;
    color: @tag-edit-g-text-color-disabled;
    cursor: not-allowed;
  }
  &-closable.@{tag-prefix-cls}-size-middle {
    line-height: @tag-middle-height;
  }
  &-closable.@{tag-prefix-cls}-size-large {
    line-height: @tag-large-height;
    padding-left: @tag-large-padding-horizontal;

    .@{tag-prefix-cls}-closeWrapper {
      .@{tag-prefix-cls}-close-icon {
        font-size: 14px;
      }
    }
  }
  &-closeWrapper {
    margin-left: 4px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    transition: color @tag-g-motion-duration, background-color @tag-g-motion-duration;
  }
  &-close-icon {
    cursor: pointer;
    font-size: 12px;
  }
}
.@{tag-prefix-cls}-rtl {
  direction: rtl;
  .@{tag-prefix-cls}-closeWrapper {
    margin-right: 4px;
    margin-left: 0;
  }
}
/*! rtl:end:ignore */



// code component mixin here
.tag-size(@size, @height, @padding, @max-width, @min-width) {
  font-size: @size;
  height: @height;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
  padding: 0 @padding;
  border-radius:  calc(@height / 2);
  max-width: @max-width;
  min-width: @min-width;
}
.tag-status(@color) {
  border: 1px solid @color;
  color: @color;
  &:hover{
    background-color: @color;
    color: #fff;
  }
}
.tag-attribute(@color) {
  color: #fff;
  background-color: @color;
}
.tag-text-color(@color) {
  color: @color;
  display: inline-flex;
  align-items: center;
  padding: 0;
  border-radius: 0;
}



@tag-custom-prefix: ~'--@{kd-prefix}-c-tag';

// color
@tag-process-color: var(~'@{tag-custom-prefix}-color-process', @color-ongoing);
@tag-success-color: var(~'@{tag-custom-prefix}-color-success', @color-success);
@tag-warning-color: var(~'@{tag-custom-prefix}-color-warning', @color-warning);
@tag-error-color: var(~'@{tag-custom-prefix}-color-error', @color-error);
@tag-end-color: var(~'@{tag-custom-prefix}-color-end', @color-end);
@tag-expired-color: var(~'@{tag-custom-prefix}-color-expired', @color-disabled);
@tag-disabled-color: var(~'@{tag-custom-prefix}-color-disabled', @color-disabled);
@tag-attribute-g-text-color: var(~'@{tag-custom-prefix}-attribute-color-text', @color-white);
@tag-edit-g-color-border: var(~'@{tag-custom-prefix}-edit-color-border', @color-text-placeholder);
@tag-edit-g-text-color: var(~'@{tag-custom-prefix}-edit-color-text', @color-text-primary);
@tag-edit-g-color-border-hover: var(~'@{tag-custom-prefix}-edit-color-border-hover', @color-theme);
@tag-edit-cloesWrapper-g-color-background-hover: var(~'@{tag-custom-prefix}-edit-cloesWrapper-color-background-hover', @color-theme);
@tag-edit-cloesWrapper-g-text-color-hover: var(~'@{tag-custom-prefix}-edit-cloesWrapper-color-text-hover', @color-theme);
@tag-edit-g-color-background-disabled: var(~'@{tag-custom-prefix}-edit-color-background-disabled', @color-background-contain-disabled);
@tag-edit-g-color-border-disabled: var(~'@{tag-custom-prefix}-edit-color-background-disabled', @color-border-strong);
@tag-edit-g-text-color-disabled: var(~'@{tag-custom-prefix}-edit-color-text-disabled', @color-border-strong);

// font
@tag-small-font-size: var(~'@{tag-custom-prefix}-font-size-small', @font-size-small);
@tag-middle-font-size: var(~'@{tag-custom-prefix}-font-size-middle', @font-size-small);
@tag-large-font-size: var(~'@{tag-custom-prefix}-font-size-large', @font-size-middle);

// motion
@tag-g-motion-duration: var(~'@{tag-custom-prefix}-motion-duration', @duration-promptly);

// radius
@tag-border-radius: var(~'@{tag-custom-prefix}-radius-border', 10px);

// sizing
@tag-small-height: var(~'@{tag-custom-prefix}-sizing-height-small', 20px);
@tag-middle-height: var(~'@{tag-custom-prefix}-sizing-height-middle', 20px);
@tag-large-height: var(~'@{tag-custom-prefix}-sizing-height-large', 24px);
@tag-max-width: var(~'@{tag-custom-prefix}-sizing-max-width');
@tag-min-width: var(~'@{tag-custom-prefix}-sizing-min-width');

// spacing
@tag-small-padding-horizontal: var(~'@{tag-custom-prefix}-spacing-padding-horizontal-small', 6px);
@tag-middle-padding-horizontal: var(~'@{tag-custom-prefix}-spacing-padding-horizontal-middle', 7px);
@tag-large-padding-horizontal: var(~'@{tag-custom-prefix}-spacing-padding-horizontal-large', 8px);

/*! rtl:begin:ignore */




@timeline-prefix-cls: ~'@{kd-prefix}-timeline';
@timeline-item-prefix-cls: ~'@{kd-prefix}-timeline-item';

.@{timeline-prefix-cls} {
  .reset-component;
  margin: 0;
  padding: 0 4px;
  overflow: hidden;
  list-style: none;

  .@{timeline-item-prefix-cls} {
    .reset-component;
    position: relative;
    margin: 0;
    padding-bottom: @timeline-item-padding-bottom;
    font-size: @timeline-content-font-size-small;

    &-tail {
      position: absolute;
      left: calc((@timeline-dot-size - 1px) / 2);
      height: calc(100% - @timeline-dot-size * 2 + 4px);
      border-left: @timeline-width solid @timeline-line-color;
    }

    &.pending .@{timeline-item-prefix-cls}-dot {
      font-size: @timeline-content-font-size-small;
    }

    &.pending .@{timeline-item-prefix-cls}-tail {
      display: none;
    }

    &-dot {
      box-sizing: border-box;
      position: absolute;
      width: @timeline-dot-size;
      height: @timeline-dot-size;
      border-radius: 50%;
      transform: translateY(-50%);

      &.blue {
        color: @timeline-finished-color;
        background-color: @timeline-finished-color;
      }

      &.red {
        color: @timeline-error-color;
        background-color: @timeline-error-color;
      }

      &.green {
        color: @timeline-success-color;
        background-color: @timeline-success-color;
      }

      &.gray {
        color: @timeline-disabled-color;
        background-color: @timeline-disabled-color;
      }
    }

    &-dot.custom {
      position: absolute;
      left: calc(@timeline-dot-size / 2);
      width: auto;
      height: auto;
      margin-top: 0;
      padding: 1px;
      line-height: 1;
      text-align: center;
      border: 0;
      border-radius: 0;
      transform: translate(-50%, -50%);
      background-color: transparent !important;
    }

    &-content {
      position: relative;
      margin: 0 0 0 calc(2 * (@timeline-dot-size - @timeline-width) + @timeline-gap);
      word-break: break-word;
      color: @timeline-content-color-text;
      max-width: @timeline-content-max-width;
      min-width: @timeline-content-min-width;

      > * {
        margin: 0;
        padding: 0;
      }
    }

    &.last {
      > .@{timeline-item-prefix-cls}-tail {
        display: none;
      }
      > .@{timeline-item-prefix-cls}-content {
        min-height: 48px;
      }
    }
  }

  &.alternate {
    .@{timeline-item-prefix-cls} {
      &-tail,
      &-dot,
      &-dot.custom {
        left: 50%;
      }

      &-dot {
        margin-left: calc(-1 * (@timeline-dot-size - 1px) / 2);

        &.custom {
          margin-left: 1px;
        }
      }

      &:nth-child(2n + 1) {
        .@{timeline-item-prefix-cls}-content {
          left: calc(50% - 4px);
          width: calc(50% - 24px);
          text-align: left;
        }
      }

      &:nth-child(2n) {
        .@{timeline-item-prefix-cls}-content {
          width: calc(50% - 24px);
          margin: 0;
          text-align: right;
        }
      }
    }
  }

  &.right {
    .@{timeline-item-prefix-cls} {
      &-tail,
      &-dot,
      &-dot.custom {
        left: auto;
        right: 4.5px;
      }

      &-dot {
        margin-right: calc(-1 * (@timeline-dot-size - 1px) / 2);

        &.custom {
          margin-right: -18px;
        }
      }
      .@{timeline-item-prefix-cls}-content {
        left: 0;
        text-align: right;
        margin: 0 calc(2 * (@timeline-dot-size - @timeline-width) + @timeline-gap) 0 0;
        width: auto;
      }
    }
  }

  &.label {
    &.left {
      .@{timeline-item-prefix-cls} {
        &-tail,
        &-dot,
        &-dot.custom {
          left: calc((2 * @timeline-gap) + (@timeline-dot-size / 2));
        }

        &-dot {
          margin-left: calc(-1 * (@timeline-dot-size - 1px) / 2);

          &.custom {
            margin-left: 1px;
          }
        }
        .@{timeline-item-prefix-cls}-label {
          position: absolute;
          text-align: right;
          color: @timeline-label-color-text;
        }
        .@{timeline-item-prefix-cls}-content {
          left: calc(@timeline-dot-size + 7.5px);
          text-align: left;
          margin-right: 16px;
        }
      }
    }
    &.right {
      .@{timeline-item-prefix-cls} {
        &-tail,
        &-dot,
        &-dot.custom {
          left: auto;
          right: calc((2 * @timeline-gap) + (@timeline-dot-size / 2));
        }

        &-dot {
          margin-right: calc(-1 * (@timeline-dot-size - 1px) / 2);

          &.custom {
            right: calc(-1 * (@timeline-dot-size - 1px) / 2);
          }
        }
        .@{timeline-item-prefix-cls}-label {
          position: absolute;
          right: 0;
          text-align: left;
        }
        .@{timeline-item-prefix-cls}-content {
          left: auto;
          right: calc(@timeline-dot-size + 7.5px);
          text-align: right;
          margin-left: 17px;
        }
      }
    }
    &.alternate {
      .@{timeline-item-prefix-cls} {
        &:nth-child(2n + 1) {
          .@{timeline-item-prefix-cls}-label {
            position: absolute;
            width: calc(50% - 18px);
            text-align: right;
          }
        }
        &:nth-child(2n) {
          .@{timeline-item-prefix-cls}-label {
            position: absolute;
            left: calc(50% + (2 * (@timeline-dot-size - @timeline-width) + @timeline-gap) - @timeline-dot-size / 2);
            width: calc(50% - (2 * (@timeline-dot-size - @timeline-width) + @timeline-gap) + @timeline-dot-size / 2);
            text-align: left;
          }
        }
      }
    }
  }

  &.pending .@{timeline-item-prefix-cls}.last .@{timeline-item-prefix-cls}-tail {
    display: block;
    height: calc(100% - 14px);
    border-left: 1px dotted @timeline-line-color;
  }

  &.reverse .@{timeline-item-prefix-cls}.last .@{timeline-item-prefix-cls}-tail {
    display: none;
  }

  &.reverse .@{timeline-item-prefix-cls}.pending {
    .@{timeline-item-prefix-cls}-tail {
      display: block;
      height: calc(100% - 15px);
      border-left: 1px dotted @timeline-line-color;
    }
    .@{timeline-item-prefix-cls}-content {
      min-height: 48px;
    }
  }
}
.@{timeline-prefix-cls}-rtl {
  direction: rtl;
  .@{timeline-item-prefix-cls} {
    &-tail {
      right: calc((@timeline-dot-size - 1px) / 2);
      left: auto;
      border-left: @timeline-width solid @timeline-line-color;
    }
    &-content {
      margin: 0 calc(2 * (@timeline-dot-size - @timeline-width) + @timeline-gap) 0 0;
      text-align: right;
    }
    &-dot.custom {
      right: calc(@timeline-dot-size / 2);
      left: auto;
      transform: translate(50%, -50%);
    }
  }
  &.@{timeline-prefix-cls} {
    &.alternate {
      .@{timeline-item-prefix-cls} {
        &-tail,
        &-dot,
        &-dot.custom {
          right: 50%;
          left: auto;
        }
        &-dot {
          margin-left: 0;
          margin-right: calc(-1 * (@timeline-dot-size - 1px) / 2);
          &.custom {
            margin-right: 1px;
            margin-left: 0;
          }
        }

        &:nth-child(2n + 1) {
          .@{timeline-item-prefix-cls}-content {
            right: calc(50% - 4px);
            left: auto;
            text-align: right;
          }
        }

        &:nth-child(2n) {
          .@{timeline-item-prefix-cls}-content {
            text-align: left;
          }
        }
      }
    }
    &.right {
      .@{timeline-item-prefix-cls} {
        &-tail,
        &-dot,
        &-dot.custom {
          right: auto;
          left: 4.5px;
        }

        &-dot {
          margin-left: calc(-1 * (@timeline-dot-size - 1px) / 2);
          margin-right: 0;
          &.custom {
            margin-left: -18px;
            margin-right: 0;
          }
        }
        .@{timeline-item-prefix-cls}-content {
          right: 0;
          text-align: left;
          margin: 0 0 0 calc(2 * (@timeline-dot-size - @timeline-width) + @timeline-gap);
        }
      }
    }
    &.label {
      &.left {
        .@{timeline-item-prefix-cls} {
          &-tail,
          &-dot,
          &-dot.custom {
            right: calc((2 * @timeline-gap) + (@timeline-dot-size / 2));
            left: auto;
          }
          &-dot {
            margin-left: 0;
            margin-right: calc(-1 * (@timeline-dot-size - 1px) / 2);
            &.custom {
              margin-left: 0;
              margin-right: 1px;
            }
          }
          .@{timeline-item-prefix-cls}-label {
            text-align: left;
          }
          .@{timeline-item-prefix-cls}-content {
            right: calc(@timeline-dot-size + 35px);
            left: auto;
            text-align: right;
            margin-right: 0;
            margin-left: 16px;
          }
        }
      }
      &.right {
        .@{timeline-item-prefix-cls} {
          &-tail,
          &-dot,
          &-dot.custom {
            left: calc((2 * @timeline-gap) + (@timeline-dot-size / 2));
            right: auto;
          }

          &-dot {
            margin-right: 0;
            margin-left: calc(-1 * (@timeline-dot-size - 1px) / 2);
            &.custom {
              right: auto;
              left: calc(-1 * (@timeline-dot-size - 23px) / 2);
            }
          }
          .@{timeline-item-prefix-cls}-label {
            left: 0;
            right: auto;
            text-align: right;
          }
          .@{timeline-item-prefix-cls}-content {
            right: auto;
            left: calc(@timeline-dot-size + 35px);
            text-align: left;
            margin-right: 17px;
            margin-left: 0;
          }
        }
      }
      &.alternate {
        .@{timeline-item-prefix-cls} {
          &:nth-child(2n + 1) {
            .@{timeline-item-prefix-cls}-label {
              text-align: left;
            }
          }
          &:nth-child(2n) {
            .@{timeline-item-prefix-cls}-label {
              right: calc(50% + (2 * (@timeline-dot-size - @timeline-width) + @timeline-gap) - @timeline-dot-size / 2);
              left: auto;
              text-align: right;
            }
          }
        }
      }
    }
  }
}
/*! rtl:end:ignore */



@timeline-prefix: '--@{kd-prefix}-c-timeline';
@timeline-gap: 8px;

@timeline-dot-size: var(~'@{timeline-prefix}-dot-sizing',9px);
// @timeline-dot-size: 9px;

// color
@timeline-finished-color:  var(~'@{timeline-prefix}-finished-color',@color-theme);
@timeline-error-color:  var(~'@{timeline-prefix}-error-color',@color-error);
@timeline-success-color:  var(~'@{timeline-prefix}-success-color',@color-success);
@timeline-disabled-color:  var(~'@{timeline-prefix}-disabled-color',@color-disabled);
@timeline-line-color:  var(~'@{timeline-prefix}-line-color',@color-border-weak);//引导线颜色
@timeline-label-color-text: var(~'@{timeline-prefix}-label-color-text',#666666);
@timeline-content-color-text: var(~'@{timeline-prefix}-content-color-text',@color-text-primary);

// font
@timeline-content-font-size-small: var(~'@{timeline-prefix}-content-font-size',@font-size-small);


// sizing
@timeline-width: var(~'@{timeline-prefix}-sizing-width',1px);
@timeline-content-max-width: var(~'@{timeline-prefix}-content-sizing-max-width');
@timeline-content-min-width: var(~'@{timeline-prefix}-content-sizing-min-width');

// spacing
@timeline-item-padding-bottom: var(~'@{timeline-prefix}-spacing-padding-bottom',24px);













@tootip-prefix-cls: ~'@{kd-prefix}-tooltip';

.@{tootip-prefix-cls} {
  .reset-component;
  max-width: @tooltip-max-width;
  padding: @tooltip-vertical-gap @tooltip-horizontal-gap;
  color: @tooltip-color;
  border-radius: @tooltip-border-radius;
  font-size: @tooltip-font-size;
  line-height: 1.5;
  background-color: @tooltip-background-color;
  filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.2));

  .arrow::before {
    border-color: @tooltip-background-color;
  }
}



@tooltip-custom-prefix: ~'--@{kd-prefix}-c-tooltip';

// color
@tooltip-color: var(~'@{tooltip-custom-prefix}-color-text', @color-text-primary);
@tooltip-background-color: var(~'@{tooltip-custom-prefix}-color-background', @color-background);

// font
@tooltip-font-size: var(~'@{tooltip-custom-prefix}-color-text', @font-size-small);

// spacing
@tooltip-vertical-gap: var(~'@{tooltip-custom-prefix}-spacing-padding-vertical', 8px);
@tooltip-horizontal-gap: var(~'@{tooltip-custom-prefix}-spacing-padding-horizontal', 12px);

// sizing
@tooltip-max-width: var(~'@{tooltip-custom-prefix}-sizing-max-width', 360px);

// radius
@tooltip-border-radius: var(~'@{tooltip-custom-prefix}-radius-border', @radius-border);

/*! rtl:begin:ignore */




@transfer-prefix-cls: ~'@{kd-prefix}-transfer';

.@{transfer-prefix-cls} {
  .reset-component;

  position: relative;
  display: flex;
  align-items: stretch;

  .@{kd-prefix}-checkbox {
    background: transparent;
    margin-right: 6px;
  }

  &-disabled {
    .@{transfer-prefix-cls}-list {
      background: @transfer-disabled-bg;
    }
  }

  &-list {
    display: flex;
    flex-direction: column;
    width: @transfer-list-width;
    min-height: 300px;
    border: 1px solid @transfer-border-color;

    &-with-pagination {
      width: @transfer-list-width;
      height: auto;
    }

    &-header {
      height: @transfer-header-height;
      display: flex;
      align-items: center;
      flex-direction: row;
      justify-content: space-between;
      flex-shrink: 0;
      font-size: @transfer-font-size-base;
      background-color: @transfer-header-bg;
      border-bottom: 1px solid @transfer-border-color;
      .transfer-horizontal-padding(@transfer-padding-base);
      &-left {
        // flex: 1;
        display: flex;
        align-items: center;
        overflow: hidden;
      }
      &-title {
        // flex: 1;
        .ellipsis;
      }
      &-select-all {
        flex-shrink: 0;
        display: inline-flex;
        align-items: center;
      }
    }

    &-search {
      height: @transfer-search-height;
      position: relative;
      &-prefix {
        i {
          color: @transfer-search-prefix-icon-color;
        }
      }
      &-suffix {
        i {
          color: @transfer-search-suffix-icon-color;
          &:hover {
            color: @transfer-search-suffix-icon-color-hover;
          }
        }
        cursor: pointer;
      }
    }

    &-body {
      display: flex;
      flex: auto;
      flex-direction: column;
      overflow: hidden;
      font-size: @transfer-font-size-base;

      &-search-wrapper {
        position: relative;
        flex: none;
        padding: 0 12px;
        margin: 8px 0;
      }
    }

    &-content {
      height: @transfer-list-content-height;
      flex: auto;
      margin: 0;
      padding: 0;
      overflow: auto;
      list-style: none;
      padding-bottom: 8px;
      &-item {
        height: @transfer-list-item-height;
        display: flex;
        align-items: center;
        justify-content: space-between;
        .transfer-horizontal-padding(@transfer-padding-base);
        cursor: pointer;
        transition: background-color @transition-duration;
        &-disabled {
          color: @transfer-list-item-disabled;
          cursor: not-allowed;
        }
        &:hover:not(&-disabled) {
          background: @transfer-list-item-hover-bg;
        }
        &-checked {
          color: @transfer-list-item-checked;
        }
        &-text {
          flex: auto;
          .ellipsis;
        }
        &-remove{
          i {
            color: @transfer-search-suffix-icon-color;
            &:hover {
              color: @transfer-search-suffix-icon-color-hover;
            }
          }
          cursor: pointer;
        }
      }
    }
    &-pagination {
      height: @transfer-pagination-height;
      display: flex;
      align-items: center;
      justify-content: flex-end;
      .transfer-horizontal-padding(@transfer-padding-base);
      border-top: 1px solid @transfer-border-color;
    }
    &-footer {
      border-top: 1px solid @transfer-border-color;
    }
    &-body-not-found {
      flex-grow: 1;
      display: flex;
      justify-content: center;
      align-items: center;
      flex-direction: column;
      padding-bottom: 8px;
      color: rgba(153, 153, 153, 1);
      &-tip {
        font-size: 12px;
        line-height: 16px;
        margin-top: 8px;
      }
    }
  }

  &-operation {
    display: flex;
    flex: none;
    flex-direction: column;
    align-self: center;
    margin: 0 8px;
    overflow: hidden;
    vertical-align: middle;

    .@{kd-prefix}-btn {
      display: block;
      height: 28px;
      padding: 0 10px;
      box-sizing: border-box;
      min-width:40px;
      & + .@{kd-prefix}-btn {
        margin-top: 20px;
      }
    }
  }
}
.@{transfer-prefix-cls}-rtl {
  direction: rtl;
  .@{kd-prefix}-checkbox {
    background: transparent;
    margin-left: 6px;
    margin-right: 0;
  }
  .@{transfer-prefix-cls}-list {
    &-content {
      &-item {
        justify-content: start;
        &-text {
          flex: none;
        }
      }
    }
  }
}
/*! rtl:end:ignore */



.transfer-horizontal-padding(@size) {
  padding: 0 @size;
}


@transfer-custom-prefix: ~'--@{kd-prefix}-c-transfer';

// color
@transfer-disabled-bg: var(~'@{transfer-custom-prefix}-color-background-disabled', @color-background-contain-disabled);
@transfer-border-color: var(~'@{transfer-custom-prefix}-color-border', @color-border-strong);
@transfer-list-item-hover-bg: var(~'@{transfer-custom-prefix}-list-item-color-background-hover', @color-hover);
@transfer-header-bg: var(~'@{transfer-custom-prefix}-header-color-background', #f5f5f5);

// font
@transfer-font-size-base: var(~'@{transfer-custom-prefix}-font-size', 12px);

// sizing
@transfer-list-item-height: var(~'@{transfer-custom-prefix}-list-item-sizing-height', 32px);
@transfer-list-content-height: var(~'@{transfer-custom-prefix}-list-item-content-sizing-height', 320px);
@transfer-header-height: var(~'@{transfer-custom-prefix}-header-sizing-height', 36px);
@transfer-search-height: var(~'@{transfer-custom-prefix}-search-sizing-height', 32px);
@transfer-pagination-height: var(~'@{transfer-custom-prefix}-pagination-sizing-height', 36px);
@transfer-list-width: var(~'@{transfer-custom-prefix}-list-sizing-width', 250px);

// spacing
@transfer-padding-base: var(~'@{transfer-custom-prefix}-spacing-horizontal', 14px);

// text
@transfer-list-item-checked: var(~'@{transfer-custom-prefix}-list-item-color-text-checked', @color-theme);
@transfer-list-item-disabled: var(~'@{transfer-custom-prefix}-list-item-color-text-disabled', @color-disabled);
@transfer-search-prefix-icon-color: var(~'@{transfer-custom-prefix}-search-icon-color-text-prefix', #999);
@transfer-search-suffix-icon-color: var(~'@{transfer-custom-prefix}-search-icon-color-text-suffix', #bbb);
@transfer-search-suffix-icon-color-hover: var(~'@{transfer-custom-prefix}-search-icon-color-text-suffix-hover', #999);
/*! rtl:begin:ignore */



@tree-prefix-cls: ~'@{kd-prefix}-tree';
@tree-node-prefix-cls: ~'@{kd-prefix}-tree-node';
.@{tree-prefix-cls} {
  position: relative;
  overflow: auto;
  height: inherit;
  display: flex;
  flex-grow: 1;
  font-size: @tree-font-size;
  color: @tree-color-text;
  margin-left: @tree-margin-left;
  padding: @tree-padding-vertical 0;
  max-width: @tree-root-max-width;
  min-width: @tree-root-min-width;
  &-root {
    min-width: 100%;
    flex-shrink: 0;
  }

  &-show-line {
    .@{tree-node-prefix-cls}-indent {
      position: relative;
      &::before {
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        width: 1px;
        border-left: 1px solid #d9d9d9;
        content: '';
        box-sizing: border-box;
        top: 0;
        bottom: 0;
      }

      &-active::before {
        border-color: @tree-color-theme;
      }
    }
  }
}

.@{tree-node-prefix-cls} {
  &-root {
    position: relative;
    display: flex;
    justify-content: flex-start;
    align-items: center;

    .@{kd-prefix}-spin-dot-spin {
      border: 2px solid transparent;
      width: @tree-expand-icon-loading-width;
      height: @tree-expand-icon-loading-height;

      .@{kd-prefix}-spin-dot-item {
        width: @tree-expand-icon-loading-width;
        height: @tree-expand-icon-loading-height;
      }
    }
  }
  &-fb-children-pointerEvents * {
    pointer-events: none;
  }
  &-item {
    display: flex;
    align-items: center;

    .node-hover();
  }

  &-indent {
    display: flex;
    width: @tree-expand-icon-width;
    margin-right: 6px;

    height: 100%;
    cursor: default;
    flex-shrink: 0;
  }

  &-icon {
    cursor: pointer;
    height: @tree-expand-icon-height;
    width: @tree-expand-icon-width;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: @tree-node-icon-size;
    color: @tree-node-icon-color-text;

    &-hover:hover {
      background-color: @tree-node-hover-bg-color;
      cursor: pointer;
    }
  }
  &-icon-hidden {
    height: @tree-node-icon-height;
    width: @tree-node-icon-width;
    flex-shrink: 0;
    opacity: 0;
    cursor: default;
  }
  &-animation-expand {
    transform: rotate(90deg);
    transition: transform @tree-transition-duration;
  }
  &-animation-collapse {
    transform: rotate(0deg);
    transition: transform @tree-transition-duration;
  }
  &-disabled {
    cursor: not-allowed !important;
    border-color: @tree-node-disabled-border-color;
  }
  &-title-disabled {
    color: @tree-node-disabled-color;
  }
  &-title-wrap {
    flex: 1;
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
    padding-left: 4px;

    .node-hover();

    &-selected {
      .node-selected();
    }

    .@{kd-prefix}-checkbox-default-disabled {
      .@{kd-prefix}-checkbox-default-indeterminate::before {
        background-color: @tree-node-disabled-color;
      }
    }
  }
  &-title {
    white-space: nowrap;
  }
  &-selected {
    .node-selected();
  }

  &-draggabled {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height: 100%;

    &.@{tree-node-prefix-cls}-dragging {
      .@{tree-node-prefix-cls}-indent::before {
        border-color: transparent;
      }
    }
  }

  &-drag-over {
    background-color: @tree-node-drag-over-color-background;
    box-shadow: inset 0 0 0 2px @tree-node-drag-over-border-color;
  }

  &-drag-line {
    &-top,
    &-bottom {
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      border-top: 2px solid @tree-node-drag-line-border-color;

      &::before {
        content: '';
        width: 4px;
        height: 4px;
        background-color: #fff;
        border-radius: 50%;
        border: 2px solid @tree-node-drag-line-border-color;
        position: absolute;
        top: -1px;
        transform: translateY(-50%);
      }
    }
    &-top {
      top: 0;
    }

    &-bottom {
      top: 100%;
    }
  }
  &-leaf-icon {
    height: @tree-node-icon-height;
    width: @tree-node-icon-width;
    display: flex;
    justify-content: center;
    align-items: center;
  }
}
.@{tree-prefix-cls}-rtl {
  direction: rtl;
  .@{tree-prefix-cls}-root {
    .@{tree-node-prefix-cls}-item {
      .@{tree-node-prefix-cls}-root {
        .@{tree-node-prefix-cls}-indent {
          margin-right: 0;
          margin-left: 6px;
        }
        .@{tree-node-prefix-cls}-title-wrap {
          padding-right: 4px;
          padding-left: 0;
          .@{kd-prefix}-checkbox {
            &-default-margin {
              margin-right: 0;
              margin-left: 4px;
            }
          }
        }
        .@{tree-node-prefix-cls}-animation-expand {
          transform: rotate(-90deg);
        }
      }
    }
  }
}
/*! rtl:end:ignore */



.node-hover {
  &-hover {
    transition: background-color @tree-transition-duration, color @tree-transition-duration;

    &:hover {
      background-color: @tree-node-hover-bg-color;
      cursor: pointer;
    }
  }
}

.node-selected {
  background-color: @tree-node-checked-bg-color !important;
  color: @tree-node-checked-text-color;

  .@{tree-node-prefix-cls}-title {
    color: @tree-node-checked-text-color;
  }

  .@{tree-node-prefix-cls}-icon {
    color: @tree-node-checked-text-color;
  }
}



@tree-prefix: '--@{kd-prefix}-c-tree';

// color
@tree-color-text: var(~'@{tree-prefix}-color-text', @color-text-primary);
@tree-node-disabled-color: var(~'@{tree-prefix}-node-color-disabled', @color-disabled);
@tree-node-disabled-border-color: var(~'@{tree-prefix}-node-color-border-disabled', @color-border-disabled);
@tree-color-theme: var(~'@{tree-prefix}-color-theme', @color-theme);
@tree-node-checked-bg-color: var(~'@{tree-prefix}-node-color-backgroung-checked', @color-theme-3);
@tree-node-checked-text-color: var(~'@{tree-prefix}-node-color-text-checked', @color-theme);
@tree-node-hover-bg-color: var(~'@{tree-prefix}-node-color-backgroung-hover', @color-hover);
@tree-node-icon-color-text: var(~'@{tree-prefix}-node-icon-color-text', #666666);
@tree-node-drag-over-border-color: var(~'@{tree-prefix}-node-drag-over-color-border', #5582f3);
@tree-node-drag-over-color-background: var(~'@{tree-prefix}-node-drag-over-color-background', #E3EBFF);
@tree-node-drag-line-border-color: var(~'@{tree-prefix}-node-drag-line-color-background', #276FF5);

// sizing
@tree-expand-icon-height: var(~'@{tree-prefix}-expand-icon-sizing-height', 16px);
@tree-expand-icon-width: var(~'@{tree-prefix}-expand-icon-sizing-width', 16px);
@tree-expand-icon-loading-height: var(~'@{tree-prefix}-expand-icon-loading-sizing-height', 16px);
@tree-expand-icon-loading-width: var(~'@{tree-prefix}-expand-icon-loading-sizing-width', 16px);
@tree-node-icon-height: var(~'@{tree-prefix}-node-icon-sizing-height', 16px);
@tree-node-icon-width: var(~'@{tree-prefix}-node-icon-sizing-width', 16px);
@tree-root-max-width: var(~'@{tree-prefix}-root-sizing-max-width');
@tree-root-min-width: var(~'@{tree-prefix}-root-sizing-min-width');

// spacing
@tree-margin-left: var(~'@{tree-prefix}-spacing-margin-left', 0px);
@tree-padding-vertical: var(~'@{tree-prefix}-spacing-padding-vertical', 3px);

// font
@tree-font-size: var(~'@{tree-prefix}-font-size', @font-size-small);
@tree-node-icon-size: var(~'@{tree-prefix}-node-icon-font-size', 16px);

// motion
@tree-transition-duration: var(~'@{tree-prefix}-motion-duration', @duration-promptly);

/*! rtl:begin:ignore */




@tree-select-prefix-cls: ~'@{kd-prefix}-tree-select';
@tree-prefix-cls: ~'@{kd-prefix}-tree';

.@{tree-select-prefix-cls} {
  position: relative;
  display: inline-block;
  box-sizing: border-box;
  background-color: transparent;
  cursor: pointer;
  vertical-align: middle;

  &-selector:hover {
    .@{tree-select-prefix-cls}-icon-active {
      color: #3761ca;
    }
  }
  &-visible {
    .@{tree-select-prefix-cls}-icon-active {
      color: #3761ca;
    }
    .@{tree-select-prefix-cls}-selection-item {
      color: @tree-select-placeholder-color;
    }
  }

  &-icon {
    &-arrow {
      display: inline-flex;
      align-items: center;
      vertical-align: middle;
      &-up {
        transform: rotate(180deg);
        transition: transform calc(@transition-duration - 0.1s) @ease;
      }

      &-down {
        transform: rotate(0deg);
        transition: transform calc(@transition-duration - 0.1s) @ease;
      }

      &-focus {
        color: @tree-select-g-color-border-foucs;
      }
    }

    &-clear {
      opacity: 0;
      z-index: 1;
      position: absolute;
      background: #fff;
      transition: opacity 0.15s ease;
      &:hover {
        color: @tree-select-g-color-border-hover;
      }
    }
  }

  &-focused:not(.@{tree-select-prefix-cls}-error) {
    .focusColor();
  }
  &-placeholder {
    position: absolute;
    color: @tree-select-placeholder-color;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    right: 28px;
    left: 0;
  }

  &-borderless {
    border: none;
  }

  &-underline {
    border-bottom: 1px solid @tree-select-g-color-border;
    &:hover:not(.@{tree-select-prefix-cls}-multiple-disabled):not(.@{tree-select-prefix-cls}-single-disabled):not(
        .@{tree-select-prefix-cls}-error
      ) {
      border-bottom: 1px solid @tree-select-g-color-border-hover;
    }
  }

  &-bordered {
    border: 1px solid @tree-select-border-g-color-border;
    padding-left: @tree-select-bordered !important;
    border-radius: @tree-select-border-radius-border;
    &:hover:not(.@{tree-select-prefix-cls}-multiple-disabled):not(.@{tree-select-prefix-cls}-single-disabled):not(
        .@{tree-select-prefix-cls}-error
      ) {
      border: 1px solid @tree-select-g-color-border-hover;
    }

    .@{tree-select-prefix-cls}-suffix {
      padding-right: 8px;
    }

    &.@{tree-select-prefix-cls}-single {
      .@{tree-select-prefix-cls}-selection-search {
        padding-left: @tree-select-bordered;
      }
    }

    .@{tree-select-prefix-cls}-placeholder {
      padding-left: @tree-select-bordered;
    }
  }

  &-wrapper {
    transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    padding: @tree-select-wrapper-padding;
    max-width: 100%;
    color: #212121;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    cursor: pointer;
    box-sizing: border-box;
    overflow-y: auto;
    overflow-x: hidden;
    position: relative;
  }

  &-dropdown {
    display: block;
    left: 0;
    z-index: @tree-select-z-index;
    box-sizing: border-box;
    padding: @tree-select-padding-vertical 0;
    margin: 0;
    overflow: auto;
    font-size: @tree-select-list-font-size;
    font-variant: initial;
    background-color: @tree-select-dropdown-bg;
    border-radius: @tree-select-g-radius-border;
    outline: none;
    box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.2);
    max-height: 200px;

    .@{tree-prefix-cls} {
      padding: 0;
    }

    .@{tree-prefix-cls}-node-item {
      padding: 0 @tree-select-dropdown-node-horizontal;
    }

    &-scroll {
      overflow-y: auto;
    }

    &-empty {
      padding: 5px 12px;
    }

    // 搜索框
    &-search {
      padding: 5px 6px;
      &-hidden {
        display: none;
      }
    }
  }

  // 选择器框大小
  &-size-small {
    .select-input-size(@tree-select-small-height, @tree-select-small-height, @tree-select-small-line-height, @tree-select-small-font-size);
  }

  &-size-middle {
    .select-input-size(@tree-select-middle-height, @tree-select-middle-height, @tree-select-middle-line-height, @tree-select-middle-font-size);
  }

  &-size-large {
    .select-input-size(@tree-select-large-height, @tree-select-large-height, @tree-select-large-line-height, @tree-select-large-font-size);
  }

  &-suffix {
    right: 0;
    position: absolute;
    display: flex;
    flex: 0;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    margin-left: 8px;
  }
  .@{tree-select-prefix-cls}-single {
    .@{tree-select-prefix-cls}-selection {
      &-search {
        position: absolute;
        right: 28px;
        left: 0;
        height: 100%;
        &-input {
          outline: 0;
          border-radius: 0;
          border: none;
          background: transparent;
          height: 100%;
          width: 100%;
        }
      }
      &-item {
        display: inline-block;
        .over();
      }
    }
    &-focused:not(.@{tree-select-prefix-cls}-error) {
      .focusColor();
    }
    &-disabled {
      background-color: @tree-select-color-background-disabled;
      color: @tree-select-color-text-disabled;
      &:hover {
        cursor: not-allowed;
      }

      .@{tree-select-prefix-cls}-suffix {
        color: @tree-select-arrow-icon-color-text-disabled;
      }
    }
    &:hover .@{tree-select-prefix-cls}-icon-clear {
      opacity: 1;
    }

    .@{tree-select-prefix-cls}-icon-clear {
      color: @tree-select-clear-color;
      &:hover {
        color: @tree-select-clear-color-hover;
      }
    }
    &-text {
      color: @tree-select-single-color-text;
      .over();
    }
    &-disabled-text {
      color: @tree-select-color-text-disabled;
    }
  }

  .@{tree-select-prefix-cls}-selection-item {
    display: inline-flex;
    box-sizing: border-box;
    align-items: center;
    vertical-align: middle;
    max-width: 100%;
    height: 20px;
    line-height: 20px;
    margin: 2px 8px 2px 0;
    cursor: default;
    user-select: none;
    &-small {
      height: 20px;
      line-height: 18px;
      font-size: 12px;
    }

    &-middle {
      font-size: 12px;
      height: 20px;
      line-height: 18px;
    }

    &-large {
      font-size: 14px;
      line-height: 22px;
      height: 22px;
    }

    &-content {
      display: inline-flex;
      align-items: center;
      vertical-align: middle;
      padding: 0 7px;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
      border: 1px solid #ccc;
      color: #212121;
    }

    &-span {
      position: relative;
      margin-left: 0.5px;
      box-sizing: border-box;
    }
    &-input {
      cursor: text;
      margin: 0;
      padding: 0;
      background: 0 0;
      border: none;
      outline: none;
      appearance: none;
      width: 100%;
      min-width: 20px;
    }
  }

  // 多选
  &-multiple {
    .@{tree-select-prefix-cls}-selection {
      &-tag {
        max-width: calc(100% - 5px);

        .@{kd-prefix}-tag {
          margin: 2px 8px 2px 0;
          max-width: 100%;
        }
      }
      &-search {
        position: relative;
        max-width: 100%;
        &-input {
          outline: 0;
          border-radius: 0;
          border: none;
          background: transparent;
          width: 100%;
        }
        &-mirror {
          position: absolute;
          top: 0;
          left: 0;
          z-index: 999;
          white-space: pre;
          visibility: hidden;
        }
      }
    }
    &-disabled {
      cursor: not-allowed;
      background-color: @tree-select-color-background-disabled;
      color: @tree-select-color-text-disabled;

      .@{tree-select-prefix-cls}-suffix {
        color: @tree-select-arrow-icon-color-text-disabled;
      }
    }
    &:hover .@{tree-select-prefix-cls}-icon-clear {
      opacity: 1;
    }
    .@{tree-select-prefix-cls}-icon-clear {
      color: @tree-select-clear-color;
      &:hover {
        color: @tree-select-clear-color-hover;
      }
    }
    &-selector {
      position: relative;
      cursor: text;
      padding-right: 24px;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
    }
    .@{tree-select-prefix-cls}-wrapper {
      &:hover:not(.@{tree-select-prefix-cls}-multiple-disabled) {
        border-bottom: 1px solid @tree-select-g-color-border-hover;
      }
    }

    &-footer {
      color: @tree-select-font-color;
      display: inline-flex;
      align-items: center;
      width: 100%;
      padding: 0 12px;
      height: 32px;
      line-height: 32px;
      border-top: 1px solid #d9d9d9;
      box-sizing: border-box;

      &-hadSelected {
        color: #999999;
        padding-left: 12px;
        > span {
          color: @tree-select-footer-g-text-color-selected;
          padding: 0 2px;
        }
      }
    }
  }

  &-error:not(.@{tree-select-prefix-cls}-single-disabled):not(.@{tree-select-prefix-cls}-multiple-disabled) {
    border-color: @tree-select-error-color;
  }

}
.@{tree-select-prefix-cls}-panel {
  &.topLeft.hidden,
  &.topRight.hidden {
    opacity: 0;
    visibility: hidden;
    transition: all calc(@transition-duration - 0.1s) @ease;
    animation-name: kdSlideDownOut;
  }

  &.topLeft,
  &.topRight {
    animation-name: kdSlideDownIn;
  }

  &.bottomLeft.hidden,
  &.bottomRight.hidden {
    opacity: 0;
    visibility: hidden;
    transition: all calc(@transition-duration - 0.1s) @ease;
    animation-name: kdSlideUpOut;
  }

  &.bottomLeft,
  &.bottomRight {
    animation-name: kdSlideUpIn;
  }
}
.@{tree-select-prefix-cls}-rtl {
  direction: rtl;
  .@{tree-select-prefix-cls}-wrapper {
    padding: 1px 0 1px 28px;
    &.@{tree-select-prefix-cls}-single {
      .@{tree-select-prefix-cls}-selection {
        &-search {
          left: 28px;
          right: 0;
        }
      }
    }
  }
  .@{tree-select-prefix-cls}-placeholder {
    left: 28px;
    right: 0;
    text-align: right;
  }
  .@{tree-select-prefix-cls}-suffix {
    right: auto;
    left: 0;
    margin-left: 0;
    margin-right: 8px;
  }
  .@{tree-select-prefix-cls}-selection-item {
    margin: 2px 0 2px 8px;
  }
  .@{tree-select-prefix-cls}-bordered {
    padding-right: @tree-select-bordered !important;
    padding-left: 0;
    .@{tree-select-prefix-cls}-suffix {
      padding-left: 8px;
      padding-right: 0;
    }

    &.@{tree-select-prefix-cls}-single {
      .@{tree-select-prefix-cls}-selection-search {
        padding-right: @tree-select-bordered;
        padding-left: 0;
      }
    }

    .@{tree-select-prefix-cls}-placeholder {
      padding-left: 0;
      padding-right: @tree-select-bordered;
    }
  }
  .@{tree-select-prefix-cls}-multiple {
    .@{tree-select-prefix-cls}-selection {
      &-tag {
        .@{kd-prefix}-tag {
          margin: 2px 0 2px 8px;
        }
      }
    }
  }
}
/*! rtl:end:ignore */



.item() {
  position: relative;
  display: block;
  font-weight: normal;
  font-size: @tree-select-list-font-size;
  min-height: @tree-select-dropdown-height;
  padding: 5px 12px;
  color: @tree-select-font-color;
  line-height: @tree-select-dropdown-line-height;
}

.focusColor() {
  border-color: @tree-select-g-color-border-foucs !important;
}

.select-input-size(@height, @maxHeight, @lineHeight, @fontSize) {
  min-height: @height;
  max-height: calc(@maxHeight * 3 - 10px);
  font-size: @fontSize;
}

.over() {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}




@tree-select-custom-prefix: ~'--@{kd-prefix}-c-tree-select';

// color
@tree-select-dropdown-bg: var(~'@{tree-select-custom-prefix}-dropdown-color-background', @color-background);
@tree-select-disabled-option-bg: var(~'@{tree-select-custom-prefix}-item-color-background-disabled', #fff);
@tree-select-item-active-bg: var(~'@{tree-select-custom-prefix}-color-background', #f5f5f5);
@tree-select-item-selected-bg: var(~'@{tree-select-custom-prefix}-color-background-selected', @color-theme-3);
@tree-select-g-color-border: var(~'@{tree-select-custom-prefix}-color-border', @color-input);
@tree-select-g-color-border-foucs: var(~'@{tree-select-custom-prefix}-color-border-foucs', @color-theme);
@tree-select-g-color-border-hover: var(~'@{tree-select-custom-prefix}-color-border-hover', @color-theme);
@tree-select-border-g-color-border: var(~'@{tree-select-custom-prefix}-border-color-border', @color-border-strong);
@tree-select-placeholder-color: var(~'@{tree-select-custom-prefix}-placeholder-color-text', #b2b2b2);
@tree-select-item-selected-color: var(~'@{tree-select-custom-prefix}-item-color-text-selected', @color-theme);
@tree-select-font-color: var(~'@{tree-select-custom-prefix}-footer-color-text', @color-text-primary);
@tree-select-footer-g-text-color-selected: var(~'@{tree-select-custom-prefix}-footer-color-text-selected', #0e5fd8);
@tree-select-g-item-text-color-disabled: var(~'@{tree-select-custom-prefix}-item-color-text-disabled', @color-disabled);
@tree-select-color-background-disabled: var(~'@{tree-select-custom-prefix}-color-background-disabled', #f5f5f5);
@tree-select-color-text-disabled: var(~'@{tree-select-custom-prefix}-color-text-disabled', @color-disabled);
@tree-select-arrow-icon-color-text-disabled: var(~'@{tree-select-custom-prefix}-arrow-icon-color-text-disabled', #b2b2b2);
@tree-select-single-color-text: var(~'@{tree-select-custom-prefix}-single-color-text', @color-text-primary);
@tree-select-clear-color: var(~'@{tree-select-custom-prefix}-icon-clear-color-text', #d9d9d9);
@tree-select-clear-color-hover: var(~'@{tree-select-custom-prefix}-icon-clear-color-text-hover', #999);
@tree-select-error-color: var(~'@{tree-select-custom-prefix}-color-error', @color-error);

// font
@tree-select-list-font-size: var(~'@{tree-select-custom-prefix}-dropdown-font-size', 12px); // 下拉列表文字大小
@tree-select-large-font-size: var(~'@{tree-select-custom-prefix}-font-size-large', 16px); // 大号字体
@tree-select-middle-font-size: var(~'@{tree-select-custom-prefix}-font-size-middle', 14px); // 中号高度
@tree-select-small-font-size: var(~'@{tree-select-custom-prefix}-font-size-small', 12px); // 小号高度

// line-height
@tree-select-dropdown-line-height: var(~'@{tree-select-custom-prefix}-dropdown-line-height', 22px);
@tree-select-large-line-height: var(~'@{tree-select-custom-prefix}-line-height-large', 28px);
@tree-select-middle-line-height: var(~'@{tree-select-custom-prefix}-line-height-middle', 22px);
@tree-select-small-line-height: var(~'@{tree-select-custom-prefix}-line-height-small', 14px);

// sizing
@tree-select-dropdown-height: var(~'@{tree-select-custom-prefix}-item-sizing-height', 22px);
@tree-select-large-height: var(~'@{tree-select-custom-prefix}-sizing-height-large', 36px); // 大号高度 lh:28px
@tree-select-middle-height: var(~'@{tree-select-custom-prefix}-sizing-height-middle', 32px); // 中号高度lh:22px
@tree-select-small-height: var(~'@{tree-select-custom-prefix}-sizing-height-small', 24px); // 小号高度lh:12px

// spacing
@tree-select-bordered: var(~'@{tree-select-custom-prefix}-bordered-spacing-padding-left', 8px);
@tree-select-wrapper-padding: var(~'@{tree-select-custom-prefix}-wrapper-spacing-padding', 1px 28px 1px 0);
@tree-select-dropdown-node-horizontal: var(~'@{tree-select-custom-prefix}-dropdown-node-spacing-padding-horizontal', 16px);
@tree-select-padding-vertical: var(~'@{tree-select-custom-prefix}-dropdown-spacing-padding-vertical', 8px);

// radius
@tree-select-g-radius-border: var(~'@{tree-select-custom-prefix}-radius-border', @radius-border);
@tree-select-border-radius-border: var(~'@{tree-select-custom-prefix}-bordered-radius-border', 2px);

// z-index
@tree-select-z-index: var(~'@{tree-select-custom-prefix}-z-index', @z-index-popper);



@typography-prefix-cls: ~'@{kd-prefix}-typography';
.@{typography-prefix-cls} {
  color: @typography-color-text-primary;
  overflow-wrap: break-word;
  line-height: 2;
  max-width: @typography-max-width;

  &&-second {
    color: @typography-color-text-secondary;
  }

  &&-success {
    color: @typography-color-success;
  }

  &&-warning {
    color: @typography-color-warning;
  }

  &&-danger {
    color: @typography-color-error;
  }

  &&-disabled {
    color: @typography-color-disabled;
    cursor: not-allowed;
    user-select: none;
  }

  &&-assist {
    color: @typography-color-text-third;
  }

  h1&,
  h2&,
  h3&,
  h4&,
  h5& {
    .@{typography-prefix-cls} + & {
      margin-top: @typography-title-margin-top;
    }
  }

  article& > div& {
    .typography-paragraph(@typography-paragraph-margin-bottom);
    &:first-child {
      .typography-paragraph(@typography-margin-bottom);
    }
  }

  article& > div& + div& {
    h2 {
      margin-top: @typography-margin-bottom;
    }
  }

  article& h1 {
    margin-top: 0;
    .typography-title-1(@heading-1-margin-bottom);
  }
  article& h2 {
    margin-top: 0;
    .typography-title-2(@heading-2-margin-bottom);
  }
  article& h3 {
    margin-top: 0;
    .typography-title-3(@heading-3-margin-bottom);
  }

  h1&,
  h1 {
    .typography-title-1();
  }
  h2&,
  h2 {
    .typography-title-2();
  }
  h3&,
  h3 {
    .typography-title-3();
  }
  // h4&,
  // h4 {
  //   .typography-title-4();
  // }
  // h5&,
  // h5 {
  //   .typography-title-5();
  // }

  code {
    margin: 0 0.2em;
    padding: 0.2em 0.4em 0.1em;
    font-size: 85%;
    background: rgba(150, 150, 150, 0.1);
    border: 1px solid rgba(100, 100, 100, 0.2);
    border-radius: 3px;
  }

  kbd {
    margin: 0 0.2em;
    padding: 0.15em 0.4em 0.1em;
    font-size: 90%;
    background: rgba(150, 150, 150, 0.06);
    border: 1px solid rgba(100, 100, 100, 0.2);
    border-bottom-width: 2px;
    border-radius: 3px;
  }

  strong {
    font-weight: 600;
  }

  // list
  ul,
  ol {
    margin: 0 0 @heading-2-margin-bottom 0;
    padding: 0;

    li {
      margin: 0 0 0 20px;
      padding: 0 0 0 4px;
    }
  }

  ul {
    list-style-type: disc;

    ul {
      list-style-type: disc;
    }
  }

  ol {
    list-style-type: decimal;
  }
}
/*! rtl:begin:ignore */
.@{typography-prefix-cls}-rtl {
  direction: rtl;
  text-align: right;
  ul,
  ol {
    li {
      margin: 0 20px 0 0;
      padding: 0 4px 0 0;
    }
  }
}
/*! rtl:end:ignore */



.typography-paragraph(@marginBottom) {
  margin-bottom: @marginBottom;
}

.typography-title(@fontSize; @fontWeight; @lineHeight; @headingColor; @headingMarginBottom) {
  margin-bottom: @headingMarginBottom;
  color: @headingColor;
  font-weight: @fontWeight;
  font-size: @fontSize;
  line-height: @lineHeight;
}

.typography-title-1(@marginBottom: @typography-title-margin-bottom) {
  .typography-title(
    @heading-1-size,
    @typography-title-font-weight,
    1.5,
    @typography-color-text-primary,
    @marginBottom
  );
}

.typography-title-2(@marginBottom: @typography-title-margin-bottom) {
  .typography-title(
    @heading-2-size,
    @typography-title-font-weight,
    1.5,
    @heading-2-color,
    @marginBottom
  );
}

.typography-title-3(@marginBottom: @typography-title-margin-bottom) {
  .typography-title(
    @heading-3-size,
    @typography-title-font-weight,
    1.5,
    @typography-color-text-primary,
    @marginBottom
  );
}

.typography-title-4() {
  .typography-title(
    @heading-4-size,
    @typography-title-font-weight,
    1.4,
    @typography-color-text-primary,
    @typography-title-margin-bottom
  );
}

.typography-title-5() {
  .typography-title(
    @heading-5-size,
    @typography-title-font-weight,
    1.5,
    @typography-color-text-primary,
    @typography-title-margin-bottom
  );
}

.operation-unit() {
  color: @typography-link-color;
  text-decoration: none;
  outline: none;
  cursor: pointer;
  transition: color @typography-duration-promptly;

  &:focus,
  &:hover {
    color: @typography-link-color-hover;
  }

  &:active {
    color: @link-color-active;
  }
}


@typography-prefix: '--@{kd-prefix}-c-typography';

// color
@heading-2-color: var(~'@{typography-prefix}-title-color-text', #276ff5);
@typography-color-text-primary: var(~'@{typography-prefix}-color-text-primary', @color-text-primary);
@typography-color-text-secondary: var(~'@{typography-prefix}-color-text-secondary', @color-text-secondary);
@typography-color-text-third: var(~'@{typography-prefix}-color-text-third', @color-text-third);
@typography-color-warning: var(~'@{typography-prefix}-color-warning', @color-warning);
@typography-color-error: var(~'@{typography-prefix}-color-error', @color-error);
@typography-color-success: var(~'@{typography-prefix}-color-success', @color-success);
@typography-color-disabled: var(~'@{typography-prefix}-color-disabled', @color-disabled);
@typography-link-color: var(~'@{typography-prefix}-color-text-link', @color-text-link);
@typography-link-color-hover: var(~'@{typography-prefix}-color-text-link-hover', @color-text-link-hover);
@typography-link-color-active: var(~'@{typography-prefix}-color-text-link-active', @color-text-link-active);

// font
@typography-title-font-weight: var(~'@{typography-prefix}-title-font-weight', 600);
@heading-1-size: var(~'@{typography-prefix}-font-size-1', 40px);
@heading-2-size: var(~'@{typography-prefix}-font-size-2', 28px);
@heading-3-size: var(~'@{typography-prefix}-font-size-3', 18px);

// motion
@typography-duration-promptly: var(~'@{typography-prefix}-motion-duration', @duration-promptly);

// spacing
@typography-title-margin-top: var(~'@{typography-prefix}-title-spacing-margin-top', 1.2em);
@typography-title-margin-bottom: var(~'@{typography-prefix}-title-spacing-margin-bottom', 0.5em);
@typography-paragraph-margin-bottom: var(~'@{typography-prefix}-paragraph-spacing-margin-bottom', 24px);
@typography-margin-bottom: var(~'@{typography-prefix}-spacing-margin-bottom', 80px);
@heading-1-margin-bottom: var(~'@{typography-prefix}-spacing-margin-bottom-1', 12px);
@heading-2-margin-bottom: var(~'@{typography-prefix}-spacing-margin-bottom-2', 24px);
@heading-3-margin-bottom: var(~'@{typography-prefix}-spacing-margin-bottom-3', 12px);

// sizing
@typography-max-width: var(~'@{typography-prefix}-sizing-width-max', 830px);


/*! rtl:begin:ignore */





@upload-prefix-cls: ~'@{kd-prefix}-upload';
@upload-prefix-text-list-cls: ~'@{upload-prefix-cls}-text-list';
@upload-prefix-picture-list-cls: ~'@{upload-prefix-cls}-picture-list';

.@{upload-prefix-cls} {
  .reset-component;

  &-select {
    position: relative;
    display: inline-block;
    cursor: pointer;
  }

  &-drag {
    .reset-component;
    position: relative;
    cursor: pointer;
    display: flex;
    height: 80px;
    text-align: center;
    align-items: center;
    justify-content: center;
    color: @upload-text-color;
    border: 1px dashed @upload-border-color;
    background-color: @upload-background-color;
    transition: border-color @upload-transition-duration, background-color @upload-transition-duration;

    &.hover,
    &:hover,
    &:active {
      border-color: @upload-border-color-active;
      background-color: @upload-background-color-ongoing;
    }
  }

  &-input {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0;
    overflow: hidden;

    input[type='file'] {
      position: absolute;
      top: -20%;
      left: 0;
      width: 100%;
      height: 120%;
      font-size: 0;
      cursor: pointer;
    }
  }

  .@{upload-prefix-text-list-cls} {
    .reset-component;
    margin-top: @upload-text-list-margin-top;
    font-size: @upload-font-size;
    border-top: 1px dashed @upload-border-color-strong;

    &-item {
      position: relative;
      padding: 0 @upload-text-list-item-padding-horizontal;
      height: @upload-list-item-height;
      overflow: hidden;
      white-space: nowrap;
      display: flex;
      align-items: center;
      transition: background-color @upload-transition-duration;

      &:hover {
        background-color: @upload-background-color-hover;

        .@{upload-prefix-text-list-cls}-item-action {
          opacity: 1;
          visibility: visible;
          transform: translateX(0);
        }
      }

      &.error {
        i,
        .@{upload-prefix-text-list-cls}-item-name {
          color: @upload-text-error-color;
        }
      }

      &-icon > i {
        font-size: @upload-font-size;
      }

      &-name,
      &-icon {
        cursor: pointer;
      }

      &-name {
        display: inline-block;
        margin: 0 @upload-text-list-item-name-padding-right 0 @upload-text-list-item-name-padding-left;
        .ellipsis;
        color: @upload-panel-color;
      }

      &-size {
        color: @upload-text-color;
      }

      &-action {
        position: absolute;
        top: 0;
        right: 0;
        padding: 0 @upload-text-list-item-padding-horizontal;
        height: @upload-list-item-height;
        line-height: @upload-list-item-height;
        background: transparent;
        opacity: 0;
        visibility: hidden;
        transform: translateX(5px);
        transition: transform @upload-transition-duration;

        a {
          display: inline-block;
          vertical-align: middle;
          color: @upload-panel-button-color;

          &:not(:first-child) {
            margin-left: 20px;
          }
        }
      }
    }
  }

  .@{upload-prefix-picture-list-cls} {
    .reset-component;

    &-item {
      position: relative;
      width: 100px;
      height: 100px;
      display: inline-block;
      margin: 0 28px 28px 0;
      vertical-align: middle;
      overflow: hidden;
      border-radius: @upload-border-radius;
      border: 1px solid @upload-border-color;
      background-color: @upload-background-color;

      .@{upload-prefix-cls}-select {
        display: flex;
        position: absolute;
        top: -1px;
        right: -1px;
        bottom: -1px;
        left: -1px;
        color: @upload-text-color;
        align-items: center;
        justify-content: center;
        border: 1px dashed @upload-border-color;
        transition: all @upload-transition-duration;

        &:hover,
        &:active {
          border-color: @upload-border-color-active;
          background-color: @upload-background-color-ongoing;
        }

        .@{upload-prefix-cls}-handle {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100%;
          display: flex;
          text-align: center;
          align-items: center;
          justify-content: center;
        }
      }

      img {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        margin: auto;
        max-width: 100%;
        max-height: 100%;
      }

      &.error {
        border-color: @upload-border-error-color;
        background-color: @upload-background-error-color;
      }

      &-loading {
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        > * {
          width: 80%;
        }
      }

      &-error {
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        &-text {
          margin-bottom: 4px;
          color: @upload-text-error-color;
        }

        a {
          display: inline-block;
          &:not(:first-child) {
            margin-left: 10px;
          }
        }
      }

      &-action > a {
        color: @upload-panel-button-color;
        font-size: @upload-picture-action-font-size;
      }
    }
  }
}
.@{upload-prefix-cls}-rtl {
  direction: rtl;
  &.@{upload-prefix-cls} {
    .@{upload-prefix-text-list-cls} {
      &-item {
        &-name {
          margin: 0 @upload-text-list-item-name-padding-left 0 @upload-text-list-item-name-padding-right;
        }
        &-action {
          left: 0;
          right: auto;
          transform: translateX(-5px);
          a {
            &:not(:first-child) {
              margin-right: 20px;
              margin-left: 0;
            }
          }
        }
      }
    }
    .@{upload-prefix-picture-list-cls} {
      &-item {
        margin: 0 0 28px 28px;
        &-error {
          a {
            &:not(:first-child) {
              margin-right: 10px;
              margin-left: auto;
            }
          }
        }
      }
    }
  }
}
/*! rtl:end:ignore */



@upload-prefix: '--@{kd-prefix}-c-upload';

// color
@upload-text-color: var(~'@{upload-prefix}-color', @color-text-third);

@upload-text-error-color: var(~'@{upload-prefix}-error-color', @color-error);
@upload-background-error-color: var(~'@{upload-prefix}-color-background-error', @color-background-error);
@upload-border-error-color: var(~'@{upload-prefix}-color-border-error', @color-border-error);
@upload-border-color: var(~'@{upload-prefix}-color-border', @color-border-weak);
@upload-border-color-strong: var(~'@{upload-prefix}-division-color', @color-border-strong);
@upload-border-color-active: var(~'@{upload-prefix}-color-border-active', @color-text-link);
@upload-background-color: var(~'@{upload-prefix}-color-background', @color-background-contain);
@upload-background-color-ongoing: var(~'@{upload-prefix}-color-background-ongoing', @color-background-ongoing);
@upload-background-color-hover: var(~'@{upload-prefix}-color-background-hover', @color-hover);

@upload-panel-button-color: var(~'@{upload-prefix}-panel-button-color', #0E5FD8);
@upload-panel-color: var(~'@{upload-prefix}-panel-color', @color-text-primary);

// motion
@upload-transition-duration: var(~'@{upload-prefix}-motion-duration', @duration-promptly);

// font
@upload-font-size: var(~'@{upload-prefix}-font-size', @font-size-middle);
@upload-picture-action-font-size: var(~'@{upload-prefix}-picture-action-font-size', @font-size-small);

// radius
@upload-border-radius: var(~'@{upload-prefix}-radius-border', @radius-border);

// sizing
@upload-list-item-height: var(~'@{upload-prefix}-list-item-height', 44px);

//spacing
@upload-text-list-margin-top: var(~'@{upload-prefix}-text-list-margin-top', 16px);
@upload-text-list-item-padding-horizontal: var(~'@{upload-prefix}-text-list-item-padding-horizontal', 20px);
@upload-text-list-item-name-padding-left: var(~'@{upload-prefix}-text-list-item-name-padding-left', 4px);
@upload-text-list-item-name-padding-right: var(~'@{upload-prefix}-text-list-item-name-padding-right', 8px);


@theme-color: var(--theme-color);
@theme-color-level1: var(--theme-color-level1);
@theme-color-level2: var(--theme-color-level2);
@theme-color-level3: var(--theme-color-level3);
@theme-color-level4: var(--theme-color-level4);
@theme-color-level5: var(--theme-color-level5);
@theme-color-level6: var(--theme-color);
@theme-color-level7: var(--theme-color-level7);
@theme-color-level8: var(--theme-color-level8);
@theme-color-level9: var(--theme-color-level9);
@theme-color-disabled: var(--theme-color-disabled);
@theme-color-hover: var(--theme-color-level5);
@theme-color-click: var(--theme-color-level7);
@theme-color-active-light: var(--theme-color-level1);
@theme-color-active-dark: var(--theme-color);
@hover-color: var(--hover-color);
@disabled-contain-bg: var(--disabled-contain-bg);
@success-color: var(--success-color);
@success-bg-color: var(--success-bg-color);
@success-border-color: var(--success-border-color);
@warning-color: var(--warning-color);
@warning-bg-color: var(--warning-bg-color);
@warning-border-color: var(--warning-border-color);
@error-color: var(--error-color);
@error-bg-color: var(--error-bg-color);
@error-border-color: var(--error-border-color);
@ongoing-color: var(--ongoing-color);
@ongoing-bg-color: var(--ongoing-bg-color);
@ongoing-border-color: var(--ongoing-border-color);
@disabled-color: var(--disabled-color);
@disabled-border-color: var(--disabled-border-color);
@link-color: var(--link-color);
@link-color-hover: var(--link-color-hover);
@link-color-active: var(--link-color-active);
@primary-text-color: var(--primary-text-color);
@primary-text-color2: var(--primary-text-color2);
@secondary-text-color: var(--secondary-text-color);
@secondary-text-color2: var(--secondary-text-color2);
@third-text-color: var(--third-text-color);
@third-text-color2: var(--third-text-color2);
@placeholder-text-color: var(--placeholder-text-color);
@placeholder-text-color2: var(--placeholder-text-color2);
@bg: var(--bg);
@bg2: var(--bg2);
@contain-bg: var(--contain-bg);
@radius-size: var(--radius-size);
@input-color: var(--input-color);
@strong-border-color: var(--strong-border-color);
@strong-border-color-1: var(--strong-border-color-1);
@weak-border-color: var(--weak-border-color);
@zebra-stripe-deep-bg-color: var(--zebra-stripe-deep-bg-color);
@btn-default-ghost-color: var(--btn-default-ghost-color);
@btn-default-ghost-active-bg: var(--btn-default-ghost-active-bg);
@btn-default-ghost-theme-color: var(--theme-color-level6);
@btn-default-ghost-theme-hover-color: var(--theme-color-level5);
@btn-default-ghost-theme-active-color: var(--theme-color-level7);
@grid-hyper-link-text-decoration: var(--grid-hyper-link-text-decoration);
@bill-list-grid-row-selected-bg-color: var(--bill-list-grid-row-selected-bg-color);
@entry-entity-grid-row-selected-bg-color: var(--entry-entity-grid-row-selected-bg-color);
@report-list-grid-row-selected-bg-color: var(--report-list-grid-row-selected-bg-color);
@__bill-list-grid-row-selected-dark-bg-color: var(--bill-list-grid-row-selected-dark-bg-color);
@__entry-entity-grid-row-selected-dark-bg-color: var(--entry-entity-grid-row-selected-dark-bg-color);
@__report-list-grid-row-selected-dark-bg-color: var(--report-list-grid-row-selected-dark-bg-color);