:root {
    /* 填充 */
    --primary-hover: #3B8AFF; /* hover*/
    --primary—routine: #004BFF; /*hover 主色-常规*/ 
    --primary-disable: #A0CFFF; /*禁用*/

    --border-color: #DDDFE6; /* 边框 */
    --splitLine-color: #EBEEF5; /* 分割线 */


    /* 文字 */
    --font-title-color: #384454; /* 标题颜色 */
    --font-text-color: #606266; /* 正文颜色 */
    --font-auxiliary-color: #9FA0A3; /* 辅助文字 */
    --font-disable-color: #C0C4CC; /* 占位/禁用 */

    --color-primary: #0067FF; /*主色*/ 
    --color-primary—routine: #004BFF; /*主色-常规*/ 
    --color-white: #FFFFFF; /*白色*/
    --color-black: #000000; /*黑色*/
    --color-success: #67C23A; /*成功反馈*/
    --color-warning: #ee9d00; /*警示反馈*/
    --color-danger: #F56C6C; /*错误反馈*/
    --color-background: #eef2fb; /*背景色*/

    --font-auxiliary-P700-color: #898A8E; /* 中性色/P700-辅助 */
    --font-auxiliary-P600-color: #BBBCC0; /* 中性色/P600-禁用&默认文字 */
}
html {
  color: var(--font-text-color) !important;
}
.cloud5_page .el-header,
.Cloud5_container .el-header {
  padding: 0;
  background-color: #FFFFFF;
  height: 50px !important;
  display: flex;
  align-items: center;
  font-weight: 500;
  color: #1B2559;
}
.cloud5_page .el-button--text,
.Cloud5_container .el-button--text {
  color: #0067FF;
}
.cloud5_page .el-menu,
.Cloud5_container .el-menu {
  background-color: #EEF2FB !important;
  height: 100% !important;
}
.cloud5_page .el-menu-item.is-active,
.Cloud5_container .el-menu-item.is-active {
  color: #FFFFFF !important;
  background-color: #0067FF !important;
}
.cloud5_page .el-tabs__item,
.Cloud5_container .el-tabs__item {
  color: #A3AED0 !important;
}
.cloud5_page .el-tabs__item:hover,
.Cloud5_container .el-tabs__item:hover {
  color: #0067FF !important;
  cursor: pointer;
}
.cloud5_page .el-tabs__item.is-active,
.Cloud5_container .el-tabs__item.is-active {
  color: #0067FF !important;
}
.cloud5_page .el-dialog .el-dialog__header,
.Cloud5_dialog .el-dialog .el-dialog__header {
  background: var(--color-white) !important;
  box-shadow: none;
  border-bottom: 1px solid #DCE0E3;
  color: var(--font-title-color) !important;
  padding: 0 0 0 20px;
}
.cloud5_page .el-dialog .el-dialog__header .el-dialog__headerbtn .el-dialog__close,
.Cloud5_dialog .el-dialog .el-dialog__header .el-dialog__headerbtn .el-dialog__close {
  color: var(--font-title-color);
  font-size: 20px;
}
.cloud5_page .el-dialog .el-dialog__title,
.Cloud5_dialog .el-dialog .el-dialog__title {
  font-size: 18px !important;
  font-style: normal !important;
  font-weight: 600;
  color: var(--font-title-color) !important;
}
.cloud5_page .el-dialog .el-dialog__footer .poi-button--primary,
.Cloud5_dialog .el-dialog .el-dialog__footer .poi-button--primary {
  background-color: var(--color-primary) !important;
  color: var(--color-white);
}
.cloud5_page .el-dialog .el-dialog__footer .poi-button--success,
.Cloud5_dialog .el-dialog .el-dialog__footer .poi-button--success {
  background-color: var(--color-success);
  color: var(--color-white);
}
.cloud5_page .el-dialog .el-dialog__footer .poi-button--warning,
.Cloud5_dialog .el-dialog .el-dialog__footer .poi-button--warning {
  background-color: var(--color-warning);
  color: var(--color-white);
}
.cloud5_page .el-dialog .el-dialog__footer .poi-button--danger,
.Cloud5_dialog .el-dialog .el-dialog__footer .poi-button--danger {
  background-color: var(--color-danger);
  color: var(--color-white);
}
.cloud5_page .el-dialog .el-form-item,
.Cloud5_dialog .el-dialog .el-form-item {
  margin-bottom: 20px !important;
}
.cloud5_page .el-button--primary,
.Cloud5_dialog .el-button--primary {
  background-color: var(--color-primary) !important;
  color: var(--color-white);
}
.cloud5_page .el-dialog__footer,
.Cloud5_dialog .el-dialog__footer {
  padding: 10px 15px 10px 0px !important;
  text-align: right !important;
}
@media screen and (min-width: 1440px) {
  .dialog_L {
    width: 1000px !important;
  }
  .dialog_L .el-dialog__body {
    max-height: 490px !important;
  }
  .dialog_M {
    width: 800px !important;
  }
  .dialog_M .el-dialog__body {
    max-height: 370px !important;
  }
  .dialog_S {
    width: 600px !important;
  }
  .dialog_S .el-dialog__body {
    max-height: 250px !important;
  }
}
@media screen and (max-width: 1440px) {
  .dialog_L {
    width: 800px !important;
  }
  .dialog_L .el-dialog__body {
    max-height: 370px !important;
  }
  .dialog_M {
    width: 600px !important;
  }
  .dialog_M .el-dialog__body {
    max-height: 250px !important;
  }
  .dialog_S {
    width: 400px !important;
  }
  .dialog_S .el-dialog__body {
    max-height: 120px !important;
  }
}
.cloud5_page .el-table .el-input,
.Cloud5_table .el-table .el-input {
  width: 100%;
}
.cloud5_page .el-table .el-button--text,
.Cloud5_table .el-table .el-button--text {
  font-size: 14px !important;
  color: var(--color-primary) !important;
  font-weight: normal;
}
.cloud5_page .el-table .el-button--text:focus,
.Cloud5_table .el-table .el-button--text:focus,
.cloud5_page .el-table .el-button--text:hover,
.Cloud5_table .el-table .el-button--text:hover {
  color: #66b1ff;
  border-color: transparent;
  background-color: transparent;
}
.cloud5_page .el-table--border .el-table__cell,
.Cloud5_table .el-table--border .el-table__cell,
.cloud5_page .el-table__body-wrapper .el-table--border.is-scrolling-left ~ .el-table__fixed,
.Cloud5_table .el-table__body-wrapper .el-table--border.is-scrolling-left ~ .el-table__fixed {
  border-right: 1px solid #E1E2E6;
}
.cloud5_page .el-table td.el-table__cell,
.Cloud5_table .el-table td.el-table__cell,
.cloud5_page .el-table th.el-table__cell.is-leaf,
.Cloud5_table .el-table th.el-table__cell.is-leaf {
  border-bottom: 1px solid #E1E2E6 !important;
}
.cloud5_page .el-table::before,
.Cloud5_table .el-table::before {
  left: 0;
  bottom: 0;
  width: 0;
  height: 0;
}
.cloud5_page .el-table th,
.Cloud5_table .el-table th {
  background: #F7F8FA !important;
  color: #333;
  font-weight: 100;
}
.cloud5_page .el-table td,
.Cloud5_table .el-table td,
.cloud5_page .el-table th.is-leaf,
.Cloud5_table .el-table th.is-leaf {
  border-bottom: 1px solid #E1E2E6 !important;
  height: 46px;
}
.cloud5_page .el-table thead.is-group th,
.Cloud5_table .el-table thead.is-group th {
  height: 46px;
}
.cloud5_page .el-table--enable-row-transition .el-table__body td,
.Cloud5_table .el-table--enable-row-transition .el-table__body td {
  height: 52px;
}
.cloud5_page .el-table td,
.Cloud5_table .el-table td,
.cloud5_page .el-table th,
.Cloud5_table .el-table th {
  padding: 0;
}
.cloud5_page .el-table__header-wrapper,
.Cloud5_table .el-table__header-wrapper {
  padding: 0;
}
.cloud5_page .el-table--enable-row-hover .el-table__body tr:hover > td,
.Cloud5_table .el-table--enable-row-hover .el-table__body tr:hover > td {
  background: #EAEEF5;
}
.cloud5_page .el-table th > .cell,
.Cloud5_table .el-table th > .cell {
  font-style: normal !important;
  font-weight: 800 !important;
  font-size: 14px !important;
  line-height: 21px !important;
  color: #1B2559 !important;
}
.cloud5_page .el-pagination.is-background .el-pager li:not(.disabled).active,
.Cloud5_table .el-pagination.is-background .el-pager li:not(.disabled).active {
  background-color: var(--color-primary);
  color: #FFFFFF !important;
}
.cloud5_page .el-button--text.is-disabled,
.Cloud5_table .el-button--text.is-disabled,
.cloud5_page .el-button--text.is-disabled:focus,
.Cloud5_table .el-button--text.is-disabled:focus,
.cloud5_page .el-button--text.is-disabled:hover,
.Cloud5_table .el-button--text.is-disabled:hover {
  color: var(--primary-disable) !important;
}
.cloud5_page .el-table__empty-text,
.Cloud5_table .el-table__empty-text {
  display: block;
  line-height: 40px !important;
  margin-bottom: 30px;
}
.cloud5_page .el-table__empty-text::before,
.Cloud5_table .el-table__empty-text::before {
  display: block;
  content: '';
  width: 200px;
  height: 178px;
  margin: 0 auto;
  margin-bottom: -33px;
  overflow: hidden;
  background-image: url(//libs.poi-t.cn/seldom_gallery/images/empty-holder.svg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
}
/*
优化表格交互，页面滚动时表头需要吸附在页面顶部
配合 table-fixed.ts 使用
*/
.table-can-fixed .el-table.fixed .table-custom-header_empty-div .el-table__header-wrapper,
.table-can-fixed.fixed .table-custom-header_empty-div .el-table__header-wrapper {
  position: fixed;
  z-index: 2;
}
.table-can-fixed .el-table.fixed .el-table__fixed-right .el-table__header,
.table-can-fixed.fixed .el-table__fixed-right .el-table__header {
  position: absolute;
  right: 0;
}
.table-can-fixed .el-table.fixed .el-table__fixed .el-table__header,
.table-can-fixed.fixed .el-table__fixed .el-table__header {
  position: absolute;
  left: 0;
}
.cloud5_page.el-input,
.Cloud5_input.el-input,
.cloud5_page .el-input,
.Cloud5_input .el-input {
  width: 220px;
}
.cloud5_page .el-input__inner,
.Cloud5_input .el-input__inner {
  font-size: 14px;
}
.cloud5_page .el-input.is-disabled .el-input__inner,
.Cloud5_input .el-input.is-disabled .el-input__inner {
  color: #57585C;
}
.cloud5_page .el-input.is-disabled .el-input__inner::placeholder,
.Cloud5_input .el-input.is-disabled .el-input__inner::placeholder {
  color: #BBBCC0 !important;
}
.cloud5_page.inputSearch,
.Cloud5_input.inputSearch,
.cloud5_page .inputSearch,
.Cloud5_input .inputSearch {
  width: 300px;
}
.cloud5_page .el-textarea,
.Cloud5_input .el-textarea {
  width: 300px;
}
.cloud5_page .el-textarea .el-textarea__inner,
.Cloud5_input .el-textarea .el-textarea__inner {
  height: 80px;
}
.cloud5_page .el-input-number .el-input,
.Cloud5_input .el-input-number .el-input,
.cloud5_page .el-cascader .el-input,
.Cloud5_input .el-cascader .el-input,
.cloud5_page .el-select .el-input,
.Cloud5_input .el-select .el-input {
  width: 100%;
}
.cloud5_page .el-button:focus,
.Cloud5_button .el-button:focus,
.cloud5_page .el-button:hover,
.Cloud5_button .el-button:hover {
  color: var(--primary-hover);
  border-color: #c6e2ff;
  background-color: #ecf5ff;
}
.cloud5_page .el-button--primary,
.Cloud5_button .el-button--primary {
  color: #FFF;
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}
.cloud5_page .el-button--primary:focus,
.Cloud5_button .el-button--primary:focus,
.cloud5_page .el-button--primary:hover,
.Cloud5_button .el-button--primary:hover {
  background: var(--primary-hover);
  border-color: var(--primary-hover);
  color: #fff;
}
.cloud5_page .el-button--primary.is-disabled,
.Cloud5_button .el-button--primary.is-disabled,
.cloud5_page .el-button--primary.is-disabled:active,
.Cloud5_button .el-button--primary.is-disabled:active,
.cloud5_page .el-button--primary.is-disabled:focus,
.Cloud5_button .el-button--primary.is-disabled:focus,
.cloud5_page .el-button--primary.is-disabled:hover,
.Cloud5_button .el-button--primary.is-disabled:hover {
  color: #FFF;
  background-color: var(--primary-disable) !important;
  border-color: var(--primary-disable) !important;
  cursor: not-allowed;
  background-image: none;
}
.cloud5_page .el-button--text,
.Cloud5_button .el-button--text {
  font-size: 14px;
  color: #384454;
  background: 0 0;
  font-weight: normal;
}
.cloud5_page .el-button--text:focus,
.Cloud5_button .el-button--text:focus,
.cloud5_page .el-button--text:hover,
.Cloud5_button .el-button--text:hover {
  color: #66b1ff;
  border-color: transparent;
  background-color: transparent;
}
.cloud5_page .el-tabs--card > .el-tabs__header .el-tabs__nav,
.Cloud5_tabs .el-tabs--card > .el-tabs__header .el-tabs__nav {
  border: 1px solid #e4e7ed !important;
  background-color: #F7F7F7;
  border-bottom: none !important;
  border-radius: 4px 4px 0 0;
  box-sizing: border-box;
}
.cloud5_page .el-tabs--card > .el-tabs__header .el-tabs__item,
.Cloud5_tabs .el-tabs--card > .el-tabs__header .el-tabs__item {
  border-bottom: 1px solid var(--border-color);
  border-left: 1px solid #e4e7ed;
  transition: color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.cloud5_page .el-tabs__item:hover,
.Cloud5_tabs .el-tabs__item:hover {
  color: var(--font-text-color) !important;
  cursor: pointer;
}
.cloud5_page .el-tabs__item.is-active,
.Cloud5_tabs .el-tabs__item.is-active {
  color: var(--font-text-color) !important;
}
.cloud5_page .el-tabs--card > .el-tabs__header .el-tabs__item.is-active,
.Cloud5_tabs .el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
  border-bottom-color: var(--color-white) !important;
  background-color: var(--color-white);
}
/* 使用方法：
 <div class="page-container">
    <section class="filter-box">
      <div class="filter-item">
        <label>时间范围</label>
        <el-input />
      </div>
      <div class="filter-item last-child">
        <label>能源种类</label>
        <el-select v-model="energyType">
          <el-option v-for="(item,index) in energyTypes" :label="item.name" :value="item.name" :key="index"></el-option>
        </el-select>
      </div>
      <el-button @click="getdescribeEnergyFlow" type="primary" class="btn-submit">查询</el-button>
      <el-button @click="reset" class="btn-reset">重置</el-button>
    </section>

    </div>
  </div>
*/
.page-container {
  box-sizing: border-box;
  padding: 20px;
  background: #fff;
}
.filter-box {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.filter-box .btn-submit,
.filter-box .btn-reset {
  flex: none;
  min-width: 80px;
  margin: 0 0 20px 0;
  border-radius: 2px;
}
.filter-box .btn-reset {
  background: #F2F3F5;
  color: #1D2129;
  margin-left: 10px;
}
.filter-box .filter-item {
  flex: none;
  display: flex;
  align-items: center;
  margin: 0 30px 20px 0;
}
.filter-box .filter-item label,
.filter-box .filter-item .label {
  flex: none;
  font-size: 14px;
  font-weight: 400;
  color: #384454;
  margin-right: 10px;
}
.filter-box .el-select {
  width: 220px;
}
.Cloud5_time .el-input__inner::placeholder {
  color: var(--font-disable-color);
}
.cloud5_page .el-checkbox__inner,
.Cloud5_checkBox .el-checkbox__inner {
  border: 1px solid #999999;
}
.cloud5_page .el-checkbox__input.is-checked .el-checkbox__inner,
.Cloud5_checkBox .el-checkbox__input.is-checked .el-checkbox__inner,
.cloud5_page .el-checkbox__input.is-indeterminate .el-checkbox__inner,
.Cloud5_checkBox .el-checkbox__input.is-indeterminate .el-checkbox__inner {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}
.cloud5_page .el-checkbox__input.is-checked + .el-checkbox__label,
.Cloud5_checkBox .el-checkbox__input.is-checked + .el-checkbox__label {
  color: var(--font-text-color);
}
.cloud5_page .el-checkbox__input.is-disabled .el-checkbox__inner,
.Cloud5_checkBox .el-checkbox__input.is-disabled .el-checkbox__inner {
  background-color: #F0F0F0;
  border-color: #999999;
}
.cloud5_page .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after,
.Cloud5_checkBox .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after {
  border-color: #808080;
}
.cloud5_page .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner,
.Cloud5_checkBox .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner {
  background-color: #E0E0E0;
  border-color: #999999;
}
.cloud5_page .el-radio__input.is-checked .el-radio__inner,
.Cloud5_radio .el-radio__input.is-checked .el-radio__inner {
  background-color: var(--color-primary);
  border-color: var(--color-primary);
}
.cloud5_page .el-radio__input.is-checked + .el-radio__label,
.Cloud5_radio .el-radio__input.is-checked + .el-radio__label {
  color: var(--font-text-color);
}
.cloud5_page .el-radio__input.is-disabled .el-radio__inner,
.Cloud5_radio .el-radio__input.is-disabled .el-radio__inner,
.cloud5_page .el-radio__input.is-disabled.is-checked .el-radio__inner,
.Cloud5_radio .el-radio__input.is-disabled.is-checked .el-radio__inner {
  background-color: #F4F7FA;
  border-color: #DCDFE6;
}
.cloud5_page .el-radio__input.is-disabled + span.el-radio__label,
.Cloud5_radio .el-radio__input.is-disabled + span.el-radio__label {
  color: var(--font-text-color);
}
.Cloud5_select .el-select {
  width: 220px;
}
.Cloud5_select /deep/ .el-select-dropdown__item.selected {
  color: var(--color-primary) !important;
}
.cloud5_page,
.cloud5_form {
  padding: 0;
  outline: none;
  border: none;
}
.cloud5_page .el-form .el-select,
.cloud5_form .el-form .el-select,
.cloud5_page .el-form .el-input,
.cloud5_form .el-form .el-input,
.cloud5_page .el-form .el-cascader,
.cloud5_form .el-form .el-cascader,
.cloud5_page .el-form .el-textarea,
.cloud5_form .el-form .el-textarea {
  width: 100%;
}
.cloud5_page .el-form.el-form--inline .el-select,
.cloud5_form .el-form.el-form--inline .el-select,
.cloud5_page .el-form.el-form--inline .el-input,
.cloud5_form .el-form.el-form--inline .el-input,
.cloud5_page .el-form.el-form--inline .el-cascader,
.cloud5_form .el-form.el-form--inline .el-cascader {
  width: 220px;
  margin-right: 20px;
}
.cloud5_page .el-form.el-form--inline .el-date-editor,
.cloud5_form .el-form.el-form--inline .el-date-editor {
  margin-right: 20px;
}
.cloud5_page .el-form.el-form--inline .el-form-item,
.cloud5_form .el-form.el-form--inline .el-form-item {
  margin-bottom: 20px;
}
.cloud5_page .el-form .el-select-dropdown__item.selected,
.cloud5_form .el-form .el-select-dropdown__item.selected,
.cloud5_page .el-form .el-select-dropdown__item.selected,
.cloud5_form .el-form .el-select-dropdown__item.selected {
  color: var(--color-primary) !important;
}
.el-select-dropdown .el-scrollbar__wrap::-webkit-scrollbar-track,
.el-cascader__dropdown .el-scrollbar__wrap::-webkit-scrollbar-track {
  background-color: #fff;
}
.table-empty.el-table--border {
  border-bottom: 1px solid #ebeef5 !important;
}
.table-empty .el-table__fixed-right:before {
  height: 0;
}
.table-empty .el-table__fixed:before {
  height: 0;
}
/* 滚动条设置 */
::-webkit-scrollbar {
  width: 14px;
  height: 14px;
}
/*
************************* 滚动条根据 background-clip 设置背景裁切位置 strat *************************
*/
::-webkit-scrollbar-thumb {
  border-radius: 10px;
  border-style: dashed;
  border-color: transparent;
  border-width: 3px;
  background-clip: padding-box;
  background-color: #BBBDC0;
}
::-webkit-scrollbar-thumb:hover {
  background-clip: border-box;
  background: #9FA0A3;
}
/*
************************* 滚动条根据 background-clip 设置背景裁切位置 end *************************
*/
/*
************************* 滚动条根据颜色渐变设置放大缩小效果 strat *************************
*/
/* 纵向滚动条 start */
/* 滑块 */
/* 纵向滚动条 end */
/* 滚动条滑块 */
/*
************************* 滚动条根据颜色渐变设置放大缩小效果 end *************************
*/
/* 横向滚动条 end */