/*
[Obsidian-Typora-Vue-Theme](https://github.com/ZekunC/Obsidian-Typora-Vue-Theme) (**v1.0.3**) is a theme for [Obsidian](https://obsidian.md/), which is inspired by [typora-vue-theme](https://github.com/blinkfox/typora-vue-theme)and [Blue Topaz](https://github.com/whyt-byte/Blue-Topaz_Obsidian-css/).
*/

/* The primary color is #42b983 or #42b883.*/
body{
	--accent-h: 153;
    --accent-s: 47%;
    --accent-l: 49%;
	--icon-color-hover: hsl(var(--interactive-accent-hsl));	
	--background-modifier-message: hsl(var(--interactive-accent-hsl));
    --background-modifier-hover: hsla(var(--interactive-accent-hsl), 0.05);
	--nav-item-color-hover: hsl(var(--interactive-accent-hsl));
    --nav-item-color-active: hsl(var(--interactive-accent-hsl));
	--table-header-weight: var(--bold-weight);
	--table-header-color: var(--text-normal);
	--h1-size: 2.2em;
	--h2-size: 1.75em;
	--h3-size: 1.4em;
	--h4-size: 1.2em;
	--h5-size: 1em;
	--h6-size: 1em;
}

.theme-light{
	--text-normal: #34495e;
	--background-secondary: #ffffff;
	--code-background: #f8f8f8;
	--cus-inline-code-text: #e96900;
	--cus-code-block-border: #f4f4f4;
	--cus-table-header: #f2f2f2;
	--cus-table-gap-tr: #fafafa;
	--table-row-background-hover: #f2f2f2;
	--cus-highlight-cursor-line: rgba(245,204,142,0.12);
}

.theme-dark{
	--text-normal: #EEEEEE;
	--code-background: #1a1a1a;
	--cus-inline-code-text: #f3b37f;
	--cus-code-block-border: #1c1c1c;
	--cus-table-header: #171717;
	--cus-table-gap-tr: #1a1a1a;
	--table-row-background-hover: #171717;
	--cus-highlight-cursor-line: rgba(225,225,225, 0.12);
}



.cm-blockid {
opacity: 0; /* 默认隐藏块ID */
}
.cm-blockid:hover {
opacity: 1; /* 鼠标悬停时显示块ID */
}

/* 当网站处于暗黑模式时，将 Logo 反色或增加亮度 */
.theme-dark .navbar-logo img, 
.theme-dark .site-body-left-column .nav-header img {
    filter: invert(1) brightness(2); /* 这会让深色线条变成白色/亮色 */
}

/* 统一 Logo 显示大小，避免突兀 */
.navbar-logo img {
    height: 32px;
    background: transparent !important; /* 强制背景透明 */
}





/* 大屏设备 */
@media (min-width: 768px) {
  img {
    max-width: 80%;  /* 屏幕宽度大于 768px 时，图片宽度最多为 80% */
  }
}

/* 小屏设备（如手机） */
@media (max-width: 767px) {
  img {
    max-width: 100%;  /* 小屏设备时，图片宽度为 100% */
  }
}

/* 适配官方发布的视频样式 */
.markdown-rendered video {
    display: block;
    width: 100%;
    max-width: 800px; /* 限制最大宽度，避免大屏幕太突兀 */
    margin: 1rem auto;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.25);
    background-color: #000;
}

/* 美化折叠组件 details */
.markdown-rendered details {
    border: 1px solid var(--background-modifier-border);
    border-radius: 10px;
    padding: 0.8em 1.2em;
    margin: 1em 0;
    background-color: var(--background-primary-alt);
    transition: all 0.3s ease;
}

/* 展开时的背景变深，增强层次感 */
.markdown-rendered details[open] {
    background-color: var(--background-primary);
    box-shadow: inset 0 0 10px rgba(0,0,0,0.05);
}

/* 美化点击区域 summary */
.markdown-rendered summary {
    cursor: pointer;
    font-weight: 600;
    color: var(--text-accent);
    outline: none;
    list-style: none; /* 隐藏默认箭头 */
}

/* 自定义展开图标 */
.markdown-rendered summary::-webkit-details-marker {
    display: none;
}

.markdown-rendered summary::before {
    content: "▶";
    display: inline-block;
    margin-right: 8px;
    transition: transform 0.2s ease;
}

.markdown-rendered details[open] summary::before {
    transform: rotate(90deg);
}

/* blockquote BEGIN*/
.markdown-rendered blockquote{
	padding: var(--size-4-2) var(--size-4-3);
	background-color: hsla(var(--interactive-accent-hsl), 0.1);
	border-left: 4px solid hsl(var(--interactive-accent-hsl));
}

.markdown-source-view.mod-cm6.is-live-preview .HyperMD-quote:before{
	border-left: 4px solid hsl(var(--interactive-accent-hsl));
}

.markdown-source-view.mod-cm6.is-live-preview .HyperMD-quote {
	background-color: hsla(var(--interactive-accent-hsl), 0.1);
}
/* blockquote END*/
.published-container {
    --footer-display: none;
}

/* code block BEGIN*/
.markdown-source-view.mod-cm6 .code-block-flair:hover, .markdown-rendered button.copy-code-button:hover{
	background-color: hsla(var(--interactive-accent-hsl), 0.1);
}

.cm-s-obsidian span.cm-inline-code{
	color: var(--cus-inline-code-text);
}

.markdown-rendered p code{
	color: var(--cus-inline-code-text);
}

.markdown-rendered pre{
	border:1px solid var(--cus-code-block-border);
}

.cm-s-obsidian div.HyperMD-codeblock-begin-bg{
	border-top: 1px solid var(--cus-code-block-border);
}

