/*

/*
 * ==========================================
 * 模块定位：全局侧边栏 - 文章分类导航样式---文章分类
 * 代码类型：CSS
 * ==========================================
 * 1. 业务功能：实现侧边栏两级分类折叠面板布局，新增标题的超链接样式拦截。
 * 2. 修复与 SEO 优化：重置 title-link 的默认 A 标签行为，防范页面样式断裂，强化 A11y 可访问性。
 * 3. 针对页面：全站包含侧边栏分类导航的页面
 * 4. 性能开销：整体样式计算与解析约 <1 ms 
 * 最后修改：2026-03-27 15:51 (UTC+8) - 底层架构级重构
 */

.mx-sidebar-cat {
    background-color: #ffffff;
    margin-bottom: 30px;
    padding: 30px; 
    box-sizing: border-box;
    border: 1px solid #f2f2f2;
    box-shadow: 0 2px 8px rgba(0,0,0,0.02);
    transform: translateZ(0); 
}

.mx-sidebar-cat__title.widget-title {
    font-size: 20px;
    font-weight: 700;
    color: #222222;
    margin: 0 0 25px 0;
    position: relative;
    padding-bottom: 12px;
    border-bottom: none;
    line-height: 1.3;
}

.mx-sidebar-cat__title.widget-title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 30px;
    height: 3px;
    background-color: #0056b3;
}

/* 【架构级拦截】彻底重置 H3 内部生成的超链接默认样式，防止 CLS 与 UI 崩坏 */
.mx-sidebar-cat__title-link {
    color: inherit; /* 继承父级的 #222222 设色 */
    text-decoration: none;
    transition: color 0.2s ease;
    display: inline-block; /* 确保链接热区铺满标题空间 */
}

.mx-sidebar-cat__title-link:hover {
    color: #0056b3; /* 与主题点缀色联动 */
}

/* 【A11y 强化】确保根节点链接的焦点可见性 */
.mx-sidebar-cat__title-link:focus-visible,
.mx-sidebar-cat__summary:focus-visible,
.mx-sidebar-cat__link:focus-visible,
.mx-sidebar-cat__sublink:focus-visible {
    outline: 2px solid #0056b3;
    outline-offset: -2px;
}

.mx-sidebar-cat__list,
.mx-sidebar-cat__sublist {
    list-style: none !important; 
    margin: 0 !important; 
    padding: 0 !important;
}

.mx-sidebar-cat__item {
    border-bottom: 1px solid #f4f5f7;
    margin-bottom: 6px; 
}

.mx-sidebar-cat__item:last-child {
    border-bottom: none;
    margin-bottom: 0;
}

.mx-sidebar-cat__summary {
    display: flex; 
    justify-content: space-between; 
    align-items: center;
    padding: 0; 
    cursor: pointer; 
    user-select: none; 
    list-style: none;
    transition: background-color 0.2s ease;
    border-radius: 0; /* 修改：将 2px 改为 0 (直角) */
    min-height: 48px; 
    will-change: background-color; 
}

.mx-sidebar-cat__summary::-webkit-details-marker { 
    display: none; 
}

.mx-sidebar-cat__link {
    flex-grow: 1; 
    font-size: 15px; 
    color: #222222; 
    text-decoration: none; 
    transition: color 0.2s ease;
    padding: 12px; 
    display: block;
    transform: translateZ(0); 
}

.mx-sidebar-cat__count { 
    color: #666666; 
    font-size: 13px; 
    margin-left: 4px; 
    font-weight: 400; 
}

.mx-sidebar-cat__summary.is-current {
    background-color: #f5f5f5; 
}

.mx-sidebar-cat__summary.is-current .mx-sidebar-cat__link {
    font-weight: 600; 
    color: #000000;
}

.mx-sidebar-cat__summary:hover .mx-sidebar-cat__link { 
    color: #0056b3; 
}

