.weda-ui-custom-mask {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  background: rgba(0, 0, 0, 0.4);
  transition: all 0.4s ease-in-out 0;
  pointer-events: none;
  opacity: 1;
  pointer-events: auto;
}

.weda-ui-custom-picker {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  z-index: 1001;
}

.weda-ui-custom-picker__inner {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: #fff;
  border-radius: 10px 10px 0 0;
  height: 390px;
  display: flex;
  flex-direction: column;
  padding-bottom: 30px;
}

.weda-ui-custom-picker__header {
  display: flex;
  flex: 0 0 auto;
  justify-content: space-between;
  padding: 12px 20px;
  border-bottom: 0.5px solid #e3e6eb;
}

.weda-ui-custom-picker__body {
  padding: 5px 16px;
  overflow: auto;
  flex: 1 1 0px;
  box-sizing: border-box;
}

.weda-ui-custom-picker__header-btn {
  margin: 0;
  background-color: transparent;
  font-size: 16px;
  padding: 0;
  line-height: 24px;
  color: rgba(0, 0, 0, 0.6);
}

.weda-ui-custom-picker__header-btn.is-primary {
  color: var(--wd-color-brand, #0052d9);
}

.weda-ui-custom-picker__header-btn::after {
  border: none;
}

.weda-ui-custom-picker__cloumns {
  display: flex;
  align-items: flex-start;
  position: relative;
  /* padding: 0 16px; */
  /* height: 200px; */
  overflow: hidden;
}

.weda-ui-custom-picker__cloumn {
  flex: 1 1 0;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-overflow-scrolling: auto;
  /* height: 199px; */
}

.weda-ui-custom-picker__cloumn::-webkit-scrollbar {
  display: none;
}

.weda-ui-custom-picker__cloumn-item {
  display: flex;
  align-items: center;
  white-space: pre-wrap;
  height: 48px;
  justify-content: flex-start;
  color: rgba(0, 0, 0, 0.9);
  position: relative;
}

.weda-ui-custom-picker__cloumn-item::before {
  content: '';
  position: absolute;
  bottom: 0;
  background-color: #e7e7e7;
  width: 100%;
  height: 1px;
  transform: scaleY(0.5);
}

/* theme */
.weda-ui-custom-picker__cloumn-item.is-selected {
  color: var(--wd-color-brand, #0052d9);
}

.weda-ui-custom-picker__cloumn-item.is-selected::after {
  content: '';
  display: block;
  width: 8px;
  height: 16px;
  border-color: var(--wd-color-brand, #0052d9);
  border-style: solid;
  border-width: 0 1.5px 1.5px 0;
  transform: rotate(45deg);
  position: absolute;
  right: 10px;
}

.weda-ui-custom-picker__cloumn-item.is-disabled {
  color: rgba(0, 0, 0, 0.26);
}

.weda-ui-custom-picker__empty {
  color: rgba(0, 0, 0, 0.4);
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.weda-ui-custom-picker__status {
  left: 16px;
  color: rgba(0, 0, 0, 0.4);
  font-size: 14px;
  height: 48px;
  line-height: 48px;
  display: flex;
  vertical-align: middle;
}

.weda-ui-custom-picker__status--loading {
  color: var(--wd-color-brand, #0052d9);
  display: flex;
  align-items: center;
}

.weda-ui-custom-picker__status--empty {
  color: #00000042;
}

.weda-ui-custom-picker__loading-icon {
  width: 20px;
  height: 20px;
  display: inline-block;
  background-image: url(data:image/png;base64,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);
  background-repeat: no-repeat;
  background-size: contain;
  animation: rotate360 0.8s linear infinite;
}

@keyframes rotate360 {
  0% {
    transform: rotate(0deg);
  }

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

.weda-ui-custom-picker__status--loading .weda-ui-custom-picker__loading-icon {
  margin-right: 8px;
}

.weda-ui-custom-picker__btn {
  background-color: transparent;
  border: none;
  font-size: 14px;
  margin-left: 8px;
}

.weda-ui-custom-picker__btn--link {
  color: var(--wd-color-brand, #0052d9);
}

/* 搜索 */
.weda-ui-custom-search {
  display: flex;
  align-items: center;
  height: 40px;
  margin: 10px 16px;
}

.weda-ui-custom-search-box {
  display: flex;
  align-items: center;
  flex: 1 1 0px;
  background-color: #f1f2f5;

  border-radius: 4px;
  height: 100%;
  position: relative;
  transition: all 0.8s linear;
}

.weda-ui-custom-search .weda-ui-input {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
  font-size: 16px;
  line-height: 24px;
  background-color: inherit;
  padding: 0 40px 0 40px;
  caret-color: var(--wd-color-brand, #0052d9);
  color: rgba(0, 0, 0, 0.9);
  border-radius: 4px;
}

.weda-ui-custom-search-box__label {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  height: 100%;
  display: flex;
  align-items: center;
  color: rgba(0, 0, 0, 0.4);
}

.weda-ui-custom-search-box__search-icon {
  width: 24px;
  height: 24px;
  margin-right: 4px;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjUiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNSAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTE0Ljc2NTUgMTUuMzI3OUMxMy41Mzc4IDE2LjMyMjEgMTEuOTc0MSAxNi45MTc2IDEwLjI3MTQgMTYuOTE3NkM2LjMyNDUzIDE2LjkxNzYgMy4xMjUgMTMuNzE4MSAzLjEyNSA5Ljc3MTMyQzMuMTI1IDUuODI0NTEgNi4zMjQ1MyAyLjYyNSAxMC4yNzE0IDIuNjI1QzE0LjIxODIgMi42MjUgMTcuNDE3NyA1LjgyNDUxIDE3LjQxNzcgOS43NzEzMkMxNy40MTc3IDExLjQ3NDEgMTYuODIyMSAxMy4wMzc4IDE1LjgyOCAxNC4yNjU1TDIxLjEyNSAxOS41NjI1TDIwLjA2MjYgMjAuNjI1TDE0Ljc2NTUgMTUuMzI3OVpNMTUuOTE1MiA5Ljc3MTMyQzE1LjkxNTIgNi42NTQzNCAxMy4zODg0IDQuMTI3NTIgMTAuMjcxNCA0LjEyNzUyQzcuMTU0MzUgNC4xMjc1MiA0LjYyNzUyIDYuNjU0MzQgNC42Mjc1MiA5Ljc3MTMyQzQuNjI3NTIgMTIuODg4MyA3LjE1NDM1IDE1LjQxNTEgMTAuMjcxNCAxNS40MTUxQzEzLjM4ODQgMTUuNDE1MSAxNS45MTUyIDEyLjg4ODMgMTUuOTE1MiA5Ljc3MTMyWiIgZmlsbD0iYmxhY2siIGZpbGwtb3BhY2l0eT0iMC40Ii8+Cjwvc3ZnPgo=);
  background-repeat: no-repeat;
}

.weda-ui-custom-search-box__dismiss-icon {
  position: absolute;
  right: 12px;
  width: 24px;
  height: 24px;
  background-image: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjQiIGhlaWdodD0iMjQiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTIyLjUgMTJDMjIuNSA2LjIwMTAxIDE3Ljc5OSAxLjUgMTIgMS41QzYuMjAxMDEgMS41IDEuNSA2LjIwMTAxIDEuNSAxMkMxLjUgMTcuNzk5IDYuMjAxMDEgMjIuNSAxMiAyMi41QzE3Ljc5OSAyMi41IDIyLjUgMTcuNzk5IDIyLjUgMTJaTTguNTA2MzYgNy40MjEzMUwxMiAxMC45MzYxTDE1LjQ5MzcgNy40MjEzMUwxNi41NTc1IDguNDc4NzZMMTMuMDU3NSAxMkwxNi41NTc1IDE1LjUyMTJMMTUuNDkzNyAxNi41Nzg3TDEyIDEzLjA2MzlMOC41MDYzNyAxNi41Nzg3TDcuNDQyNTEgMTUuNTIxMkwxMC45NDI1IDEyTDcuNDQyNSA4LjQ3ODc2TDguNTA2MzYgNy40MjEzMVoiIGZpbGw9ImJsYWNrIiBmaWxsLW9wYWNpdHk9IjAuNCIvPgo8L3N2Zz4K);
  background-repeat: no-repeat;
}

/* theme */
.weda-ui-custom-search__btn-cancle {
  flex: 0 0 auto;
  display: none;
  margin-left: 16px;
  color: var(--wd-color-brand, #0052d9);
  font-size: 32rxp;
  background-color: transparent;
  border: none;
  padding: 0;
}

.weda-ui-custom-search__btn-cancle::after {
  border: none;
}

/* 获取焦点后 */
.weda-ui-custom-search.is-focused .weda-ui-custom-search__btn-cancle {
  display: inline-flex;
}

.weda-ui-custom-search.is-focused .weda-ui-custom-search-box__label {
  left: 12px;
  transform: translateX(0);
}

.weda-ui-custom-search.is-focused
  .weda-ui-custom-search-box__search-placeholder {
  display: none;
}

.weda-ui-custom-picker__cloumn-item-text {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-right: 50px;
}
