@charset "utf-8";

* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

:root {
  --color-white: #FFFFFF;
  --color-primary-hover: #409EFF;
  --color-primary-active: #1488fc;
  --color-primary: #337ECC;
  --color-success: #529B2E;
  --color-warning: #fa3030;
  --color-placeholder: #CCCCCC;
  --color-note: #506FA8;
  --color-gray: #999999;
  --color-gray-dark: #808080;
  --color-grey: #666;
  --color-disabled: #A8ABB2;
  --color-blue: #115888;

  --border-color-default: #DCDFE6;
  --border-color-default-hover: #3388FF;
  --border-color-default-active: #73b9ff;

  --border-color-primary-lighter: #D9ECFF;
  --border-color-primary-light: #A0CFFF;
  --border-color-primary-hover: #79BBFF;
  --border-color-primary: #409EFF;
  --border-color-primary-active: #337ECC;

  --border-color-success-lighter: #E1F3D8;
  --border-color-success-light: #B3E19D;
  --border-color-success-hover: #95D475;
  --border-color-success: #67C23A;
  --border-color-success-active: #529B2E;

  --border-color-warning-lighter: #FDE2E2;
  --border-color-warning-light: #FAB6B6;
  --border-color-warning-hover: #F89898;
  --border-color-warning: #F56C6C;
  --border-color-warning-active: #C45656;

  --border-color-plain-hover: #C6E2FF;
  --border-color-gray: #E6EBF5;
  --border-color-gray-dark: #D5D5D5;

  --bg-color-soft: #FAFAFA;
  --bg-color-mute: #F4F4F4;
  --bg-color-lighter: #ebeef5;
  --bg-color-light: #DEDFE0;
  --bg-color-grey: #A8A8A8;
  --bg-color-plain: #ECF5FF;
  --bg-color-plain-success: #F0F9EB;
  --bg-color-plain-warning: #FEF0F0;
  --bg-color-warning: #fffde5;
  --bg-color-disabled: #F5F7FA;

  --shadow-color-default: #41aaf7;
  --shadow-color-dropdown: rgba(0, 0, 0, 0.5);

  --transition-border: border-color .15s ease-in-out 0s, border-width .1s ease, box-shadow .15s ease-in-out 0s;
  --transition-all: all 0.15s ease;
}

/*常用颜色*/
.note {
  color: #506FA8;
}

.grey {
  color: #666;
}

.gray {
  color: #999999;
}

.gray_dark {
  color: #666666;
}

.blue {
  color: #115888;
}

.dodgerblue {
  color: #1E90FF;
}

.grayblue {
  color: #7da1cf;
}

.green {
  color: #009900;
}

.limegreen {
  color: #32CD32;
}

.red {
  color: #ff0000;
}

.grayred {
  color: #d6867d;
}

.coral {
  color: #FF7F50;
}

.placeholder {
  color: #CCCCCC;
}

html,
body {
  overflow: hidden;
  height: 100%;
  margin: 0;
  padding: 0;
  font-family: Tahoma, Arial, 微软雅黑, 黑体, 宋体;
  font-size: 13px;
}

body {
  display: flex;
  flex-direction: column;
  background-color: #FFF;
}

/* 滚动条样式 */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
  background-color: #FFF;
}

::-webkit-scrollbar:hover {
  /*border-radius:5px;*/
  background: var(--bg-color-mute);
}

::-webkit-scrollbar-thumb {
  border-radius: 5px;
  margin: 3px;
  background: rgba(0, 0, 0, 0.1);
}

::-webkit-scrollbar-thumb:hover {
  background: var(--bg-color-grey);
}

table {
  table-layout: fixed;
}

ul,
dl,
ol,
li {
  margin: 0;
  padding: 0;
  list-style: none;
}

input,
textarea,
button {
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
}

/* 去除input后的x */
input::-ms-clear {
  display: none;
}

input::-ms-reveal {
  display: none;
}

input:valid+.clear {
  display: inline;
}

a:link {
  text-decoration: none;
  color: var(--color-primary);
}

a:visited {
  text-decoration: none;
  color: var(--color-primary);
}

a:hover {
  text-decoration: none;
  color: var(--color-primary-hover);
}

a:active {
  text-decoration: none;
  color: var(--color-primary-active);
}

/* 去除chrome焦点虚框 */
*:focus {
  outline: none;
}

/* 【form】 */
.form {
  display: flex;
  column-gap: var(--column-gap);
  align-content: flex-start;
}

.form:not(.inline):not(.inline-tight) {
  flex-direction: column;
  --column-gap: 0;
}

.form.inline {
  --column-gap: 60px;
  flex-wrap: wrap;
}

.form.inline-tight {
  --column-gap: 40px;
  flex-wrap: wrap;
}

.form:not(.validity) {
  row-gap: 12px;
}

.form-item {
  display: flex;
}

.form:not(.inline):not(.inline-tight) .form-item {
  width: 100%;
}

.form.inline .form-item,
.form.inline-tight .form-item {
  width: calc(50% - var(--column-gap) / 2);
}

.form.validity>.form-item {
  padding-bottom: 25px;
}

.form-item.toptag {
  flex-direction: column;
}

.form-item .form-item-tag {
  color: var(--color-gray-dark);
}

.form-item:not(.toptag) .form-item-tag {
  width: 120px;
  line-height: 32px;
}

.form-item.toptag>.form-item-tag {
  line-height: 26px;
}

.form-item.required>.form-item-tag::after {
  content: '*';
  font-weight: bold;
  margin-left: 4px;
  color: var(--color-warning);
}

.form-item-cont {
  position: relative;
  word-break: keep-all;
  white-space: nowrap;
  display: inline-flex;
  align-items: center;
}

.form-item:not(.toptag) .form-item-cont {
  flex-grow: 1;
  width: 0;
}

.form-item.toptag .form-item-cont {
  width: 100%;
}

.form-item-cont[validitytip]::after {
  content: attr(validitytip);
  position: absolute;
  left: 0;
  bottom: -18px;
  font-size: 12px;
  max-width: 100%;
  overflow: hidden;
  color: var(--color-warning);
}

.valign {
  line-height: normal;
  display: inline-flex;
  align-items: center;
}

/* 【表单元素】 */
/* 文本框（类型为text、password、number、tel） */
input:not([type]),
input[type=text],
input[type=password],
input[type=number],
input[type=tel] {
  height: 32px;
  vertical-align: middle;
  line-height: 30px;
  text-indent: 4px;
  border: solid var(--border-color-default) 1px;
  border-radius: 3px;
  transition: var(--transition-border);
  -webkit-transition: var(--transition-border);
}

textarea {
  border: solid var(--border-color-default) 1px;
  border-radius: 3px;
  padding: 2px 4px;
  resize: none;
  transition: var(--transition-border);
  -webkit-transition: var(--transition-border);
}

input:not([type]):not(:disabled):not(.warning):hover,
input[type=text]:not(:disabled):not(.warning):hover,
input[type=password]:not(:disabled):not(.warning):hover,
input[type=number]:not(:disabled):not(.warning):hover,
input[type=tel]:not(:disabled):not(.warning):hover,
input:not([type]):not(:disabled):not(.warning):focus,
input[type=text]:not(:disabled):not(.warning):focus,
input[type=password]:not(:disabled):not(.warning):focus,
input[type=number]:not(:disabled):not(.warning):focus,
input[type=tel]:not(:disabled):not(.warning):focus,
textarea:not(:disabled):not(.warning):hover,
textarea:not(:disabled):not(.warning):focus {
  border: solid 1px var(--border-color-default-hover);
  box-shadow: 0px 0px 3px var(--shadow-color-default);
}

input:not([type]):not(:disabled).warning,
input[type=text]:not(:disabled).warning,
input[type=password]:not(:disabled).warning,
input[type=number]:not(:disabled).warning,
input[type=tel]:not(:disabled).warning,
textarea:not(:disabled).warning {
  color: var(--color-warning);
  border-color: var(--border-color-warning);
  background-color: var(--bg-color-warning);
}

input:not([type]):not(:disabled).warning:hover,
input[type=text]:not(:disabled).warning:hover,
input[type=password]:not(:disabled).warning:hover,
input[type=number]:not(:disabled).warning:hover,
input[type=tel]:not(:disabled).warning:hover,
input:not([type]):not(:disabled).warning:focus,
input[type=text]:not(:disabled).warning:focus,
input[type=password]:not(:disabled).warning:focus,
input[type=number]:not(:disabled).warning:focus,
input[type=tel]:not(:disabled).warning:focus,
textarea:not(:disabled).warning:hover,
textarea:not(:disabled).warning:focus {
  box-shadow: 0px 0px 3px var(--border-color-warning);
}

input:not([type]):disabled,
input[type=text]:disabled,
input[type=password]:disabled,
input[type=number]:disabled,
input[type=tel]:disabled,
textarea:disabled {
  color: var(--color-disabled);
  background-color: var(--bg-color-disabled);
}

/* 【日期选择框】 */
input:not([type]).date,
input[type=text].date {
  background-position: right 4px center;
  background-repeat: no-repeat;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAd0lEQVQ4T92RyxGAMAhEN/1oEamcHvzUg8MBhyCZfPTkKSQbHgskItoArDnnREQMADaWu39TnZnPMKkXIOACoNXkVDfWQaTfACuOxN8BpO+RytpidQYtWBUQrdKv2A754eA1oGVd9T+3MD2D3kT/T9a4A1gmAccFBXe0d2yR0zcAAAAASUVORK5CYII=");
}

/* 日期范围 */
.daterange {
  display: inline-flex;
  flex-shrink: 0;
  width: 230px;
  position: relative;
  border: solid var(--border-color-default) 1px;
  border-radius: 3px;
  transition: var(--transition-border);
  -webkit-transition: var(--transition-border);
}

.daterange input {
  height: 30px !important;
  line-height: normal !important;
  text-align: center;
  width: calc(50% - 9px);
  background-image: none !important;
}

.daterange input,
.daterange input:hover,
.daterange input:focus,
.daterange input:active {
  border: none !important;
  box-shadow: none !important;
}

.daterange input:disabled,
.daterange input.warning {
  background-color: transparent !important;
}

.daterange input:first-child {
  order: 0;
}

.daterange input:last-child {
  order: 2;
}

.daterange::before {
  display: inline-flex;
  min-width: 26px;
  align-items: center;
  justify-content: center;
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e9ba";
  font-size: 18px;
  color: var(--color-placeholder);
}

.daterange::after {
  display: inline-flex;
  min-width: 18px;
  line-height: 30px;
  justify-content: center;
  order: 1;
  content: '至';
}

.daterange:not(.disabled):not(.warning) {
  background-color: var(--color-white);
}

.daterange:not(.disabled).warning {
  border-color: var(--border-color-warning);
  background-color: var(--bg-color-warning);
}

.daterange.disabled {
  color: var(--color-disabled);
  background-color: var(--bg-color-disabled);
}

.daterange:not(.disabled):not(.warning):hover,
.daterange:not(.disabled):not(.warning):focus-within {
  border: solid 1px var(--border-color-default-hover);
  box-shadow: 0px 0px 3px var(--shadow-color-default);
}

