@charset 'utf-8';

/**
 * matcha.libs.css
 * 适配外部引用库
 */

/* iconfont 图标 */
.iconfont {
	font-family: "iconfont" !important;
	font-size: 16px;
	font-style: normal;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* Fluidbox */
.fluidbox-anchor {
	border: none!important;
	display: block;
	width: 100%;
	cursor: zoom-in
}
.fluidbox-anchor:hover {
	opacity: 1
}

.fluidbox__overlay {
	background: var(--overlay-bg)
}

/* 覆盖 bigfoot */
.bigfoot-footnote {
	border-radius: 3px;
	box-shadow: 0 0 .5em rgba(0, 0, 0, 0.2);
	-webkit-box-shadow: 0 0 .5em rgba(0, 0, 0, 0.2);
	border: none;
}
.bigfoot-footnote__content {
	color: var(--text-color)
}

.bigfoot-footnote__button:hover,
.bigfoot-footnote__button:focus {
	background: var(--theme-color)
}

/* 适配 ExSearch */
.ins-section .ins-search-item.active,.ins-section .ins-search-item:hover {
	background: var(--theme-color)!important
}
.ins-close:hover {
	color: var(--theme-color)!important
}
.ins-search ::-webkit-scrollbar,
.ins-search::-webkit-scrollbar {
	background: rgb(247,247,247)
}


/* prism toolbar */
div.code-toolbar>.toolbar {
	right: .5em
}
div.code-toolbar>.toolbar>.toolbar-item>button {
	box-shadow: none;
	border-radius: 3px;
	background: transparent;
	color: var(--gray-bg);
	cursor: pointer;
	border: none;
	font-size: 1.1em;
	transition: background .3s;
	padding: 0 .2em
}
div.code-toolbar>.toolbar>.toolbar-item>button:hover,
div.code-toolbar>.toolbar>.toolbar-item>button:focus {
	background: var(--light-bg);
	color: var(--text-gray)
}
div.code-toolbar>.toolbar>.toolbar-item>button::before {
	content: '\e94c';
	font-family: 'iconfont'!important;
	font-weight: 800
}

/* 适配 BracketDown 插件 */

.post-content details summary {
	list-style-type: none
}
.post-content details summary::before {
	content: '\e749';
	font-family: "iconfont" !important;
	display: inline-block;
	transition: transform .3s;
	margin-right: .5em;
	transform: rotate(90deg)
}
.post-content details.opened:not(.closing) summary::before {
	transform: rotate(180deg)
}

.post-content details .bracketdown-details-content {
	margin-left: 1.5em!important;
	display: none
}


.post-content details summary::-webkit-details-marker {
    display: none /* for Chrome */
}

.bracketdown-block {
	background: rgb(0,50,20,.03);
	border: 1px dashed var(--theme-color)!important;
	position: relative;
	margin-top: .8em
}
.bracketdown-block::before {
	content: 'NOTICE';
	font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
	font-size: .7em;
	color: #fff;
	position: absolute;
	top: -.7em;
	left: 1.1em;
	background: var(--theme-color);
	font-weight: 400;
	padding: 0 .5em
}

.post-content .bracketdown-underline,
.section-title {
	text-decoration: none;
	position: relative;
	z-index: 1
}
.post-content .bracketdown-underline::before,
.section-title::before {
	content: "";
    position: absolute;
    height: .8em;
    bottom: .2em;
    width: 100%;
    background-color: var(--theme-color);
    opacity: .7;
	z-index: -1
}

.post-content [data-github] {
	border-radius: 3px;
	background: #fffffe;
	border-color: var(--gray-bg)
}

.post-content [data-github]::before {
	content: '\e885';
	font-family: 'iconfont';

	position: absolute;
	font-size: 10em;
	bottom: -.5em;
	right: -.1em;
	color: var(--light-bg);
	z-index: -1
}

.post-content [data-github] {
	min-width: 50%;
	position: relative;
	overflow: hidden;
	z-index: 1
}
@media (max-width: 1200px) {
	.post-content [data-github],
	.post-content .bracketdown-post {
		max-width: 100%
	}
}
.post-content [data-github] a {
	color: var(--text-color)!important
}

.post-content .bracketdown-post {
	border-color: var(--gray-bg);
	border-width: 2px;
	padding: 1em 1.5em
}

.post-content .bracketdown-post-title a {
	color: var(--text-color)
}

.post-content .bracketdown-post:hover {
	transition: border .3s;
	border-color: var(--theme-color)
}
.post-content .bracketdown-post:hover .bracketdown-post-meta a {
	border-color: var(--theme-color)
}

.post-content .bracketdown-post .bracketdown-post-title a:hover {
	color: var(--theme-color)
}

.post-content .bracketdown-post .bracketdown-post-meta a {
	border-width: 2px;
	border-color: var(--gray-bg);
	border-radius: 3px;
	padding: .3em 1em;
	color: var(--text-gray)
}
.post-content .bracketdown-post .bracketdown-post-meta a:hover {
	background: var(--theme-color);
	border-color: var(--theme-color);
	color: #fff
}

/* 懒加载 */

.post-content img.lazy:not(.lazy-loaded) {
	max-width: 100px
}