/* 昼夜模式专用css */
/* 以下配色为全球公认的一套色彩值，如无必要，无需修改下方色彩值（主题色可以修改） */
:root {
	--theme: #409eff;
	--background: #fff;
	--background-grey: #f5f5f5;
	--body-bg-color: #f5f6f7;
	--back-trn-85: rgba(255, 255, 255, 0.85);
	--back-trn-75: rgba(255, 255, 255, 0.75);
	--back-trn-6: rgba(255, 255, 255, 0.6);
	--float-btn-bg: rgba(200, 200, 200, 0.4);
	--main-border-color: rgba(50, 50, 50, 0.06);
	--main: #303133;
	--routine: #606266;
	--minor: #909399;
	--seat: #c0c4cc;
	--classA: #dcdfe6;
	--classB: #e4e7ed;
	--classC: #ebeef5;
	--classD: #f2f6fc;
	--radius-wrap: 8px;
	--radius-inner: 3.5px;
	--main-radius: var(--radius-inner);
	--text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
	--box-shadow: 0px 0px 20px -5px rgba(158, 158, 158, 0.22);
	--main-shadow: rgba(116, 116, 116, 0.08);
	--back-line-color-left: var(--theme);
	--back-line-color-right: #05D1D3;
	--back-line: linear-gradient(270deg, #986fee, #8695e6, #68b7dd, #18d7d3);
	--back-line-right: linear-gradient(to right, var(--back-line-color-left), var(--back-line-color-right));
	--transition: 0.1s;

	--main-bg-color: #fff;
	--key-color: #333;
	--main-color: #4e5358;
	--muted-color: #777;
	--muted-2-color: #999;
	--muted-3-color: #b1b1b1;
	--muted-color: #777;
	--focus-color: var(--theme);
	--muted-border-color: rgba(0, 0, 0, 0.03);
	--blur-bg: #ffffff;
}

/* 黑夜模式的配色方案 */
html body.dark-theme {
	/* --theme: #54b5db; */
	/* --background: #232323; */
	--background: #323335;
	--back-line-color-left: var(--theme);
	--back-line-color-right: #6a80e3;
	--back-line-right: linear-gradient(to right, var(--back-line-color-left), var(--back-line-color-right));
	--back-trn-85: rgba(35, 35, 35, 0.85);
	--back-trn-75: rgba(35, 35, 35, 0.75);
	--back-trn-6: rgba(35, 35, 35, 0.6);
	/* --main: #999; */
	--main: #b4b6bb;
	--routine: #888;
	--minor: #777;
	--seat: #666;
	--classA: #515253;
	--classB: #454545;
	--classC: #414243;
	--classD: #303030;
	--text-shadow: none;
	--box-shadow: none;

	--body-bg-color: #292a2d;
	/* --key-color: #f8fafc; */
	/* --main-color: #e5eef7; */
	/* --main-color: #b4b6bb; */
	--main-color: var(--main);
	--key-color: var(--main-color);
	--main-shadow: rgba(24, 24, 24, 0.1);
	--muted-color: #b4b6bb;
	--muted-2-color: #888a8f;
	--muted-3-color: #636469;
	/* --body-bg-color: #000102; */
	--main-bg-color: #323335;
	--muted-bg-color: #2d2e31;
	--main-border-color: rgba(114, 114, 114, 0.1);
	--muted-border-color: rgba(184, 184, 184, 0.02);
	--blur-bg: rgba(50, 51, 53, 0.8);
	--float-btn-bg: rgba(70, 70, 70, 0.4);
}

/* 深色模式下的网页背景颜色及文本颜色 */
/* 此处用于修改黑夜模式下没有覆盖到的小地方的样式 */
/* 保留需要切换的图片样式 */
body.dark-theme .joe_header__above-logo>.light,
body.dark-theme .footer .footer-logo>.light {
	display: none;
}

body.dark-theme .joe_header__above-logo>.dark,
body.dark-theme .footer .footer-logo>.dark {
	display: block;
}

/* 保留特殊元素样式 */
body.dark-theme .joe_detail__article blockquote {
	background: var(--classD);
	color: var(--routine);
	border-color: var(--classA);
}

body.dark-theme .joe_detail__article code:not([class]) {
	background: #fdf0ec38;
	color: #a6aba8;
}

body.dark-theme .joe_detail__article-anote {
	color: #ffffff9c;
}

body.dark-theme .joe_detail__article-abtn {
	color: #ffffff9c;
}

body.dark-theme .joe_detail__overdue-wrapper {
	background: var(--classD);
}

body.dark-theme .joe_list>li {
	background: var(--background);
}