/* ================================================
   博客园 shadcn 风格 · 灰色系（全覆盖版）
   - 使用 shadcn 推荐的主题变量命名，便于全站换肤
   - 以中性灰为主色，不使用深蓝
   - 覆盖首页/列表/文章/侧边栏/评论/分页/日历/代码等
   ================================================= */

/* 主题变量（Light / Dark） */
:root{
  --background: 0 0% 100%;
  --foreground: 240 10% 3.9%;
  --card: 0 0% 100%;
  --card-foreground: 240 10% 3.9%;
  --popover: 0 0% 100%;
  --popover-foreground: 240 10% 3.9%;
  --primary: 240 5% 26%; /* 灰阶主色，不用蓝色 */
  --primary-foreground: 0 0% 98%;
  --secondary: 240 5% 96%;
  --secondary-foreground: 240 10% 3.9%;
  --muted: 240 5% 96%;
  --muted-foreground: 240 4% 46%;
  --accent: 240 4% 93%;
  --accent-foreground: 240 10% 3.9%;
  --destructive: 0 72% 50%;
  --destructive-foreground: 0 0% 98%;
  --border: 240 5% 84%;
  --input: 240 5% 84%;
  --ring: 240 6% 10%;
  --radius: 0.5rem;
}

.dark{
  --background: 240 10% 5%;
  --foreground: 0 0% 98%;
  --card: 240 10% 6%;
  --card-foreground: 0 0% 98%;
  --popover: 240 10% 5%;
  --popover-foreground: 0 0% 98%;
  --primary: 0 0% 92%;             /* 深色主色也保持灰阶 */
  --primary-foreground: 240 10% 5%;
  --secondary: 240 5% 12%;
  --secondary-foreground: 0 0% 98%;
  --muted: 240 5% 15%;
  --muted-foreground: 240 5% 65%;
  --accent: 240 5% 12%;
  --accent-foreground: 0 0% 98%;
  --destructive: 0 62% 40%;
  --destructive-foreground: 0 0% 98%;
  --border: 240 4% 26%;
  --input: 240 4% 26%;
  --ring: 240 5% 65%;
}

