right-header {
  display: block;
  height: 53px;
  background-color: var(--leftAsideRightHeader-color, #1e2d45);
  line-height: 53px;

  .tip {
    margin: 0 30px 0 auto;
    height: 100%;
    font-size: 14px;
    width: fit-content;
    text-align: right;

    .btn-group {
      vertical-align: initial;
    }
  }

  .tip-system {
    margin-left: 12px;
    height: 45px;
    padding-right: 5px;
    color: white !important;
    text-decoration: none !important;

    .fa-exclamation-triangle {
      color: #F39C12;
    }
  }

  .user-select {
    position: relative;
    top: -2px;
    left: 3px;
  }

  .system-setting {
    width: 340px;
    display: flex;

    dl {
      flex: 1;
      margin: 10px;

      + dl {
        margin-left: 8px;
      }
    }

    dt {
      margin-bottom: 6px;
    }

    .fa {
      font-size: 18px;
      width: 32px;
    }

    span {
      color: #9e9e9e;
    }

    dd {
      line-height: 25px;

      .badge {
        color: white;
        background: rgba(243, 156, 18, 0.7);
        padding: 1px 4px;
        margin-left: 2px;
        vertical-align: text-top;
      }
    }

    a {
      color: var(--global-theme-color-heavy, #00c2b1);
      display: block;
      width: 100%;
      padding-left: 32px;

      &:hover {
        color: white;
        background-color: var(--global-theme-color-heavy, #00c8c1);
        border-radius: 2px;
        text-decoration: none;
      }
    }
  }

  .count {
    color: #f39c12;
    font-weight: bold;
  }

  .popover-content {
    padding: 0;
  }

  .message-view {
    width: 346px;

    .head {
      display: flex;
      justify-content: space-between;
      background-color: #f6f5f4;
      border-bottom: 1px solid #e4e4e4;
      padding: 10px 10px;

      span {
        display: inline-block;
      }

      .more {

        a {
          padding: 0px 8px;

          &:hover {
            color: var(--global-theme-color-light, #00c8c1);
          }
        }
      }
    }

    .messageContent {
      padding: 10px 15px 0;
      max-height: 280px;
      overflow: auto;

      .title {
        font-weight: bolder;

        &:hover {
          color:var(--global-theme-color-heavy, #00c8c1);
        }
      }

      .message {
        border-bottom: 1px solid #e4e4e4;
        padding-top: 5px;
      }

      p {
        margin-bottom: 5px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
      }
    }
  }
}
