@import 'src/styles/variables.module';
@import 'src/styles/element-plus';
@import './sidebar.scss';
@import './tailwind.scss';

html,
body,
#app {
  height: 100%;
}

.modeltopbox {
  width: 100%;
  height: 17px;
}

// main-container global css
.app-container {
  padding: 20px;
}

.search {
  padding: 18px 0 0 10px;
  margin-bottom: 10px;
  border-radius: 5px;
  border: 1px solid #ddd;
  box-shadow: 6px 2px 6px #CCC;
}

svg {
  display: inline-block;
}

.el-dialog {
  display: flex !important;
  flex-direction: column !important;
  margin: auto !important;
  position: absolute !important;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  height: max-content;
}

.el-dialog__body {
  padding: 20px !important;
}

.el-dialog__header {
  background: rgb(248, 248, 248);
  margin-right: 0px !important;
}

.dialogplantop .el-dialog__body {
  padding-top: 0 !important;
}

.dialogpadding .el-dialog__body {
  padding-top: 0 !important;
  padding-left: 0 !important;
  padding-bottom: 0 !important;
}

.buttonstyleheight .el-button {
  height: 38px;
}

.monitor-dialog .el-dialog__header {
  padding-top: 10px;
  // background: rgb(17, 61, 49);
  // background: #000000;
  // color: #ffffff;
  // border-bottom: 2px solid rgb(17, 61, 49);

}

.monitor-dialog .el-dialog__body {
  // background: rgb(17, 61, 49);
  // background: #000000;
  // padding: 0 !important;
  padding: 10px !important;
  padding-top: 0px;
  // color: #ffffff;

}

.monitor-dialog .el-dialog__headerbtn {
  top: -1px;
}

.monitor-dialog .el-dialog__close svg {
  color: #209F84;
}

.Camera-number-input .el-input__wrapper {
  padding-right: 0
}

.monitor-dialog .el-switch__core {
  min-width: 67px;
  height: 30px;
}

.monitor-dialog .el-switch__core .el-switch__inner {
  height: 27px;
  padding: 0 4px 0 calc(16px + 7px);
}

.monitor-dialog .el-switch__core .el-switch__action {
  width: 22px;
  height: 22px;
}

.monitor-dialog .el-switch.is-checked .el-switch__core .el-switch__action {
  left: calc(100% - 26px);
}

.stationboard-left2 .el-progress__text {
  display: none;
}

.stationboard-left2 .el-progress-bar__outer {
  background-color: rgba(255, 255, 255, 0.2);
  border-radius: 0;
}

.stationboard-left2 .el-progress-bar__inner {
  background-color: #0099ff;
  border-radius: 0;
}

.beforehandPosition-input .el-input__wrapper {
  background: transparent;
  box-shadow: 0 0 0 1px rgba(50, 177, 245, 0.4) inset;
}

.beforehandPosition-input .el-input__inner {
  color: #ffffff;
}

.beforehandPosition-input .el-input-number__decrease {
  background: transparent;
  border-left: 1px solid rgba(50, 177, 245, 0.4);

}

.beforehandPosition-input .el-input-number__increase {
  width: 25px !important;
  border-bottom: 1px solid rgba(50, 177, 245, 0.4) !important;
  border-left: 1px solid rgba(50, 177, 245, 0.4);
  background: transparent;
  color: rgba(50, 177, 245, 0.4);
}

.beforehandPosition-input .el-input-number__increase:hover {
  color: rgba(50, 177, 245, 0.4);
}

.beforehandPosition-input .el-input-number__decrease {
  width: 25px !important;
  color: rgba(50, 177, 245, 0.4);
  border-left: 1px solid rgba(50, 177, 245, 0.4) !important;
}

.beforehandPosition-input .el-input__wrapper:hover {
  box-shadow: 0 0 0 1px rgba(50, 177, 245, 0.4) inset !important;
}

.beforehandPosition-input.el-input-number--large {
  line-height: 35px;
  height: 35px;
}

// //鼠标移入表格，边框变化
.PatrolMonitoring .el-table__row td {
  border: 1px solid transparent !important;
  border-right: 0px solid transparent !important;
  border-left: 0px solid transparent !important;
}

