:root {
    --custom-code-background: #bfc9ce;
    --custom-code-hover: #5f7b8c;
}


/* 代码块 */
.b3-typography div.hljs,
.protyle-wysiwyg div.hljs{
    padding: 0.5em 1em 1.6em;
}


.protyle-wysiwyg .code-block[fold='1'] .hljs {
    opacity: 0;
}

/* .b3-typography .code-block, */

.protyle-wysiwyg .code-block:not(pre){
    width: 98%;
    margin: 1em auto;
    background: var(--b3-protyle-code-background);
    border-radius: 4px;
    box-shadow: 0 0 0 1px #1e25351a;
    /* padding: 2em 1em 1em; */
}

/* .b3-typography .hljs, */
.protyle-wysiwyg .hljs {
    /* background-color: var(--b3-protyle-code-background) !important; */
    background-color: transparent !important;
    /* padding: 34px 15px 15px 15px; */
}



/* 代码行数 */
.b3-typography .hljs.protyle-linenumber,
.protyle-wysiwyg .hljs.protyle-linenumber {
    padding-left: 0;
    /* margin-left: 74px; */
}

.b3-typography .protyle-linenumber__rows,
.protyle-wysiwyg .protyle-linenumber__rows {
    opacity: 0.7;
    /* background-color: var(--b3-protyle-code-background); */
}

.b3-typography .protyle-linenumber__rows span::before,
.protyle-wysiwyg .protyle-linenumber__rows span::before {
    text-align: center;
    justify-content: center;
    align-items: center;
}

/* 代码语言选择框 */
.protyle-wysiwyg .code-block .protyle-action .protyle-action__language {
    /* 代码语言默认显示 */
    opacity: 1 !important;
    background: var(--b3-protyle-code-background);
}

.protyle-wysiwyg .code-block .protyle-action__language {
    background-color: transparent;
    transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
    height: 20px;
    line-height: 20px;
    vertical-align: middle;
    display: inline-flex;
    text-transform: uppercase;
    border-radius: 4px;
    padding: 0 5px;
    margin-left: 0.5em;
    font-size: 12px !important;
}

.protyle-wysiwyg .code-block .protyle-action__language:hover {
    background-color: var(--custom-code-background);
}

.protyle-wysiwyg .code-block .protyle-action__language:active {
    background-color: var(--custom-code-background);
}

/* 代码复制按钮和菜单 */
/* .protyle-wysiwyg .code-block .protyle-action__copy {
    display: inline-flex;
    width: auto;
}
.protyle-wysiwyg .code-block .protyle-action__copy svg {
    margin: 0;
    width: 11px;
    height: 11px;
    padding: 0px 0px;
    margin: auto 0;
    margin-right: 6px;
} */
/* .protyle-wysiwyg .code-block .protyle-action__copy::after {
    opacity: 1;
    transform: unset;
    margin: -4px 0px;
    padding: 0;
    border: unset;
    border-radius: unset;
    box-shadow: unset;
    outline: unset;
    position: unset;
    height: 25px;
    line-height: 25px;
    vertical-align: middle;
    display: inline-flex;
    font-size: 11px;
    position: unset;
    z-index: 0;
} */
/* .protyle-wysiwyg .code-block .protyle-action__copy::after {
    content: 'Copy';
} */
.protyle-wysiwyg .code-block .protyle-action__copy,
.protyle-wysiwyg .code-block .protyle-action__menu {
    background-color: #0206056b;
    transition: all 0.2s cubic-bezier(0.645, 0.045, 0.355, 1);
}

.protyle-wysiwyg .code-block .protyle-action__copy:hover,
.protyle-wysiwyg .code-block .protyle-action__menu:hover {
    background-color: var(--custom-code-hover);
}

.protyle-wysiwyg .code-block .protyle-action__copy:active,
.protyle-wysiwyg .code-block .protyle-action__menu:active {
    background-color: var(--custom-code-hover);
}

.protyle-wysiwyg .code-block:hover.protyle-action__language {
    opacity: 1;
}

.protyle-wysiwyg .code-block[fold='1'] {
    height: 36px !important;
}





/* ------代码语言栏居右--------- */
/* .b3-typography .code-block .protyle-action,
.protyle-wysiwyg [data-node-id].code-block .protyle-action {
    left: auto;
    right: 4px;
} */

/* ---------mac三点--------- */
/* .code-block::after {
    content: ' ';
    position: absolute;
    background: #fa625c;
    box-shadow: 23px 0 #fdbc40, 45px 0 #35cd4b;
    border-radius: 50%;
    top: 10px;
    left: 15px;
    height: 12px;
    width: 12px;
    z-index: 1;
} */



/* 代码块添加margin bottom */
.protyle-wysiwyg [data-node-id].li>[data-node-id].code-block {
    margin-bottom: 10px;
}



/* 代码块不设置语言，不显示语言内容 */
.protyle-wysiwyg[data-readonly=false] .code-block .protyle-action .protyle-action__language:empty::after {
    opacity: 0 !important;
}
.protyle-wysiwyg [data-node-id][fold="1"]:not(.li):not([data-type=NodeHeading]).code-block .protyle-action__language{
    margin-top: 3px;
}


.protyle-wysiwyg .code-block .protyle-action .protyle-action__language {
    opacity: 1;
    background: transparent;
}

/* 代码块滚动时语言和按钮固定在编辑器顶部 by JeffreyChen https://ld246.com/article/1728146248791 */


.protyle-wysiwyg[contenteditable] .code-block .protyle-action {
    position: sticky;
}

.protyle-wysiwyg[contenteditable] .code-block .protyle-action::after {
    /* content: "";
    position: absolute;
    height: 100%;
    width: 100%;
    background-color: var(--b3-protyle-code-background);
    pointer-events: none; */
}

