:root {
  --control-text-color: #777;
  --select-text-bg-color: rgba(223, 197, 223); /*#7e66992e;*/
  --search-select-bg-color: #8163bd;

  /* side bar */
  --side-bar-bg-color: #f7f7fb;
  --active-file-text-color: #8163bd;
  --active-file-bg-color: #e9e4f0;
  --item-hover-bg-color: #e9e4f0;
  --active-file-border-color: #8163bd;

  --title-color: #6c549c;
  --text-color: #333333;
  --light-text-color: #666666;

  --base-font: "Helvetica Neue", "Noto Sans", -apple-system, Ubuntu,
    "Microsoft YaHei", Helvetica, "Nimbus Sans L", Arial, "Liberation Sans",
    "Noto Sans CJK SC", "PingFang SC", "Hiragino Sans GB", "Source Han Sans SC",
    "Source Han Sans CN", "Wenquanyi Micro Hei", "WenQuanYi Zen Hei", "ST Heiti",
    SimHei, "WenQuanYi Zen Hei Sharp", "Source Sans Pro", sans-serif;
  --title-font: "Noto Serif", "Noto Serif CJK SC", "EB Garamond", Georgia,
    "Nimbus Roman No9 L", "Songti SC", "Source Han Serif SC",
    "Source Han Serif CN", STSong, "AR PL New Sung", "AR PL SungtiL GB", NSimSun,
    SimSun, "TW\-Sung", "WenQuanYi Bitmap Song", "AR PL UMing CN",
    "AR PL UMing HK", "AR PL UMing TW", "AR PL UMing TW MBE", PMingLiU, MingLiU,
    "Ubuntu", "Source Sans Pro", serif;
  --monospace: "JetBrains Mono", "Fira Code", "Cascadia Code", "Sarasa Term SC",
    Monaco, "Deja Vu Sans Mono", Consolas, "Lucida Console", "Andale Mono",
    "Roboto Mono", Courier, Monospace !important;

  --link-color: #745fb5;
  --bold-color: #745fb5 /* #8163bd */;
  --code-color: #ff79c6;
  --purple-4: #bb60d5;
  --purple-light-1: rgba(99, 99, 172, 0.05);
  --purple-light-2: rgba(99, 99, 172, 0.1);
  --purple-light-3: rgba(99, 99, 172, 0.2);
  --purple-light-4: rgba(129, 99, 189, 0.3);
  --purple-light-5: #e9e4f0;
  --purple-light-6: rgba(129, 99, 189, 0.7);
  --purple-light-7: rgba(129, 99, 189, 0.3);

  --shadow: var(--purple-light-3) 0px 5px 10px;

  --border: #eee;
  --fence-border: var(--border);
  --table-border: #ddd;
  --boxes: #f0eef5;
}

html {
  font-size: 16px;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-rendering: optimizelegibility;
  -webkit-font-smoothing: initial;
}

body {
  color: var(--text-color);
  -webkit-font-smoothing: antialiased;
  line-height: 1.6rem;
  letter-spacing: 0;
  margin: 0;
  overflow-x: hidden;
}

/* 页边距 和 页面大小 */
#write {
  font-family: var(--base-font);
  /* max-width: 914px; */
  margin: 0 auto;
  padding: 1rem 4rem;
  padding-bottom: 100px;
}

#write p {
  line-height: 1.6rem;
  word-spacing: 0.05rem;
}

body > *:first-child {
  margin-top: 0 !important;
}

body > *:last-child {
  margin-bottom: 0 !important;
}

a {
  color: var(--link-color);
  text-decoration: none;
}
/* #write a {
  border-bottom: 1px solid var(--link-color);
  color: var(--link-color);
  text-decoration: none;
} */
#write a:hover {
  border-bottom: 1px solid var(--link-color);
  color: var(--link-color);
  text-decoration: none;
}
.md-content {
  color: var(--purple-light-6);
}

h1,
h2,
h3,
h4,
h5,
h6 {
  position: relative;
  margin-top: 1rem;
  margin-bottom: 0.5rem;
  /* font-weight: bold; */
  font-weight: normal;
  line-height: 1.4;
  cursor: text;
  color: var(--title-color);
  font-family: var(--title-font);
}

