#jsxc-window-list {
  @include presence-indicator(" .jsxc-bar--window .jsxc-avatar");
  bottom: 0;
  left: 0;

  position: fixed;
  right: 210px;
  transition: right 0.5s;
  z-index: 50;

  .jsxc-roster-hidden & {
    right: 10px;
  }

  @media (min-width: 768px) {
    clip: rect(-10000px, 10000px, 30px, 30px);
  }

  > ul {
    bottom: 0;
    display: flex;
    height: 44px;
    list-style: none;
    margin: 0;
    overflow: visible;
    padding: 0;
    position: absolute;
    right: 0;
    transition: right 0.5s;
    white-space: nowrap;

    > li {
      align-items: flex-end;
      cursor: pointer;
      display: flex;
      height: 44px;
      margin: 0;
      margin-right: 5px;
      overflow: visible;
      padding: 0;
      position: relative;
      white-space: normal;
      width: 46px;

      &.jsxc-normal {
        transition: width 0.2s;
        width: auto;
      }

      &.jsxc-minimized {
        transition: width 0.2s;
        width: 54px !important;
        //  overwrite resizeable width
        @media (min-width: 768px) {
          width: 200px !important;
        }

        .jsxc-emoticons {
          display: none;
        }

        .jsxc-tools {
          display: none;
        }
      }

      &[data-subscription="from"],
      &[data-subscription="none"] {
        .jsxc-bar__caption {
          opacity: 0.7;
        }

        .jsxc-avatar {
          filter: grayscale(100%);
        }
      }
    }
  }
}

#jsxc-window-list-handler {
  bottom: 0;
  height: 45px;
  left: 0;
  position: fixed;
  width: 30px;

  @media (max-width: 768px) {
    display: none;
  }

  > {
    div {
      background-color: $scrollbar-bg;
      box-sizing: border-box;
      color: $scrollbar-color;
      cursor: pointer;
      float: left;
      height: 100%;
      line-height: 45px;
      text-align: center;
      user-select: none;
      width: 14px;

      &:hover {
        background-color: $scrollbar-bg-hover;
      }
    }

    .jsxc-disabled {
      background-color: $scrollbar-bg-disabled !important;
      color: $scrollbar-color-disabled;
      cursor: default !important;
      display: none;
    }
  }
}
