.high-light-wrapper {
  text-align: left;
  font-size: var(--font-size-base);

  .hljs {
    font-weight: var(--font-weight-normal);
    padding-inline: 0;
    padding-block: 1.2em;

    &::-webkit-scrollbar {
      height: 8px;
    }

    &::-webkit-scrollbar-thumb {
      background-color: rgba(211, 211, 220, 50%);
      border-radius: 6px;

      &:hover {
        background-color: rgba(190, 190, 190, 100%);
      }
    }

    &::-webkit-scrollbar-track {
      background-color: transparent;
    }
  }

  .code-pre {
    padding-inline: 12px 12px;
    position: relative;
    border-radius: var(--border-radius-mini);

    &.copyable {
      padding-inline: 12px 32px;
    }

    .copy-button {
      position: absolute;
      top: 6px;
      right: 6px;
    }

    &.dark {
      background-color: #282c34;
    }

    &.light {
      background-color: rgb(250, 250, 250);
    }
  }
}