/*
 * ===================================================================
 * 优化说明:
 *
 * 1.  引入 CSS 变量 (根作用域 :root): 统一管理网站的主题颜色、字体、
 *     容器宽度等，便于维护和一键换肤。
 * 2.  结构化重组: 将样式按逻辑功能（全局, 布局, 头部, 主体, 侧栏,
 *     页脚, 组件）重新排序，并添加清晰的注释，增强可读性。
 * ===================================================================
 */

/* --- 1. 根变量与全局重置 --- */
:root {
    /* 颜色体系 */
    --color-primary: #c89f64;
    --color-primary-dark: #b08d57;
    --color-primary-text: #7c4328;
    --color-primary-text-light: #8c6f4b;
    --color-primary-bg-light: #fcfaf5;
    --color-primary-border-light: #e0d9c9;

    --color-accent-red: #e4393c;
    --color-accent-red-dark: #c00;
    
    --color-text-base: #333;
    --color-text-555: #555;
    --color-text-secondary: #666;
    --color-text-muted: #999;
    --color-text-white: #fff;
    --color-text-footer: #888;
    --color-global:#eee;
    --color-yj-all:#d9534f;
    
    --color-bg-base: #fff;
    --color-bg-dark: #333;
    --color-bg-light-gray: #f5f5f5;
    --color-border-light: #e0e0e0;
    --color-border-base: #ddd;
    --color-bottom-daek:#2196F3;
    --color-bg-card: #fff;
    /*page*/
    --color-page-select:#2979ff;
    --color-page-hover:#d4e4ff;
    /* 字体体系 */
    --font-family-base: 'Microsoft YaHei','PingFang SC', '微软雅黑',Tahoma,Helvetica,'SimSun', Arial, sans-serif;

    /* 布局尺寸 */
    --container-width: 1200px;
    --sidebar-width: 300px;
    --layout-gap: 20px;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: var(--font-family-base);
    font-size: 14px;
    line-height: 1.6;
    color: var(--color-text-base);
    background: var(--color-bg-base) url(//www.zgjm2008.com/zgjm2008/images/main_body_bg.gif) center -1px repeat-x;
}

a {
    text-decoration: none;
    color: #005aa0;
}
a:hover {
    text-decoration: underline;
    color: var(--color-accent-red);
}
/* --- imgload --- 
img[loading='lazy'][src$=".jpg"],
img[loading='lazy'][src$=".gif"],
img {
  background: url('https://www.zgjm2008.com/static/images/loading.gif') center no-repeat #EDEFF6;
  background-size: contain;
}
*/
/* --- 2. 布局与容器 --- */
.container {
    width: var(--container-width);
    margin: 0 auto;
    padding: 0 15px;
}

.content-wrapper {
    display: flex;
    gap: 20px;
    align-items: flex-start; /* 关键：让子项从顶部开始对齐，不拉伸 */
}

.left-column-area {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: var(--layout-gap);
}

.sidebar {
    width: var(--sidebar-width);
    flex-shrink: 0;
}

/* --- 3. 页面头部 (Header) --- */
.page-header {
   /*  border-bottom: 1px solid var(--color-border-light);  */
    box-shadow: 0px 4px 4px -4px rgba(0,0,0,0.25);
}

.top-bar {
    padding: 5px 0;
    font-size: 12px;
    background-color: var(--color-bg-base);
    border-bottom: 1px solid var(--color-global);
}
.top-bar, .top-bar a {
    color: var(--color-text-secondary);
}

.main-header {
    padding: 10px 0;
}

.header-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.logo img,
.header-banner img {
    max-height: 88px;
    display: block;
}

.header-banner {
    text-align: center;
    background: var(--color-bg-card);
}

.search-area {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}
.search-form-group {
    display: flex;
}
.search-area input[type="text"] {
    width: 350px;
    padding: 8px 12px;
    border: 2px solid var(--color-primary);
    font-size: 14px;
}
.search-area button {
    padding: 8px 20px;
    margin-left: -2px; /* Overlap border */
    border: 2px solid var(--color-primary);
    background-color: var(--color-primary);
    color: var(--color-text-white);
    font-size: 14px;
    cursor: pointer;
}

.hot-searches {
    margin-top: 8px;
    font-size: 12px;
    color: var(--color-text-muted);
}
.hot-searches a {
    color: var(--color-accent-red);
    margin: 0 5px;
}

.main-nav {
    height: 45px;
    background-color: var(--color-primary);
}
/* 这个类将由 jQuery 动态添加 */
.fixed-nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0; /* 使用 left 和 right 可以自适应宽度 */
  z-index: 1000; /* 确保在最上层 */
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
  background-color: rgba(200, 159, 100, 0.5); 

  /* (可选) 如果想让背景更模糊，更有毛玻璃效果 (现代浏览器支持) */
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);

}

.nav-placeholder {
  display: none; /* 默认隐藏 */
}
  /* --- ↑↑↑ 修改结束 ↑↑↑ --- */
.main-nav ul {
    list-style: none;
    display: flex;
}
.main-nav ul li a {
    display: block;
    padding: 0 21px;
    line-height: 45px;
    color: var(--color-text-white);
    font-size: 16px;
    text-decoration: none;
}
.main-nav ul li a:hover,
.main-nav ul li a.active {
    background-color: var(--color-primary-dark);
}

.sub-nav {
    background-color: var(--color-bg-card);
    padding: 8px 0;
    width: 100%;
}

.sub-nav ul {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    padding-left: 10px;
    margin: 0 auto;
}

.sub-nav ul li {
    margin-right: 25px;
}

.sub-nav ul li:last-child {
    margin-right: 0;
}

.sub-nav ul li a {
    color: var(--color-primary-text-light);
    font-size: 14px;
}

.sub-nav ul li a.active_nav {
    display: block;
    border-bottom:2px var(--color-page-select)  solid;
}


