.var-site-code-example {
  margin-top: 16px;
  margin-bottom: 4px;
  position: relative;
  border: thin solid var(--site-config-color-hl-border);
  border-radius: 4px;
  transition: border 0.25s;

  &:hover {
    .var-site-code-example__toolbar {
      opacity: 1;
    }
  }

  &__toolbar {
    display: flex;
    align-items: center;
    position: absolute;
    z-index: 1;
    right: 10px;
    top: 10px;
    opacity: 0;
    transition: 0.25s all;

    button {
      color: var(--site-config-color-hl-code) !important;
    }
  }

  &__code {
    transition: all 0.25s;
    overflow: hidden;
    border-radius: var(--site-config-code-example-border-radius);
  }

  &--scroller {
    code {
      white-space: nowrap;
    }
  }
}