.mx-sidebar-cat__details > summary::after {
    content: "+"; 
    color: #aaaaaa; 
    font-size: 18px; 
    font-weight: 300;
    line-height: 1; 
    margin-left: 10px; 
    flex-shrink: 0; 
    width: 24px; 
    text-align: center;
    padding: 12px 0; 
}

.mx-sidebar-cat__details[open] > summary::after { 
    content: "\2013"; 
}

.mx-sidebar-cat__summary--no-child { 
    cursor: default; 
}

.mx-sidebar-cat__sublist { 
    padding-bottom: 8px !important; 
}

.mx-sidebar-cat__subitem { 
    border-top: 1px solid #fcfcfc; 
}

.mx-sidebar-cat__sublink {
    display: flex; 
    align-items: center;
    padding: 12px 10px 12px 25px; 
    font-size: 14px; 
    color: #222222; 
    text-decoration: none;
    transition: all 0.2s ease; 
    margin: 4px 0; 
    border-radius: 0; /* 修改：将 2px 改为 0 (直角) */
    min-height: 48px; 
    transform: translateZ(0); 
    will-change: color, background-color;
}

.mx-sidebar-cat__sublink.is-current {
    background-color: #f5f5f5; 
    color: #000000;
    font-weight: 500;
}

.mx-sidebar-cat__sublink:hover { 
    color: #0056b3; 
}

.mx-sidebar-cat__sublink::before {
    content: ""; 
    display: block; 
    width: 4px; 
    height: 4px;
    border-top: 1px solid #aaaaaa; 
    border-right: 1px solid #aaaaaa;
    transform: rotate(45deg); 
    margin-right: 10px; 
    transition: border-color 0.2s ease;
}

.mx-sidebar-cat__sublink.is-current::before,
.mx-sidebar-cat__sublink:hover::before {
    border-color: #0056b3;
}
/* ----------逻辑结束---------- */

/*
 * ==========================================
 * 模块定位：侧边栏 - 公司简介静态引流组件---公司简介
 * 代码类型：CSS
 * ==========================================
 * 1. 业务功能：为侧边栏 mx-banner 组件提供高响应式的现代化视觉样式。
 * 2. 修复与 SEO 优化：注入 translateZ(0) 强制开启 GPU 硬件加速避免侧边栏区域重绘；使用 inline-flex 修复基线偏移；强制交互热区 min-height 防移动端误触惩罚。
 * 3. 针对页面：全局侧边栏 (Global Sidebar)
 * 4. 性能开销：< 0.1 ms (纯静态解析，无重绘阻塞)
 * 最后修改：2026-03-26 11:15 (UTC+8) - 底层架构级重构
 */

.mx-banner {
    background-color: #2b5592;
    /* 流式内边距，利用 clamp 淘汰媒体查询，降低 CSS 渲染树构建成本 */
    padding: clamp(24px, 5%, 40px);
    box-sizing: border-box;
    width: 100%;
    /* 触发 GPU 硬件加速，避免侧边栏区域滚动与交互时的重排重绘 */
    transform: translateZ(0);
}

.mx-banner__title {
    /* 流式字号，完美适配平板与手机，防穿透 CLS */
    font-size: clamp(22px, 3vw, 28px);
    font-weight: 700;
    margin: 0 0 20px 0;
    color: #fff;
    position: relative;
    padding-bottom: 15px;
}

.mx-banner__title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 32px;
    height: 3px;
    background-color: #ea6000;
}

.mx-banner__desc {
    font-size: 16px;
    line-height: 1.6;
    margin: 0 0 30px 0;
    color: rgba(255, 255, 255, 0.9);
}

.mx-banner__btn {
    /* 强制使用 inline-flex，彻底修复传统 inline-block 带来的跨语言基线不对齐问题 */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #222222;
    color: #fff;
    padding: 12px 28px;
    /* 强制触发移动端防误触底线 */
    min-height: 48px;
    text-decoration: none;
    font-weight: 500;
    font-size: 15px;
    transition: background-color 0.2s ease;
    /* 提前声明动画意图，压榨浏览器 GPU 性能分配 */
    will-change: background-color;
}