.PatrolMonitoring .el-table__row:hover td {
  border: 1px solid #009BFF !important;
  border-right: 0px solid transparent !important;
  border-left: 0px solid transparent !important;
}

.PatrolMonitoring .el-table__row:hover td {
  border-right: 1px solid #009BFF;
}

.PatrolMonitoring .el-table__row:hover td:first-child {
  border-left: 1px solid #009BFF !important;
}

.PatrolMonitoring .el-table__row:hover td:last-child {
  border-right: 1px solid #009BFF !important;
}

.PatrolMonitoring .el-table__row:hover :last-child td {
  border-bottom: 1px solid #009BFF !important;
}

.PatrolMonitoring .warning-row {
  background-color: rgb(255 255 255 / 0%) !important;
}

.PatrolMonitoring .success-row {
  background-color: rgba(255, 255, 255, 0.05) !important;
}

.el-image-viewer__wrapper {
  z-index: 9999 !important;
}

 .el-date-table td.today .el-date-table-cell__text {
  color: #fff !important;
}

// 时间控件颜色
 .el-date-table td.start-date .el-date-table-cell__text,
 .el-date-table td.end-date .el-date-table-cell__text {
  background: #46a2f3;
}

 .el-date-range-picker .el-picker-panel__body {
  background: #17212e !important;
}

 .el-popper.is-light .el-popper__arrow::before {
  background: #17212e !important;
}

 .el-date-table td.in-range .el-date-table-cell {
  background: #46a2f367 !important;
  color: #ffffff !important;
}