/* --- 4. 页面主体 (Main) --- */
.page-main {
    padding: 15px 0; /* 修改这里：之前是 0 0，现在顶部增加 20px 间距 */
}


/* --- 4. 页面主体 (Mains) --- */
.page-main-nav {
    padding: 15px 0;
}

/* 4.1 首页及通用内容块 */
.main-content {
    flex: 1;  /* For homepage layout */
    background-color: var(--color-bg-card);
    border-radius: 2px;
    padding: 20px;
    box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.1);
}
/* --- 新增：匹配图片的列表头样式 --- */
.list-header-title {
    /* 字体样式 */
    font-size: 18px;        /* 标题字体大小 */
    font-weight: 700;    /* 普通字重，不加粗 */
    color: var(--color-text-muted);
    
    /* 布局与间距 */
    margin: 0 0 20px 0;     /* 标题与下方列表的间距 */
    padding: 0 0 15px 5px;    /* 标题文字与下方分割线的间距 */
    
    /* 视觉元素 */
    border: none;           /* 确保无其他边框 */
    border-bottom: 1px solid var(--color-global); /* 关键：添加图片中的浅灰色下划线 */
}

.category-block {
    margin-bottom: 30px;
}

.category-title {
    display: flex;
    align-items: center;
    padding-bottom: 10px;
    margin-bottom: 15px;
    border-bottom: 1px solid var(--color-global);
    font-size: 18px;
    color: var(--color-primary-text-light);
}
.category-title a {
    color: #884b29;
}
.category-title .more-link {
    margin-left: auto;
    font-size: 14px;
    font-weight: normal;
    color: var(--color-text-muted);
}