/* 基础重置与通用 */
*,*::before,*::after{ box-sizing: border-box; }
html,body{ margin:0!important; padding:0!important; background:hsl(var(--background))!important; color:hsl(var(--foreground))!important; }
body{
  font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC",sans-serif;
  font-size:16px; line-height:1.7; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
::selection{ background:hsl(var(--primary) / .18); }

a{ color:hsl(var(--primary)); text-decoration:none; transition:color .2s; }
a:hover{ text-decoration:underline; }
a:focus-visible{ outline:2px solid hsl(var(--ring)); outline-offset:2px; border-radius:6px; }

img,video,canvas,iframe{ max-width:100%; height:auto; }
ul,ol{ padding-left:1.25rem; }
h1,h2,h3,h4,h5,h6{ font-weight:700; line-height:1.3; margin:1.5rem 0 .75rem; }

/* 输入与按钮 */
input,select,textarea,button{ font:inherit; color:inherit; }
input[type="text"],input[type="search"],input[type="email"],input[type="url"],input[type="password"],textarea,select{
  width:100%; background:hsl(var(--background)); border:1px solid hsl(var(--border));
  color:hsl(var(--foreground)); border-radius:var(--radius); padding:.6rem .75rem; transition:border-color .2s,box-shadow .2s;
}
input:focus,textarea:focus,select:focus{ border-color:hsl(var(--ring)); box-shadow:0 0 0 3px hsl(var(--ring) / .15); }
button,.btn,input[type="button"],input[type="submit"]{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  background:hsl(var(--primary)); color:hsl(var(--primary-foreground));
  border:1px solid hsl(var(--primary)); border-radius:var(--radius);
  padding:.5rem .9rem; font-weight:600; cursor:pointer; transition:opacity .2s,transform .08s;
}
button:hover{ opacity:.95; } button:active{ transform:translateY(1px); }

/* 布局与头部 */
#home,#main,#mainContent,#sideBar,#header,#footer,#navigator{ background:transparent!important; border:0!important; }
#header{ padding:2rem 1rem 1rem; border-bottom:1px solid hsl(var(--border)); }
#blogTitle h1,#blogTitle .title,#blogTitle a{ margin:0; font-size:2rem; font-weight:800; color:hsl(var(--foreground))!important; text-decoration:none; }
#blogTitle .subtitle,#blogSubtitle{ margin-top:.5rem; color:hsl(var(--muted-foreground)); }

#navigator{ margin-top:.75rem; padding:.25rem 0 .75rem; border-bottom:1px solid hsl(var(--border)); }
#navList{ display:flex; flex-wrap:wrap; gap:.75rem 1.25rem; list-style:none; padding:0; margin:0; }
#navList a{ color:hsl(var(--muted-foreground))!important; border-bottom:2px solid transparent; padding:.4rem 0; font-weight:600; }
#navList a:hover{ color:hsl(var(--foreground))!important; border-bottom-color:hsl(var(--primary)); }

#main{ max-width:1200px; margin:0 auto; padding:1.25rem; display:grid; grid-template-columns:1fr; gap:2rem; }
@media (min-width: 992px){ #main{ grid-template-columns:minmax(0,1fr) 320px; } }
#mainContent,.forFlow{ min-width:0; display:flex; flex-direction:column; gap:1.25rem; }

/* 列表卡片 */
.day,.entrylist,.entrylistItem,.post,.PostList{
  background:hsl(var(--card)); border:1px solid hsl(var(--border)); border-radius:var(--radius); overflow:hidden; transition:box-shadow .2s;
}
.day:hover,.entrylistItem:hover{ box-shadow:0 8px 20px -12px rgb(0 0 0 / .35); }
.dayTitle,.entrylistTitle,.PostListTitle{
  background:hsl(var(--muted)); color:hsl(var(--muted-foreground));
  margin:0; padding:.75rem 1rem; font-weight:700; border-bottom:1px solid hsl(var(--border));
}
.postTitle,.postTitle2,.entrylistItemTitle{ margin:0; padding:1rem 1rem .3rem; font-size:1.4rem; font-weight:800; }
.postTitle a,.postTitle2 a,.entrylistItemTitle a{ color:hsl(var(--foreground))!important; text-decoration:none; }
.postTitle a:hover{ color:hsl(var(--primary))!important; }

.postCon,.entrylistPostSummary,.c_b_p_desc{ color:hsl(var(--muted-foreground)); padding:0 1rem .75rem; }
.postDesc,.entrylistItemPostDesc{ padding:.75rem 1rem 1rem; border-top:1px dashed hsl(var(--border)); color:hsl(var(--muted-foreground)); display:flex; gap:1rem; flex-wrap:wrap; font-size:.9rem; }

/* 文章详情 */
#post_detail,#topics{ background:hsl(var(--card)); border:1px solid hsl(var(--border)); border-radius:var(--radius); overflow:hidden; }
#post_detail{ padding:1.25rem; }
#post_detail .postTitle,#topics .postTitle{ font-size:2rem; margin:0 0 1rem!important; padding:0 0 .75rem!important; border-bottom:1px solid hsl(var(--border)); }
#post-date,.post-meta{ color:hsl(var(--muted-foreground)); font-size:.9rem; }

/* 正文排版 */
#cnblogs_post_body,.cnblogs-markdown{ color:hsl(var(--foreground)); font-size:1rem; line-height:1.85; }
#cnblogs_post_body h1{ font-size:1.8rem; border-bottom:1px solid hsl(var(--border)); padding-bottom:.5rem; }
#cnblogs_post_body h2{ font-size:1.5rem; margin-top:1.75rem; }
#cnblogs_post_body h3{ font-size:1.25rem; }
#cnblogs_post_body a{ color:hsl(var(--primary)); font-weight:500; }
#cnblogs_post_body blockquote{
  border-left:4px solid hsl(var(--primary)); background:hsl(var(--muted));
  padding:.9rem 1rem; margin:1.25rem 0; border-radius:0 var(--radius) var(--radius) 0;
}
#cnblogs_post_body table{ width:100%; border-collapse:collapse; margin:1.25rem 0; border:1px solid hsl(var(--border)); border-radius:var(--radius); overflow:hidden; }
#cnblogs_post_body th,#cnblogs_post_body td{ border-bottom:1px solid hsl(var(--border)); padding:.6rem .75rem; text-align:left; }
#cnblogs_post_body th{ background:hsl(var(--muted)); font-weight:700; }

/* 代码块（含 highlight.js 与 syntaxhighlighter 兜底） */
#cnblogs_post_body pre,.cnblogs_code pre,pre code,.syntaxhighlighter,.hljs{
  background:hsl(var(--muted))!important; color:hsl(var(--foreground))!important;
  border:1px solid hsl(var(--border))!important; border-radius:var(--radius)!important;
  padding:.9rem 1rem!important; font-family:ui-monospace,Menlo,Consolas,"Fira Code",monospace!important; font-size:.92rem!important; line-height:1.6!important; overflow:auto;
}
#cnblogs_post_body code{ background:hsl(var(--muted)); border:1px solid hsl(var(--border)); border-radius:6px; padding:.15rem .35rem; }
/* 朴素代码块：去掉窗口装饰/标题条/阴影，保持等宽对齐 */
#cnblogs_post_body pre,
.cnblogs-markdown pre,
.postBody pre,
.cnblogs_code pre {
  background: #0f0f10 !important;          /* 深色背景，可按需改 */
  color: #e6e6ea !important;                /* 文本色 */
  border: 1px solid #2a2a2a !important;
  border-radius: 8px !important;
  padding: 12px 14px !important;
  box-shadow: none !important;
  white-space: pre !important;              /* 不换行，保证 ASCII 图形不被折行 */
  overflow: auto !important;
  letter-spacing: 0 !important;             /* 避免字距影响对齐 */
}