/*
 * 修改点：将鼠标悬停时的背景颜色修改为橙色 #ea6000。
 * 同时保留文字颜色 (#fff) 和轮廓样式 (outline: none) 不变。
 */
.mx-banner__btn:hover,
.mx-banner__btn:focus-visible {
    background-color: #ea6000; /* 修改为新的背景色 */
    color: #fff;               /* 保留原文字颜色 */
    /* 依赖背景色变化，去除默认边框带来的额外计算 */
    outline: none;             /* 保留其他样式 */
}
/* ----------逻辑结束---------- */

/*
 * ==========================================
 * 模块定位：全局侧边栏 - 置顶文章样式与首行对齐防御---置顶文章推荐
 * 代码类型：CSS
 * ==========================================
 * 1. 业务功能：极简卡片 UI 构建，彻底剥离浏览器默认列表样式。
 * 2. 修复与 SEO 优化：全面更替命名空间为 .mx-sticky；保留数学精算的黑点首行中轴线锁定与 >= 48px 无死角热区。
 * 3. 针对页面：全局侧边栏 (Global Sidebar)
 * 4. 性能开销：< 0.1 ms 纯净 CSS
 * * 最后修改：2026-04-25 09:30 (UTC+8) - 底层架构级重构
 */

.mx-sticky {
    background-color: #ffffff;
    padding: 30px;
    box-sizing: border-box;
    border: 1px solid #f2f2f2;
    box-shadow: 0 2px 8px rgba(0,0,0,0.02);
    transform: translateZ(0); /* [铁律] 触发 GPU 硬件加速，防渲染抖动 */
    margin-bottom: 24px;
}

.mx-sticky__title {
    font-size: 20px;
    font-weight: 700;
    color: #222222;
    margin: 0 0 15px 0;
    position: relative;
    padding-bottom: 12px;
}

.mx-sticky__title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 30px;
    height: 3px;
    background-color: #0056b3;
}

.mx-sticky__list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mx-sticky__item {
    margin-bottom: 0;
    border-bottom: 1px dashed #f5f5f5;
}

.mx-sticky__item:last-child {
    border-bottom: none;
}

.mx-sticky__link {
    position: relative;
    display: block; 
    padding: 14px 0 14px 14px; /* [SEO红线] 物理撑开移动端 >=48px 无死角热区 */
    text-decoration: none;
    color: #222222;
    font-size: 14px;
    line-height: 1.5;
    transition: color 0.2s ease, background-color 0.2s ease;
    outline: none;
}

.mx-sticky__link::before {
    content: "";
    position: absolute;
    left: 0;
    top: 23px; /* [排版精算] 刚性锁定第一行文本视觉中心 */
    width: 4px;
    height: 4px;
    background-color: #b3b3b3;
}

.mx-sticky__link:hover {
    color: #0056b3;
}

/* [A11y红线] 欧美无障碍键盘导航焦点必须可见 */
.mx-sticky__link:focus-visible {
    color: #0056b3;
    outline: 2px dashed #0056b3;
    outline-offset: -2px;
}

/* [架构预留] 广告防重排与静默折叠机制 */
.mx-ad-placeholder {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    margin-top: 20px;
    background-color: transparent;
}

.mx-ad-placeholder:empty {
    display: none;
}
/* ----------逻辑结束---------- */

/*
 * ==========================================
 * 模块定位：侧边栏 - 热门标签云 (Sidebar Tags)---侧边栏 - TAG
 * 代码类型：CSS
 * ==========================================
 * 1. 业务功能：流式布局与 UI 样式。
 * 2. 修复与 SEO 优化：强制补充 min-height: 48px 满足移动端防误触点击热区标准；强化 :focus-visible 提升 A11y 无障碍合规度。
 * 3. 针对页面：全局侧边栏及 Tags 页面
 * 4. 性能开销：约 0 ms - [纯静态 CSS 解析]
 * 最后修改：2026-03-27 11:27 (UTC+8) - 底层架构级重构
 */

