#tipModal {
  // :deep(.el-dialog) {
  width: 680px !important;
  height: 328px !important;
  background: url('@/assets/images/rongYunImg/popwindow-bg.png') no-repeat !important;
  background-size: 100% 100% !important;
  padding: 20px !important;

  :deep(.el-dialog__title) {
    color: #ffffff !important;
  }
}

#ryAcceptModal {
  width: 980px !important;
  height: 628px !important;
  background: url('@/assets/images/rongYunImg/popwindow-bg.png') no-repeat !important;
  background-size: 100% 100% !important;
  padding: 20px !important;

  .el-dialog__header {
    border: none;

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

  .el-dialog__body {
    padding: 0;
    width: 100%;
    padding: 10px;
    height: calc(100% - 80px);
  }

  .el-dialog {
    width: 680px;
    height: 628px;
    background: url('@/assets/images/rongYunImg/popwindow-bg.png') no-repeat;
    background-size: 100% 100%;
    padding: 20px;
  }

  .titleRy {
    font-size: 24px;
    font-family: YouSheBiaoTi;
    font-weight: 400;
    color: #f9feff;
    height: 30px;
    line-height: 30px;
    background: linear-gradient(0deg, #9bd8ff 0%, #d4edff 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    padding-left: 20px;
    text-align: left;
    // width: 100%;
  }

  .rong-container-app {
    width: 100%;
    height: 500px;
    position: relative;

    .rong-video-box-app {
      width: 100%;
      height: 100%;
      display: flex;
      flex-wrap: wrap;
      overflow: auto;

      .video-item {
        box-sizing: border-box;
        width: 100%;
        height: calc(100% - 10px);
        position: relative;

        .video-user-id {
          position: absolute;
          top: 5px;
          padding: 0 5px;
          border-radius: 2px;
          z-index: 100;
          font-size: 14px;
          color: #58fdff;
          display: inline-block;
          width: 100%;
          text-align: center;
        }

        .video-media-type {
          position: absolute;
          top: 30px;
          left: 0;
          display: block;
          width: 100%;
          height: calc(100% - 30px);
          background: url('@/assets/images/rongYunImg/yuyin_bg.png') no-repeat;
          background-size: 100% 100%;
        }

        video {
          width: 100%;
          height: 100%;
        }
      }

      .first-child {
        position: absolute;
        right: 0;
        top: 0;
        width: 30%;
        height: 30%;
        z-index: 999;
      }

      .video-item-4 {
        width: 50%;
        height: calc(50% - 10px);
      }

      .video-item-8 {
        width: 25%;
        height: calc(50% - 10px);
      }
    }

    .rong-action-app {
      position: absolute;
      width: 100%;
      height: 50px;
      bottom: 10px;
      display: flex;
      justify-content: center;

      .hunupBtn {
        width: 40px;
        height: 40px;
      }
    }
  }

  :deep(.el-dialog__headerbtn) {
    background-color: red !important;
  }

  .el-icon-close {
    width: 16px;
    height: 16px;
    vertical-align: 2px;
    border-radius: 50%;
    text-align: center;
    transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    transform-origin: 100% 50%;

    &:before {
      transform: scale(0.6);
      display: inline-block;
      vertical-align: -3px;
    }

    &:hover {
      background-color: #b4bccc;
      color: #fff;
      width: 12px !important;
      height: 12px !important;
    }
  }
}

.responseDialog {
  .dialog-footer {
    position: absolute;
    right: 40px;
    bottom: 30px;
  }

  .tipsHeader {
    font-size: 18px;
    color: #fff;
  }
}

.voiceDilog {
  position: fixed;
  right: 10px;
  bottom: 10px;
  border-radius: 10px;
  width: 170px;
  height: 90px;
  background: #185d7fba;
  user-select: none;
  z-index: 9999999;
  padding: 5px;

  .voiceHeader {
    padding: 10px;
    color: #ffffff;
    display: flex;
    align-items: center;
    font-size: 12px;

    img {
      margin-right: 10px;
    }
  }

  .submit {
    position: absolute;
    left: 50%;
    width: 90px;
    margin-left: -35px;
    bottom: 20px;
    font-size: 12px;
  }

  .vioceIcon {
    width: 14px;
    height: 18px;
  }
}

.contactBoxRY {
  line-height: 22px;
  height: 590px;
  position: relative;
  top: calc(50% - 320px);

  // background: linear-gradient(0deg, rgba(0, 43, 67, 0.8) 0%, rgba(0, 82, 108, 0.8) 100%);
  background: linear-gradient(0deg, rgba(13, 42, 84, 0.8) 0%, rgba(13, 42, 84, 0.8) 100%);
  box-sizing: border-box;
  box-shadow: inset 0 0 0.02604rem 0.02604rem rgba(28, 138, 255, 0.5411764706);

  z-index: 3;

  .online {
    color: #00ff00;
  }

  .offline {
    color: red;
  }

  .el-dialog__header {
    text-align: left;
  }

  .tableBox {
    width: 100%;
    height: 100%;
    padding: 10px 20px;
  }

  .chooseBox {
    color: #d7e2ff;
    margin-bottom: 10px;
  }

  .el-dialog__title {
    color: #f9feff;
  }

  // tabs
  .el-tabs__item {
    color: #eee;
  }

  // 表格
  .tableRY {
    height: 340px;
    border: 1px solid #325bc1;
    border-radius: 2px;

    .el-table {
      width: 100%;
      height: 100%;
      --el-table-border-color: transparent;
      --el-table-bg-color: transparent !important;

      .el-table__header-wrapper {
        background-color: transparent !important;

        tr {
          background: transparent !important;
          border-color: transparent;
        }

        .el-table__cell {
          // background: linear-gradient(0deg, #00fbffa3 0%, #00fbff00 100%) !important;
          background: none;
          border-radius: 2px;

          font-family: Source Han Sans CN;
          font-weight: 400;
          font-size: 14px;
          color: #ffffff;
          line-height: 58px;
        }

        th {
          // background: linear-gradient(0deg, rgba(0, 251, 255, 0.6392156863) 0%, rgba(0, 251, 255, 0) 100%) !important;
          background: linear-gradient(0deg, rgba(28, 138, 255, 0.2) 0%, rgba(28, 138, 255, 0.5) 100%) !important;
          border-color: transparent;
          color: #9cdfee;
          font-size: 14px;
          font-weight: 400;
          text-align: center;
        }
      }

      // .el-table__body-wrapper {
      //   background-color: transparent !important;

      //   tr {
      //     background: linear-gradient(0deg, rgba(0, 251, 255, 0.6392156863) 0%, rgba(0, 251, 255, 0) 100%) !important;
      //     border-color: transparent;

      //     &.el-table__row--striped {
      //       td {
      //         &.el-table__cell {
      //           background: rgb(20 43 119);
      //         }
      //       }
      //     }

      //     td {
      //       border-color: transparent;
      //       color: #d1deee;
      //       font-size: 14px;
      //       text-align: center;
      //       background: none;
      //     }
      //   }
      // }
      .el-table__body-wrapper {
        .el-table__row {
          background-color: transparent;
          border: none;

          td.el-table__cell {
            border: none;

            .cell {
              font-family: Source Han Sans CN;
              font-weight: 400;
              font-size: 14px;
              color: #ffffff;
            }
          }
        }

        .el-table__row--striped {
          td.el-table__cell {
            // background: linear-gradient(0deg, #008599 0%, #08596d 100%);
            background: linear-gradient(0deg, rgba(21,141,253,0.2) 0%, rgba(21,141,253,0.05) 100%);
            border: none;
          }
        }
      }
    }

    .el-table--enable-row-hover .el-table__body tr:hover>td.el-table__cell {
      background-color: transparent;
    }

    .el-table__body tr.current-row>td.el-table__cell {
      background-color: rgba(0, 125, 142, 0.3) !important;
    }

    .paginationBox {
      .el-pagination {
        margin-top: 15px;
        justify-content: right;
        --el-pagination-bg-color: rgba(11, 52, 116, 0.5);

        & button:disabled {
          background-color: rgba(11, 52, 116, 0.5);
          color: #409eff;
        }

        .el-pagination__total {
          color: #fff;
        }

        .btn-next,
        .btn-prev {
          color: #409eff;
        }

        .el-pager {
          li {
            color: #fff;

            &.is-active {
              color: #eee;
            }
          }
        }

        .el-pagination__jump {

          .el-pagination__goto,
          .el-pagination__classifier {
            color: #409eff;
          }

          .el-input {
            height: 26px;

            .el-input__wrapper {
              background-color: transparent;
              box-shadow: 0 0 0 1px #409eff inset;

              .el-input__inner {
                color: #fff;
              }
            }
          }
        }
      }
    }
  }

  // 群呼
  .grouoDiv {
    padding: 5px 20px 20px 20px;
    margin-top: 20px;
    height: 410px;
    overflow-y: auto;

    .TabLine {
      display: flex;
      align-items: center;
      justify-content: space-between;
      background: #073770;
      padding-right: 8px;

      .Line {
        display: inline-block;
        padding: 5px 5px 5px 8px;
        color: #eee;
        font-size: 16px;
        margin-right: 10px;
      }

      .el-checkbox__label {
        color: #fff;
      }
    }

    .checkboxClass {
      padding: 10px 0 30px 0;

      :deep(.el-checkbox) {
        width: 95px;
        margin-bottom: 4px;
      }
    }
  }
}