.daterange:not(.disabled).warning:hover,
.daterange:not(.disabled).warning:focus-within {
  box-shadow: 0px 0px 3px var(--border-color-warning);
}

/* 数字输入框 */
.numberinput {
  position: relative;
  padding: 0;
  line-height: normal;
  display: inline-flex;
  align-items: center;
  width: 120px;
}

.numberinput:after {
  content: attr(unit);
  position: absolute;
  z-index: 1;
  right: 30px;
  line-height: 12px;
  text-align: center;
  font-size: 12px;
  color: var(--color-gray);
  overflow: hidden;
  cursor: text;
}

.numberinput>input {
  width: 100%;
  padding-right: 30px;
}

.numberinput>input+label,
.numberinput>input+label+label {
  position: absolute;
  right: 1px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: calc(100% / 2 - 1px);
  border-left-width: 1px;
  border-left-style: solid;
  user-select: none;
  color: var(--border-color-default);
  transition: var(--transition-border);
  -webkit-transition: var(--transition-border);
}

.numberinput>input+label {
  top: 1px;
  border-radius: 0 3px 0 0;
}

.numberinput>input+label+label {
  bottom: 1px;
  border-radius: 0 0 3px 0;
}

.numberinput>input:not(:disabled)+label,
.numberinput>input:not(:disabled)+label+label {
  background-color: rgba(255, 255, 255, 0.9);
}

.numberinput>input+label::before,
.numberinput>input+label+label::before {
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 12px;
}

.numberinput>input+label::before {
  content: "\e630";
}

.numberinput>input+label+label::before {
  content: "\e62b";
}

.numberinput>input+label,
.numberinput>input+label+label {
  border-left-color: var(--border-color-default);
}

.numberinput>input:not(:disabled):not(.warning):hover+label,
.numberinput>input:not(:disabled):not(.warning):hover+label+label {
  color: var(--color-primary-hover);
  border-left-color: var(--border-color-default-hover);
}

.numberinput>input:not(:disabled).warning+label,
.numberinput>input:not(:disabled).warning+label+label {
  border-left-color: var(--border-color-warning);
}

.numberinput>input:not(:disabled):not(.warning)+label:hover,
.numberinput>input:not(:disabled):not(.warning)+label+label:hover {
  color: var(--color-primary-hover);
}

.numberinput>input:not(:disabled).warning+label:hover,
.numberinput>input:not(:disabled).warning+label+label:hover {
  color: var(--color-warning);
}

.numberinput>input:not(:disabled)+label:hover,
.numberinput>input:not(:disabled)+label+label:hover {
  background-color: var(--bg-color-mute);
}

.numberinput>input:not(:disabled)+label:active,
.numberinput>input:not(:disabled)+label+label:active {
  background-color: var(--bg-color-light);
}

/* 输入框占位文本颜色 */
input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: var(--color-placeholder);
}

input::-moz-placeholder,
textarea::-moz-placeholder {
  color: var(--color-placeholder);
}

input::-moz-placeholder,
textarea::-moz-placeholder {
  color: var(--color-placeholder);
}

input::-ms-input-placeholder,
textarea::-ms-input-placeholder {
  color: var(--color-placeholder);
}

/* 【femnu input】 */
.fmenu.input {
  position: relative;
  padding: 0;
  line-height: normal;
  display: inline-flex;
  align-items: center;
}

.fmenu.input>input {
  width: 100%;
  padding-right: 28px;
}

.fmenu.input>input:read-only {
  cursor: default;
}

.fmenu.input.active>input:not(:disabled):not(.warning) {
  border: solid 1px var(--border-color-default-hover);
  box-shadow: 0px 0px 3px var(--shadow-color-default);
}

.fmenu.input.active>input:not(:disabled).warning {
  border-color: var(--border-color-warning);
  box-shadow: 0px 0px 3px var(--border-color-warning);
}

.fmenu.input>input+label {
  position: absolute;
  right: 1px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: calc(100% - 2px);
  top: 1px;
  border-radius: 0 3px 3px 0;
  user-select: none;
  color: var(--color-gray);
  transition: var(--transition-border);
  -webkit-transition: var(--transition-border);
}

.fmenu.input>input:not(:disabled):not(:read-only)+label {
  background-color: rgba(255, 255, 255, 0.9);
}