.mx-tags {
    background-color: #ffffff;
    padding: 30px;
    box-sizing: border-box; 
    border: 1px solid #f2f2f2;
    box-shadow: 0 2px 8px rgba(0,0,0,0.02);
    margin-top: 30px;
    /* 触发 GPU 硬件加速，保障滑动时的绘制性能 */
    transform: translateZ(0); 
}

.mx-tags__title {
    font-size: 20px;
    font-weight: 700;
    color: #222222;
    margin: 0 0 25px 0;
    position: relative;
    padding-bottom: 12px;
}

.mx-tags__title::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 30px;
    height: 3px;
    background-color: #0056b3;
}

.mx-tags__list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.mx-tags__item {
    margin: 0;
    padding: 0;
}

.mx-tags__link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background-color: #f5f5f5;
    color: #222222;
    text-decoration: none;
    padding: 0 16px;
    border-radius: 0; /* 新增防御：强制直角 */
    min-height: 48px; /* 强制满足 Google Mobile UX 48px 点击热区标准 */
    font-size: 14px;
    transition: background-color 0.2s ease, color 0.2s ease;
}

/* A11y: 明确区分 hover 与 focus-visible (仅键盘触发) */
.mx-tags__link:hover {
    background-color: #0056b3;
    color: #ffffff;
}

.mx-tags__link:focus-visible {
    background-color: #0056b3;
    color: #ffffff;
    outline: 2px solid #ffaa00;
    outline-offset: 2px;
}

.mx-tags__count {
    color: #666666;
    margin-left: 6px;
    font-size: 13px;
    transition: color 0.2s ease;
}

.mx-tags__link:hover .mx-tags__count,
.mx-tags__link:focus-visible .mx-tags__count {
    color: #e0e0e0;
}

.mx-tags__more {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
    margin-top: 20px;
    color: #666666;
    text-decoration: none;
    font-size: 14px;
    min-height: 48px; /* 满足底部 More Tags 热区标准 */
    transition: color 0.2s ease;
}

.mx-tags__more:hover,
.mx-tags__more:focus-visible {
    color: #0056b3;
    outline: none;
}

/* 广告防抖动占位 (Zero CLS) */
.mx-ad-placeholder {
    display: block;
    width: 100%;
    margin-top: 20px;
}

.mx-ad-placeholder:empty {
    display: none;
    min-height: 0;
    margin: 0;
    padding: 0;
}

/* ----------逻辑结束---------- */
/*
 * ==========================================
 * 模块定位：全局样式 - 移动端与平板端侧边栏响应式处理
 * 代码类型：CSS
 * ==========================================
 * 1. 业务功能：在屏幕宽度 <= 1024px（涵盖 Mobile 与 Tablet 基准）时，隐藏右侧边栏。
 * 2. 修复与 SEO 优化：严格遵循 GeneratePress 响应式断点规范。规避 PHP 层缓存毒化风险。通过合并断点 (max-width: 1024px)，用极简规则覆盖移动与平板双端，清除破坏层叠上下文的 !important 声明，保障 CSSOM 树解析极速渲染。
 * 3. 针对页面：全局 (GeneratePress Child style.css)
 * 4. 性能开销：0 ms (静态样式直出，无后端性能损耗)
 * 最后修改：2026-03-31 09:43 (UTC+8) - 底层架构级重构
 */

@media (max-width: 1024px) {
    /* 1. 隐藏右侧边栏，规避移动端与平板端视口挤压 */
    body #right-sidebar {
        display: none;
    }
    
    /* 2. 强制主内容区撑满全宽，解除 Flex 限制防御 CLS */
    body #primary {
        width: 100%;
        max-width: 100%;
        flex: none; /* 关键：解除 GeneratePress 默认的 flex 比例划分 */
    }
}
/* ----------逻辑结束---------- */