#cnblogs_post_body pre code,
.cnblogs-markdown pre code,
.postBody pre code,
.cnblogs_code pre code {
  font-family: ui-monospace, "Cascadia Mono", "Fira Code", Consolas, Menlo, Monaco, "SFMono-Regular", "Liberation Mono", monospace !important;
  font-size: 13.5px !important;
  line-height: 1.6 !important;
  font-variant-ligatures: none !important;  /* 关连字，避免 -> 之类变形 */
}

/* 去掉代码块装饰/语言牌/三色小圆点等伪元素 */
#cnblogs_post_body pre::before,
#cnblogs_post_body pre::after,
.cnblogs-markdown pre::before,
.cnblogs-markdown pre::after,
pre[class*="language-"]::before,
pre[class*="language-"]::after {
  content: none !important;
}

/* 代码里的链接不变蓝、不加下划线（防止“看起来像链接”的词被误染色） */
#cnblogs_post_body pre a,
.cnblogs-markdown pre a,
.postBody pre a,
.cnblogs_code pre a {
  color: inherit !important;
  text-decoration: none !important;
}

/* 如果出现行号或左侧栏，把它关掉 */
.line-numbers-rows,
pre .gutter,
pre .linenums {
  display: none !important;
}

/* 目录 */
#cnblogs_toc,#toc,#toc_container,.toc{
  background:hsl(var(--accent)); border:1px solid hsl(var(--border)); color:hsl(var(--foreground));
  border-radius:var(--radius); padding:.75rem 1rem; font-size:.95rem;
}

/* 标签/分类/上一篇下一篇 */
#EntryTag a,#BlogPostCategory a{
  display:inline-block; padding:.15rem .6rem; margin:.25rem .35rem .25rem 0;
  background:hsl(var(--muted)); color:hsl(var(--foreground)); border:1px solid hsl(var(--border)); border-radius:999px; text-decoration:none;
}
#EntryTag a:hover,#BlogPostCategory a:hover{ border-color:hsl(var(--primary)); color:hsl(var(--primary)); }