.el-date-range-picker__content.is-left {
  border-right: 1px solid !important;
  border-image: linear-gradient(180deg, rgba(255, 255, 255, 0) 15%, #46a2f3 40%, rgba(255, 255, 255, 0) 90%) 2 2 2 2;
}


 .el-date-table .available.in-range .el-date-table-cell:hover {
  color: #ffffff !important;
  background: #46a2f3 !important;
}

 .el-date-table td .available:hover {
  background: #46a2f3;
}

 .el-date-table td .available.in-range .el-date-table-cell .el-date-table-cell__text:hover {
  color: #46a2f367;
}

 .el-date-range-picker__header {
  color: #ffffff;
}
 .el-date-table th {
  color: #ffffff;
}
 .el-picker-panel__icon-btn {
  color: #ffffff;
}
// 单选时间控件颜色
.el-popper.is-light {
  background: #17212e !important;
  box-shadow: #46a2f3 0px 0px 5px !important;
  border: 1px solid #46a2f3;
  // inset: 132px auto auto 254px !important;
}
 .el-input__wrapper {
  background-color: #00f9a200 !important;
  box-shadow: 0 0 0 1px #00f9a233 inset;
}

 .el-date-picker__time-header {
  border-bottom: 1px solid #0f4176 !important;
}

 .el-date-range-picker__time-header {
  border-bottom: 1px solid #ffffff4f;
}
 .el-picker-panel__footer {
  border-top: 1px solid #ffffff4f;
  background-color: #17212e;
}
 .el-picker-panel__body-wrapper {
  background: #17212e !important;
  // box-shadow: rgba(0, 249, 162, 0.298) 0px 0px 5px !important;
}
.el-button.is-plain{
  // --el-button-hover-text-color:;
  --el-button-hover-bg-color:#46a2f31e !important;
  // --el-button-hover-border-color:;
}
.el-button{
  --el-button-bg-color:#ffffff00 !important;
  --el-button-border-color:#009bff !important;
  --el-button-text-color:#009bff !important;
}
.el-button.is-text:not(.is-disabled):hover{
  background-color: #ffffff00 !important;
}
.el-year-table td .cell {
  color: #ffffff;
}
.el-time-panel__btn{
  color: #409eff !important;
}
.el-time-panel__footer{
  border-top: 1px solid #225b7e !important;
  background-color: #17212e !important;
}
.el-time-spinner__item:hover:not(.is-disabled):not(.is-active){
  background-color: #ffffff3f !important;
}
.el-time-spinner__item{
  color: #fff !important;
}
.el-time-spinner__item.is-active:not(.is-disabled){
color: #007efc !important;
}
.el-picker-panel .el-time-panel{
  background-color: #17212e !important;
  border: 1px solid #225b7e !important;
}
 .el-picker-panel__icon-btn .el-icon {
  color: #46a2f3;
}

 .el-date-table th {
  border-bottom: solid 1px #ffffff00 !important;
}

 .el-date-picker__header--bordered {
  border-bottom: solid 1px #ffffff00 !important;
}

 .el-year-table td .cell:hover {
  color: #46a2f3;
}

.el-month-table td .cell {
  color: #ffffff;
}

 .el-month-table td .cell:hover {
  color: #46a2f3;
}

 .el-month-table td.current:not(.disabled) .cell {
  color: #46a2f3;
}

 .el-date-table td.prev-month {
  color: #46a2f380 !important;
}

 .el-date-table td.next-month {
  color: #46a2f380 !important;
}

 .el-popper__arrow {
  display: none;
}

.el-date-table td {
  color: #46a2f3 !important;
}

 .el-date-table td.current:not(.disabled) .el-date-table-cell__text {
  background: #46a2f3;
}

 .el-date-picker__header-label {
  color: #ffffff;
}

 .el-date-picker__header-label:hover {
  color: #46a2f3;
}
.el-picker-panel__footer{
  background-color: #17212e !important;
  border-top:1px solid #007efc59 !important ;
}
//后台时间控件
.el-range-editor.is-active:hover {
  box-shadow: 0 0 0 1px #3693cb inset !important;
}

.el-range-editor.is-active {
  box-shadow: 0 0 0 1px #3693cb inset !important;
}

.el-date-table td.current:not(.disabled) .el-date-table-cell__text {
  color: #fff !important;
}

.el-date-table td.today.end-date .el-date-table-cell__text {
  color: #fff !important;
}

.el-date-table td.today.start-date .el-date-table-cell__text {
  color: #fff !important;
}


.selType {
  // width: 240px;
  // margin-right: 10px;
  // background-color: transparent !important;
  // color: #fff;
  // border-radius: 3px;


  input {
    color: #fff !important;
  }

  .el-select__caret {
    color: #697f9a !important;
  }

  .el-popper__arrow {
    display: none !important;
  }

  .el-select-dropdown__item {
    color: #ffffff !important;
  }

  .el-select-dropdown__item.hover,
  .el-select-dropdown__item:hover {
    color: #009BFF !important;
    background: linear-gradient(to right, rgba(0, 155, 255, .2), transparent) !important;
    // background: url('@/assets/3d/an_d2.png') no-repeat !important;
    background-size: 100% 100% !important;
  }

  .el-select-dropdown__item.selected {
    color: #009BFF !important;
    background: linear-gradient(to right, rgba(0, 155, 255, .2), transparent) !important;
    background-size: 100% 100% !important;
  }

  .el-popper.is-light {
    background-color: #16202e !important;
    box-shadow: rgb(51, 82, 124) 0px 0px 5px !important;
    border: 1px solid #225b7e;
    inset: 40px auto auto 0px !important;
  }

}

// .selType1 {
// width: 240px;
// margin-right: 10px;
// background-color: transparent !important;
// color: #fff;
// border-radius: 3px;


input {
  color: #fff !important;
}

.el-select__caret {
  color: #697f9a !important;
}

.el-popper__arrow {
  display: none !important;
}

.el-select-dropdown__item {
  color: #ffffff !important;
}

// .el-select-dropdown__item.hover,
// .el-select-dropdown__item:hover {
//   color: #009BFF !important;
//   background: linear-gradient(to right, rgba(0, 155, 255, .2), transparent) !important;
//   // background: url('@/assets/3d/an_d2.png') no-repeat !important;
//   background-size: 100% 100% !important;
// }
.el-select-dropdown__item.hover,
.el-select-dropdown__item:hover {
  color: #009BFF !important;
  background: linear-gradient(to right, rgba(0, 155, 255, .2), transparent) !important;
  // background: url('@/assets/3d/an_d2.png') no-repeat !important;
  background-size: 100% 100% !important;
}

.el-select-dropdown__item.selected {
  color: #009BFF !important;
  background: linear-gradient(to right, rgba(0, 155, 255, .2), transparent) !important;
  background-size: 100% 100% !important;
}

.el-popper.is-light {
  background-color: #16202e !important;
  box-shadow: rgb(51, 82, 124) 0px 0px 5px !important;
  border: 1px solid #225b7e !important;
  // inset: 40px auto auto 0px !important;
}

// }

.fontFamily {
  font-family: "阿里妈妈数黑体 Bold", "阿里妈妈数黑体";
}

// .PatrolMonitoring .el-table__empty-block {
//   background-color: rgb(59 153 125 / 0%) !important;
// }

.el-loading-spinner .path {
  stroke: #009BFF !important;
}

.el-loading-text {
  color: #009BFF !important;
}

.docx-wrapper {
  padding: 10px !important;
}

.docx-wrapper .docx {
  width: 100% !important;
  padding: 10pt 10pt !important;
}

.tab .el-radio-group {
  display: none;
}

.checkbox-group.el-popper {
  background: #131a25 !important;
  border-color: #409eff94 !important;
}

.checkbox-group .el-popper__arrow::before {
  background: #131a25 !important;
  border-color: #409eff94 !important;
}

.checkbox-group .el-checkbox__label {
  color: #ffffff !important;
}

.checkbox-group .el-checkbox {
  margin-right: 30px;
  margin-left: 15px;
}


// 修改公共样式 20231219
.el-table {
  --el-table-row-hover-bg-color: transparent !important;
  --el-table-border-color: transparent !important;
  background-color: transparent !important;
}

.el-input__wrapper {
  background-color: rgba(19, 26, 37, 0) !important;
  box-shadow: 0 0 0 1px #225b7e inset !important;
}

.el-input__wrapper:hover {
  box-shadow: 0 0 0 1px #009bff inset !important;
}

.el-range-editor.is-disabled input {
  background-color: transparent !important;
}

#app .el-table:not(.el-table--border) .el-table__cell {
  border: none;
}




