@import url("base.css");

.markdown-section td,
.markdown-section th {
  border: 1px solid var(--section-table-header-border-color);
}

.markdown-section blockquote{
  background-color: var(--section-blockquote-background-color);
  color: var(--main-color);
}

.markdown-section p.tip,
.markdown-section tr:nth-child(2n) {
  background-color: var(--table-2nd-row-background-color);
}

.markdown-section tr:nth-child(2n-1) {
  background-color: var(--table-1st-row-background-color);
}

.progress {
  background-color: var(--main-theme-color);
  background-color: var(--theme-color, var(--main-theme-color));
}

.search .search-keyword,
.search a:hover {
  color: var(--main-theme-color);
  color: var(--theme-color, var(--main-theme-color))
}

body {
  color: var(--main-color);
}

.app-nav a.active,
.app-nav a:hover {
  color: var(--main-theme-color);
  color: var(--theme-color, var(--main-theme-color))
}

.app-nav a.active {
  border-bottom: 2px solid var(--main-theme-color);
  border-bottom: 2px solid var(--theme-color, var(--main-theme-color))
}

.github-corner svg {
  color: var(--background-color);
  fill: var(--main-theme-color);
  fill: var(--theme-color, var(--main-theme-color));
}

.anchor span {
  color: var(--main-color);
}

.sidebar-toggle {
  background-color: var(--section-sidebar-background-color);
}

.sidebar-toggle span {
  background-color: var(--main-theme-color);
  background-color: var(--theme-color, var(--main-theme-color));
}

.markdown-section p.tip:before {
  color: var(--background-color);
}

.markdown-section p.tip em {
  color: var(--main-color);
}

.markdown-section p.warn {
  background: var(--section-p-warn-background-color);
}

@media screen and (max-width:768px) {
  body.close .sidebar-toggle {
    background-color: var(--sidebar-background-color);
  }
}

section.cover.has-mask .mask {
  background-color: var(--background-color);
}

section.cover .cover-main>p:last-child a {
  border: 1px solid var(--main-theme-color);
  border-color: var(--theme-color, var(--main-theme-color));
  color: var(--theme-color, var(--main-theme-color));
}

section.cover .cover-main>p:last-child a:last-child {
  background-color: var(--theme-color, var(--main-theme-color));
  color: #fff
}

section.cover blockquote>p>a {
  border-bottom: 2px solid var(--theme-color, var(--main-theme-color));
}

section.cover blockquote>p>a:hover {
  color: var(--theme-color, var(--main-theme-color))
}

.sidebar,
body {
  background-color: var(--background-color);
  transition: background-color 0.3s ease-in-out;
}

.sidebar {
  color: var(--main-color);
}

.sidebar li {
  margin: 6px 15px 6px 0
}

.sidebar ul li a {
  color: var(--main-color);
}

.sidebar ul li.active>a {
  color: var(--theme-color, var(--main-theme-color));
}

.markdown-section h1,
.markdown-section h2,
.markdown-section h3,
.markdown-section h4,
.markdown-section strong {
  color: var(--section-color);
}

.markdown-section a {
  color: var(--theme-color, var(--section-blockquote-color));
}

.markdown-section blockquote {
  border-left: 4px solid var(--theme-color, var(--main-theme-color));
}


.markdown-section code {
  background-color: var(--section-main-color);
  color: var(--section-blockquote-color);
  font-family: d9c, d9;
}

.markdown-section pre {
  -moz-osx-font-smoothing: initial;
  -webkit-font-smoothing: initial;
  background-color: var(--section-main-color);
  font-family: d9c, d9;
}

.token.string {
  color: var(--theme-color, var(--main-theme-color))
}


.token.attr-value,
.token.control,
.token.directive,
.token.unit {
  color: var(--theme-color, var(--main-theme-color))
}

.markdown-section pre>code {
  -moz-osx-font-smoothing: initial;
  -webkit-font-smoothing: initial;
  background-color: var(--section-main-color);
  color: var(--section-blockquote-color);
  font-family: d9c, d9;
}

pre:after {
  color: #ccc;
  content: attr(data-lang);
  top: 0;
}

.markdown-section p.tip {
  background-color: var(--section-main-color);
  color: var(--section-background-color)
}

input[type=search] {
  background: #4f4f4f;
  border-color: #4f4f4f;
  color: var(--main-color);
}

body.light .sidebar li>a:has(>img) {
  color: var(--main-color);
}

.sidebar-nav>ul>li>ul>li>a:has(>img):hover,
.sidebar-nav>ul>li>a:has(>img):hover,
.sidebar-nav>ul>li>ul>li:has( li.active)>a,
.sidebar-nav>ul>li>ul>li.active>a,
.sidebar-nav>ul>li:has( li.active)>a,
.sidebar-nav>ul>li.active>a {
  filter: brightness(0.7) drop-shadow(0 10px 10px #141414);
}

article.markdown-section:has(.intro)>.notice {
  background-color: var(--section-main-color);
  border-color: var(--section-background-color);
  &[onclick]:hover{
    background-color: var(--section-main-color);
  }
}

div.medium-zoom-overlay{
  background-color: var(--background-color) !important;
}

.markdown-section:has(iframe[single]) {
  &>p{
    background-color: var(--background-color);
  }
}

.controlSpan{
  background-color: var(--span-color);
  &>svg{
    stroke: var(--span-fill-color);
  }
}