html,
body {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  font-family: '思源黑体', 'Microsoft YaHei', '黑体', '宋体', Arial, sans-serif;
  font-size: 14px;
}

/* Flex 基础设置 */
.flex-h,
.flex-h-right,
.flex-h-left-center,
.flex-h-top,
.flex-h-top-wrap,
.flex-h-space,
.flex-h-wrap,
.flex-h-center {
  display: flex;
  flex-direction: row;
}

.flex-v,
.flex-v-center {
  display: flex;
  flex-direction: column;
}

.flex-v-left {
  display: flex;
  flex-flow: column nowrap;
  place-content: left left;
  align-items: left;
}

/* 水平对齐 */
.flex-h,
.flex-h-wrap,
.flex-h-space {
  align-items: center;
  justify-content: center;
}

.flex-left-center {
  justify-content: flex-start;
  align-items: center;
}

.flex-h-right,
.flex-right-center {
  justify-content: flex-end;
  align-items: center;
}

.flex-h-top,
.flex-h-top-wrap {
  align-items: flex-start;
  justify-content: flex-start;
}

.flex-h-space {
  justify-content: space-between;
}

.flex-h-center {
  justify-content: center;
  align-items: center;
}

/* 垂直对齐 */
.flex-v {
  align-items: center;
  justify-content: center;
}

.flex-h-left {
  display: flex;
  flex-flow: row nowrap;
  place-content: left left !important;
  align-items: center;
}

.flex-h-left-center {
  display: flex;
  flex-flow: row wrap;
  place-content: baseline left;
  align-items: baseline;
}

.flex-h-top {
  display: flex;
  flex-flow: row nowrap;
  place-content: top top;
  align-items: top;
}

.flex-h-bottom {
  display: flex;
  flex-flow: row nowrap;
  place-content: bottom bottom;
  align-items: bottom;
  justify-content: bottom;
}

.flex-h-top-wrap {
  display: flex;
  flex-flow: row wrap;
  place-content: top top;
  align-items: top;
}

.flex-v-top {
  justify-content: flex-start;
}

.flex-v-center {
  justify-content: center;
  align-items: center;
}

/* Flex 包裹 */
.flex-h-wrap,
.flex-h-top-wrap {
  flex-wrap: wrap;
}

/* 弹性空间 */
.spring,
.spring-h,
.spring-v {
  flex-grow: 1;
  flex-shrink: 1;
}

.spring-h {
  height: 100%;
}

.spring-v {
  width: 100%;
}

.button-hover-effect {
  transition:
    opacity 0.3s ease,
    transform 0.3s ease,
    background-color 0.3s ease;

  &:hover {
    opacity: 0.9 !important;
    cursor: pointer;
    /*text-decoration: blink !important;*/
  }
}

.full-w {
  width: 100%;
}

.full-h {
  height: 100%;
}

.full-wh {
  width: 100%;
  height: 100%;
}

.grid-h-one-fourth {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
}

.grid-h-one-third {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

.grid-h-half {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

.grid-h-ratio-1-2 {
  display: grid;
  grid-template-columns: 1fr 2fr;
}

.no-wrap {
  white-space: nowrap;
}

.sw-hidden {
  visibility: hidden;
}

.sw-visible {
  visibility: visible;
}

.ym-main-color {
  color: rgb(42 130 228 / 100%);
}

.ym-margin-right {
  margin-right: 16px;
}

.ym-margin-left {
  margin-left: 16px;
}

.ym-margin-top {
  margin-top: 16px;
}

.ym-margin-bottom {
  margin-bottom: 16px;
}

.ym-margin-left-right {
  margin-left: 16px;
  margin-right: 16px;
}

.ym-button-fill {
  height: 32px;
  padding: 0 18px;
  border-radius: 3px 0 0 3px;
  background: rgb(42 130 228 / 100%);
  border: 1px solid rgb(223 225 232 / 100%);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 32px;
  color: rgb(255 255 255 / 100%);
  text-align: center;
  vertical-align: top;
}

.ym-button-plain {
  height: 32px;
  padding: 0 18px;
  border-radius: 3px 0 0 3px;
  border: 1px solid rgb(223 225 232 / 100%);
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 32px;
  color: rgb(42 130 228 / 100%);
  text-align: center;
  vertical-align: top;
}

.ym-main-font {
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 17.38px;
  color: rgb(56 56 56 / 100%);
  text-align: left;
  vertical-align: top;
}

.common-dialog-form-item {
  display: flex;
  align-items: center;
  width: 425px;
  height: 32px;
}

.sw-btn-rev {
  opacity: 0.8;
  cursor: pointer;
}

.sw-btn-rev:hover {
  opacity: 1;
}

.sw-btn {
  opacity: 1;
  cursor: pointer;
}

.sw-btn:hover {
  opacity: 0.8;
}

.ym-border-bottom {
  border-bottom: 1px solid rgba(223, 225, 232, 1);
}

.el-popper.el-popper__map {
  z-index: 9 !important;
}

/* 禁止数字输入框的加减按钮 */
input[type='number']::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type='number'] {
  -moz-appearance: textfield;
}

input[type='number'] {
  -ms-appearance: textfield;
}

.disabled {
  opacity: 0.5 !important;
  cursor: not-allowed !important;
}

.temp-disabled {
  cursor: not-allowed !important;
}

.ol-dragbox {
  background-color: rgba(52, 152, 219, 0.3) !important;
  border: 2px solid rgba(42, 130, 228) !important;
}