.el-select:hover:not(.el-select--disabled) .el-input__wrapper {
  box-shadow: 0 0 0 1px #009bff inset;
}

.el-select {
  --el-select-input-focus-border-color: #009bff !important;
}

.el-form-item__label {
  color: #B5D7FF !important;
}



.el-range-separator {
  color: #fff !important;
}

.el-tree {
  background-color: #ffffff00 !important;
  --el-tree-node-hover-bg-color: rgba(0, 153, 255, 0.1);
}

.el-tree-node.is-current>.el-tree-node__content {
  background: none !important;
  background-image: url(@/assets/images/u324.png) !important;
  background-size: 100% 100%;
  color: #009bff !important;
  background-repeat: no-repeat !important;
  height: 40px;
}

.el-loading-mask {
  background-color: #00205ad8 !important;
}

.el-scrollbar__wrap {
  // background: #17212e;
  background: transparent;
}

.el-table:not(.el-table--border) .el-table__cell {
  border: none;
}

.el-tree-node__content {
  background: transparent !important;
  color: #fff;
  width: 100% !important;
  height: 40px !important;
  margin: auto !important;
}

.el-tree-node__content:hover {
  // background: none !important;
  background-image: url(@/assets/images/u324.png) no-repeat !important;
  background-size: 100% 100%;
  color: #009BFF;
}

.el-tree-node__content:hover {
  color: #009BFF;
}


.el-table tr {
  background: #1b2838 !important;
  color: #fff !important;
}

.el-table .el-table__row.el-table__row--striped {
  background: #17212e !important;
  color: #fff !important;
}

.el-table--striped .el-table__body tr.el-table__row--striped td.el-table__cell {
  background: transparent !important;
}

// 公用标题样式
.publicline {
  width: 5px;
  height: 14px;
  background: #009BFF;
}

.publictitle {
  padding-left: 10px;
  font-family: 'Arial Negreta', 'Arial Normal', 'Arial';
  font-weight: 700;
  font-style: normal;
  font-size: 16px;
  color: #B5D7FF;
  text-decoration: none !important;
}


.el-table .sort-caret.ascending {
  border-bottom-color: rgb(181, 215, 255);
}

.el-table .sort-caret.descending {
  border-top-color: rgb(181, 215, 255);
}

.el-table .descending .sort-caret.descending {
  border-top-color: rgb(181, 215, 255) !important;
}