/* 侧边栏 */
#sideBar,#sideBarMain{ display:flex; flex-direction:column; gap:1rem; }
.catListTitle,.sideTitle{ background:hsl(var(--muted)); color:hsl(var(--foreground)); font-weight:700; border:1px solid hsl(var(--border)); border-radius:var(--radius) var(--radius) 0 0; padding:.75rem .9rem; }
.catListView,.list,.sidebar-block,#blog-news,#sidebar_news{
  background:hsl(var(--card)); border:1px solid hsl(var(--border)); border-top:0; border-radius:0 0 var(--radius) var(--radius); padding:.75rem .9rem;
}
#sideBar a{ color:hsl(var(--muted-foreground)); text-decoration:none; }
#sideBar a:hover{ color:hsl(var(--primary)); }

/* 日历 */
#blog-calendar,.Cal{ background:hsl(var(--card)); border:1px solid hsl(var(--border)); border-radius:var(--radius); overflow:hidden; }
.CalTitle{ background:hsl(var(--muted)); font-weight:700; padding:.5rem .75rem; border-bottom:1px solid hsl(var(--border)); }
.CalTodayDay{ background:hsl(var(--accent)); font-weight:700; }

/* 分页 */
#pager,.post-pager,#nav_next_page{
  margin:1.5rem 0; display:flex; justify-content:center; gap:.4rem; flex-wrap:wrap;
}
#pager a,.post-pager a{
  display:inline-flex; align-items:center; justify-content:center; min-width:2.25rem; height:2.25rem;
  padding:0 .75rem; border:1px solid hsl(var(--border)); border-radius:var(--radius);
  background:hsl(var(--background)); color:hsl(var(--foreground)); font-weight:600; text-decoration:none; transition:background .2s,border-color .2s;
}
#pager a:hover{ background:hsl(var(--muted)); }
#pager .current{ background:hsl(var(--primary)); color:hsl(var(--primary-foreground)); border-color:hsl(var(--primary)); }

/* 评论 */
.feedback_area_title{ font-size:1.25rem; font-weight:800; margin:2rem 0 1rem; padding-bottom:.5rem; border-bottom:1px solid hsl(var(--border)); }
#comment_form{ background:hsl(var(--card)); border:1px solid hsl(var(--border)); border-radius:var(--radius); padding:1rem; }
#blog-comments-placeholder .feedbackItem,.feedbackItem{
  background:hsl(var(--card)); border:1px solid hsl(var(--border)); border-radius:var(--radius); padding:.75rem 1rem; margin:.75rem 0;
}
.feedbackCon{ color:hsl(var(--foreground)); }
.feedbackManage{ color:hsl(var(--muted-foreground)); font-size:.9rem; }

/* 页脚 */
#footer{ margin-top:2rem; padding:1.25rem; border-top:1px solid hsl(var(--border)); color:hsl(var(--muted-foreground)); }

/* 响应式 */
@media(max-width:767.98px){
  #header{ padding:1.25rem 1rem .75rem; }
  #blogTitle h1,#blogTitle .title{ font-size:1.65rem; }
  #main{ padding:1rem; gap:1.25rem; }
  #post_detail .postTitle{ font-size:1.6rem; }
}

/* 兜底：强制白/暗背景，避免皮肤残留 */
#home,body,#main,#mainContent,#sideBar,#header,#footer{ background-color:hsl(var(--background))!important; }


/* ========== 可折叠代码块 ========== */
/* 可调参数 */
:root {
  --cb-collapsed-height: 280px;   /* 折叠时最大高度 */
  --cb-btn-fg: #cfd2d8;
  --cb-btn-bg: rgba(255,255,255,0.04);
  --cb-btn-br: rgba(255,255,255,0.10);
  --cb-btn-fg-hover: #ffffff;
  --cb-btn-bg-hover: rgba(255,255,255,0.08);
  --cb-btn-br-hover: rgba(255,255,255,0.18);
}

.cb-codebox { position: relative; border-radius: 8px; }
.cb-codebox pre { margin: 0 !important; }

