.code-docs {
    display: flex;
    flex-direction: column;
    border-radius: 8px;
    position: relative;
    border: .5px solid #ececf1;
    background: linear-gradient( 45deg, #f7f7f8 0%, rgba(247, 247, 248, 1) 100% );
    margin: 20px 0;
}
.code-docs-header {
    display: flex;
    align-items: center;
    padding: 4px 8px 4px 14px;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    overflow: auto;
    flex-shrink: 0;
    border-bottom: .5px solid var(--divider);
    gap: 4px;
}
.code-docs-title {
    flex: 1 1 auto;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-right: 12px;
    color: var(--color-first);
    font-weight: 400;
    font-size: 12px;
    letter-spacing:0;
    line-height: 20px;
}
.code-docs-body {
    flex-grow: 1;
    flex-shrink: 0;
    position: relative;
}

pre[class*="language-"],
code[class*="language-"] {
white-space: pre-line !important;
word-spacing: normal !important;
}
.code-docs-body code {font-family: monospace;}
.token.operator, .token.entity, .token.url, .language-css .token.string, .style .token.string{background: transparent !important;}