h1 tt,
h1 code {
  font-size: inherit !important;
}
h2 tt,
h2 code {
  font-size: inherit !important;
}
h3 tt,
h3 code {
  font-size: inherit !important;
}
h4 tt,
h4 code {
  font-size: inherit !important;
}
h5 tt,
h5 code {
  font-size: inherit !important;
}
h6 tt,
h6 code {
  font-size: inherit !important;
}

h1 {
  padding-bottom: 0.4rem;
  font-size: 2.2rem;
  line-height: 1.3;
}
h1 {
  text-align: center;
  padding-bottom: 0.3em;
  font-size: 2.2em;
  line-height: 1.2;
  margin: 1.6em auto 1em;
}
h1:after {
  content: "";
  display: block;
  margin: 0.2em auto 0;
  width: 6rem;
  height: 2px;
 }

h2 {
  margin: 1.4em auto 0.8em;
  padding-left: 10px;
  line-height: 1.4;
  font-size: 1.8em;
  border-left: 9px solid var(--title-color);
  border-bottom: 1px solid var(--title-color);
}
h3 {
  font-size: 1.5rem;
  margin: 1.2em auto 0.5em;
}
h4 {
  font-size: 1.3rem;
}
h5 {
  font-size: 1.2rem;
}
h6 {
  font-size: 1.1rem;
}

p,
blockquote,
ul,
ol,
dl,
table {
  margin: 0.8em 0;
}

/* horizontal rule */
hr {
  margin: 16px 0;
  border: 0;
  border-top: 2px solid var(--border);
}

/* 列表 */
li > ol,
li > ul {
  margin: 0 0;
}

li p.first {
  display: inline-block;
}

ul,
ol {
  padding-left: 2rem;
}

ul:first-child,
ol:first-child {
  margin-top: 0;
}

ul:last-child,
ol:last-child {
  margin-bottom: 0;
}

#write ol li,
ul li {
  padding-left: 0.1rem;
}

/* 无序列表，显示为空心圆 */
/* ul {
  list-style-type: circle;
} */

/* 引用 */
blockquote {
  border-left: 0.2rem solid var(--purple-light-4);
  padding: 0.8rem 1.2rem;
  color: var(--light-text-color);
  background-color: var(--purple-light-1);
  font-family: var(--base-font);
}

/* 表格 */

table {
  font-size: 0.9rem;
  padding: 0;
  margin: 0;
  word-break: initial;
}

table tr {
  border-top: 1px solid var(--table-border);
  border-bottom: 1px solid var(--table-border);
  margin: 0;
  padding: 0;
}

table tr.md-end-block {
  border-top: none;
}

table tr th {
  font-weight: bold;
  border: none;
  border-bottom: solid 1px var(--table-border);
  margin: 0;
  padding: 6px 13px;
  transition-duration: 0.3s;
  transition-property: background-color;
}

table tr td {
  border: none;
  margin: 0;
  padding: 6px 13px;
  transition-duration: 0.3s;
  transition-property: background-color;
}

#write table tr td:hover,
#write table tr th:hover {
  background-color: var(--boxes);
}

table tr th:first-child,
table tr td:first-child {
  margin-top: 0;
}

table tr th:last-child,
table tr td:last-child {
  margin-bottom: 0;
}

/* 表格 背景色 */
table tr:nth-child(2n),
thead {
  background-color: #f7f7fb;
}
table tr:nth-child(2n + 1),
thead {
  background-color: #ffffff;
}
#write table thead th {
  background-color: #f0eef5;
}

/* 粗体 */
#write strong {
  padding: 0 2px;
  /* color: var(--bold-color); */
  font-weight: bold;
}

/* 斜体 */
#write em {
  padding: 0 5px 0 2px;
  /* font-style: normal; */
  /* color: #4abdeb; */
}

/* inline code */
#write code,
tt {
  padding: 2px 4px;
  border-radius: 2px;
  font-family: var(--monospace);
  font-size: 0.92rem;
  color: var(--code-color);
  background-color: var(--purple-light-1);
}

tt {
  margin: 0 2px;
}

#write .md-footnote {
  background-color: #f8f8f8;
  color: var(--code-color);
}

/* highlight. */
#write mark {
  background-color: rgb(255, 217, 255);
  border-radius: 2px;
  padding: 2px 4px;
  margin: 0 2px;
  color: var(--text-color);
}

#write del {
  padding: 1px 2px;
}

