.hljs{display:block;overflow-x:auto;padding:1em;background:#1e1e1e;color:#d4d4d4}
.hljs-comment,.hljs-quote{color:#6a9955;font-style:italic}
.hljs-keyword,.hljs-selector-tag,.hljs-addition{color:#569cd6}
.hljs-number,.hljs-string,.hljs-meta .hljs-meta-string,.hljs-literal,.hljs-doctag,.hljs-regexp{color:#ce9178}
.hljs-title,.hljs-section,.hljs-name,.hljs-selector-id,.hljs-selector-class,.hljs-attribute{color:#dcdcaa}
.hljs-attr,.hljs-variable,.hljs-template-variable,.hljs-class .hljs-title,.hljs-type{color:#4ec9b0}
.hljs-symbol,.hljs-bullet,.hljs-subst,.hljs-meta,.hljs-meta .hljs-keyword,.hljs-selector-attr,.hljs-selector-pseudo,.hljs-link{color:#d4d4d4}
.hljs-built_in,.hljs-deletion{color:#ce9178}
.hljs-formula{background:#323232}
.hljs-emphasis{font-style:italic}
.hljs-strong{font-weight:bold}

pre {
    position: relative;
    margin: 15px 0;
    border-radius: 8px;
    overflow: hidden;
}

pre code {
    display: block;
    padding: 20px;
    overflow-x: auto;
    font-family: 'Fira Code', 'Monaco', 'Consolas', monospace;
    font-size: 14px;
    line-height: 1.6;
}

.code-block {
    position: relative;
}

.code-block::before {
    content: attr(data-lang);
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 12px;
    color: #6a9955;
    text-transform: uppercase;
}

.code-table {
    width: 100%;
    border-collapse: collapse;
}

.code-table .line-number {
    width: 50px;
    padding: 0 15px;
    text-align: right;
    color: #858585;
    user-select: none;
    border-right: 1px solid #323232;
}

.code-table .line-content {
    padding: 0 15px;
}