/* 折叠效果：限制高度 + 渐隐遮罩 */
.cb-codebox.cb-collapsed pre {
  max-height: var(--cb-collapsed-height);
  overflow: hidden !important;
}
.cb-codebox .cb-fade {
  position: absolute; left: 0; right: 0; bottom: 0; height: 64px;
  pointer-events: none; z-index: 1; display: none;
  /* 背景色会在 JS 中按实际代码块背景色自动设置 */
  background: linear-gradient(180deg, rgba(0,0,0,0), rgba(15,15,16,0.98));
}
.cb-codebox.cb-collapsed .cb-fade { display: block; }

/* 工具条（右上角） */
.cb-codebox .cb-tools {
  position: absolute; top: 8px; right: 8px; z-index: 2;
  display: flex; gap: 6px; align-items: center;
}
.cb-codebox .cb-btn {
  -webkit-user-select: none; user-select: none;
  cursor: pointer; font-size: 12px; line-height: 20px;
  padding: 0 8px; border-radius: 6px; border: 1px solid var(--cb-btn-br);
  color: var(--cb-btn-fg); background: var(--cb-btn-bg);
  backdrop-filter: saturate(1.2) blur(2px);
}
.cb-codebox .cb-btn:hover { color: var(--cb-btn-fg-hover); background: var(--cb-btn-bg-hover); border-color: var(--cb-btn-br-hover); }
.cb-codebox .cb-meta { opacity: .75; font-size: 12px; margin-right: 4px; }

/* 双击提示（可选，不喜欢可删） */
.cb-codebox .cb-hint {
  position: absolute; bottom: 10px; left: 12px; z-index: 2;
  font-size: 12px; color: rgba(255,255,255,.55); display: none;
}
.cb-codebox.cb-collapsed .cb-hint { display: block; }

/* 给某段代码显式禁用折叠：在代码块外层或 pre 上加 class="no-fold" */
.no-fold, .no-fold pre { /* 占位，便于选择器排除 */ }

/* 保证 ASCII 图形不被折行（你之前的设置若已包含可忽略） */
#cnblogs_post_body pre,
.cnblogs-markdown pre,
.postBody pre,
.cnblogs_code pre {
  white-space: pre !important;
  letter-spacing: 0 !important;
  font-variant-ligatures: none !important;
}

#header {
background: #0c0d0f;
border-bottom: 1px solid #22252a;
box-shadow: inset 0 -1px 0 rgba(255,255,255,0.02);
padding: 12px 16px;
margin-bottom: 12px;
}
#blogTitle { margin: 0 0 6px 0; }
#blogTitle h1, #blogTitle h1 a, #Header1_HeaderTitle, a.headermaintitle {
font-size: 20px !important;
font-weight: 700;
color: #e8eaee !important;
text-decoration: none !important;
}
#blogTitle h2, #blog_subtitle { margin-top: 4px; color: #aab0b7; font-size: 13px; font-weight: 400; }

/* 统计行 */
#navigator .blogStats, .blogStats {
margin: 6px 0 10px 0;
color: #9aa0a6;
font-size: 12px;
line-height: 1.6;
}

/* 导航条 */
#navigator { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
#navList { display: flex; gap: 8px; list-style: none; padding: 0; margin: 0; }
#navList li { margin: 0; padding: 0; }
#navList a {
display: inline-flex; align-items: center; height: 28px; line-height: 28px;
padding: 0 10px; border-radius: 8px;
color: #cfd2d8; text-decoration: none;
border: 1px solid rgba(255,255,255,0.10);
background: rgba(255,255,255,0.04);
backdrop-filter: saturate(1.2) blur(2px);
}
#navList a:hover {
color: #fff;
background: rgba(255,255,255,0.08);
border-color: rgba(255,255,255,0.18);
}
#navList img { height: 14px; width: auto; margin-left: 4px; vertical-align: middle; opacity: .9; }

/* 让内容与头部分离一点 */
#main, #home #mainContent, #container { margin-top: 6px; }

/* 大屏时让标题、统计、导航排版更紧凑 */
@media (min-width: 900px) {
#header { padding: 14px 24px; }
#blogTitle h1 a { font-size: 22px !important; }
}