.md-task-list-item > input {
  margin-left: -1.3em;
}

@media print {
  html {
    font-size: 0.9rem;
  }

  table,
  pre {
    page-break-inside: avoid;
  }

  pre {
    word-wrap: break-word;
  }
}

#write pre.md-meta-block {
  padding: 1rem;
  font-size: 85%;
  line-height: 1.45;
  background-color: #f7f7f7;
  border: 0;
  border-radius: 3px;
  color: #777777;
  margin-top: 0 !important;
}

.mathjax-block > .code-tooltip {
  bottom: 0.375rem;
}

/* 图片 */
.md-image > .md-meta {
  border-radius: 3px;
  font-family: var(--monospace);
  padding: 2px 0 0 4px;
  font-size: 0.9em;
  color: inherit;
}
/* 图片靠左显示 */
p .md-image:only-child {
  width: auto;
  text-align: left;
  margin-left: 2rem;
}
.md-tag {
  color: inherit;
}

#write img {
  max-width: 914px;
}

/* 写![shadow-...]() 显示图片阴影 */
img[alt|="shadow"] {
  box-shadow: var(--shadow);
  border-radius: 0.4rem;
}

#write a.md-toc-inner {
  line-height: 1.6;
  white-space: pre-line;
  border-bottom: none;
  font-size: 0.9rem;
}

#typora-quick-open {
  border: 1px solid #ddd;
  background-color: #f8f8f8;
}

#typora-quick-open-item {
  background-color: #fafafa;
  border-color: #fefefe #e5e5e5 #e5e5e5 #eee;
  border-style: solid;
  border-width: 1px;
}

#md-notification:before {
  top: 10px;
}

header,
.context-menu,
.megamenu-content,
footer {
  font-family: var(--base-font);
}

.file-node-content:hover .file-node-icon,
.file-node-content:hover .file-node-open-state {
  visibility: visible;
}

.md-lang {
  color: #b4654d;
}

.html-for-mac .context-menu {
  --item-hover-bg-color: #e6f0fe;
}

/* 代码框 */
/* CodeMirror 3024 Day theme */

/* 代码段 背景 */
pre {
  --select-text-bg-color: rgba(223, 197, 223) !important;
}

/* border and bg */
.md-fences {
  border: 1px solid var(--fence-border);
  border-radius: 5px;
  background: #fdfdfd !important;
}
#write pre.md-fences {
  /* padding: 1rem 0.5rem 1rem; */
  display: block;
  -webkit-overflow-scrolling: touch;
  box-shadow: var(--shadow);
}

.cm-s-inner {
  padding: 0.25rem;
  border-radius: 0.25rem;
}

.cm-s-inner.CodeMirror,
.cm-s-inner .CodeMirror-gutters {
  /* background-color: #f8f8f8 !important; */
  color: #3a3432 !important;
  border: none;
}

.cm-s-inner .CodeMirror-gutters {
  color: #6d8a88;
}

/* 光标 */
.cm-s-inner .CodeMirror-cursor {
  border-left: solid thin var(--title-color) !important;
}

.cm-s-inner .CodeMirror-linenumber {
  padding: 0 0.1rem 0 0.3rem;
  color: #b8b5b4;
}

.cm-s-inner .CodeMirror-line::selection,
.cm-s-inner .CodeMirror-line::-moz-selection,
.cm-s-inner .CodeMirror-line > span::selection,
.cm-s-inner .CodeMirror-line > span::-moz-selection,
.cm-s-inner .CodeMirror-line > span > span::selection,
.cm-s-inner .CodeMirror-line > span > span::-moz-selection {
  background: var(--purple-light-1);
}

.cm-s-inner span.cm-comment {
  color: #cdab53;
}

.cm-s-inner span.cm-string,
.cm-s-inner span.cm-string-2 {
  color: #f2b01d;
}

.cm-s-inner span.cm-number {
  color: #a34e8f;
}

.cm-s-inner span.cm-variable {
  color: #01a252;
}

.cm-s-inner span.cm-variable-2 {
  color: #01a0e4;
}

.cm-s-inner span.cm-def {
  /*   color: #e8bbd0;
  color: #e2287f; */
  color: var(--text-color);
}

.cm-s-inner span.cm-operator {
  color: #ff79c6;
}