.el-table .ascending .sort-caret.ascending {
  border-bottom-color: rgb(181, 215, 255) !important;
}

.el-transfer-panel .el-transfer-panel__header {
  background: #253b51 !important;
  border: #253b51 !important;
}

.el-transfer-panel__body {
  background: #17212e !important;
  border: none !important;
}

.el-transfer-panel {
  background: #17212e !important;
  border: 1px solid #ffffff1c !important;
  border-radius: 5px;
}

.el-radio__inner {
  background-color: #ffffff00 !important;
}

.el-radio__inner {
  border: 1px solid #009BFF !important;
}

.details-button {
  width: 112px;
  height: 36px;
  line-height: 36px;
  font-family: 'Arial Normal', 'Arial';
  font-weight: 400;
  font-style: normal;
  font-size: 14px;
  color: #009BFF;
  text-align: center;
  background: url(@/assets/publicimg/xsri_an.png);
  background-size: 100% 100%;
  cursor: pointer;
  margin: 0 15px;
}

.details-button:hover {
  background: url(@/assets/publicimg/xsri_an1.png);
  background-size: 100% 100%;
}
.button-style {
  border: #409eff solid 1px;
  background-color: rgb(18, 28, 37);
  color: #409eff;
  border-radius: 5px;
  padding: 0px 5px;
  font-size: 14px;
  cursor: pointer;
  margin-left: 5px;
}
.button-style:hover{
  background-color: rgb(44 44 44);
}

.searchButton {
 
  background-color: #0099ff !important;
  color: #ffffff !important;
  // margin-top: 15px;
  // margin-left: 10px;
}
.is-disabled.searchButton{
  // background-color: rgb(21, 22, 22) !important;
  color: #5584b3 !important;
}

.searchButton .el-icon{
  color: #007efc !important;
}
.is-disabled.searchButton .el-icon{
  color: #5584b3 !important;
}
.el-input-number.is-controls-right .el-input-number__decrease{
  background: #ffffff00;
  border-left:1px solid #225b7e !important;
}
.el-input-number.is-controls-right .el-input-number__increase{
  background: #ffffff00;
  border-left:1px solid #225b7e !important;
  border-bottom:1px solid #225b7e !important;
}
.el-select__tags .el-tag--info{
 background-color: #007efc38 !important;
}
.el-tag.el-tag--info{
  --el-tag-text-color:#409eff !important;
  border-radius: 1px !important;
}
.el-radio{
  --el-radio-text-color:#fff !important;
}

.el-tabs .el-tabs__nav-wrap::after{
  background-color:rgba(0, 155, 255,0.3);
}
.el-tabs .el-tabs__active-bar{
  background-color:#009BFF;
}
.cell{
  padding: 0 5px !important;
}
.el-input-number__decrease .el-icon{
   padding-top: 4px;
}
.el-checkbox__inner{
  border: 1px solid #495c73 !important;
}
.is-checked{
  .el-checkbox__input.is-checked .el-checkbox__inner::after{
    border-color: #009BFF !important;
  }
}

.el-checkbox__input.is-checked .el-checkbox__inner{
  border: 1px solid #009bff !important;
  background-color: rgba(0, 155, 255, 0.2) !important;
}
.el-switch{
  --el-switch-off-color:#40a0ff50 !important;
}
.el-button:hover{
  background-color: #0099ff !important;
  color: #fff !important;
  border: 1px solid #0099ff !important;

}
.el-button.is-disabled{
  background-color: #ffffff0c !important;
  color: #0099ff86 !important;
  border: 1px solid #0099ff86 !important;
}
.button_one:hover{
  
      border: 1px solid #ffffff00 !important;
  
}
//左侧树统一样式
.el-tree-node.is-current > .el-tree-node__content {
  background: none !important;
  background-image: url(@/assets/sytlechange/treeBack.svg) !important;
  background-size: 100% 100%;
  color: #00ffff !important;
  background-repeat: no-repeat !important;
}
.el-tree-node__content:hover{
  color:#00ffff;
}
//
.silderRight {
  height: calc(90vh) !important;
  background: url(@/assets/navigation/ty_1614x988.png) !important;
  background-size: 100% 100% !important;
  background-color: #00205a !important;
}