.fmenu.input>input+label::before {
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.fmenu.input>input:not(:read-only)+label::before {
  content: "\e63c";
  font-size: 14px;
}

.fmenu.input>input:read-only+label::before {
  content: "\e6e6";
  font-size: 16px;
}

.fmenu.input>input:not(:read-only)+label {
  border-left-width: 1px;
  border-left-style: solid;
  border-left-color: var(--border-color-default);
}

.fmenu.input>input:not(:disabled):not(.warning):hover+label,
.fmenu.input.active>input:not(:disabled):not(.warning)+label {
  border-left-color: var(--border-color-default-hover);
}

.fmenu.input>input:not(:disabled).warning+label {
  border-left-color: var(--border-color-warning);
}

.fmenu.input>input:not(:disabled):not(.warning)+label:hover,
.fmenu.input.active>input:not(:disabled):not(.warning)+label {
  color: var(--color-primary-hover);
}

.fmenu.input>input:not(:disabled).warning+label:hover,
.fmenu.input.active>input:not(:disabled).warning+label {
  color: var(--color-warning);
}

.fmenu.input>input:not(:read-only):not(:disabled)+label:hover,
.fmenu.input.active>input:not(:read-only):not(:disabled)+label {
  background-color: var(--bg-color-mute);
}

.fmenu.input>input:not(:read-only):not(:disabled)+label:active {
  background-color: var(--bg-color-light);
}

/* 可下拉选择的容器（如区划选择器） */
.selection {
  height: 32px;
  display: inline-flex;
  align-items: center;
  padding-left: 4px;
  padding-right: 26px;
  border: solid var(--border-color-default) 1px;
  border-radius: 3px;
  position: relative;
  overflow: hidden;
  user-select: none;
  cursor: default;
  transition: var(--transition-border);
  -webkit-transition: var(--transition-border);
}

.selection>.title {
  display: inline-flex;
  align-items: center;
  overflow: hidden;
  flex-wrap: nowrap;
  white-space: nowrap;
  max-width: 100%;
  user-select: none;
}

.selection>.title:empty::after {
  content: attr(placeholder);
  color: var(--color-placeholder);
}

.selection::after {
  position: absolute;
  right: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e6e6";
  font-size: 16px;
  color: var(--color-gray);
}

.selection.disabled::after {
  color: var(--color-disabled);
}

.selection:not(.disabled):not(.warning) {
  background-color: #FFFFFF;
}

.selection:not(.disabled).warning {
  color: var(--color-warning);
  border-color: var(--border-color-warning);
  background-color: var(--bg-color-warning);
}

.selection:not(.disabled):not(.warning):hover,
.selection:not(.disabled):not(.warning):focus {
  border: solid 1px var(--border-color-default-hover);
  box-shadow: 0px 0px 3px var(--shadow-color-default);
}

.selection:not(.disabled).warning:hover,
.selection:not(.disabled).warning:focus {
  box-shadow: 0px 0px 3px var(--border-color-warning);
}

.selection.disabled {
  color: var(--color-disabled);
  background-color: var(--bg-color-disabled);
}

.selection>.clear {
  position: absolute;
  display: none;
  align-items: center;
  justify-content: flex-end;
  width: 24px;
  height: calc(100%);
  right: 27px;
  background-color: #FFFFFF;
  user-select: none;
}

.selection:not(.disabled).warning>.clear {
  background-color: var(--bg-color-warning);
}

.selection:not(.disabled):hover>.title:not(:empty)+.clear,
.selection:not(.disabled):focus>.title:not(:empty)+.clear {
  display: inline-flex;
}

.selection>.clear::after {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e615";
  font-size: 14px;
  color: var(--color-gray);
  background-color: var(--bg-color-plain);
}

.selection>.clear:hover::after {
  background-color: var(--bg-color-lighter);
}

.selection>.clear:active::after {
  background-color: var(--bg-color-light);
}

/* 下拉图片选择器 */
.selection.selectimage {
  width: 120px;
  height: 70px;
  padding-left: 3px;
  padding-top: 3px;
  padding-bottom: 3px;
}

.selection.selectimage>label.title {
  height: 100%;
  width: 100%;
  background-position: center center;
  background-size: 100% 100%;
  background-repeat: no-repeat;
  border: 1px solid #F1F1F1;
}


.selection.selectimage .fmenu-dropdown {
  overflow-y: hidden;
  padding: 6px;
  max-height: none;
}

.selection .imagewrap {
  display: flex;
  flex-direction: column;
  row-gap: 6px;
  max-height: 286px;
  overflow-y: auto;
}

.selection .imagewrap:not(:empty) {
  width: 450px;
  border: solid var(--border-color-default) 1px;
  padding: 6px;
  margin-bottom: 6px;
}

.selection .imagewrap .grouptitle {
  color: #999999;
  background-color: #F6F6F6;
  padding: 6px;
}

.selection .imagewrap .imagecountent {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: flex-start;
  gap: 6px;
}

.selection .imagewrap .imagecountent:empty::before {
  content: '加载中...';
}

.selection .imagewrap .imagecountent>div {
  position: relative;
  flex-shrink: 0;
  width: calc((100% + 6px) / 4 - 6px);
  height: 68px;
  border: 1px solid #F1F1F1;
  padding: 2px;
  background-color: #FFF;
  background-position: center center;
  background-origin: content-box;
  background-size: contain;
  background-repeat: no-repeat;
  transition: var(--transition-border);
  -webkit-transition: var(--transition-border);
}

.selection .imagewrap .imagecountent>div.sel {
  border: solid 1px var(--border-color-default-hover);
}

.selection .imagewrap .imagecountent>div:not(.disabled):hover {
  border: solid 1px var(--border-color-default-hover);
  box-shadow: 0px 0px 4px var(--shadow-color-default);
}

.selection .imagewrap .imagecountent>div .clearimg {
  position: absolute;
  top: -3px;
  right: -3px;
  width: 18px;
  height: 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: #FFF;
  background-color: var(--color-warning);
  cursor: pointer;
}

.selection .imagewrap .imagecountent>div .clearimg::after {
  content: "\e615";
  font-size: 12px;
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.selection .dropdown-footer {
  display: flex;
  column-gap: 6px;
  justify-content: space-between;
}

.selection .dropdown-footer button.small {
  width: 70px;
}

/* 搜索框 */
.search {
  display: inline-flex;
  align-items: center;
  position: relative;
}

.search>input {
  padding-right: 28px;
}

.search>input+label {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: calc(100% - 2px);
  right: 1px;
  font-size: 16px;
  color: var(--border-color-default);
  user-select: none;
}

.search>input+label::before {
  content: "\e620";
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.search>input:hover+label,
.search>input:focus+label,
.search>input+label:hover {
  color: var(--color-primary-hover);
}

/*颜色选择器*/
input.ex_color {
  display: none;
}

input.ex_color+label {
  position: relative;
  display: inline-block;
  width: 100%;
  border: solid #CCC 1px;
  height: 26px;
  padding: 0;
  background-color: #000;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  background-position: center center;
  background-repeat: no-repeat;
}

input.ex_color+label {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAaCAYAAADSbo4CAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAc9JREFUeNrsls1LAkEYxp9NE6WEEgwxCxK9BBF06dAfkJegY8amYBcRvCV6CcST/gGSXyBISB062S2SIoIgEE9CiAiFoikdIukLdnIHPGSagmsY7AMD+74zvPubZ/YdliFNYQTEiCD/GiQUCiGfz9Nno9EIu90uOIi0n0WFQgEulwu1Wg2xWGwojoz1s0gmk0EqlSKVSoFhGPh8PlSr1b8H4TiOOmE2myGRSMCyLMLhsKAwPY+mXq+j0WjA6XRCpVLRnF6vpzAHoTAeFMuYn9VgY3UBK4aZ4TjCQ/BOeDweaLVayOVyOlowlh0WU0+3yOSK2E/c4OjiTviuaUFYLBYK0U2XV9dIHp+gPL0G5eQEkm6TsI4Eg0GYTKZfIcrlMtLnZ6grl8Ax4/j45IT/RhwOB+LxODQaDR2dIKLRKLa2Wewd5mhuxaDuWIs/2nb5/f7+HFGr1bDZbEgkEj+6g4eIRCKwWq3Q6eZoTqmQYXd9sWOt9pe2x1Skh5qXGAkEAqRSqdC4VCoRr9dLisUijZ8bb2TTd0qyhcdepYjb7e461xOkBdPcBclkMt8geL28vpN09p4Mqm5dwwxwNxEh21cEGVkQ8Q9NBBFBuulLgAEAop289b2XR78AAAAASUVORK5CYII=");
}

input.ex_color:hover+label {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAaCAYAAADSbo4CAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAdRJREFUeNrslj1IQlEUx/9P3/ODMlIIxD4oyyWIwIaIdnNpLuOlYksIbgk6NDs7SPmFKJE0tOjQEAURQRTUFoRIQyCJES6CZDzDG6/BfCmp6fD+cOG+w+XcH/9z3uFSxWKxij6QBH0iEaRedCuHkskkMpkM2RsMBlgslt6AZLNZuN1uFAoFRCKR3pVGJpOBpmmk02lQFAW/349yufz/IBzHESdqJZFKpWBZFsFgsKMwTUtTqVRQKpXgcrmg0WhITK/XE5i9/SCelfOYGNVidXEK0yPy7jhSg6g54fF4oNPpoFAoyOJhrJssht9ucffwhN3ENU7uX/4MQglNVh7CarUSCCFdXF7h8OgYOfUyVIMD2Nte6qwjgUAAZrP5V4hcLofzs1O8qubAUQzeK1zne8TpdCIWi0Gr1ZLVCCIcDmN9g8XOwQOJGWdGGuby+Xw/Yl6vtzVHar+sw+FAIpFAPp//AREKhWCz2TA2Nk5iKqUMWyuzDXPVX1r/3bRZGYYhMPF4/BuGd8Jut0OtVn9BM1J41xagkHwI5uIvbwTxa7PWN240GoXJZEIqlSJO8BC0XImbxzyMk0NtzREhEKqNnNWuTVbxPdJP75GqWBoRRAQR0KcAAwB/16TNqJH3OQAAAABJRU5ErkJggg==");
}

/*字体颜色*/
input.fontcolor {
  display: none;
}

input.fontcolor+label {
  position: relative;
  display: inline-block;
  width: 100%;
  border: solid #CCC 1px;
  height: 26px;
  padding: 0;
  background-color: #000;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  background-position: center center;
  background-repeat: no-repeat;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAaCAYAAADSbo4CAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAARZJREFUeNrsljGKhDAUhn+XKbSbI1hMK9hZKp7AxgNY2dmJHsHGUwhW9iJaqNh4A8F6EEsbESyyq8UWI4MzrDsOu35NyEvgfXkJSSjyBd6AD7wJh8gh8jdFXNeFqqro+34/kSl5WZa4XC5I03Q/kSRJwHEcJElCFEX7iUzJZVmGKIpomgZ1Xb9epKoqdF0HQRBA0/TcThXaktMjk+I4xvl8RhAEc38cR2RZBk3TZrE1bNtexBzHea4iwzAgz3PwPP8dY1kWDMOgKIqHVnub9LY/Q1YIw5Dour6Ie55HTNMkz2BZ1t2xVRHDMIjv+4t427ZEURRyvV7JFlB3/iPUD84d+fWb9XhrXslpy30+tuYQ+RcinwIMAG6XS2mFReapAAAAAElFTkSuQmCC");
}

input.fontcolor:hover+label {
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAaCAYAAADSbo4CAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAARlJREFUeNrslj9qhFAQxj/DglYWHkCwFSvtVMRrCHaewhN4BC9iK/4BEQvxAIK1dmIjorBBi0BMlryQzbokft0MD+b3vpnhParv+yueQC94Ep0gJ8jfBPF9H47jYBzH40DW4mVZQhAEZFl2HEiaphBFEZqmIYqi40DW4rquQ1VVdF2HpmkeD1LXNYZhgCzLoGkaiqJsDt1TF5JDSZKAZVkEQbDF8zyjqipYlrWBfSXP8z7kXNf9niPTNCHPc0iS9JbjeR4Mw6AoCqLb7ovuYyJH1g3hOA62bb/LL8uCOI5hGAYxzOrMZxBEjoRhuA3oXqZpbgPbti3xHNyCWEXd+I9QP5i766+u7/nWPFqXe/b5bM0J8i9AXgUYACCEYQCXvA+IAAAAAElFTkSuQmCC");
}

/* 按钮 */
button,
input[type='button'] {
  border-width: 1px;
  border-style: solid;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  white-space: nowrap;
  column-gap: 6px;
  transition: all 0.1s ease-in-out 0s;
}

button:not(.small):not(.mini),
input[type='button']:not(.small):not(.mini) {
  height: 32px;
  font-size: 14px;
}

button:not(.small):not(.mini):not(.circle),
input[type='button']:not(.small):not(.mini):not(.circle) {
  padding-left: 10px;
  padding-right: 10px;
}

button.small,
input[type='button'].small {
  height: 26px;
  font-size: 12px;
}

button.small:not(.circle),
input[type='button'].small:not(.circle) {
  padding-left: 8px;
  padding-right: 8px;
}

button.mini,
input[type='button'].mini {
  height: 20px;
  font-size: 12px;
}

button.mini:not(.circle),
input[type='button'].mini:not(.circle) {
  padding-left: 5px;
  padding-right: 5px;
}

button:not(.round):not(.circle),
input[type='button']:not(.round):not(.circle) {
  border-radius: 3px;
}

button:not(.small):not(.mini).round,
input[type='button']:not(.small):not(.mini).round {
  border-radius: 50vh;
}

button.small.round,
input[type='button'].small.round {
  border-radius: 13px;
}

button.mini.round,
input[type='button'].mini.round {
  border-radius: 10px;
}

button:not(.small):not(.mini).circle,
input[type='button']:not(.small):not(.mini).circle {
  width: 32px;
  border-radius: 16px;
}

button.small.circle,
input[type='button'].small.circle {
  width: 26px;
  border-radius: 13px;
}

button.mini.circle,
input[type='button'].mini.circle {
  width: 20px;
  border-radius: 10px;
}

/* input按钮禁止含有图标 */
button:not(.small):not(.mini).circle .iconfont {
  font-size: 14px;
}

button.small.circle .iconfont,
button.mini.circle .iconfont {
  font-size: 12px;
}


button:not(.plain):not(:disabled),
input[type='button']:not(.plain):not(:disabled) {
  border-color: var(--bg-color-lighter);
  background-color: var(--bg-color-lighter);
}

button:not(.plain):not(:disabled):hover,
button.active:not(.plain):not(:disabled),
button.focus:not(.plain):not(:disabled):focus,
input[type='button']:not(.plain):not(:disabled):hover,
input[type='button'].active:not(.plain):not(:disabled),
input[type='button'].focus:not(.plain):not(:disabled):focus {
  color: var(--color-primary-hover);
  border-color: var(--bg-color-plain);
  background-color: var(--bg-color-plain);
}

button:not(.plain):not(:disabled):not(.active):active,
input[type='button']:not(.plain):not(:disabled):not(.active):active {
  color: var(--color-primary-active);
  border-color: var(--border-color-default);
  background-color: var(--border-color-default);
}


button.primary:not(.plain):not(:disabled),
input[type='button'].primary:not(.plain):not(:disabled) {
  color: var(--color-white);
  border-color: var(--border-color-primary);
  background-color: var(--border-color-primary);
}

button.primary:not(.plain):not(:disabled):hover,
button.primary.active:not(.plain):not(:disabled),
button.primary.focus:not(.plain):not(:disabled):not(:active):focus,
input[type='button'].primary:not(.plain):not(:disabled):hover,
input[type='button'].primary.active:not(.plain):not(:disabled),
input[type='button'].primary.focus:not(.plain):not(:disabled):not(:active):focus {
  color: var(--color-white);
  border-color: var(--border-color-primary-hover);
  background-color: var(--border-color-primary-hover);
}

button.primary:not(.plain):not(:disabled):not(.active):active,
input[type='button'].primary:not(.plain):not(:disabled):not(.active):active {
  border-color: var(--border-color-primary-active);
  background-color: var(--border-color-primary-active);
}


button.success:not(.plain):not(:disabled),
input[type='button'].success:not(.plain):not(:disabled) {
  color: var(--color-white);
  border-color: var(--border-color-success);
  background-color: var(--border-color-success);
}

button.success:not(.plain):not(:disabled):hover,
button.success.active:not(.plain):not(:disabled),
button.success.focus:not(.plain):not(:disabled):not(:active):focus,
input[type='button'].success:not(.plain):not(:disabled):hover,
input[type='button'].success.active:not(.plain):not(:disabled),
input[type='button'].success.focus:not(.plain):not(:disabled):not(:active):focus {
  color: var(--color-white);
  border-color: var(--border-color-success-hover);
  background-color: var(--border-color-success-hover);
}

button.success:not(.plain):not(:disabled):not(.active):active,
input[type='button'].success:not(.plain):not(:disabled):not(.active):active {
  border-color: var(--border-color-success-active);
  background-color: var(--border-color-success-active);
}


button.warning:not(.plain):not(:disabled),
input[type='button'].warning:not(.plain):not(:disabled) {
  color: var(--color-white);
  border-color: var(--border-color-warning);
  background-color: var(--border-color-warning);
}

button.warning:not(.plain):not(:disabled):hover,
button.warning.active:not(.plain):not(:disabled),
button.warning.focus:not(.plain):not(:disabled):not(:active):focus,
input[type='button'].warning:not(.plain):not(:disabled):hover,
input[type='button'].warning.active:not(.plain):not(:disabled),
input[type='button'].warning.focus:not(.plain):not(:disabled):not(:active):focus {
  color: var(--color-white);
  border-color: var(--border-color-warning-hover);
  background-color: var(--border-color-warning-hover);
}

button.warning:not(.plain):not(:disabled):not(.active):active,
input[type='button'].warning:not(.plain):not(:disabled):not(.active):active {
  border-color: var(--border-color-warning-active);
  background-color: var(--border-color-warning-active);
}


button.plain:not(:disabled),
input[type='button'].plain:not(:disabled) {
  color: var(--color-primary);
  border-color: var(--border-color-gray-dark);
  background-color: var(--color-white);
}

button.plain:not(:disabled):hover,
button.plain.active:not(:disabled),
button.plain.focus:not(:disabled):not(:active):focus,
input[type='button'].plain:not(:disabled):hover,
input[type='button'].plain.active:not(:disabled),
input[type='button'].plain.focus:not(:disabled):not(:active):focus {
  color: var(--color-primary-hover);
  border-color: var(--border-color-default-active);
}

button.plain:not(:disabled):not(.active):active,
input[type='button'].plain:not(:disabled):not(.active):active {
  color: var(--color-primary-active);
  border-color: var(--border-color-default-active);
  background-color: var(--bg-color-plain);
}


button.primary.plain:not(:disabled),
input[type='button'].primary.plain:not(:disabled) {
  color: var(--color-primary);
  border-color: var(--border-color-primary-light);
  background-color: var(--bg-color-plain);
}

button.primary.plain:not(:disabled):hover,
button.primary.plain.active:not(:disabled),
button.primary.focus.plain:not(:disabled):not(:active):focus,
input[type='button'].primary.plain:not(:disabled):hover,
input[type='button'].primary.plain.active:not(:disabled),
input[type='button'].primary.focus.plain:not(:disabled):not(:active):focus {
  color: var(--color-white);
  border-color: var(--border-color-primary-hover);
  background-color: var(--border-color-primary-hover);
}

button.primary.plain:not(:disabled):not(.active):active,
input[type='button'].primary.plain:not(:disabled):not(.active):active {
  color: var(--color-white);
  border-color: var(--border-color-primary-active);
  background-color: var(--border-color-primary-active);
}


button.success.plain:not(:disabled),
input[type='button'].success.plain:not(:disabled) {
  color: var(--color-success);
  border-color: var(--border-color-success-light);
  background-color: var(--bg-color-plain-success);
}

button.success.plain:not(:disabled):hover,
button.success.plain.active:not(:disabled),
button.success.plain.focus:not(:disabled):not(:active):focus,
input[type='button'].success.plain:not(:disabled):hover,
input[type='button'].success.plain.active:not(:disabled),
input[type='button'].success.plain.focus:not(:disabled):not(:active):focus {
  color: var(--color-white);
  border-color: var(--border-color-success-hover);
  background-color: var(--border-color-success-hover);
}

button.success.plain:not(:disabled):not(.active):active,
input[type='button'].success.plain:not(:disabled):not(.active):active {
  color: var(--color-white);
  border-color: var(--border-color-success-active);
  background-color: var(--border-color-success-active);
}


button.warning.plain:not(:disabled),
input[type='button'].warning.plain:not(:disabled) {
  color: var(--color-warning);
  border-color: var(--border-color-warning-light);
  background-color: var(--bg-color-plain-warning);
}

button.warning.plain:not(:disabled):hover,
button.warning.plain.active:not(:disabled),
button.warning.plain.focus:not(:disabled):not(:active):focus,
input[type='button'].warning.plain:not(:disabled):hover,
input[type='button'].warning.plain.active:not(:disabled),
input[type='button'].warning.plain.focus:not(:disabled):not(:active):focus {
  color: var(--color-white);
  border-color: var(--border-color-warning-hover);
  background-color: var(--border-color-warning-hover);
}

button.warning.plain:not(:disabled):not(.active):active,
input[type='button'].warning.plain:not(:disabled):not(.active):active {
  color: var(--color-white);
  border-color: var(--border-color-warning-active);
  background-color: var(--border-color-warning-active);
}

button:disabled,
input[type='button']:disabled {
  color: var(--color-disabled);
}

button.primary:not(.plain):disabled,
input[type='button'].primary:not(.plain):disabled {
  color: var(--color-white);
  border-color: var(--border-color-primary-light);
  background-color: var(--border-color-primary-light);
}

button.success:not(.plain):disabled,
input[type='button'].success:not(.plain):disabled {
  color: var(--color-white);
  border-color: var(--border-color-success-light);
  background-color: var(--border-color-success-light);
}

button.warning:not(.plain):disabled,
input[type='button'].warning:not(.plain):disabled {
  color: var(--color-white);
  border-color: var(--border-color-warning-light);
  background-color: var(--border-color-warning-light);
}

button.primary.plain:disabled,
input[type='button'].primary.plain:disabled {
  color: var(--border-color-primary-light);
  border-color: var(--border-color-primary-lighter);
  background-color: var(--bg-color-plain);
}

button.success.plain:disabled,
input[type='button'].success.plain:disabled {
  color: var(--border-color-success-light);
  border-color: var(--border-color-success-lighter);
  background-color: var(--bg-color-plain-success);
}

button.warning.plain:disabled,
input[type='button'].warning.plain:disabled {
  color: var(--border-color-warning-light);
  border-color: var(--border-color-warning-lighter);
  background-color: var(--bg-color-plain-warning);
}

/* input按钮不可使用伪类 */
button:disabled.waiting::before {
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\ee75";
  animation: button-waiting 1s linear infinite;
}

@keyframes button-waiting {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

button.arrow {
  padding-right: 6px !important;
}

button.arrow::after {
  font-family: "iconfont" !important;
  content: "\e6e6";
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
}

button.arrow:not(:disabled)::after {
  color: var(--color-gray);
}

button.arrow.primary:not(.plain):not(:disabled)::after,
button.arrow.success:not(.plain):not(:disabled)::after,
button.arrow.warning:not(.plain):not(:disabled)::after {
  opacity: 0.75;
  color: var(--color-white);
}

button.arrow.primary.plain:not(:disabled):hover:after,
button.arrow.success.plain:not(:disabled):hover:after,
button.arrow.warning.plain:not(:disabled):hover:after,
button.arrow.primary.focus.plain:not(:disabled):focus:after,
button.arrow.success.focus.plain:not(:disabled):focus:after,
button.arrow.warning.focus.plain:not(:disabled):focus:after {
  opacity: 0.75;
  color: var(--color-white);
}

button.arrow:disabled::after {
  opacity: 0.75;
  color: var(--color-disabled);
}

button.arrow.primary:not(.plain):disabled::after,
button.arrow.success:not(.plain):disabled::after,
button.arrow.warning:not(.plain):disabled::after {
  opacity: 0.75;
  color: var(--color-white);
}

.buttongroup {
  display: inline-flex;
  z-index: 0;
}

.buttongroup>button,
.buttongroup>input[type='button'] {
  z-index: 1;
}

.buttongroup>button:first-child:not(:last-child),
.buttongroup>input[type='button']:first-child:not(:last-child) {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
}

.buttongroup>button:last-child:not(:first-child),
.buttongroup>input[type='button']:last-child:not(:first-child) {
  border-top-left-radius: 0;
  border-bottom-left-radius: 0;
}

.buttongroup>button:not(:last-child):not(:first-child),
.buttongroup>input[type='button']:not(:last-child):not(:first-child) {
  border-radius: 0;
  border-radius: 0;
}

.buttongroup>button:not(.plain)+button:not(.plain),
.buttongroup>input[type='button']:not(.plain)+input[type='button']:not(.plain) {
  margin-left: 1px;
}

.buttongroup>button.plain:not(:last-child),
.buttongroup>input[type='button'].plain:not(:last-child) {
  margin-right: -1px;
}

.buttongroup>button:not(.plain)+button.plain:not(:first-child),
.buttongroup>input[type='button']:not(.plain)+input[type='button'].plain:not(:first-child) {
  margin-left: -1px;
  z-index: 0;
}

.buttongroup>button:not(:disabled):hover,
.buttongroup>button:not(:disabled):focus,
.buttongroup>input[type='button']:not(:disabled):hover,
.buttongroup>input[type='button']:not(:disabled):focus {
  z-index: 2;
}

/* 【checkbox】 */
.checkboxwrap {
  display: inline-flex;
  vertical-align: middle;
  align-items: center;
  column-gap: 6px;
  line-height: normal;
  padding: 0;
}

input[type='checkbox']:not(.switch) {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  flex-shrink: 0;
  border-width: 1px;
  border-style: solid;
  transition: var(--transition-border);
  -webkit-transition: var(--transition-border);
}

input[type='checkbox']:not(.switch):checked::after {
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e64d";
}

input[type='checkbox']:not(.switch):not(.small):not(.mini) {
  width: 26px;
  height: 26px;
  border-radius: 3px;
  font-size: 18px;
  --indeterminate-width: 10px;
}

input[type='checkbox']:not(.switch).small {
  width: 20px;
  height: 20px;
  border-radius: 2px;
  font-size: 14px;
  --indeterminate-width: 8px;
}

input[type='checkbox']:not(.switch).mini {
  width: 16px;
  height: 16px;
  border-radius: 2px;
  font-size: 12px;
  --indeterminate-width: 6px;
}

input[type='checkbox']:not(.switch):not(:disabled):hover {
  border-width: 2px;
}

input[type='checkbox']:not(.switch):not(:disabled):not(:checked) {
  border-color: var(--border-color-default);
  background-color: #FFFFFF;
}

input[type='checkbox']:not(.switch):not(.success):not(:disabled):checked,
input[type='checkbox']:not(.switch):not(.success):not(:disabled):not(:checked)[indeterminate='true'],
input[type='checkbox']:not(.switch):not(.success):not(:disabled):hover {
  border-color: var(--border-color-primary);
}

input[type='checkbox']:not(.switch):not(.success):not(:disabled):checked {
  color: var(--color-white);
  background-color: var(--border-color-primary);
}

input[type='checkbox']:not(.switch).success:not(:disabled):checked,
input[type='checkbox']:not(.switch).success:not(:disabled):not(:checked)[indeterminate='true'],
input[type='checkbox']:not(.switch).success:not(:disabled):hover {
  border-color: var(--border-color-success);
}

input[type='checkbox']:not(.switch).success:not(:disabled):checked {
  color: var(--color-white);
  background-color: var(--border-color-success);
}

input[type='checkbox']:disabled:not(.switch):not(:checked) {
  border-color: var(--border-color-default);
  background-color: var(--bg-color-disabled);
}

input[type='checkbox']:disabled:not(.switch):not(.success):checked {
  color: var(--color-white);
  border-color: var(--border-color-primary-light);
  background-color: var(--border-color-primary-light);
}

input[type='checkbox']:disabled:not(.switch).success:checked {
  color: var(--color-white);
  border-color: var(--border-color-success-light);
  background-color: var(--border-color-success-light);
}

input[type='checkbox']:not(.switch):not(:checked)[indeterminate='true']::before {
  content: '';
  width: var(--indeterminate-width);
  height: var(--indeterminate-width);
}

input[type='checkbox']:not(.switch):not(.success):not(:disabled):not(:checked)[indeterminate='true']::before {
  background-color: var(--border-color-primary);
}

input[type='checkbox']:not(.switch).success:not(:disabled):not(:checked)[indeterminate='true']::before {
  background-color: var(--border-color-success);
}

input[type='checkbox']:disabled:not(.switch):not(.success):not(:checked)[indeterminate='true'] {
  border-color: var(--border-color-primary-light);
}

input[type='checkbox']:disabled:not(.switch):not(.success):not(:checked)[indeterminate='true']::before {
  background-color: var(--border-color-primary-light);
}

input[type='checkbox']:disabled:not(.switch).success:not(:checked)[indeterminate='true'] {
  border-color: var(--border-color-success-light);
}

input[type='checkbox']:disabled:not(.switch).success:not(:checked)[indeterminate='true']::before {
  background-color: var(--border-color-success-light);
}

input[type='checkbox']:disabled:not(.switch)+span {
  color: var(--color-disabled);
}

/* 【switch】 */
input[type='checkbox'].switch {
  position: relative;
  display: inline-flex;
  align-items: center;
  padding-left: 2px;
  padding-right: 2px;
  transition: all 0.5s ease;
  -webkit-transition: all 0.5s ease;
}

input[type='checkbox'].switch:not(.small):not(.mini) {
  width: 50px;
  height: 26px;
  border-radius: 13px;
  --width-action: 20px;
}

input[type='checkbox'].switch.small {
  width: 40px;
  height: 20px;
  border-radius: 10px;
  --width-action: 16px;
}

input[type='checkbox'].switch.mini {
  width: 30px;
  height: 16px;
  border-radius: 8px;
  --width-action: 12px;
}

input[type='checkbox'].switch::before {
  position: absolute;
  content: "";
  width: var(--width-action);
  height: var(--width-action);
  border-radius: 100%;
  -webkit-transition: all 0.1s;
  transition: all 0.1s;
}

input[type='checkbox'].switch:not(:checked):before {
  left: 2px;
}

input[type='checkbox'].switch:checked:before {
  left: calc(100% - var(--width-action) - 2px);
}

input[type='checkbox'].switch::before {
  background-color: var(--color-white);
}

input[type='checkbox'].switch:not(:disabled):not(:checked) {
  background-color: var(--bg-color-light);
}

input[type='checkbox'].switch:not(:disabled):checked {
  background-color: var(--border-color-primary);
}

input[type='checkbox'].switch.success:not(:disabled):checked {
  background-color: var(--border-color-success);
}

input[type='checkbox'].switch.warning:not(:disabled):checked {
  background-color: var(--border-color-warning);
}

input[type='checkbox'].switch:disabled::before {
  opacity: 0.75;
}

input[type='checkbox'].switch:disabled:not(:checked) {
  background-color: var(--bg-color-light);
}

input[type='checkbox'].switch:disabled:checked {
  background-color: var(--border-color-primary-light);
}

input[type='checkbox'].switch.success:disabled:checked {
  background-color: var(--border-color-success-light);
}

input[type='checkbox'].switch.warning:disabled:checked {
  background-color: var(--border-color-warning-light);
}

/* 【rectcheckbox】 */
.rectcheckbox {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #FFF;
  height: 32px;
  min-width: 50px;
  user-select: none;
  overflow: hidden;
}

.rectcheckbox input[type=checkbox] {
  display: none;
}

.rectcheckbox input[type=checkbox]+span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-wrap: nowrap;
  white-space: nowrap;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-width: 1px;
  border-style: solid;
  border-radius: 3px;
  transition: var(--transition-border);
  -webkit-transition: var(--transition-border);
}

.rectcheckbox input[type='checkbox']:not(:disabled):not(:checked)+span {
  border-color: var(--border-color-default);
  background-color: #FFFFFF;
}

.rectcheckbox input[type='checkbox']:not(:disabled):checked+span {
  border-color: var(--border-color-primary);
}

.rectcheckbox input[type='checkbox']:disabled+span {
  color: var(--color-disabled);
}

.rectcheckbox input[type='checkbox']:disabled:not(:checked)+span {
  border-color: var(--border-color-default);
  background-color: var(--bg-color-disabled);
}

.rectcheckbox input[type='checkbox']:disabled:checked+span {
  border-color: var(--border-color-primary-light);
  background-color: var(--border-color-primary-light);
}

.rectcheckbox input[type='checkbox']:not(:disabled):hover+span {
  border-width: 2px;
}

.rectcheckbox input[type='checkbox']:not(:disabled):checked+span,
.rectcheckbox input[type='checkbox']:not(:disabled):hover+span {
  border-color: var(--border-color-primary);
}

.rectcheckbox input[type=checkbox]:checked+span::before {
  position: absolute;
  right: 0;
  bottom: -3px;
  width: auto;
  height: auto;
  line-height: 16px;
  overflow: hidden;
  z-index: 1;
  color: #FFF;
  font-size: 12px;
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e64d";
}

.rectcheckbox input[type=checkbox]+span::after {
  transition: var(--transition-all);
  -webkit-transition: var(--transition-all);
}

.rectcheckbox input[type=checkbox]:checked+span::after {
  content: '';
  position: absolute;
  right: 0;
  bottom: 0;
  border: 10px solid var(--border-color-primary);
  border-top-color: transparent;
  border-left-color: transparent;
}

/* 【radio】 */
.radiowrap {
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
  column-gap: 6px;
}

input[type='radio'] {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  border-width: 1px;
  border-style: solid;
  border-radius: 100%;
}

input[type='radio']:checked::after {
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e64d";
}

input[type='radio']:not(.small):not(.mini) {
  width: 26px;
  height: 26px;
  font-size: 18px;
}

input[type='radio'].small {
  width: 20px;
  height: 20px;
  font-size: 14px;
}

input[type='radio'].mini {
  width: 16px;
  height: 16px;
  font-size: 12px;
}

input[type='radio']:not(:disabled):hover {
  border-width: 2px;
}

input[type='radio']:not(:disabled):not(:checked) {
  border-color: var(--border-color-default);
}

input[type='radio']:not(.success):not(:disabled):checked,
input[type='radio']:not(.success):not(:disabled):hover {
  border-color: var(--border-color-primary);
}

input[type='radio']:not(.success):not(:disabled):checked {
  color: var(--color-white);
  background-color: var(--border-color-primary);
}

input[type='radio'].success:not(:disabled):checked,
input[type='radio'].success:not(:disabled):hover {
  border-color: var(--border-color-success);
}

input[type='radio'].success:not(:disabled):checked {
  color: var(--color-white);
  background-color: var(--border-color-success);
}

input[type='radio']:disabled:not(:checked) {
  border-color: var(--border-color-default);
  background-color: var(--bg-color-disabled);
}

input[type='radio']:disabled:not(.success):checked {
  color: var(--color-white);
  border-color: var(--border-color-primary-light);
  background-color: var(--border-color-primary-light);
}

input[type='radio']:disabled.success:checked {
  color: var(--color-white);
  border-color: var(--border-color-success-light);
  background-color: var(--border-color-success-light);
}

input[type='radio']:disabled+span {
  color: var(--color-disabled);
}

/* 【rectradio】 */
.rectradio:not(.small) {
  --rectradio-height: 32px;
}

.rectradio.small {
  --rectradio-height: 26px;
  font-size: 12px;
}

.rectradio {
  display: inline-flex;
  min-width: 120px;
  overflow: hidden;
  height: var(--rectradio-height);
  background-color: var(--bg-color-lighter);
  padding: 2px;
}

.rectradio.primary {
  border-width: 1px;
  border-style: solid;
  border-color: var(--border-color-default);
  padding: 0;
}

.rectradio:not(.round) {
  border-radius: 3px;
}

.rectradio.round {
  border-radius: calc(var(--rectradio-height));
}

.rectradio label {
  flex-grow: 1;
  width: 0;
  display: flex;
}

.rectradio label input[type='radio'] {
  display: none;
}

.rectradio label input[type='radio']+span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  overflow: hidden;
  flex-wrap: nowrap;
  white-space: nowrap;
  transition: all 0.15s ease;
  -webkit-transition: all 0.15s ease;
  user-select: none;
}

.rectradio:not(.round) label input[type='radio']+span {
  border-radius: 2px;
}

.rectradio.round label input[type='radio']+span {
  border-radius: calc(var(--rectradio-height) - 4px);
}

.rectradio:not(.primary) label input[type='radio']:checked:not(:disabled)+span {
  background-color: #FFFFFF;
}

.rectradio.primary label input[type='radio']:checked:not(:disabled)+span {
  color: #FFFFFF;
  background-color: var(--border-color-primary);
}

.rectradio.primary label input[type='radio']:disabled:checked+span {
  color: #FFFFFF;
  background-color: var(--border-color-primary-light);
}

.rectradio:not(.primary) label input[type='radio']:disabled:checked+span {
  background-color: rgba(255, 255, 255, 0.9);
}

/* 【下拉框】 */
select {
  padding: 0 28px 0 4px;
  height: 32px;
  line-height: 30px;
  border: solid 1px var(--border-color-default);
  border-radius: 3px;
  margin: 0;
  appearance: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAZ0lEQVQ4T2NkoBAwUqifYdQABtQwmD9/qSoj4++tDAyMrNgD9//v//9ZvRMTo2/D5DECEckQVVRD/t9G1wySxxoLmIZg14zTAJAEwhAGBmw24/QCsrNBhoD4yH5GD5vRhIQjGknJoQAZ9SoRxrO+AQAAAABJRU5ErkJggg==");
  background-repeat: no-repeat;
  background-position: right 4px center;
  background-color: #FFF;
  transition: var(--transition-border);
  -webkit-transition: var(--transition-border);
}

select:not(:disabled):not(.warning):hover,
select:not(:disabled):not(.warning):focus {
  border: solid 1px var(--border-color-default-hover);
  box-shadow: 0px 0px 3px var(--shadow-color-default);
}

select:not(:disabled).warning {
  color: var(--color-warning);
  border-color: var(--border-color-warning);
  background-color: var(--bg-color-warning);
}

select:not(:disabled).warning:hover,
select:not(:disabled).warning:focus {
  box-shadow: 0px 0px 3px var(--border-color-warning);
}

select:disabled {
  opacity: 1;
  color: var(--color-disabled);
  background-color: var(--bg-color-disabled);
}

select::-ms-expand {
  display: none;
}

/* 【上传】 */
/* 文件选择框 */
.fileinput {
  position: relative;
  display: inline-flex;
  align-items: center;
  height: 32px;
  padding-left: 4px;
  padding-right: 28px;
  min-width: 120px;
  border: solid 1px var(--border-color-default);
  border-radius: 3px;
  overflow: hidden;
}

.fileinput::after {
  position: absolute;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 100%;
  right: 0;
  content: '\e652';
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
  color: var(--color-gray);
}

input[type=file]:not(:disabled):not(.warning)+.fileinput:hover,
input[type=file]:not(:disabled):not(.warning)+.fileinput:focus {
  border: solid 1px var(--border-color-default-hover);
  box-shadow: 0px 0px 3px var(--shadow-color-default);
}

input[type=file]:not(:disabled).warning+.fileinput {
  color: var(--color-warning);
  border-color: var(--border-color-warning);
  background-color: var(--bg-color-warning);
}

input[type=file]:not(:disabled).warning+.fileinput:hover,
input[type=file]:not(:disabled).warning+:focus {
  box-shadow: 0px 0px 3px var(--border-color-warning);
}

input[type=file]:disabled+.fileinput {
  color: var(--color-disabled);
  background-color: var(--bg-color-disabled);
}

.fileinput>span {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.fileinput>span:empty::after {
  content: attr(placeholder);
  color: var(--color-placeholder);
}

/* 文件选择卡片 */
.filewrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  align-content: flex-start;
  gap: 10px;
  padding: 10px;
  overflow: auto;
  border: solid var(--border-color-default) 1px;
}

.file-upload {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  row-gap: 4px;
  border-radius: 3px;
  color: var(--color-placeholder);
  border: dashed 1px var(--border-color-default);
  width: var(--file-item-width, 80px);
  height: var(--file-item-height, 80px);
  transition: var(--transition-all);
  -webkit-transition: var(--transition-all);
}

.file-upload::before {
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: calc(var(--file-item-width, 80px) / 3.2);
}

.file-upload:not(.image):not(.camera):not(.file)::before {
  content: "\ee77";
}

.file-upload.image::before {
  content: "\ee31";
}

.file-upload.camera::before {
  content: "\ee34";
}

.file-upload.file::before {
  content: "\e64c";
}

.file-upload::after {
  content: attr(placeholder);
  font-size: 12px;
}

.file-upload:hover {
  color: var(--color-primary-hover);
  border-color: var(--border-color-plain-hover);
  background-color: var(--bg-color-plain);
}

/* 【文件项目】 */
.file-item {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 3px;
  border: solid 1px var(--border-color-default);
  background-color: #FFFFFF;
  user-select: none;
  width: var(--file-item-width, 80px);
  height: var(--file-item-height, 80px);
}

.file-item:not(.image)::before {
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: calc(var(--file-item-width, 80px) / 3.2);
}

.file-item.word::before {
  content: "\e64a";
  color: #2B579B;
}

.file-item.excel::before {
  content: "\e648";
  color: #107B0F;
}

.file-item.ppt::before {
  content: "\e649";
  color: #D24825;
}

.file-item.pdf::before {
  content: "\e647";
  color: #B20010;
}

.file-item img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  object-position: center center;
}

.file-item img:empty::after {
  content: '加载中';
  color: var(--color-placeholder);
  font-size: 12px;
}

.file-item .filename {
  position: absolute;
  width: 100%;
  bottom: 0;
  height: 24px;
  line-height: 100%;
  border: none;
  border-radius: 0;
  font-size: 12px;
  background-color: rgba(0, 0, 0, 0.1);
  color: var(--color-grey);
}

.file-item-action {
  position: absolute;
  display: flex;
  align-items: center;
  align-content: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 1px;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  background-color: rgba(80, 80, 80, .75);
  opacity: 0;
  transition: opacity 0.2s;
}

.file-item:hover .file-item-action:not(:empty) {
  cursor: pointer;
  opacity: 1;
}

.file-item .file-item-action>span {
  display: none;
  align-items: center;
  justify-content: center;
  width: calc((var(--file-item-width, 80px)-2) / 3 - 2px);
  height: calc((var(--file-item-width, 80px)-2) / 3 - 2px);
  min-width: 22px;
  min-height: 22px;
  border-radius: 3px;
}

.file-item .file-item-action>span.viewer,
.file-item .file-item-action>span.download,
.file-item .file-item-action>span:hover {
  background-color: rgba(180, 180, 180, 0.85);
}

.file-item .file-item-action>span.delete:hover {
  background-color: rgba(241, 145, 145, 0.9);
}

.file-item .file-item-action>span::before {
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  font-family: iconfont !important;
  font-size: 16px;
  color: var(--color-white);
}

.file-item .file-item-action>span.viewer::before {
  content: "\7a";
}

.file-item .file-item-action>span.download::before {
  content: "\ee78";
}

.file-item .file-item-action>span.edit::before {
  content: "\e628";
}

.file-item .file-item-action>span.delete::before {
  content: "\ee45";
}

.file-item.image .file-item-action>span.viewer,
.file-item.pdf .file-item-action>span.viewer {
  display: inline-flex;
}

.file-item:not(.image) .file-item-action>span.download,
.file-item:not(.pdf) .file-item-action>span.download {
  display: inline-flex;
}

.file-item.edit .file-item-action>span.delete {
  display: inline-flex;
}

.file-item.edit .filename+.file-item-action>span.edit {
  display: inline-flex;
}

/* 【弹出菜单】 */
.fmenu-dropdown {
  position: fixed;
  z-index: 10000;
  display: none;
  min-width: 140px;
  max-height: 274px;
  text-align: left;
  background-color: #FFFFFF;
  color: #000;
  border: solid var(--border-color-default) 1px;
  border-radius: 3px;
  box-shadow: 0 3px 9px var(--shadow-color-dropdown);
  overflow-x: hidden;
  overflow-y: auto;
}

.fmenu-dropdown.above {
  box-shadow: 0 -2px 9px rgba(0, 0, 0, 0.5);
}

.fmenu-dropdown .fmenu-item {
  display: flex;
  align-items: center;
  height: 30px;
  white-space: nowrap;
  cursor: default;
  user-select: none;
}

/* 无右边距 */
.fmenu-dropdown .fmenu-item:not(.paddingless) {
  padding-right: 12px;
}

.fmenu-dropdown .fmenu-item.indent {
  text-indent: 6px;
}

.fmenu-dropdown .fmenu-item:not(.sel):not(.disabled):hover {
  background-color: #E6E6E6;
}

.fmenu-dropdown .fmenu-item.topline {
  border-top: solid #EEE 1px;
}

.fmenu-dropdown .fmenu-item.bottomline {
  border-bottom: solid #EEE 1px;
}

.fmenu-dropdown .fmenu-item .item-text {
  flex-grow: 1;
  word-break: break-all;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 13px;
}

.fmenu-dropdown .fmenu-item:not(.item-icon) .item-text {
  text-indent: 28px;
}

.fmenu-item.item-icon:before {
  font-family: "iconfont" !important;
  content: "";
  color: #0d9cf6;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  text-align: center;
  min-width: 28px;
}

/* 复制 */
.fmenu-item.item-icon.copy:before {
  content: "\e607";
}

/* 编辑 */
.fmenu-item.item-icon.edit:before {
  content: "\e628";
}

/* 删除 */
.fmenu-item.item-icon.del:before {
  content: "\ee45";
  color: #fa381f;
  font-size: 13px;
}

/* 审核 */
.fmenu-item.item-icon.review:before {
  content: "\e654";
  color: #0d9cf6;
}

/* 撤销审核 */
.fmenu-item.item-icon.unreview:before {
  content: "\e653";
  color: #FF0000;
}

.fmenu-dropdown .fmenu-item:not(.disabled).arrow::after {
  font-family: "iconfont" !important;
  content: "\e7bc";
  color: #b3b3b3;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 14px;
  margin-left: 12px;
}

.fmenu-dropdown .fmenu-item.sel {
  background-color: #0F95FF;
  color: #FFF;
}

.fmenu-dropdown .fmenu-item.sel .item-icon:before,
.fmenu-dropdown .fmenu-item.sel.arrow::after {
  color: #FFF;
}

.fmenu-dropdown .fmenu-item.disabled,
.fmenu-dropdown .fmenu-item.disabled.item-icon:before {
  color: #969696
}

.fmenu.active>.fmenu-dropdown,
.fmenu.active+.fmenu-dropdown {
  display: block;
  animation: fmenu-dropdown-show 0.2s ease normal;
}

.fmenu-dropdown .fmenu-item:not(.disabled):hover>.fmenu-dropdown {
  display: block;
  animation: fmenu-dropdown-show 0.2s ease normal;
}

@keyframes fmenu-dropdown-show {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

/* 提示框 */
.tipso_bubble,
.tipso_bubble>.tipso_arrow {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box
}

.tipso_bubble {
  position: absolute;
  border-radius: 3px;
  z-index: 9999;
  padding: 6px;
  box-shadow: 2px 2px 5px 0 rgba(54, 58, 80, .65);
}

.tipso_bubble>.tipso_content {
  max-width: 300px;
  word-wrap: break-word;
}

.tipso_bubble>.tipso_arrow {
  position: absolute;
  width: 0;
  height: 0;
  border: 8px solid;
  pointer-events: none;
}

.tipso_bubble.top>.tipso_arrow {
  border-color: #000 transparent transparent;
  top: 100%;
  left: 50%;
  margin-left: -8px
}

.tipso_bubble.bottom>.tipso_arrow {
  border-color: transparent transparent #000;
  bottom: 100%;
  left: 50%;
  margin-left: -8px
}

.tipso_bubble.left>.tipso_arrow {
  border-color: transparent transparent transparent #000;
  top: 50%;
  left: 100%;
  margin-top: -8px
}

.tipso_bubble.right>.tipso_arrow {
  border-color: transparent #000 transparent transparent;
  top: 50%;
  right: 100%;
  margin-top: -8px
}

/* 提示信息 */
.tipcontent {
  position: relative;
  border: solid #B5DAFF 1px;
  background-color: #F0F8FF;
  padding: 10px 16px 10px 10px;
}

.tipcontent ul {
  line-height: 24px;
  color: #083C7F;
  margin-left: 20px;
}

.tipcontent ul li:before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  background-color: #083C7F;
  border-radius: 50%;
  margin-left: -15px;
  margin-right: 10px;
  vertical-align: middle;
}

.tipcontent .hidetipcontent {
  position: absolute;
  top: 0;
  right: 0;
  width: 20px;
  height: 20px;
  text-align: center;
  color: #0d9cf6;
  border-radius: 50%;
  /* background-color:#f36c12; */
  cursor: pointer;
}

.tipcontent .hidetipcontent:before {
  line-height: 20px;
  content: "\e615";
  display: inline-block;
  vertical-align: middle;
  font-size: 16px;
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* 【树型列表】 */
/* 侧边树型列表 */
.treemenuside {
  display: flex;
  flex-direction: column;
  position: relative;
  min-width: 22px;
  border: 1px solid #e6ebf5;
  background-color: #FFF;
}

.treemenuside .treemenuwrap:not(.fmenu-dropdown) {
  width: 180px;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
}

.treemenuside .treemenuhead {
  display: flex;
  height: 33px;
  align-items: center;
  background-color: var(--bg-color-soft);
  overflow: hidden;
  border-bottom: solid #e8ebee 1px;
  background-repeat: no-repeat;
  background-position: 6px center;
  padding-left: 6px;
}

/* 显示或隐藏控制按钮 */
.treemenuside:not(.treemenuhide) .treemenuhidebar {
  position: absolute;
  z-index: 10;
  width: 14px;
  height: 48px;
  text-align: center;
  line-height: 48px;
  background-color: #F6F8FA;
  right: -16px;
  top: 50%;
  margin-top: -24px;
  transform: perspective(.5em) rotateY(8deg);
  border-radius: 0 3px 3px 0;
  border-color: #E9E9EB;
  border-style: solid;
  border-width: 1px 1px 1px 0;
}

.treemenuside .treemenuhidebar::before {
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 12px;
}

.treemenuside:not(.treemenuhide) .treemenuhidebar::before {
  color: #0F95FF;
  content: "\e644";
}

.treemenuside.treemenuhide .treemenuhidebar {
  flex-grow: 1;
  display: flex;
  align-items: center;
  padding-top: 6px;
  width: 100%;
  writing-mode: vertical-lr;
  background-color: #F6F8FA;
  color: #359AFC;
  font-size: 12px;
}

.treemenuside.treemenuhide .treemenuhidebar::before {
  content: "\ee1b";
  margin-bottom: 6px;
}

.treemenuside.treemenuhide .treemenuhidebar::after {
  content: attr(text-content-after);
  letter-spacing: 0.5em;
}

.treemenuside .treemenuhidebar:hover {
  background-color: rgba(135, 206, 250, 0.3);
}

/* 弹出树型菜单 */
.treemenuwrap.fmenu-dropdown {
  max-height: none;
  overflow-y: hidden;
}

.treemenuwrap.fmenu-dropdown .treemenu {
  height: auto;
  overflow-y: auto;
}

/* 树型菜单搜索 */
.treesearchwrap {
  position: relative;
  border-bottom: 1px solid #D9D9D9;
  text-indent: 0;
}

.treesearchwrap input[type=text] {
  background-repeat: no-repeat;
  width: 100%;
  border: none !important;
  background-position: right center;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAPCAYAAADphp8SAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAU9JREFUeNqMk8FHBGEYxmc3SkSUKEt7347LsnSY/yBWRHRqLy17iVa31HGXdEiH6FinSOm8pkuxxz3sqeuyRMQSsabfyzPZxsy3+/Lzjpn3e773+553MmEYelEEQbBIOoRtKMAHtOHc9/2O54hMJIRIkfQMq/r2CUtjtQ3EWmlCWYnYgkeJ3MEai5bJc1CDITSp23F2REGT5yNoIdCIF/G9RHqFAeSpGSV2RNhO33CWtJvu5x5yUE48GrvNk9ehw4Kh4z7byqW0O5rV84/njlEs/xeiiy/ZXKS7BYfQpnIv1TU5Zc6dJhWxgd3LHrzDi8s1s70LK3ANJ3Q64L0dexcuwIZ1i/dPkwayrIGMhrAvl8bjBqGq62hm8RtpAy41LzkN4oPeWeyz4bGzo0mBwBXpQK5V4kfMetNHXbM0A7dxh6cW0m9RkWs9/Ql/8SvAACBtdJd4ul69AAAAAElFTkSuQmCC");
}

.treesearchwrap input[type=text]:hover {
  border: none !important;
  box-shadow: none !important;
}

.treesearchwrap input[type=text]:focus {
  border: none !important;
  box-shadow: none !important;
}

.treesearchwrap .treesearch-nav {
  position: absolute;
  display: none;
  height: 28px;
  top: 2px;
  right: 2px;
  line-height: 26px;
  padding: 1px;
  overflow: hidden;
  background-color: #EBEBEC;
  border-radius: 24px;
  user-select: none;
}

.treesearchwrap .treesearch-nav span {
  color: #888888;
  margin-left: 5px;
  margin-right: 5px;
}

.treesearchwrap .treesearch-nav i {
  display: inline-block;
  width: 23px;
  height: 23px;
  text-align: center;
  color: #888888;
  border-radius: 23px;
}

.treesearchwrap .treesearch-nav i:not(.disabled):hover {
  color: #000000;
  background-color: #CCC;
}

.treesearchwrap .treesearch-nav i.disabled {
  color: #CCC;
}

.treemenu {
  flex-grow: 1;
  height: 0;
  width: 100%;
  overflow-x: hidden;
  overflow-y: auto;
}

.treemenu li {
  display: flex;
  flex-direction: row;
  align-items: center;
  text-indent: 0;
  height: 30px;
  line-height: 30px;
  -moz-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  cursor: default;
}

.treemenu li.sel {
  color: #1E90FF;
  font-weight: bold;
  background-color: #F2F7FD;
}

.treemenu li.disabled {
  color: #969696;
}

.treemenu li label {
  flex-grow: 1;
  width: 0;
  height: 100%;
  padding-left: 6px;
  display: flex;
  align-items: center;
}

.treemenu li>i {
  display: block;
  float: left;
  margin-left: 3px;
  width: 24px;
  min-width: 24px;
  height: 30px;
  background-position: center center;
  background-repeat: no-repeat;
}

.treemenu li>i.line {
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAERJREFUeNrs17ENAEAIQlG96d2aiytgYeEnoTTklYakcFpVcm+7L/zk4HY0rK1hxIgRI0aMGDFixIgRXxVnP1Ab+QIMAPeLandshKKrAAAAAElFTkSuQmCC');
}

.treemenu li>i.linet {
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAGRJREFUeNrs18EKACEIBNBm6Z/9Br/a3Q7dY2bBQ+NFOog8QixU1WAiM1chIoKqfwYfEGqlxtXV2GKLLbb4MvEUxdhbap9P8rfR8IeYym13PFVxx0PAc2yxxRZfJgb7aVPjFWAA3KMjpsiHNNQAAAAASUVORK5CYII=');
}

.treemenu li>i.linel {
  background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAFpJREFUeNrslTEOwDAIA3HUP/MGXk2aIWOlCoYMOS+IwTrdZGWmVRIRqyh3L/WH1aNGtwXOU2CMMcYY48uMn6ax9krt/899F02qzmI3ww4FMGDAgAED/swUYABTIxs4prOcHgAAAABJRU5ErkJggg==');
}

.treemenu li label .menutext {
  flex-grow: 1;
  width: 0;
  overflow: hidden;
  word-break: keep-all;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.treemenu li.treemenuitem {
  height: 28px;
  line-height: 28px;
  padding-left: 6px;
  background-repeat: no-repeat;
  background-position: 10px center;
  word-break: keep-all;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}


.treemenu li:not(.disabled):not(.sel):not(._sel):hover {
  color: #598DF2;
  background-color: #F5F5F5;
}

.treemenu li.disabled:hover {
  color: #969696;
  background-color: #F5F5F5;
}

.treemenu li span.menu_arrow {
  min-width: 22px;
  width: 22px;
  height: 22px;
  margin: 3px;
  text-align: center;
  line-height: 24px;
  color: #999;
  border-radius: 22px;
  transition: all 0.2s;
  -ms-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -webkit-transition: all 0.2s;
  -o-transition: all 0.2s;
}

.treemenu li span.menu_arrow::after {
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e62b";
  font-size: 12px;
}

.treemenu li.sel span.menu_arrow {
  background-color: rgba(135, 206, 250, 0.3);
  color: #FFF;
}

.treemenu li span.menu_arrow_flex {
  transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
}

.treemenu li span.menu_arrow:hover {
  background-color: #FFF;
  color: #0d9cf6;
  font-weight: bold;
}

.treemenu li.sel span.menu_arrow:hover {
  color: #FFF;
  background-color: rgba(135, 206, 250, 0.5);
}

/* 【数据列表页】 */
.listspace {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  row-gap: 10px;
  padding: 15px;
  height: 0;
}

div.listspace-dialog {
  background-color: #FFFFFF;
  border-radius: 0;
  border: 0;
  display: flex;
  flex-direction: column;
}

/**/
div.substep {
  position: relative;
  z-index: 24;
  height: 41px;
  overflow: hidden;
  border-bottom: solid #e1e1e1 1px;
}

div.substep ol {
  font-size: 0;
  height: 40px;
  /* box-shadow: 0 1px 4px 0 rgba(54, 58, 80, .32); */
}

div.substep ol>li {
  display: inline-block;
  font-size: 14px;
  line-height: 40px;
  color: #78787e;
  overflow: hidden;
  pointer-events: stroke;
  -moz-user-select: none;
  -webkit-user-select: none;
  user-select: none;
  cursor: default;
}

div.substep ol>li.substep-right {
  float: right;
  padding-right: 6px;
}

div.substep ol>li i {
  font-size: 12px;
  margin-left: 6px;
}

div.substep ol>li>span {
  display: inline-block;
  height: 40px;
  line-height: 40px;
  margin-left: 6px;
  padding-left: 6px;
  padding-right: 6px;
  border-bottom: solid transparent 3px;
  cursor: pointer;
}

div.substep ol>li>span:hover {
  color: #00A4FF;
}

div.substep ol>li._sel>span {
  color: #00A4FF;
  border-bottom: solid #39F 3px;
}

div.substep ol>li>span span.smailltips {
  display: inline-block;
  font-size: 12px;
  font-weight: normal;
  height: auto;
  line-height: 12px;
  background-color: #F93;
  color: #FFFFFF;
  border-radius: 3px;
  padding: 4px 4px 4px 4px;
  transform: scale(0.8);
  -ms-transform: scale(0.8);
  -moz-transform: scale(0.8);
  -webkit-transform: scale(0.8);
  -o-transform: scale(0.8);
}

div.substep ol>li select {
  height: 28px;
  background-color: #fff;
  border: solid #cdcdcd 1px;
  border-radius: 0;
  box-shadow: none;
}

div.substep ol>li select:hover {
  border: solid 1px #79b9e3;
}

.childframewrap {
  position: absolute;
  top: 40px;
  right: 0;
  bottom: 0;
  left: 0;
}

.childframewrap>iframe {
  position: absolute;
  overflow: hidden;
  border: 0;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* 【数据表格页工具栏】 */
.toolbar {
  display: flex;
  z-index: 25;
  gap: 5px;
}

/*显示列*/
.selcolumn {
  max-height: none;
  overflow-y: hidden;
  line-height: normal;
}

.selcolumn ul {
  min-width: 170px;
  max-height: 400px;
  overflow-x: auto;
}

.selcolumn ul>li.fmenu-item label {
  flex-grow: 1;
  align-self: stretch;
  display: flex;
  padding-left: 8px;
  padding-right: 12px;
}

.selcolumn .selcolumn-footer {
  display: flex;
  height: 30px;
  background-color: #EEEEEE;
  padding-left: 8px;
}

/* 【数据表格父容器（左右布局）】 */
.listcontentwrap {
  flex-grow: 1;
  height: 0;
  display: flex;
  flex-direction: row;
}

/* 【数据表格容器】 */
.listcontent {
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background-color: #FFFFFF;
  border: 1px solid var(--border-color-gray);
  padding: 10px;
  box-shadow: 0 2px 10px 0 rgba(0, 0, 0, .1);
}

.listcontentwrap .listcontent {
  width: 0;
}

/* 表格标题 */
.listhead {
  z-index: 22;
  border-bottom: solid var(--border-color-gray-dark) 1px;
  overflow: hidden;
}

.listhead:not(.even) {
  height: 35px;
}

.listhead.even {
  height: 58px;
}

.listhead>table {
  table-layout: fixed;
  height: 100%;
  width: 100%;
}

.listhead>table th {
  color: var(--color-gray-dark);
  font-weight: normal;
  word-break: break-all;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border-right: solid var(--border-color-gray-dark) 1px;
}

.listhead:not(.even) th {
  height: 34px;
}

.listhead.even>table tr:first-child th:not([rowspan='2']) {
  height: 28px;
}

.listhead>table tr:first-child th {
  border-image: linear-gradient(rgba(255, 0, 0, 0), var(--border-color-gray-dark)) 1 80;
}

.listhead>table tr th[rowspan='2'] {
  border-image: linear-gradient(rgba(255, 0, 0, 0), var(--border-color-gray-dark), var(--border-color-gray-dark)) 1 80;
}

.listhead>table tr:nth-child(2) th {
  height: 29px;
  border-right: solid var(--border-color-gray-dark) 1px;
  border-top: solid var(--border-color-gray-dark) 1px;
}

.listhead>table tr:first-child th:last-child {
  border-right: 0;
}

.listhead>table tr th .fs-label-wrap {
  justify-content: center;
}

.listhead>table tr th .fs-label-wrap .fs-label {
  padding-top: 0;
  padding-bottom: 0;
  padding-right: 0;
}

.listhead:not(.even)>table tr th .fs-label-wrap .fs-label {
  height: 34px;
  line-height: 34px;
}

.listhead.even>table tr th[rowspan='2'] .fs-label-wrap .fs-label {
  height: 57px;
  line-height: 57px;
}

.listhead.even>table tr th:not([rowspan='2']) .fs-label-wrap .fs-label {
  height: 57px;
  line-height: 57px;
}

/* 表格主体容器 */
.listbody {
  flex-grow: 1;
  height: 0;
  z-index: 22;
  overflow-x: auto;
  overflow-y: scroll;
}

.listbody.empty {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  row-gap: 3px;
}

.listbody.empty::before {
  z-index: 1;
  font-size: 64px;
  color: var(--color-placeholder);
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\ee42";
}

.listbody.empty:after {
  font-size: 18px;
  color: var(--color-placeholder);
  content: "没有记录";
}

.listbody.empty .listtable {
  display: none !important;
}

/* 数据表格 */
.listtable {
  width: 100%;
  display: none;
}

.listtable tr>td {
  height: 34px;
  border-bottom: solid #E7EAEC 1px;
  text-indent: 4px;
  padding-right: 4px;
  text-align: center;
  overflow: hidden;
  word-break: keep-all;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.listtable tr td.column-function {
  text-indent: 0;
  padding-right: 0;
}

.listtable tr.dark td {
  border-top: solid #D4D4D4 1px;
}

.listtable tr td.expand {
  text-align: left;
  word-break: keep-all;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background: green;
}

.listtable tr.locked {
  color: #0D9CF6;
}

.listtable tr.gray.locked {
  color: #02c2d9;
}

.listtable tr:hover td {
  background-color: #FCFCFC;
}

.listtable tr.grouprow td {
  background-color: #F9F9F9;
}

.listtable tr._sel td {
  background-color: #F2F7FD;
}

.listtable tr.grouprow._sel td {
  background-color: #ecf5ff;
}

.listtable tr._sel:hover td {
  background-color: #F2F7FD;
}

.listtable label.wechat:before {
  color: #6E70F0;
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\ee6a";
  font-size: 16px;
  margin-right: 2px;
}

.listtable i.icondisabled {
  font-size: 14px;
}

.listtable i.icondisabled::before {
  content: "\ee28";
}

.listtable tr.listempty {
  color: #CCC;
}

.listtable tr.listempty td {
  border-bottom: none;
  height: 60px;
  vertical-align: middle;
}

.listtable tr.listempty:hover td {
  background-color: transparent;
}

.listtable tr>td.td_list {
  text-align: left;
}

.listtable tr>td.td_list>p {
  text-indent: 0;
}

.listtable tr>td.td_list>p>span {
  text-indent: 0;
}

.listtable tr>td.td_list>p>span.td_list_tip {
  color: #999;
  margin-right: 6px;
}

.listtable tr>td.td_list>p>span.td_list_tip:empty {
  display: none;
}

/*数据列表操作按钮*/
.listtable tr td.column-function a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  column-gap: 3px;
  min-width: 19px;
  min-height: 19px;
  color: #6795E2;
}

.listtable tr td.column-function a:not(:last-of-type) {
  margin-right: 8px;
}

.listtable tr td.column-function a:hover {
  color: #31aaf5;
}

.listtable tr td.column-function a:active {
  color: #31aaf5;
}

.listtable tr td.column-function a.disabled,
.listtable tr td.column-function a.disabled:hover {
  color: #b4b4b4;
  cursor: default;
}

.listtable tr td.column-function a.fmenu:after {
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e6e6";
  font-size: 16px;
}

/* 卡片式列表 */
.cardlistbody {
  flex-grow: 1;
  height: 0;
  z-index: 22;
  overflow-x: auto;
  overflow-y: scroll;
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  align-content: flex-start;
}

.cardlist {
  padding: 6px 10px;
  border: solid 1px #E1E1E1;
}

.cardlist .form-item {
  padding: 3px 0;
}

.cardlist .form-item .form-item-tag {
  min-width: 70px;
  width: 70px;
  line-height: normal;
  height: auto;
}

.cardlist .form-item .form-item-cont {
  line-height: normal;
  overflow: hidden;
}

/* 卡片式列表操作按钮 */
.list-menu {
  display: flex;
  flex-direction: row;
  border-top: solid 1px #eeeeee;
  padding-top: 6px;
  -moz-user-select: none;
  -webkit-user-select: none;
  user-select: none;
}

.list-menu>div {
  flex-grow: 1;
  width: 0;
  line-height: 30px;
  overflow: hidden;
  white-space: nowrap;
  text-align: center;
  color: #0099FF;
  cursor: default;
}

.list-menu>div:before {
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  margin-right: 3px;
}

.list-menu>div.disabled {
  color: #b4b4b4;
}

.list-menu>div:not(.disabled):hover {
  background-color: #eaf6fd;
}

.list-menu>div:not(.disabled):active {
  background-color: #dfeef7;
}

.list-menu>div.disabled:before {
  color: #b4b4b4;
}

/**/
.list-menu>div.edit:before {
  content: "\e628";
}

.list-menu>div.patrol:before {
  content: "\e9c9";
}

.list-menu>div.review:before {
  content: "\e654";
}

.list-menu>div.review:not(.disabled):before {
  color: #FF0000;
}

.list-menu>div.unreview:before {
  content: "\e653";
}

.list-menu>div.unreview:not(.disabled):before {
  color: #FF0000;
}

.list-menu>div.print:before {
  content: "\e70f";
}

.list-menu>div.del:not(.disabled) {
  color: #fa381f;
}

.list-menu>div.del:before {
  content: "\a7ca";
}


/* 页脚 */
.listfoot {
  display: flex;
  background-color: #FFF;
  padding-top: 10px;
  border-top: solid var(--border-color-gray) 1px;
  color: var(--color-grey);
}

.listfoot .record_count {
  display: flex;
  align-items: center;
}

/* 【页码插件】 */
.pagecontrol {
  flex-grow: 1;
  display: flex;
  column-gap: 8px;
  height: 30px;
  color: var(--color-gray);
}

.pagecontrol .pagecount {
  flex-grow: 1;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.pagecontrol .pageination {
  display: flex;
  background-color: var(--border-color-default);
  padding: 1px;
  column-gap: 1px;
}

.pagecontrol .pageination>* {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #FFFFFF;
  cursor: default;
}

.pagecontrol i.turnpage {
  width: 30px;
}

/* 页码选择 */
.pagecontrol .pageindex {
  min-width: 100px;
  overflow: hidden;
}

.pagecontrol .fmenu {
  position: relative;
  padding-right: 12px;
}

.pagecontrol .fmenu::after {
  position: absolute;
  font-family: "iconfont" !important;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  content: "\e6e6";
  font-size: 16px;
  right: 4px;
}

.pagecontrol .pageination>*:hover,
.pagecontrol .pageoffset:hover,
.pagecontrol .fmenu.active {
  color: var(--color-primary-hover);
  background-color: var(--bg-color-plain);
}

.pagecontrol .pageoffset {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 90px;
  border: solid var(--border-color-default) 1px;
  cursor: default;
}

.pagecontrol .pageindex ul,
.pagecontrol .pageoffset ul {
  max-height: 226px;
}

/**/
/*提升z-index，完整显示快捷菜单*/
.z-index30 {
  z-index: 30;
}

.act {
  display: none !important;
}

/* 预览页面样式 */
.paperwin {
  flex-grow: 1;
  background-color: #DDDDDD;
  overflow: auto;
}

.papercont {
  padding: 10px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 8px;
  min-height: 100%;
  align-items: center;
}

.paperwrap {
  flex-shrink: 0;
  background-color: #FFF;
  overflow: hidden;
  border: solid 1px #C6C6C6;
  box-shadow: 2px 2px 3px 0 rgba(54, 58, 80, .32);
}

.paper {
  position: relative;
  width: 210mm;
  height: 297mm;
  transform-origin: left top;
  -ms-transform-origin: left top;
  -moz-transform-origin: left top;
  -webkit-transform-origin: left top;
  -o-transform-origin: left top;
}

.paperscalebar {
  position: fixed;
  right: 30px;
  bottom: 80px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.paperscalebar>li>button {
  height: 36px !important;
  width: 36px !important;
  border: solid 1px #F7F7F7;
  border-radius: 36px !important;
  color: #7A7A7A !important;
  background-color: #FFF !important;
  box-shadow: 2px 2px 3px 0 rgba(54, 58, 80, .32);
}

.paperscalebar>li>button::before {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.paperscalebar>li>button.scalepaper::before {
  font-size: 18px;
  content: "\ee49";
}

.paperscalebar>li>button.zoom2::before {
  content: "\e9c8";
}

.paperscalebar>li>button.zoom1::before {
  content: "\e64f";
  font-size: 17px;
}

.paperscalebar>li>button:hover {
  background-color: var(--bg-color-plain) !important;
}

.paperscalebar>li>button:active {
  background-color: var(--border-color-default) !important;
}

/*=========编辑对话框===============*/
body.popups.loading .editcontdiv {
  display: none;
}

body.popups form {
  flex: 1;
  height: 0;
  display: flex;
  flex-direction: column;
}

body.popups.loading .editfoot {
  display: none;
}

body.popups:not(.loading) .editcontdiv {
  flex: 1;
  z-index: 2;
  display: flex;
  flex-direction: column;
  row-gap: 10px;
  overflow-x: hidden;
  overflow-y: auto;
}

/**/
.editfoot {
  display: flex;
  height: 50px;
  align-items: center;
  justify-content: flex-end;
  padding-left: 15px;
  padding-right: 15px;
  column-gap: 15px;
  background: var(--bg-color-mute);
  overflow: hidden;
}

.editfoot button {
  min-width: 90px;
}