.category-title::before {
    content: '';
    display: inline-block;
    width: 36px;
    height: 36px;
    margin-right: 8px;
    flex-shrink: 0;
    background-image: url('//zgjm2008.com/zgjm2008/images/icon.png');
    background-repeat: no-repeat;
    background-size: auto 36px; /* Key: Scale sprite by height */
    background-position-y: center;
}
/* Sprite Positions (Scaled from original 76px steps) */
.tu1::before  { background-color: #27AE60; background-position-x: 0; }
.tu2::before  { background-color: #2980B9; background-position-x: -36px; }
.tu3::before  { background-color: #8E44AD; background-position-x: -72px; }
.tu4::before  { background-color: #E67E22; background-position-x: -108px; }
.tu5::before  { background-color: #E74C3C; background-position-x: -144px; }
.tu6::before  { background-color: #16A085; background-position-x: -180px; }
.tu7::before  { background-color: #F1C40F; background-position-x: -216px; }
.tu8::before  { background-color: #7F8C8D; background-position-x: -252px; }
.tu9::before  { background-color: #3498DB; background-position-x: -288px; }
.tu10::before { background-color: #2ECC71; background-position-x: -325px; }
.tu11::before { background-color: #9B59B6; background-position-x: -360px; }

.terms-list a {
    display: inline-block;
    margin: 0 20px 10px 0;
    color: var(--color-primary-text);
    font-size: 15px;
}
.article-list { list-style: none; }
.article-list li {
    padding: 5px 0;
    border-bottom: 1px dashed var(--color-border-base);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.article-list li a { color: var(--color-primary-text); }
.article-list li a::before {
    content: '';
    display: inline-block;
    width: 14px; 
    height: 14px; 
    background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAEaSURBVEiJY2AYBcMdMFNuhAOLgJzYSi5+KavvH5/tpJvFQnKivQwMjEkMDIwWXPxSAsRazkSZpab9/xkYC5CEGInVS7RCQpYyMvyf+O7R6QJ8eii2mFJLybKYGpaSbDG1LCXJYmpaSrTF1LaUKItpYSlBi2llKV6LBRRMDRj/Mp5mYGRggQq9YPn+RfX162tfqGExzpLrw4PTF/4xMkYy/Gf4AxWS+MPJs11UVIuHGhYTjGN+OfMQpv//lyP5/AjL9y+elPqcqFRNC8uJzsfUtpykkoualpNcVlPLcrJqJ2pYTnZ9TKnlZLdAPj46uQYtn9v84eDeTKx+ipo+KJb/Z/jzj5FpKiXmkQz45cxD+OXMQ+hq6SggFgAATVSxF9rYOfQAAAAASUVORK5CYII=') no-repeat;
    background-size: contain;
   transform: scaleX(-1); 
   margin-right: 8px;
 
}
.article-title {
    font-size: 24px;
    text-align: center;
    margin: 15px 0;
    color: var(--color-text-base);
}
.article-meta {
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--color-global);
    font-size: 12px;
    text-align: center;
    color: var(--color-text-muted);
    background: url('data:image/svg+xml;utf8,<svg viewBox="0 0 1440 320" xmlns="http://www.w3.org/2000/svg"><path fill="%233498db" fill-opacity="0.05" d="M0,192L48,181.3C96,171,192,149,288,149.3C384,149,480,171,576,186.7C672,203,768,213,864,197.3C960,181,1056,139,1152,133.3C1248,128,1344,160,1392,176L1440,192L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>') 
        repeat-x; /* 使用SVG路径定义波浪形状 */
       animation: wave 10s linear infinite; /* 添加波浪动画 */

}
.article-meta span { margin: 0 10px; }

.article-content {
    font-size: 16px;
    line-height: 2;
    color: #444;
}
.article-content p { margin-bottom: 20px; }
.article-content img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: 25px auto;
    border-radius: 4px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.08);
}
.article-content h2, .article-content h3 {
    font-size: 20px;
    color: var(--color-primary-text-light);
    padding-left: 15px;
    margin: 30px 0 15px 0;
    border-left: 4px solid var(--color-primary);
}
/* --- 核心：净化混乱的链接 --- */
.article-content a.infotextkey {
    color: inherit !important; /* 强制继承父元素颜色，去除链接蓝色 */
    text-decoration: none !important; /* 强制去除下划线 */
 
}
/* 解决嵌套链接的问题，确保内层链接也被正确处理 */
.article-content a.infotextkey a.infotextkey {
     display: inline; /* 避免嵌套导致格式错乱 */
}

/* --- 结构化样式：区分标题、段落和列表 --- */

/* 1. 开篇引言 (blockquote) */
.article-content blockquote {
    font-size: 1.1em;
    color: #495057;
    border-left: 4px solid #007bff; /* 使用蓝色作为强调色 */
    padding: 10px 20px;
    margin: 0 0 35px 0;
    background-color: #f8f9fa;
    border-radius: 0 5px 5px 0;
}
.article-content blockquote p {
    margin: 0; /* 清除引言内部p标签的默认边距 */
}

/* 2. 普通段落 (p) */
.article-content p {
    margin-top: 0;
    margin-bottom: 1.5em; /* 确保段落间有足够间距 */
    font-size: 16px;
}

/* 3. 识别并美化章节标题 (那些后面跟着列表的<p>标签) */
/* 使用:has()选择器，现代浏览器支持良好 */
.article-content p:has(+ ol) {
    font-size: 1.8em;
    font-weight: 600;
    color: #212529;
    margin-top: 45px;
    margin-bottom: 25px;
    padding-bottom: 12px;
    border-bottom: 2px solid #e9ecef;
}

/* 4. 美化名字列表 (ol, li) */
.article-content ol {
    list-style: none; /* 移除默认的 "1. 2. 3." */
    padding-left: 0;
    counter-reset: name-list-counter; /* 初始化自定义计数器 */
}

.article-content ol li {
    counter-increment: name-list-counter; /* 列表项计数器+1 */
    margin-bottom: 25px;
    position: relative;
    padding-left: 50px; /* 为自定义序号留出空间 */
}

/* 创建漂亮的自定义列表序号 */
.article-content ol li::before {
    content: counter(name-list-counter); /* 显示计数器的数字 */
    position: absolute;
    left: 0;
    top: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%; /* 圆形背景 */
    background-color: #007bff; /* 与引言强调色一致 */
    color: #ffffff;
    font-weight: bold;
    text-align: center;
    line-height: 32px;
    font-size: 0.95em;
}

/* 列表项内的段落样式重置 */
.article-content li p {
    margin: 0;
    font-size: 1.05em; /* 名字列表的字体可以稍大一点 */
}

/* 5. 最后“建议与提醒”部分的特殊样式 */
.article-content p:last-of-type {
    margin-top: 30px;
    padding: 20px;
    background: #fff9e6; /* 使用淡黄色背景突出 */
    border-left: 4px solid #ffc107; /* 黄色强调线 */
    border-radius: 5px;
}
        
.article-summary-box {
    padding: 20px;
    margin: 25px 0;
    background-color: var(--color-primary-bg-light);
    border: 1px solid #f2eee3;
    border-left: 4px solid #ead9a5;
    font-size: 14px;
    line-height: 1.8;
    color: var(--color-text-secondary);
}
.article-summary-box strong {
    color: var(--color-primary-text-light);
}

.article-tags {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid var(--color-global);
    font-size: 14px;
}
.article-tags strong {
    font-weight: bold;
    color: var(--color-text-base);
    margin-right: 10px;
}
.article-tags a {
    display: inline-block;
    padding: 5px 12px;
    margin: 0 8px 8px 0;
    border-radius: 4px;
    background-color: var(--color-bg-light-gray);
    color: #777;
    transition: all 0.2s ease;
}
.article-tags a:hover {
    background-color: #ead9a5;
    color: var(--color-text-base);
}

.category-grid-list {
    list-style: none;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px 0;
}
.category-grid-list li {
    padding-right: 20px;
}
.category-grid-list li:nth-child(3n) {
    border-right: none;
    padding-right: 0;
}
.category-grid-list li a {
    display: flex;
    align-items: center; /* 垂直居中 */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--color-primary-text);
    font-size: 14px;
}
.category-grid-list li a::before {
    content: '';
    display: inline-block;
    width: 14px; /* 根据您的图片尺寸调整 */
    height: 14px; /* 根据您的图片尺寸调整 */
    background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAEaSURBVEiJY2AYBcMdMFNuhAOLgJzYSi5+KavvH5/tpJvFQnKivQwMjEkMDIwWXPxSAsRazkSZpab9/xkYC5CEGInVS7RCQpYyMvyf+O7R6QJ8eii2mFJLybKYGpaSbDG1LCXJYmpaSrTF1LaUKItpYSlBi2llKV6LBRRMDRj/Mp5mYGRggQq9YPn+RfX162tfqGExzpLrw4PTF/4xMkYy/Gf4AxWS+MPJs11UVIuHGhYTjGN+OfMQpv//lyP5/AjL9y+elPqcqFRNC8uJzsfUtpykkoualpNcVlPLcrJqJ2pYTnZ9TKnlZLdAPj46uQYtn9v84eDeTKx+ipo+KJb/Z/jzj5FpKiXmkQz45cxD+OXMQ+hq6SggFgAATVSxF9rYOfQAAAAASUVORK5CYII=') no-repeat;
    background-size: contain;
    transform: scaleX(-1); /* 水平翻转 */
    margin-right: 8px;
}

/* 4.3 相关/推荐阅读 */
.related-articles,
.recommended-reading {
     border: 1px solid var(--color-primary-border-light);
    background-color: var(--color-bg-base);
    border-radius: 2px;
}
.related-header,
.recommended-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 15px;
    background-color: #f7f4ed;
    border-bottom: 1px solid var(--color-primary-border-light);
    font-size: 16px;
    color: var(--color-primary-text-light);
    font-weight: bold;
}
.related-header .more-link {
    font-size: 12px;
    font-weight: normal;
    color: var(--color-text-muted);
}
.related-list-wrapper {
    padding: 15px;
    background: url('//www.zgjm2008.com/zgjm2008/images/sybg.png') repeat;
}
.related-list {
    list-style: none;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px 20px;
}
.related-list li a {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--color-primary-text);
    font-size: 14px;
}
.related-list li a::before {
    content: '·';
    color: var(--color-primary);
    font-weight: bold;
    margin-right: 8px;
    text-decoration: none; /* Keep underline on link hover only */
}

.recommended-reading {
    border: none;
    background: none;
}
.recommended-heading {
    margin-bottom: 15px;
    background: none;
    border: none;
    border-bottom: 1px solid var(--color-global);
    padding: 0 0 10px 0;
}
.recommended-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
    padding: 8px;
}
.recommended-item {
    display: block;
    border: 1px solid var(--color-global);
    background-color: var(--color-bg-base);
    transition: all 0.3s ease;
}
.recommended-item:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}
.recommended-item img {
    width: 100%;
    height: 120px;
    object-fit: cover;
    display: block;
}
.recommended-item span {
    display: block;
    padding: 10px;
    font-size: 14px;
    line-height: 1.5;
    height: 4.5em; /* 1.5 (line-height) * 3 (lines) */
    overflow: hidden;
    color: var(--color-text-base);
}

/* --- 5. 侧边栏 (Sidebar) --- */
.widget {
    border-radius: 2px;
    padding: 20px;
    box-shadow: 0px 2px 8px 0px rgba(0,0,0,0.1);
    background-color: var(--color-bg-base);
    margin-bottom: var(--layout-gap);
}
.widget-title {
    display: flex;
    align-items: center;
    padding-bottom: 10px;
    margin-bottom: 15px;
    border-bottom: 1px solid var(--color-global);
    font-size: 16px;
    font-weight: bold;
    color: var(--color-bottom-daek);
}
.widget-title::before {
    content: '';
    display: inline-block;
    width: 5px;
    height: 16px;
    margin-right: 10px;
    border-radius: 2px;
    background-color: var(--color-bottom-daek);
}

.hot-dream-list {
    list-style: none;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 15px;
}
.hot-dream-list li {
    padding: 7px 0;
    border-bottom: 1px solid #f0f0f0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.hot-dream-list li a {
    display: flex;
    align-items: center; /* 垂直居中 */
    color: var(--color-primary-text);
}
.hot-dream-list li a::before {
    content: '';
    display: inline-block;
    width: 14px; /* 根据您的图片尺寸调整 */
    height: 14px; /* 根据您的图片尺寸调整 */
    background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAEaSURBVEiJY2AYBcMdMFNuhAOLgJzYSi5+KavvH5/tpJvFQnKivQwMjEkMDIwWXPxSAsRazkSZpab9/xkYC5CEGInVS7RCQpYyMvyf+O7R6QJ8eii2mFJLybKYGpaSbDG1LCXJYmpaSrTF1LaUKItpYSlBi2llKV6LBRRMDRj/Mp5mYGRggQq9YPn+RfX162tfqGExzpLrw4PTF/4xMkYy/Gf4AxWS+MPJs11UVIuHGhYTjGN+OfMQpv//lyP5/AjL9y+elPqcqFRNC8uJzsfUtpykkoualpNcVlPLcrJqJ2pYTnZ9TKnlZLdAPj46uQYtn9v84eDeTKx+ipo+KJb/Z/jzj5FpKiXmkQz45cxD+OXMQ+hq6SggFgAATVSxF9rYOfQAAAAASUVORK5CYII=') no-repeat;
    background-size: contain;
   transform: scaleX(-1); /* 水平翻转 */
   margin-right: 8px; /* 根据需要调整间距 */
 
}
.sidebar-image img {
    max-width: 100%;
    display: block;
    border: 1px solid var(--color-global);
}

.promo-widget {
    padding: 0;
    border: none;
    background: none;
    box-shadow: none;
}
.promo-icon-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px 10px;
    padding: 20px;
    margin-bottom: 10px;
    background-color: var(--color-bg-base);
    border: 1px solid var(--color-border-light);
}
.promo-icon-item a {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 13px;
    color: var(--color-text-555);
}
.promo-icon-item img {
    width: 50px;
    height: 50px;
    margin-bottom: 8px;
}
.promo-article-list {
    list-style: none;
}
.promo-article-list li {
    margin-bottom: 10px;
    background-color: var(--color-bg-base);
    border: 1px solid var(--color-border-light);
}
.promo-article-list li:last-child { margin-bottom: 0; }
.promo-article-list li a {
    display: flex;
    align-items: center;
    padding: 15px;
}
.promo-article-list li a:hover { background-color: #fafafa; }
.promo-thumbnail img {
    width: 110px;
    height: auto;
    border-radius: 4px;
    display: block;
}
.promo-text { flex: 1; padding-left: 15px; }
.promo-title {
    font-size: 15px;
    line-height: 1.5;
    font-weight: 500;
    margin-bottom: 8px;
    color: var(--color-text-base);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.promo-category {
    font-size: 12px;
    color: var(--color-text-muted);
}
.colorful-tag-cloud {
    padding-top: 5px;
}
.colorful-tag-cloud a {
    display: inline-block;
    padding: 6px 14px;
    margin: 0 8px 10px 0;
    border-radius: 16px;
    font-size: 14px;
    color: var(--color-text-white);
    transition: all 0.2s ease-in-out;
}
.colorful-tag-cloud a:hover {
    transform: translateY(-2px);
    opacity: 0.9;
}
.colorful-tag-cloud a:nth-child(10n + 1) { background-color: #009688; }
.colorful-tag-cloud a:nth-child(10n + 2) { background-color: #2196F3; }
.colorful-tag-cloud a:nth-child(10n + 3) { background-color: #4CAF50; }
.colorful-tag-cloud a:nth-child(10n + 4) { background-color: #673AB7; }
.colorful-tag-cloud a:nth-child(10n + 5) { background-color: #9C27B0; }
.colorful-tag-cloud a:nth-child(10n + 6) { background-color: #E91E63; }
.colorful-tag-cloud a:nth-child(10n + 7) { background-color: #f44336; }
.colorful-tag-cloud a:nth-child(10n + 8) { background-color: #FFC107; }
.colorful-tag-cloud a:nth-child(10n + 9) { background-color: #FF9800; }
.colorful-tag-cloud a:nth-child(10n + 0) { background-color: #03A9F4; }


/* --- 6. 页面页脚 (Footer) --- */
.site-links-section {
    background-color: var(--color-bg-base);
    padding: 20px 0 30px;
}
.links-header {
    display: flex;
    align-items: baseline;
    margin-bottom: 10px;
    border-bottom: 1px solid var(--color-border-light);
}
.links-header h3 {
    position: relative;
    padding-bottom: 15px;
    margin: 0;
    font-size: 16px;
    font-weight: bold;
    color: var(--color-text-base);
}
.links-header h3::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: -1px;
    width: 100%;
    height: 3px;
    background-color: var(--color-accent-red-dark);
}
.links-header span {
    margin-left: 20px;
    font-size: 14px;
    color: var(--color-text-secondary);
}
.links-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 0;
}
.links-grid a {
    padding: 0 5px;
    color: var(--color-text-secondary);
}
.links-grid a:hover { color: var(--color-accent-red-dark); }

.page-footer {
    padding: 25px 0;
    background-color: var(--color-bg-dark);
    color: var(--color-text-footer);
    font-size: 12px;
    line-height: 2;
    text-align: center;
}
.page-footer a {
    color: var(--color-text-footer);
}
.page-footer a:hover {
    color: #ccc;
}


/* --- 7. 特殊组件 (Components) --- */
/* 7.1 上下篇文章导航 */
.post-navigation {
    display: flex;
    justify-content: space-between;
    gap: var(--layout-gap);
    margin-top: 30px;
    padding-top: 30px;
    border-top: 1px solid var(--color-global);
}
.post-navigation p { /* Legacy support */
    line-height: 1.8;
    color: var(--color-text-555);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.post-navigation a {
    flex: 1;
    display: flex;
    align-items: center;
    background: var(--color-text-white);
    overflow: hidden;
    border-radius: 2px;
    font-weight: 700;
    transition: all 0.3s ease;
    color: var(--color-primary-text);
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    border: 1px var(--color-page-select) solid;
}
.post-navigation a:hover {
    background:var(--color-page-hover);
    text-decoration: none;
}
.post-navigation .nav-label {
    padding: 12px 18px;
    background-color: var(--color-page-select);
    color: var(--color-text-white);
    white-space: nowrap;
    font-weight: 700;
}
.post-navigation .nav-title {
    flex-grow: 1;
    padding: 12px 18px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--color-page-select);
}
.post-navigation a.next-post .nav-title {
    text-align: right;
}

/* 7.2 分页导航 */
.pagination {
    padding-top: 20px;
    border-top:1px var(--color-global) solid ;
    text-align: center;
}
.pagination a,
.pagination span {
    display: inline-block;
    padding: 8px 16px;
    margin: 0 4px;
    box-shadow: 0 4px 5px 0px #E6EBF5;
    border-radius: 2px;
    font-size: 14px;
    transition: all 0.2s ease;
}
.pagination a {
    color: var(--color-text-555);
}
.pagination a:hover {
    background-color: var(--color-page-select);
    border-color: var(--color-primary-border-light);
    color: var(--color-text-white);
    font-weight: bold;
    text-decoration: none;
}
.pagination .current {
    background-color: var(--color-page-select);
    border-color: var(--color-primary-text-light);
    color: var(--color-text-white);
    font-weight: bold;
}
.pagination span {
    color: var(--color-text-muted);
}
.pagination span strong {
    color: var(--color-yj-all);
    font-weight: normal;
    margin: 0 2px;
}
.pagination .page-ellipsis {
    color: var(--color-text-muted);
    border: none;
    padding: 6px 4px;
    font-weight: bold;
    box-shadow:none;
}
.lnews{ margin-top:10px;}
.nnews{border:none;}

/* 7.3 导航栏 Hot/New 图标 */
.hot-nav-item,
.hot-jr-item {
    position: relative;
}
.hot-nav-item::after,
.hot-jr-item::after {
    content: '';
    position: absolute;
    top: 2px;
    right: 8px;
    width: 25px;
    height: 15px;
    background-repeat: no-repeat;
    background-size: contain;
}
.hot-nav-item::after {
    background-image: url('//zgjm2008.com/zgjm2008/images/hot_5.gif');
}
.hot-jr-item::after {
    background-image: url('//zgjm2008.com/zgjm2008/images/new_1.gif');
}

/* 7.4 返回顶部按钮 */
.cd-top {
    display: inline-block;
    position: fixed;
    right: 30px;
    bottom: 180px;
    width: 60px;
    height: 60px;
    background: var(--color-primary-text) url(//zgjm2008.com/zgjm2008/images/cd-top-arrow.svg) no-repeat center;
    box-shadow: 0 0 10px rgba(0,0,0,.05);
    visibility: hidden;
    opacity: 0;
    transition: all .3s;
    /* Hide text */
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
}
.cd-top.cd-is-visible {
    visibility: visible;
    opacity: 1;
}
.cd-top.cd-fade-out {
    opacity: .5;
}

/************************************************************/
/* --- Pop-up Message & Loading Indicator Styles --- */
/************************************************************/
/* 全屏加载遮罩层 */
.body-loading {
    position: fixed;
    inset: 0; /* 更简洁的 top, left, bottom, right 写法 */
    z-index: 998;
    background-color: rgba(255, 255, 255, .5); 
}

.body-loading span,
.body-msg {
    position: fixed;
    top: 50%;
    left: 50%;
    background-color: rgba(0, 0, 0, .7);
    color: var(--color-text-white);
    border-radius: 4px;
    z-index: 999;
    text-align: center;
}

.body-loading span {
    padding: 10px;
    min-width: 80px;
    min-height: 50px;
    transform: translate(-50%, -50%);
    display: flex; 
    align-items: center;
    justify-content: center;
    animation: fadeIn .3s ease forwards;
}

.body-loading span::before {
    content: '';
    display: block;
    width: 28px;
    height: 28px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAMAAAAM7l6QAAAAn1BMVEUAAAC8u7yxr7DLysrOzs7S0tK6uLmjoaLp6enFxMWvra+lo6SWlJXr6+vm5ubf39/R0dG7ubrBv8Dh4eGlo6Tc3NyenJ2rqaqbmZrp6emhn6Da2tqxsLDY2Niura2amJnHxsfLy8uzs7PCwMHf39+UkpOioKGvrq6YlpeYlpf+//+XlZd2c3WamJni4uLb29vDwcKysrKrqarT09P09fV/crQcAAAALXRSTlMAIRMu+1X++/19TjBWMSXjzcy5emZlPN7dwcC4j4x+fkPr4d/V1c6wk+3MpmKjQrqtAAABDUlEQVQoz73P2XKCQBAF0NvDElkUZV9EUaNmG7bk/78tYyjCjCSvngeqmluXbvBAWfZPsApIPBaLJcD2NIuDuhjjd/4yi5d1bQxxzHmMmbL2QIsvDef78iq6bfTqANkbPvgrA5yQpr1NUxKM5wiCe3bFcZzvMaKiaTwDv9yU81y6XjQbb5pSnrpQRZHUDpWIBCiY9KbQhTWT0vxJyDFYfwpKfLnFl3HSBCjIcRzIDOnH7BCqaq0fpinpE1v+lK/rB7md9P2VMLJ0vSRUG+Mn29hg277fYaRZFYBTa8HfIOyODIh3DhRWewIzTcKx22JGa1sDZJoa7K6LAdyXfQwxrn/UyaIxZtJelTjtcb4BNboSop/e5fkAAAAASUVORK5CYII=) no-repeat center;
    background-size: contain; /* 使用 contain 更安全 */
    animation: rotate 1s linear infinite;
}

.body-msg {
    padding: 20px 40px;
    font-weight: 700;
    font-size: 18px;
    transform: translate(-50%, -60%); 
    opacity: 0;
    animation: slideIn .3s ease forwards;
}

@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}

@keyframes rotate {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

@keyframes slideIn {
    from {
        opacity: 0;
        transform: translate(-50%, -60%);
    }
    to {
        opacity: 1;
        transform: translate(-50%, -50%);
    }
}

/* --- 样式新增：侧边栏 - 作者信息卡片 --- */

/* 1. 卡片主容器样式 */
.author-card {
    /* 移除 .widget 的默认边框和内边距，以便自定义 */
    border: 1px solid #f0f0f0;
    padding: 24px; /* 增加内边距，使其更宽敞 */
    background-color: var(--color-text-white);
    text-align: left; /* 确保内容左对齐 */
}

/* 2. 头部区域（头像+信息） */
.author-card .author-header {
    display: flex;
    align-items: center; /* 垂直居中对齐 */
    margin-bottom: 16px; /* 与下方简介的间距 */
}

/* 3. 圆形头像 */
.author-card .author-avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%; /* 关键：设置为圆形 */
    margin-right: 15px; /* 与右侧文字的间距 */
    object-fit: cover;  /* 确保图片不变形 */
    flex-shrink: 0;
    border: 1px solid var(--color-global); /* 添加一个细微的边框 */
}

/* 4. 信息区域（名称+粉丝数） */
.author-card .author-info {
    flex-grow: 1;
}

.author-card .author-name {
    font-size: 16px;
    font-weight: 600; /* 稍粗的字体 */
    color: #333;
    margin: 0 0 5px 0; /* 名称与下方统计数据的间距 */
}

.author-card .author-stats {
    font-size: 13px;
    color: var(--color-text-muted);
    margin: 0;
}

/* 5. 简介文本 */
.author-card .author-bio {
    font-size: 14px;
    color: var(--color-text-secondary);
    line-height: 1.7;
    margin: 0 0 20px 0; /* 与下方按钮的间距 */
    
    /* 最多显示两行，超出部分显示省略号 */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 6. 关注按钮 */
.author-card .follow-button {
    display: block; /* 设为块级元素，使其可以设置宽度和居中 */
    width: 100%;    /* 宽度占满容器 */
    padding: 10px 0;
    text-align: center;
    font-size: 15px;
    font-weight: 500;
    color: var(--color-text-white);
    background-color: #4a8cff; /* 示例蓝色 */
    border: none;
    border-radius: 30px; /* 胶囊形状的圆角 */
    text-decoration: none;
    transition: background-color 0.2s ease;
}

.author-card .follow-button:hover {
    background-color: #3b7ee5; /* 鼠标悬停时颜色变深 */
    text-decoration: none; /* 移除悬停时的下划线 */
}


/* --- ↓↓↓ 新增：文章首段缩进样式 ↓↓↓ --- */
.article-content p:first-of-type {
    text-indent: 2em; /* 首行缩进两个字符宽度 */
}
/* --- ↑↑↑ 新增样式结束 ↑↑↑ --- */

 /* ** ↓↓↓ 新增样式以匹配图片布局 ↓↓↓ ***/

.article-summary-list {
   list-style: none;
   padding: 0;
   margin: 0;
}
.article-summary-list li {
   display: flex;
   gap: 20px; /* 控制图片和文字之间的间距 */
   padding: 25px 0;
   border-bottom: 1px solid #f0f0f0;
   align-items: flex-start; /* 顶部对齐 */
}
.article-summary-list li:first-child {
    padding-top: 10px;
}
.article-summary-list .list-item-image {
   flex-shrink: 0;
}
.article-summary-list .list-item-image img {
   width: 175px; /* 图片宽度 */
   height: 115px; /* 图片高度 */
   object-fit: cover;
   display: block;
   border-radius: 4px; /* 轻微的圆角 */
}
.article-summary-list .list-item-content h2 {
   margin: 0 0 10px 0;
   font-size: 20px;
   font-weight: bold;
   line-height: 1.4;
}
.article-summary-list .list-item-content h2 a {
   color: #333;
   text-decoration: none;
}
.article-summary-list .list-item-content h2 a:hover {
   color: var(--color-yj-all);
}
.article-summary-list .list-item-content p {
   margin: 0;
   font-size: 14px;
   color: var(--color-text-secondary);
   line-height: 1.7;
   overflow: hidden;
   height: 80px;
}
 /* ** ↑↑↑ 新增样式结束 ↑↑↑ ** */
/* ** ↓↓↓ 用这段新样式替换所有旧的 breadcrumb-bar 相关样式 ↓↓↓ ** */

/* 面包屑导航栏现在是 main-content 的一部分 */
.breadcrumb-bar {
    /* 移除所有背景、边框、固定高度等样式 */
    background: none;
    border: none;
    height: auto;
    line-height: normal;
    padding: 0;
    margin-bottom: 20px; /* 关键：添加下边距，与下面的标题隔开 */
}

.p10{padding:10px;}
.p20{padding:20px;}
.b10{padding:10px;}
.b20{padding:20px;}
/* 路径容器样式 */
.breadcrumb-path {
    font-size: 14px;
    color: var(--color-text-muted); /* 分隔符 > 的颜色 */
}

/* 路径中的链接样式 */
.breadcrumb-path a {
    color: #005aa0;
    text-decoration: none;
}

.breadcrumb-path a:hover {
    text-decoration: underline;
    color: var(--color-accent-red);
}

/* 当前页面标题 (span) 的样式 */
.breadcrumb-path span {
    color: var(--color-text-secondary);
}

.breadcrumb-home::before {
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-right: 0.4em;
    background-color: currentColor; /* 图标颜色随文字颜色变化 */
    -webkit-mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5z'/%3e%3c/svg%3e");
    mask-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5z'/%3e%3c/svg%3e");
}

/* 分隔符 <em> 的样式 */
.breadcrumb-path em {
    /* 修复了选择器，并删除了 float */
    display: inline-block; /* 使其可以设置宽高和边距 */
    width: 10px;
    height: 10px; /* 调整高度与宽度和背景图尺寸一致 */
    margin: 0 8px; /* 设置左右边距，与链接隔开 */
    
    /* 由于 em 标签现在是空的，不再需要 font-size: 0 来隐藏文字 */

    background: url(//zgjm2008.com/zgjm2008/images/arrow_right.png) no-repeat center center;
    background-size: 10px 10px; /* 确保背景图完整显示 */
}

/* ** ↑↑↑ 新样式结束 ↑↑↑ ** */
 
/* --- 三列标签/文章列表 (新命名: taglist) --- */
.taglist {
    list-style: none;
    padding: 0;
    margin: 0; /* 确保没有默认外边距 */
    display: grid;
    /* 创建三列，每列平分可用空间 */
    grid-template-columns: repeat(3, 1fr);
    /* 设置行间距为20px, 列间距为0 (因为使用边框分隔) */
    gap: 20px 0;
}

.taglist li {
    /* 设置右内边距，隔开文字和边框 */
    padding-right: 20px;
    /* 移除可能继承的旧样式 */
    padding-left: 0; 
    border-bottom: none;
}

/* 关键：移除每行最后一项（第3n个）的右边框和右内边距 */
.taglist li:nth-child(3n) {
    border-right: none;
    padding-right: 0;
}

/* 列表内链接的样式 */
.taglist li a {
    color: var(--color-primary-text,--color-primary-text);
    font-size: 14px;
    text-decoration: none;
    display: block; /* 使链接可点击区域最大化 */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* 链接前的装饰性小圆点 */
.taglist li a::before {
    content: '';
    display: inline-block;
    color: var(--color-primary, --color-primary);
    font-weight: bold;
    width: 14px; /* 根据您的图片尺寸调整 */
    height: 14px; /* 根据您的图片尺寸调整 */
    background:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAeCAYAAAA7MK6iAAAAAXNSR0IArs4c6QAAAARzQklUCAgICHwIZIgAAAEaSURBVEiJY2AYBcMdMFNuhAOLgJzYSi5+KavvH5/tpJvFQnKivQwMjEkMDIwWXPxSAsRazkSZpab9/xkYC5CEGInVS7RCQpYyMvyf+O7R6QJ8eii2mFJLybKYGpaSbDG1LCXJYmpaSrTF1LaUKItpYSlBi2llKV6LBRRMDRj/Mp5mYGRggQq9YPn+RfX162tfqGExzpLrw4PTF/4xMkYy/Gf4AxWS+MPJs11UVIuHGhYTjGN+OfMQpv//lyP5/AjL9y+elPqcqFRNC8uJzsfUtpykkoualpNcVlPLcrJqJ2pYTnZ9TKnlZLdAPj46uQYtn9v84eDeTKx+ipo+KJb/Z/jzj5FpKiXmkQz45cxD+OXMQ+hq6SggFgAATVSxF9rYOfQAAAAASUVORK5CYII=') no-repeat;
    background-size: contain;
    transform: scaleX(-1); /* 水平翻转 */
    margin-right: 8px;
}

/* 鼠标悬停效果 */
.taglist li a:hover {
    color: var(--color-accent-red, --color-accent-red);
    text-decoration: underline;
}
/* ** ↑↑↑ 新样式结束 ↑↑↑ ** */

/* --- 新增：侧边栏日历模块 --- */
.calendar-widget {
    padding: 15px; 
    border: none;
    border-radius: 5px;
    box-shadow: 0px 1px 3px 1px var(--color-global);
}

.calendar-content {
    display: flex;
    align-items: flex-start; /* 顶部对齐 */
    gap: 25px; /* 日期框和农历信息之间的间距 */
    padding-bottom: 15px;
    border-bottom: 1px solid #f0e9d8; /* 浅色分割线 */
    margin-bottom: 15px;
}

.date-box {
    border: 1px solid #ddd;
    text-align: center;
    width: 100px;
    flex-shrink: 0; /* 防止日期框被压缩 */
    background-color: var(--color-bg-card);
    margin-left: 5px;
}

.date-box .month {
    background-color: var(--color-yj-all); /* 红色背景 */
    color: var(--color-text-white);
    padding: 5px;
    font-size: 12px;
}

.date-box .day {
    font-size: 36px;
    font-weight: bold;
    color: var(--color-text-555);
    padding: 5px 0;
    line-height: 1;
    
}

.date-box .week {
  font-size:14px;
  color: var(--color-text-secondary);
}

.lunar-info {
    flex: 1;
    font-size: 16px;
    color: var(--color-text-secondary);
    padding: 5px 0;
}

.lunar-info p {
    margin: 0;
    line-height: 1.8;
}

.activities {
    display: flex;
    align-items: flex-start;
}
.activities + .activities {
    margin-top: 15px; /* “宜”和“忌”之间的间距 */
}

.activity-icon {
    width: 28px;
    height: 28px;
    border-radius: 50%; /* 圆形图标 */
    color: var(--color-text-white);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    font-weight: bold;
    margin-right: 10px;
}

.activity-list {
    flex: 1;
    line-height:1.2;
}

.favorable .activity-icon {
    background-color: var(--color-yj-all); /* “宜”的红色背景 */
}

.favorable .activity-list {
    color: var(--color-yj-all); /* “宜”的红色文字 */
}

.unfavorable .activity-icon {
    background-color: #95a5a6; /* “忌”的灰色背景 */
}

.unfavorable .activity-list {
    color: #777; /* “忌”的灰色文字 */
}

@keyframes wave {
  0% {
    background-position-x: 0;
  }
  100% {
    background-position-x: 28rem; /* 让背景图水平移动一个完整宽度 */
  }
}



/* --- 暗黑模式核心样式 --- */

/* 1. 定义暗黑模式下的颜色变量 */
html.dark-mode {
    --color-primary: #dcb881; /* 暗模式下主色调可以稍亮一些 */
    --color-primary-dark: #b08d57;
    --color-primary-text: #dcb881;

    --color-text-base: #e0e0e0; /* 基础文字变为浅灰色 */
    --color-text-555: #c7c7c7;
    --color-text-secondary: #a0a0a0;
    --color-text-muted: #777;
    --color-text-footer: #999;
    
    --color-bg-base: #121212; /* 页面主背景变为深黑色 */
    --color-bg-dark: #000;
    --color-bg-light-gray: #1e1e1e; /* 浅色背景块变为深灰色 */

    --color-border-light: #3a3a3a;
    --color-border-base: #444;
    --color-global: #2c2c2c;
    
    --color-page-select: #3d8bfd;
    --color-page-hover: #2a2a2a;
    --color-bg-card: #1e1e1e; /* 暗黑模式下为深灰色 */
}

/* 2. 暗黑模式下的全局调整 */
html.dark-mode body {
    background-image: none; /* 移除明亮模式下的背景图 */
    color-scheme: dark; /* 告知浏览器这是暗色方案，滚动条等UI会自适应 */
}
html.dark-mode img {
    /* 降低图片亮度和饱和度，使其在暗色背景下不刺眼 */
    filter: brightness(.85) saturate(.9);
}

/* 3. 修正暗黑模式下特定元素的颜色 */
html.dark-mode a {
    color: #80bfff; /* 链接颜色改为亮蓝色 */
}
html.dark-mode a:hover {
    color: #a0cfff;
}
html.dark-mode .fixed-nav ul li a {
    color: var(--color-text-base); /* 固定导航的文字颜色跟随主题 */
}


.entry-tag {
    font-size: 0;
    margin-bottom: 10px;
}

.entry-tag a,.entry-tag a:before {
    display: inline-block;
    font-size: 14px;
    border-radius: 20px
}

.entry-tag a {
    margin: 0 10px 5px 0;
    padding: 4px 10px 4px 0;
    line-height: 14px;
    color: #151414;
    background: #f0f0f0;
    box-shadow: 0 0 1px rgba(0,0,0,.1);
}

.entry-tag a:before {
    margin: -4px 6px -4px 0;
    padding: 4px 7px;
    line-height: inherit;
    color: #fff;
    background: #2979ff;
     content:"#";
    vertical-align: top
}

.entry-tag a:focus,.entry-tag a:hover {
    color: #fff;
    background: #2979ff;
    text-decoration: none
}

/* 4. 切换按钮的样式 */
.dark-mode-toggle {
    background: none;
    border: none;
    color: var(--color-text-secondary);
    width: 22px;
    height: 22px;
    border-radius: 50%;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    vertical-align: middle;
    transition: background-color 0.3s, border-color 0.3s;
}
.dark-mode-toggle:hover {
    background-color: var(--color-bg-light-gray);
}
.dark-mode-toggle .moon-icon {
    display: none;
}
html.dark-mode .dark-mode-toggle .sun-icon {
    display: none;
}
html.dark-mode .dark-mode-toggle .moon-icon {
    display: inline-block;
}
html.dark-mode .main-content {
    box-shadow: 0px 4px 12px 0px rgba(0, 0, 0, 0.2);
}
html.dark-mode .sub-nav ul li a {
    color: var(--color-text-secondary); /* 使用稍浅的灰色文字 */
}
html.dark-mode .sub-nav ul li a.active_nav {
    border-bottom-color: var(--color-primary);
}