.cm-s-inner span.cm-keyword {
  color: #db2d20;
}

.cm-s-inner span.cm-atom {
  color: #a34e8f;
}

.cm-s-inner span.cm-meta {
  color: inherit;
}

.cm-s-inner span.cm-tag {
  color: #db2d20;
}

.cm-s-inner span.cm-attribute {
  color: #01a252;
}

.cm-s-inner span.cm-qualifier {
  color: #388aa3;
}

.cm-s-inner span.cm-property {
  color: #01a252;
}

.cm-s-inner span.cm-builtin {
  color: #388aa3;
}

.cm-s-inner span.cm-variable-3,
.cm-s-inner span.cm-type {
  color: #ffb86c;
}

.cm-s-inner span.cm-bracket {
  color: #3a3432;
}

.cm-s-inner span.cm-link {
  color: #a34e8f;
}

.cm-s-inner span.cm-error {
  background: #db2d20;
  color: #5c5855;
}

/* .md-fences.md-focus .cm-s-inner .CodeMirror-activeline-background {
  background: var(--purple-light-2);
} */

.cm-s-inner .CodeMirror-matchingbracket {
  text-decoration: underline;
  color: #a34e8f !important;
}

#fences-auto-suggest .active {
  background: #ddd;
}

/* language tip */
#write .code-tooltip {
  bottom: initial;
  top: calc(100% - 1px);
  /* background: #f7f7f7; */
  border: 1px solid #ddd;
  /* border-top: 0; */
}

.auto-suggest-container {
  border-color: #b4b4b4;
}

.auto-suggest-container .autoComplt-hint.active {
  background: #b4b4b4;
  color: inherit;
}

/* task list */
#write .md-task-list-item > input {
  -webkit-appearance: initial;
  display: block;
  position: absolute;
  border: 1px solid #b4b4b4;
  border-radius: 0.2rem;
  margin-top: 0.3rem;
  /* margin-left: -1.8rem; */
  height: 1rem;
  width: 1rem;
  transition: background 0.3s;
}

#write .md-task-list-item > input:focus {
  outline: none;
  box-shadow: none;
}

#write .md-task-list-item > input:hover {
  background: #ddd;
}

#write .md-task-list-item > input[checked]::before {
  content: "";
  position: absolute;
  top: 20%;
  left: 50%;
  height: 60%;
  width: 2px;
  transform: rotate(40deg);
  background: #333;
}

#write .md-task-list-item > input[checked]::after {
  content: "";
  position: absolute;
  top: 46%;
  left: 25%;
  height: 30%;
  width: 2px;
  transform: rotate(-40deg);
  background: #333;
}

#write .md-task-list-item > p {
  transition: color 0.3s, opacity 0.3s;
}

#write .md-task-list-item.task-list-done > p {
  color: #b4b4b4;
  text-decoration: line-through;
}

#write .md-task-list-item.task-list-done > p > .md-emoji {
  opacity: 0.5;
}

#write .md-task-list-item.task-list-done > p > .md-link > a {
  opacity: 0.6;
}

/* sidebar and outline */
.pin-outline .outline-active {
  color: var(--active-file-text-color);
}

.file-list-item {
  border-bottom: 1px solid;
  border-color: var(--purple-light-5);
}

.file-list-item-summary {
  font-weight: normal;
}

.file-list-item.active {
  color: var(--active-file-text-color);
  background-color: var(--purple-light-5);
}

.file-tree-node.active > .file-node-background {
  background-color: var(--purple-light-5);
  font-weight: normal;
}

.file-tree-node.active > .file-node-content {
  color: var(--active-file-text-color);
  font-weight: normal;
}

.file-node-content {
  color: #5e676d;
}

.sidebar-tabs {
  border-bottom: none;
}
.sidebar-tab.active {
  font-weight: normal;
}
.info-panel-tab-border {
  color: var(--link-color);
}

.sidebar-content-content {
  font-size: 0.9rem;
}

/* 搜索 */
.ty-file-search-match-text {
  background-color: var(--purple-light-4);
}
.md-search-hit {
  background-color: var(--purple-light-4);
  contain: style;
}

element.style {
  width: calc(100% - 18px);
}
#file-library-search-input:focus {
  border-color: var(--link-color);
}
.code-tooltip .ty-input:focus,
input:focus {
  border-color: var(--link-color);
}