/* 样式简写 */

.d_f {
  display: flex;
  align-items: center;
}

.fw_w {
  flex-wrap: wrap;
}

.jc_c {
  justify-content: center;
}

.jc_sb {
  justify-content: space-between;
}

.jc_s {
  justify-content: start;
}

.jc_fe {
  justify-content: flex-end;
}

.fd_c {
  flex-direction: column;
  align-items: initial;
}

.ai_fs {
  align-items: flex-start;
}

.ai_c {
  align-items: center;
}

.ai_fe {
  align-items: flex-end;
}

.f_1 {
  flex: 1;
  overflow: hidden;
}

.o_u {
  overflow: unset;
}

.o_h {
  overflow: hidden;
}

.w_100 {
  width: 100%;
}

.h_100 {
  height: 100%;
}

.mw_mc {
  min-width: max-content;
}

.to_e {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.ta_l {
  text-align: left;
}

.ta_c {
  text-align: center;
}

.ta_r {
  text-align: right;
}

.c_p {
  cursor: pointer;
  user-select: none;
}

.pe_n {
  pointer-events: none;
}

/* 样式修正 */
html,
body {
  overflow: hidden;
}

/* 富文本内消除字体大小控制 */
div[ng-bind-html] * {
  font-size: inherit;
}

/* 颜色选择器 */
.layui-colorpicker-main {
  box-sizing: content-box;
}

:root {
  /** 主题色 */
  --theme_blue: #426df9;
  --theme_light_blue: #e3e9fb;
  --theme_dark_blue: #2f50d4;
  /** 危险色 */
  --danger_color: #ff4b26;
  /** 禁用色 */
  --disabled_text: #a2b7bd;
  /** 间距 */
  --spacing: 12px;
  /** 间距y */
  --spacing_y: 10px;
  /** 主色 */
  --primary_color: #426df9;
  /** 信息色 */
  --info_color: #909399;
  --info_color_light_3: #b1b3b8;
  --info_color_light_7: #dedfe0;
}

.ml_spacing {
  margin-left: var(--spacing);
}

.mr_spacing {
  margin-right: var(--spacing);
}

.mt_spacing {
  margin-top: var(--spacing_y);
}

.mb_spacing {
  margin-bottom: var(--spacing_y);
}

.gap {
  gap: var(--spacing_y) var(--spacing);
}

/** 模块卡片 */
.model_card {
  background: #ffffff;
  border-radius: 9px;
}

/** 模块卡片分割线 */
.model_card_division {
  height: 0;
}

.model_card_division::before {
  content: "";
  display: block;
  height: 42px;
  background: linear-gradient(180deg, #ecf2f7 0%, #ffffff 100%);
  margin-left: -50%;
  margin-right: -50%;
}

.model_card_title {
  font-weight: bold;
  font-size: 16px;
  color: #383a3b;
  line-height: 21px;
}

.model_card_title>div {
  font-size: 16px;
}

/** 表单组件 */
/** 通用样式 */
.customInput,
.customTextarea,
.customSelect {
  height: 40px;
  background-color: #fbfbfb;
  border-radius: 6px;
  border: 1px solid #d3d3d3;
  font-size: 14px;
  color: #777777;
  line-height: 24px;
  padding: 0 10px;
}

.customSelect {
  padding-right: 30px;
}

.customTextarea {
  vertical-align: middle;
}

.customInput.readonly,
.customInput.disabled,
.customInput:disabled,
.customTextarea.readonly,
.customTextarea.disabled,
.customSelect.readonly,
.customSelect.disabled,
.customSelect:disabled {
  background: #f3f3f3;
  opacity: 0.9;
}

.customInput.disabled,
.customInput:disabled,
.customTextarea.disabled,
.customSelect.disabled,
.customSelect:disabled {
  cursor: no-drop;
}

/** 自定义输入框 */
.customInput::placeholder,
.customTextarea::placeholder {
  color: #9bacb0;
}

.customInput[date] {
  padding-left: 30px;
  background-image: url(../images/rili.png);
  background-repeat: no-repeat;
  background-position-x: 8px;
  background-position-y: center;
  background-size: 14px;
}

/** 自定义文本域 */
.customTextarea {
  height: unset;
  padding: 7px 10px;
}

/** 自定义按钮 */
.customBtn {
  height: 40px;
  border-radius: 6px;
  font-size: 14px;
  line-height: 15px;
  text-align: center;
  padding: 0 15px;
  cursor: pointer;
  user-select: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* .customBtn + .customBtn {
  margin-left: 14px;
} */
.customBtn>img {
  margin-right: 8px;
}

.customBtn>img:last-child {
  margin-right: unset;
}

/* .customBtn.text > img {
  margin-right: 2px;
} */
/** 主色 */
.customBtn.primary {
  background: var(--theme_blue);
  color: #ffffff;
}

/** 主色 */
.customBtn.danger {
  background: var(--danger_color);
  color: #ffffff;
}

.customBtn.primary:hover {
  background: var(--theme_dark_blue);
}

.customBtn.danger:not(.disabled):hover {
  opacity: 0.8;
}

/** 主色-空心 */
.customBtn.primary.plain {
  border: 1px solid var(--theme_blue);
  background: unset;
  color: var(--theme_blue);
}

.customBtn.primary.plain:hover {
  background: var(--theme_light_blue);
}

/** 主色-空心 */
.customBtn.danger.plain {
  border: 1px solid var(--danger_color);
  background: unset;
  color: var(--danger_color);
}

.customBtn.danger.plain:hover {
  background: #fef0f0;
}

/** 主色-文本 */
.customBtn.primary.text {
  color: var(--theme_blue);
  border: unset;
  background: unset;
  padding: unset;
}

.customBtn.danger.text {
  color: var(--danger_color);
  border: unset;
  background: unset;
  padding: unset;
}

.customBtn.primary.text.disabled {
  color: var(--disabled_text);
  cursor: no-drop;
}

/** 小按钮 */
.customBtn.small {
  height: 32px;
  padding: 0px 10px;
}

.customBtn.disabled,
.customBtn:disabled {
  cursor: no-drop;
  background-color: #ccc;
}

.customBtn.disabled:hover,
.customBtn:disabled:hover {
  background-color: #ccc;
}

/** 链接 */
.customLink {
  font-size: 14px;
  /* line-height: 19px; */
  display: flex;
  align-items: center;
  cursor: pointer;
}

/* .customLink + .customLink {
  margin-left: 10px;
} */
.customLink:hover {
  text-decoration: underline;
}

.customLink>img {
  margin-right: 2px;
}

.customLink>span {
  flex: 1;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/** 主色 */
.customLink.primary {
  color: var(--theme_blue);
}

/** 主色 */
.customLink.danger {
  color: var(--danger_color);
}

.customLink.text {
  text-decoration: unset;
  cursor: unset;
}

.customLink.disabled {
  cursor: no-drop !important;
  color: var(--disabled_text) !important;
}

.customLink.disabled:hover {
  text-decoration: none !important;
}

/** 自定义表格 */
.customTable {
  width: 100%;
  font-size: 14px;
  color: #555555;
  line-height: 19px;
}

.customTable td,
.customTable th {
  padding: 9px 5px;
  overflow-wrap: anywhere;
}

.customTable thead th {
  padding: 5px 5px;
}

.customTable td:first-child,
.customTable th:first-child {
  padding-left: 20px;
}

.customTable td:last-child,
.customTable th:last-child {
  padding-right: 20px;
}

.customTable thead th {
  font-size: 12px;
  color: #708e96;
  line-height: 16px;
}

.customTable tbody tr:hover {
  background: #f2f2f2 !important;
}

.customTable[stripe] tbody tr:nth-child(odd),
.customTable.stripe tbody tr:nth-child(odd) {
  background: #f5f8fa;
}

/** 面包屑 */
.customBreadcrumb {
  background: #ffffff;
  border-radius: 9px;
  height: 52px;
  padding: 0 10px;
  display: flex;
  align-items: center;
  font-size: 14px;
  color: #4e6687;
  line-height: 19px;
  margin-bottom: 10px;
}

.customBreadcrumb .backButton {
  margin-right: 10px;
}

.customBreadcrumb .backButton img {
  margin-right: 5px;
}

.customBreadcrumb>div:not([class*="backButton"]) {
  padding: 0 10px;
}

.customBreadcrumb>div[ui-sref] {
  color: #426df9;
  cursor: pointer;
  font-weight: bold;
}

/** tab标签 */
.customTab {
  height: 60px;
  display: flex;
  align-items: center;
  overflow-x: auto;
  position: relative;
  user-select: none;
  padding: 0 20px;
}

.customTab:not(:hover)::-webkit-scrollbar {
  width: 0px;
  height: 0px;
}

.customTab>div {
  font-weight: bold;
  font-size: 16px;
  color: #a9b2cb;
  line-height: 21px;
  margin: 0 10px;
  cursor: pointer;
  min-width: max-content;
}

.customTab>div.active {
  color: #446ef9;
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: unset;
}

.customTab>div.active::after {
  content: "";
  display: block;
  width: 35px;
  height: 4px;
  background-color: #446ef9;
  border-radius: 4px;
  position: absolute;
  bottom: 0;
}

.customTab>div:first-child {
  margin-left: 0;
}

.customTab>div:last-child {
  margin-right: 0;
}

/** 自定义选框 */
.customCheck {
  font-size: 14px;
  line-height: 15px;
  color: #777777;
  display: flex;
  align-items: center;
  position: relative;
  cursor: pointer;
  user-select: none;
}

.customCheck::before {
  content: "";
  width: 18px;
  min-width: 18px;
  height: 18px;
  /* background: #f3f3f3; */
  border: 1px solid #d3d3d3;
  border-radius: 50%;
}

.customCheck.check {
  color: #5790ff;
}

.customCheck.check::before {
  background: #5790ff;
}

.customCheck>span {
  margin-left: 5px;
}

.customCheck.check::after {
  content: "";
  width: 8px;
  height: 8px;
  background: #ffffff;
  border-radius: 50%;
  position: absolute;
  left: 6px;
}

.customCheck.disabled {
  cursor: no-drop;
}

.customCheck.disabled::before {
  background: #f3f3f3;
}

.customCheck.disabled.check::before {
  background: #a8abb2;
}

/** 分页 */
.customPage {
  display: flex;
  align-items: center;
  justify-content: center;
}

.customPage .layui-laypage {
  margin: unset;
  display: flex;
  align-items: center;
  justify-content: center;
}

.customPage .layui-laypage a,
.customPage .layui-laypage span:not(.layui-laypage-curr) {
  background-color: unset;
}

/** 总计 */
.customPage .layui-laypage-count {
  margin: 0 7px;
  color: #777777;
}

/** 分页 */
.customPage .layui-laypage-limits {
  margin: 0 7px;
}

.customPage .layui-laypage-limits select {
  color: #777777;
  width: 103px;
  height: 28px;
  background: #ffffff;
  border-radius: 6px;
  border: 1px solid #979797;
  box-sizing: border-box;
  text-align: center;
  padding: unset;
}

.customPage .layui-laypage-limits select:focus {
  border-color: var(--theme_blue) !important;
}

/** 页码 */
.customPage a[data-page],
.customPage .layui-laypage-curr,
.customPage .layui-laypage-spr {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 30px;
  height: 30px;
  border-radius: 6px;
  box-sizing: border-box;
  border: unset;
  margin: unset;
  padding: 0 6px;
  color: #777777;
  user-select: none;
}

.customPage a[data-page]:hover {
  background-color: #eef1f5;
}

/** 上一页 */
.customPage a.layui-laypage-prev {
  font-size: 0 !important;
  margin-left: 7px;
}

.customPage a.layui-laypage-prev::before {
  content: "";
  display: block;
  width: 7px;
  height: 7px;
  border: 2px solid #c6c6c6;
  border-bottom: unset;
  border-right: unset;
  transform: rotate(-45deg) skew(-10deg, -10deg);
}

/** 当前页 */
.customPage .layui-laypage-curr {
  background-color: #416df9;
}

.customPage .layui-laypage-curr .layui-laypage-em {
  display: none;
}

/** 下一页 */
.customPage a.layui-laypage-next {
  font-size: 0 !important;
  margin-right: 7px;
}

.customPage a.layui-laypage-next::before {
  content: "";
  display: block;
  width: 7px;
  height: 7px;
  border: 2px solid #c6c6c6;
  border-top: unset;
  border-left: unset;
  transform: rotate(-45deg) skew(-10deg, -10deg);
}

/** 跳转 */
.customPage .layui-laypage-skip {
  margin: 0 7px;
  color: #777777;
  display: flex;
  align-items: center;
}

.customPage .layui-laypage-skip .layui-input {
  width: 56px;
  height: 28px;
  background: #ffffff;
  border-radius: 6px;
  border: 1px solid #979797;
}

.customPage .layui-laypage-skip .layui-input:focus {
  border-color: var(--theme_blue) !important;
}

.customPage .layui-laypage-skip .layui-laypage-btn {
  display: none;
}

/** 自定义弹窗 */
.customModal.in {
  top: 0 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
}

.customModal .p-dialog {
  max-height: unset;
}

.customModal .p-dialog .p-dialog-header {
  position: absolute;
  z-index: 999;
  opacity: 0;
  padding: unset;
  width: 100%;
  height: 32px;
}

.customModal .p-dialog .p-dialog-content {
  background: transparent;
  overflow: hidden;
  padding: 0px;
  border: 0px;
}

.customModal .modalContent {
  max-width: 95vw;
  max-height: 95vh;
  background-color: #fff;
  padding: 32px 0 24px;
  box-shadow: 0px 5px 13px 0px rgba(184, 184, 184, 0.5);
  border-radius: 12px;
  border: 1px solid #cfcfcf;
  overflow: hidden;
  position: relative;
  display: flex;
  flex-direction: column;
}

.customModal .modalCloseIcon {
  position: absolute;
  top: 33px;
  right: 33px;
  cursor: pointer;
  z-index: 9;
}

.customModal .modalHead {
  font-weight: bold;
  font-size: 16px;
  color: #383a3b;
  line-height: 21px;
  padding-left: 34px;
  padding-right: 60px;
  padding-bottom: 30px;
}

.customModal .modalCenter {
  padding: 0 34px;
  overflow: auto;
}

.customModal .modalFoot {
  padding-top: 30px;
  display: flex;
  justify-content: center;
  align-items: center;
}

/** 自定义表单 */
.customFormCell {
  display: flex;
  align-items: center;
}

.customFormCell+.customFormCell {
  margin-top: 24px;
}

.customFormCell .formLabel {
  width: 100px;
  min-width: 100px;
  margin-right: 38px;
  text-align: right;
  position: relative;
  font-size: 14px;
  color: #666666;
  line-height: 19px;
}

.customFormCell .formLabel.top {
  align-self: flex-start;
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.customFormCell.require .formLabel::after {
  content: "*";
  color: #ff5d44;
  margin-left: 4px;
  position: absolute;
  right: -10px;
}

.customFormCell .formValue {
  flex: 1;
  min-height: 40px;
}

/** 输入框组 */
.customInputGroup .customSelect:not(:last-child),
.customInputGroup .customInput:not(:last-child) {
  border-top-right-radius: unset;
  border-bottom-right-radius: unset;
  border-right: unset;
}

.customInputGroup .customSelect:not(:first-child),
.customInputGroup .customInput:not(:first-child),
.customInputGroup .customBtn:not(:first-child) {
  border-top-left-radius: unset;
  border-bottom-left-radius: unset;
}

/** 开关 */
.customSwitch {
  --switch-padding: 2px;
  --btnSize: 14px;
  --animation: all 0.3s;
  display: inline-flex;
  align-items: center;
  padding: var(--switch-padding);
  background-color: var(--info_color_light_3);
  color: #fff;
  border-radius: calc(var(--btnSize) + var(--switch-padding) * 2);
  cursor: pointer;
  user-select: none;
  font-family: Helvetica;
  line-height: var(--btnSize);
  transition: var(--animation);
  position: relative;
  padding-left: calc(var(--btnSize) + var(--switch-padding));
  -webkit-tap-highlight-color: transparent;
}

/** 开关-按钮 */
.customSwitch::before {
  content: "";
  width: var(--btnSize);
  height: var(--btnSize);
  background-color: #fff;
  border-radius: 50%;
  position: absolute;
  left: var(--switch-padding);
  transition: var(--animation);
}

/** 开关-文本 */
.customSwitch::after {
  content: attr(data-inactive);
  padding: 0 5px;
}

/** 开关-激活 */
.customSwitch.active {
  background-color: var(--primary_color);
  padding-left: var(--switch-padding);
  padding-right: calc(var(--btnSize) + var(--switch-padding));
}

/** 开关-激活-按钮 */
.customSwitch.active::before {
  left: calc(100% - var(--btnSize) - var(--switch-padding));
}

/** 开关-激活-文本 */
.customSwitch.active::after {
  content: attr(data-active);
}

.customSwitch.disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.customUpload {
  background: #E3E9FB;
  border-radius: 6px;
  border: 1px solid #8DA9FA;
  display: flex;
  align-items: center;
  padding: 6px 12px;
  font-size: 14px;
  line-height: 15px;
  color: #426DF9;
  width: max-content;
  overflow: hidden;
}

.customUpload.img {
  width: 150px;
  height: 100px;
  border-style: dashed;
  padding: unset;
  flex-direction: column;
  justify-content: center;
}

.customUpload img {
  width: 16px;
  height: 16px;
  margin-right: 5px;
}

.customUpload.img img {
  width: 28px;
  height: 28px;
  margin-right: unset;
  margin-bottom: 10px;
}

.customUpload.img img:first-child:last-child {
  width: 100%;
  height: 100%;
  margin-bottom: unset;
}

.customUploadExplain {
  font-size: 12px;
  color: #798F95;
  line-height: 22px;
}