bigbluebutton-Github/bigbluebutton-html5/imports/ui/components/video-preview/virtual-background/styles.scss

@import "/imports/ui/components/video-preview/styles";

.thumbnail {
  width: 47px;
  height: 47px;
  position: absolute;
  cursor: pointer;
  top: 1px;
  left: 2px;
}

.virtualBackgroundRowDropdown {
  input {
    border-radius: 0.3rem;
  }

  input:disabled {
    filter: grayscale(100%);
  }

  button {
    padding: var(--btn-lg-padding);
  }

  button, input {
    border: var(--border-size-small) solid var(--user-thumbnail-border);
    margin: 0 0.15em;
  }  
}

.virtualBackgroundRowThumbnail {
  @extend .virtualBackgroundRowDropdown;
  margin-top: 0.4rem;
}

.virtualBackgroundItem:focus{
  color: var(--btn-default-color);
  background-color: var(--btn-default-bg);
  background-clip: padding-box;
  box-shadow: 0 0 0 var(--border-size) var(--btn-primary-border);
}

.virtualBackgroundItem {
  outline: none;
  display: flex;
  position: relative;
  justify-content: center;
  align-items: center;
  border-radius: 3px;
  cursor: pointer;
  height: 48px;
  width: 48px;
}

.bgWrapper {
  display: flex;
  justify-content: space-between;
  overflow-x: auto;
  margin: 3px;
  padding: 3px;
}

.bgNone,
.bgImage {
  border-radius: 3px;
  height: 48px;
  width: 48px;
}