.cm-s-obsidian div.HyperMD-codeblock-end-bg{
	border-bottom: 1px solid var(--cus-code-block-border);
}

.markdown-source-view.mod-cm6 .cm-line.HyperMD-codeblock{
	border-left: 1px solid var(--cus-code-block-border);
	border-right: 1px solid var(--cus-code-block-border);
}

.markdown-rendered li code{
	color: var(--cus-inline-code-text);
}
/* code block END*/


/* table BEGIN*/
table thead{
	background-color: var(--cus-table-header);
	font-weight: bold;
}

table tr:nth-child(2n),
thead {
    background-color: var(--cus-table-gap-tr);
}
/* table END*/


/*Header BEGIN*/
.markdown-preview-view h1, .markdown-preview-view h2, .markdown-preview-view h3, .markdown-preview-view h4, .markdown-preview-view h5, .markdown-preview-view h6{
	position:relative;
}

.markdown-preview-view h1:hover::before, .HyperMD-header .cm-header-1:hover::before{
    content: 'h1';
    position: absolute;
    font-size: 10px;
    color: rgb(221 221 221);
    font-weight: 400;
    width: auto;
    left: -19px;
    border: 1px solid;
    padding: 0px 2px;
    border-radius: 3px;
    top: 1px;
}

.markdown-preview-view h2:hover::before, .HyperMD-header .cm-header-2:hover::before{
    content: 'h2';
    position: absolute;
    font-size: 10px;
    color: rgb(221 221 221);
    font-weight: 400;
    width: auto;
    margin: 0;
    left: -20px;
    border: 1px solid;
    padding: 0px 2px;
    border-radius: 3px;
    top: -4px;
}

.markdown-preview-view h3:hover::before, .HyperMD-header .cm-header-3:hover::before{
    content: 'h3';
    position: absolute;
    font-size: 10px;
    color: rgb(221 221 221);
    font-weight: 400;
    width: auto;
    margin: 0;
    left: -20px;
    border: 1px solid;
    padding: 0px 2px;
    border-radius: 3px;
    top: -6px;
}

.markdown-preview-view h4:hover::before, .HyperMD-header .cm-header-4:hover::before{
    content: 'h4';
    position: absolute;
    font-size: 10px;
    color: rgb(221 221 221);
    font-weight: 400;
    width: auto;
    margin: 0;
    left: -21px;
    border: 1px solid;
    padding: 0px 2px;
    border-radius: 3px;
    top: -8px;
}

.markdown-preview-view h5:hover::before, .HyperMD-header .cm-header-5:hover::before{
   content: 'h5';
    position: absolute;
    font-size: 10px;
    color: rgb(221 221 221);
    font-weight: 400;
    width: auto;
    margin: 0;
    left: -20px;
    border: 1px solid;
    padding: 0px 2px;
    border-radius: 3px;
    top: -11px;
}

.markdown-preview-view h6:hover::before, .HyperMD-header .cm-header-6:hover::before{
    content: 'h6';
    position: absolute;
    font-size: 10px;
    color: rgb(221 221 221);
    font-weight: 400;
    width: auto;
    margin: 0;
    left: -20px;
    border: 1px solid;
    padding: 0px 2px;
    border-radius: 3px;
    top: -11px;
}
/*Header END*/

/*Cursor line BEGIN*/
.cm-active.cm-line{
	background:var(--cus-highlight-cursor-line) !important;
}
/*Cursor line END*/

/*Hover Font color BEGIN*/
.menu-item:hover:not(.is-disabled):not(.is-label), .suggestion-item.is-selected{
	color: hsl(var(--interactive-accent-hsl));
}
/*Hover Font color END*/

/*Navigator File BEGIN*/
.nav-file-title.is-active::before{
	border-left: 4px solid hsl(var(--interactive-accent-hsl));
    content: "";
    position: absolute;
    left: 0px;
    top: 0;
    height: 100%;
}
/*Navigator File END*/

/* 强制 Logo 容器占满横向空间并居中 */
.nav-header, .navbar-brand {
    display: flex !important;
    width: 100% !important;
    justify-content: center !important; /* 水平居中 */
    align-items: center !important;     /* 垂直居中 */
    padding-right: 0 !important;        /* 关键：消除右侧给文字留的空隙 */
    margin: 0 auto !important;
}

/* 移除图片右侧默认的间距 */
.nav-header img, .navbar-logo img {
    margin-right: 0 !important;
    display: block !important;
}

/* 精准锁定截图中的标题元素并隐藏 */
.site-body-left-column-site-name {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
}

/* 右下角悬浮窗容器 */
#custom-site-footer {
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 9999;
    font-family: var(--font-interface);
}

.footer-group {
    display: flex;
    gap: 8px;
    background-color: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(10px);
    padding: 6px 12px;
    border-radius: 20px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
    align-items: center;
}

/* 通用按钮样式 */
.footer-btn {
    font-size: 12px;
    color: #555;
    text-decoration: none;
    white-space: nowrap;
}

/* 联系作者按钮 */
.link-btn {
    padding: 2px 8px;
    background-color: #2c3e50;
    color: white !important;
    border-radius: 12px;
    transition: background-color 0.2s;
}

.link-btn:hover {
    background-color: #34495e;
}

/* 统计与版权文字颜色微调 */
.stat-btn, .copyright-btn {
    color: #888;
    border-right: 1px solid #eee;
    padding-right: 8px;
}

.copyright-btn {
    border-right: none;
    padding-right: 0;
}

/* 移动端适配：缩小间距 */
@media (max-width: 480px) {
    #custom-site-footer {
        bottom: 15px;
        right: 15px;
    }
    .footer-group {
        padding: 4px 10px;
        gap: 6px;
    }
}