/*Text code Styling*/
.text-code-container {
    position: relative;
}

.text-code-container .btn-copy-code {
    position: absolute;
    right: var(--spacing-2);
    top: var(--spacing-2);
}

.text-code-container :not(pre) > code[class*=language-], pre[class*=language-] {
    background: var(--background-color-body);
    /*background: var(--color-grey-light);*/
}

.text-code-container code[class*=language-], pre[class*=language-] {
    text-shadow: none;
    color: var(--text-color-main);
}

.text-code-container .language-css .token.string {
    color: #9a6e3a;
    background: transparent;
}

.text-code-container pre[class*=language-] {
    padding: var(--spacing-6) var(--spacing-4) var(--spacing-1) var(--spacing-4);
}

.text-code-container .token.boolean, .token.constant, .token.deleted, .token.number, .token.property, .token.symbol, .token.tag {
    color: var(--token-tag);
}

.text-code-container .token.atrule, .token.attr-value, .token.keyword {
    color: var(--attribute-value);
}

.text-code-container .token.class-name, .token.function {
    color: var(--token-funtion);
}

code {
    color: var(--token-tag);
}