/**
 * 轻蜂加速器主题 - 统一CSS样式文件
 * 基于所有HTML文件提取的样式
 * 
 * @package Qingfeng
 * @version 1.0.0
 */

/* ============================================
   CSS变量定义
   ============================================ */
:root {
    --background: 210 40% 98%;
    --foreground: 215 25% 27%;
    --card: 0 0% 100%;
    --card-foreground: 215 25% 27%;
    --popover: 0 0% 100%;
    --popover-foreground: 215 25% 27%;
    --primary: 217 91% 60%;
    --primary-foreground: 0 0% 100%;
    --secondary: 210 40% 96.1%;
    --secondary-foreground: 222.2 47.4% 11.2%;
    --muted: 210 40% 96.1%;
    --muted-foreground: 214 15% 55%;
    --accent: 210 40% 96.1%;
    --accent-foreground: 222.2 47.4% 11.2%;
    --destructive: 0 84.2% 60.2%;
    --destructive-foreground: 210 40% 98%;
    --border: 210 40% 94%;
    --input: 214.3 31.8% 91.4%;
    --ring: 217 91% 60%;
    --radius: 0.5rem;
}

.dark {
    --background: 222.2 84% 4.9%;
    --foreground: 210 40% 98%;
    --card: 222.2 84% 4.9%;
    --card-foreground: 210 40% 98%;
    --popover: 222.2 84% 4.9%;
    --popover-foreground: 210 40% 98%;
    --primary: 217 91% 60%;
    --primary-foreground: 222.2 47.4% 11.2%;
    --secondary: 217.2 32.6% 17.5%;
    --secondary-foreground: 210 40% 98%;
    --muted: 217.2 32.6% 17.5%;
    --muted-foreground: 215 20.2% 65.1%;
    --accent: 217.2 32.6% 17.5%;
    --accent-foreground: 210 40% 98%;
    --destructive: 0 62.8% 30.6%;
    --destructive-foreground: 210 40% 98%;
    --border: 217.2 32.6% 17.5%;
    --input: 217.2 32.6% 17.5%;
    --ring: 212.7 26.8% 83.9%;
}

/* ============================================
   基础样式重置
   ============================================ */
html {
    scroll-behavior: smooth;
}

body, main {
    margin: 0;
    padding: 0;
    font-family: inherit !important;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
}

/* 确保 body 和 main 的背景色不被覆盖 - 使用更高优先级 */
/* 注意：博客相关页面（blog.html, blog-post.html）的背景色在 HTML 的 style 标签中设置，优先级更高 */
/* 以下规则仅适用于没有内联背景色样式的页面 */
/* 如果元素有内联样式，内联样式会优先（优先级更高），所以这里只设置默认值 */
html body.bg-slate-50,
body.bg-slate-50,
html main.bg-slate-50,
main.bg-slate-50 {
    /* 移除 background-color，让 Tailwind 的 bg-slate-50 类或内联样式控制 */
    /* background-color: rgb(248 250 252); */
    /* background: rgb(248 250 252); */
    min-height: 100vh;
}

/* 确保整个页面都有背景色 - 但允许内联样式覆盖 */
html {
    /* 移除 background-color，让内联样式或 Tailwind 类控制 */
    /* background-color: rgb(248 250 252); */
    /* background: rgb(248 250 252); */
    min-height: 100vh;
}

/* 强制 body 背景色 - 但允许内联样式覆盖 */
body[class*="bg-slate-50"] {
    /* 移除 background-color，让 Tailwind 的 bg-slate-50 类或内联样式控制 */
    /* background-color: rgb(248 250 252); */
    /* background: rgb(248 250 252); */
}

/* 强制 main 背景色 - 但允许内联样式覆盖 */
main[class*="bg-slate-50"] {
    /* 移除 background-color，让 Tailwind 的 bg-slate-50 类或内联样式控制 */
    /* background-color: rgb(248 250 252); */
    /* background: rgb(248 250 252); */
}

section {
    margin: 0;
    transition: background-color 0.3s ease;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

footer {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

a {
    font-family: inherit !important;
}

/* ============================================
   文章列表页面包屑导航样式
   ============================================ */
.archive .breadcrumb-nav,
.archive .breadcrumb-nav a,
.archive .breadcrumb-nav span {
    color: #6b7280 !important;
}

.archive .breadcrumb-nav a:hover {
    color: hsl(var(--primary)) !important;
}

/* 面包屑导航通用样式 - 确保所有文字都是灰色 */
.border-b.bg-background .text-muted-foreground,
.border-b.bg-background .text-muted-foreground a,
.border-b.bg-background .text-muted-foreground span {
    color: #6b7280 !important;
}

.border-b.bg-background .text-muted-foreground a:hover {
    color: hsl(var(--primary)) !important;
}

/* ============================================
   导航栏二级菜单样式
   ============================================ */
/* 确保二级菜单可以点击 */
header nav .menu-item-has-children > ul,
header nav .menu-item-has-children > .sub-menu,
header nav .relative.group > ul,
header nav .relative.group > .sub-menu {
    pointer-events: auto !important;
    z-index: 9999 !important;
}

header nav .menu-item-has-children > ul a,
header nav .menu-item-has-children > .sub-menu a,
header nav .relative.group > ul a,
header nav .relative.group > .sub-menu a {
    pointer-events: auto !important;
    cursor: pointer !important;
    z-index: 10000 !important;
    position: relative !important;
    display: block !important;
    text-decoration: none !important;
}

/* 确保父菜单项不会阻止子菜单的点击 */
header nav .menu-item-has-children.relative.group > a {
    pointer-events: auto !important;
}

/* 确保子菜单链接可以点击 */
header nav .sub-menu li a,
header nav ul.sub-menu li a {
    pointer-events: auto !important;
    cursor: pointer !important;
    position: relative !important;
    z-index: 10001 !important;
    display: block !important;
    width: 100% !important;
}

/* 子菜单显示时的样式 */
header nav .sub-menu[style*="display: block"],
header nav .sub-menu[style*="display:block"] {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

/* ============================================
   移动端优化样式
   ============================================ */
@media (max-width: 640px) {
    .container {
        padding-left: 1rem;
        padding-right: 1rem;
    }
    
    /* 移动端按钮优化 - 触摸友好的按钮高度 */
    button {
        min-height: 44px;
    }
    
    /* 移动端卡片间距优化 */
    .grid > * {
        margin-bottom: 1rem;
    }
    
    /* 文章列表页移动端布局优化 */
    article.flex.flex-row {
        flex-direction: column !important;
    }
    
    article.flex.flex-row img {
        width: 100% !important;
        height: 200px !important;
    }
}

/* 文章列表页样式优化 */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.line-clamp-3 {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* 平板端优化 */
@media (min-width: 640px) and (max-width: 1024px) {
    .container {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
}

/* ============================================
   卡片和交互元素样式
   ============================================ */
.category-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.category-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.07);
    border-color: hsl(var(--primary));
}

.icon-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.icon-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px -5px rgba(0, 0, 0, 0.1);
}

.download-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.download-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 30px -8px rgba(8, 9, 13, 0.07);
    border-color: hsl(var(--primary));
}

/* ============================================
   图标颜色控制
   ============================================ */
/* 1. 主要按钮（蓝色背景）中的图标应为白色，但导航栏的客户端下载按钮图标应为蓝色 */
button[class*="bg-primary"][class*="text-primary-foreground"] i.fas,
button[class*="bg-primary"][class*="text-primary-foreground"] i.fab,
button.bg-primary.text-primary-foreground i {
    color: hsl(var(--primary-foreground)) !important;
}

/* 导航栏客户端下载按钮 - 确保显示 */
header a[href*="#download"],
header a[href*="#download"][class*="bg-primary"],
header .flex.items-center.space-x-4 > a[href*="#download"],
header div.flex.items-center.space-x-4 > a,
header #header-download-btn {
    display: inline-flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    position: relative !important;
    z-index: 10 !important;
    background-color: #3b82f6 !important; /* 蓝色备用 */
    color: #f0f9ff !important; /* 白色文字备用 */
    padding: 8px 16px !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    height: 36px !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}

/* 导航栏客户端下载按钮图标应为蓝色 */
header a[class*="bg-primary"][class*="text-primary-foreground"] i.fas,
header a[class*="bg-primary"][class*="text-primary-foreground"] i.fab,
header a.bg-primary.text-primary-foreground i,
header a[href*="#download"] i.fas.fa-download,
header a[href*="#download"] i.fas {
    color: hsl(var(--primary)) !important;
    display: inline-block !important;
    visibility: visible !important;
    opacity: 1 !important;
    font-family: "Font Awesome 6 Free" !important;
    font-weight: 900 !important;
}

/* 2. 次要按钮中的图标继承文字颜色 */
button[class*="bg-background"] i.fas,
button[class*="bg-background"] i.fab,
button.bg-background i {
    color: inherit !important;
}

/* 3. 确保英雄区平台图标显示为 slate-500 颜色（灰色） */
.text-slate-500 i.fab,
.text-slate-500 i.fas,
.text-slate-500 i[class*="fa-"],
section.bg-sky-100 .text-slate-500 i.fab,
section.bg-sky-100 .text-slate-500 i.fas {
    color: rgb(100 116 139) !important;
}

/* 4. 确保权威认证区域的图标显示为蓝色（primary） */
i.fas.text-primary,
i.fab.text-primary,
i[class*="fa-"][class*="text-primary"],
section.bg-secondary i.fas.text-primary,
section.bg-secondary i.fab.text-primary {
    color: hsl(var(--primary)) !important;
}

/* 5. 确保优势区域的图标显示为蓝色（primary） */
.flex.items-start i.fas.text-primary,
.flex.items-start i.fab.text-primary,
.flex.items-start i[class*="fa-"][class*="text-primary"],
section:not(.bg-secondary):not(.bg-sky-100) .flex.items-start i.fas.text-primary,
section:not(.bg-secondary):not(.bg-sky-100) .flex.items-start i.fab.text-primary {
    color: hsl(var(--primary)) !important;
}

/* 6. 确保全平台覆盖区域的图标显示为灰色（muted-foreground） */
i.fab.text-muted-foreground,
i.fas.text-muted-foreground,
i[class*="fa-"][class*="text-muted-foreground"],
section#download i.fab.text-muted-foreground,
section#download i.fas.text-muted-foreground {
    color: hsl(var(--muted-foreground)) !important;
}

/* 7. 通用规则：所有图标默认继承父元素颜色（优先级较低） */
i.fas, i.fab, i[class*="fa-"] {
    color: inherit;
}

/* ============================================
   文章正文样式（Prose）
   ============================================ */
.prose {
    color: #202935 !important;
    font-family: inherit !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* 确保文章正文区域的所有文本都使用 #202935 */
.single-main-content .prose {
    color: #202935 !important;
}

.single-main-content .prose p,
.single-main-content .prose li,
.single-main-content .prose blockquote,
.single-main-content .prose blockquote p {
    color: #202935 !important;
}

.prose code {
    font-size: 0.875em;
    color: #dc2626;
    background-color: #f3f4f6;
    padding: 2px 4px;
    border-radius: 4px;
}

.prose pre {
    background-color: #1f2937;
    color: #f3f4f6;
    padding: 1rem;
    border-radius: 0.5rem;
    overflow-x: auto;
}

.prose pre code {
    background-color: transparent;
    color: inherit;
    padding: 0;
    border-radius: 0;
}

.prose blockquote {
    border-left: 4px solid hsl(var(--border));
    padding-left: 1rem;
    margin-left: 0 !important;
    margin-right: 0 !important;
    font-style: normal;
    color: #202935 !important;
}

.prose blockquote p {
    color: #202935 !important;
}

.prose ol, .prose ul {
    padding-left: 1.5rem;
    margin-top: 1.25em;
    margin-bottom: 1.25em;
}

.prose li {
    margin-top: 0.5rem;
    margin-bottom: 0.5em;
    color: #202935 !important;
}

.prose li code {
    color: #dc2626;
    background-color: #f3f4f6;
    padding: 2px 4px;
    border-radius: 4px;
    font-size: 0.875em;
}

.prose p {
    margin-top: 0;
    margin-bottom: 24px;
    line-height: 28.8px;
    color: #202935 !important;
    font-size: 16px;
    font-weight: 400;
}

.prose h1 {
    color: rgb(17 24 39);
    font-weight: 700;
}

.prose h2 {
    color: rgb(32, 41, 53) !important;
    font-size: 18px !important;
    margin-top: 0;
    margin-bottom: 24px;
    font-weight: 700;
    line-height: 32.4px;
    border-bottom: none !important;
    padding-bottom: 0;
    position: relative;
    padding-left: 16px;
}

/* H2标题前的蓝色垂直条图标 */
.prose h2::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 22px;
    background-color: #3D83F5;
    display: block;
    border-radius: 2px;
}

.prose h3 {
    color: rgb(32, 41, 53) !important;
    font-size: 16px !important;
    margin-top: 0;
    margin-bottom: 24px;
    font-weight: 700;
    line-height: 28.8px;
}

.prose h4 {
    color: rgb(31 41 55);
}

.prose strong {
    color: rgb(17 24 39);
    font-weight: 600;
}

.prose a {
    color: hsl(var(--primary));
    text-decoration: underline;
    font-family: inherit !important;
}

.prose a:hover {
    opacity: 0.8;
}

.prose .entry-content {
    color: #202935 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* 确保 entry-content 内的所有文本都使用 #202935 */
.prose .entry-content p,
.prose .entry-content li,
.prose .entry-content blockquote,
.prose .entry-content blockquote p {
    color: #202935 !important;
}

.prose .entry-content p {
    margin-top: 0;
    margin-bottom: 24px;
    color: #202935 !important;
    line-height: 28.8px;
    font-size: 16px;
    font-weight: 400;
}

.prose .entry-content code {
    color: #dc2626;
    background-color: #f3f4f6;
    padding: 2px 4px;
    border-radius: 4px;
    font-size: 0.875em;
}

.prose .entry-content pre {
    background-color: #1f2937;
    color: #f3f4f6;
    padding: 1rem;
    border-radius: 0.5rem;
    overflow-x: auto;
    margin-top: 1.25em;
    margin-bottom: 1.25em;
}

.prose .entry-content pre code {
    background-color: transparent;
    color: inherit;
    padding: 0;
    border-radius: 0;
}

.prose .entry-content blockquote {
    border-left: 4px solid hsl(var(--border));
    padding-left: 1rem;
    margin-left: 0;
    margin-right: 0;
    font-style: normal;
    color: #4b5563;
}

.prose .entry-content ol,
.prose .entry-content ul {
    padding-left: 1.5rem;
    margin-top: 1.25em;
    margin-bottom: 1.25em;
    list-style-type: decimal;
}

.prose .entry-content li {
    margin-top: 0.5rem;
    margin-bottom: 0.5em;
}

.prose .entry-content h2 {
    color: rgb(32, 41, 53) !important;
    font-size: 18px !important;
    margin-top: 0;
    margin-bottom: 24px;
    font-weight: 700;
    line-height: 32.4px;
    position: relative;
    padding-left: 16px;
}

/* 文章内容区域H2标题前的蓝色垂直条图标 */
.prose .entry-content h2::before {
    content: '';
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 4px;
    height: 22px;
    background-color: #3D83F5;
    display: block;
    border-radius: 2px;
}

.prose .entry-content h3 {
    color: rgb(32, 41, 53) !important;
    font-size: 16px !important;
    margin-top: 0;
    margin-bottom: 24px;
    font-weight: 700;
    line-height: 28.8px;
}

.prose .entry-content strong {
    color: #111827;
    font-weight: 600;
}

.prose .entry-content a {
    color: hsl(var(--primary));
    text-decoration: underline;
}

.prose .entry-content a:hover {
    opacity: 0.8;
}

/* ============================================
   右侧小工具上下间距 - 24px
   ============================================ */
.archive-sidebar.space-y-6,
.single-sidebar.space-y-6,
.archive-sidebar[class*="space-y-6"],
.single-sidebar[class*="space-y-6"],
aside.archive-sidebar.space-y-6,
aside.single-sidebar.space-y-6 {
    --tw-space-y-reverse: 0;
    margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse))) !important;
    margin-bottom: calc(1.5rem * var(--tw-space-y-reverse)) !important;
}

.archive-sidebar.space-y-7,
.single-sidebar.space-y-7,
.archive-sidebar[class*="space-y-7"],
.single-sidebar[class*="space-y-7"],
aside.archive-sidebar.space-y-7,
aside.single-sidebar.space-y-7 {
    --tw-space-y-reverse: 0;
    margin-top: calc(1.75rem * calc(1 - var(--tw-space-y-reverse))) !important;
    margin-bottom: calc(1.75rem * var(--tw-space-y-reverse)) !important;
}

/* ============================================
   下载页面截图轮播样式
   ============================================ */
.screenshot-carousel {
    position: relative;
    width: 100%;
}

#screenshot-track {
    display: flex;
    transition: transform 0.5s ease-in-out;
}

#screenshot-track > div {
    min-width: 100%;
}

.screenshot-dot {
    transition: all 0.3s ease;
    cursor: pointer;
}

.screenshot-dot:hover {
    transform: scale(1.2);
}

.screenshot-prev,
.screenshot-next {
    cursor: pointer;
    transition: all 0.3s ease;
}

.screenshot-prev:hover,
.screenshot-next:hover {
    background-color: #e2e8f0 !important;
    transform: scale(1.1);
}

/* 确保侧边栏内的小工具间距为24px */
.archive-sidebar > * + *,
.single-sidebar > * + * {
    margin-top: 24px !important;
}

/* ============================================
   右侧小工具搜索框样式 - 与帮助中心页面一致
   ============================================ */
/* 搜索框边框颜色 - 沿用帮助中心样式 */
.sidebar-1 .widget input[type="search"],
.sidebar-1 .widget input[type="text"],
.sidebar-1 .qf-search-widget input[type="search"],
.sidebar-1 .qf-search-widget input[type="text"],
.sidebar-help .widget input[type="search"],
.sidebar-help .widget input[type="text"],
.sidebar-help .qf-search-widget input[type="search"],
.sidebar-help .qf-search-widget input[type="text"],
.archive-sidebar .widget input[type="search"],
.archive-sidebar .widget input[type="text"],
.archive-sidebar input[type="search"],
.archive-sidebar input[type="text"],
.single-sidebar .widget input[type="search"],
.single-sidebar .widget input[type="text"],
.single-sidebar input[type="search"],
.single-sidebar input[type="text"],
aside input[type="search"],
aside input[type="text"] {
    border: 1px solid #F3F3F5 !important;
    border-color: #F3F3F5 !important;
    background-color: #ffffff !important;
    border-radius: 0.5rem !important; /* rounded-lg */
    padding-left: 2.75rem !important; /* pl-11 */
    padding-right: 1rem !important; /* pr-4 */
    padding-top: 0.75rem !important; /* py-3 */
    padding-bottom: 0.75rem !important; /* py-3 */
}

/* ============================================
   文章详情页图片间距 - 与正文保持一致
   ============================================ */
/* 确保图片的左右间距与正文内容一致（无额外margin） */
.single-main-content .prose img,
.single-main-content .entry-content img,
.single-main-content .prose figure,
.single-main-content .entry-content figure,
.single-main-content .prose figure img,
.single-main-content .entry-content figure img {
    margin-left: 0 !important;
    margin-right: 0 !important;
    max-width: 100% !important;
    height: auto !important;
    display: block !important;
}

/* 确保figure标签（WordPress图片容器）的间距与正文一致 */
.single-main-content .prose figure,
.single-main-content .entry-content figure {
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 1.25em !important;
    margin-bottom: 1.25em !important;
    padding: 0 !important;
}

/* 确保图片caption的间距 */
.single-main-content .prose figure figcaption,
.single-main-content .entry-content figure figcaption,
.single-main-content .prose .wp-caption-text,
.single-main-content .entry-content .wp-caption-text {
    margin-top: 0.5em !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 0 !important;
    text-align: center !important;
    font-size: 0.875em !important;
    color: #6b7280 !important;
}

/* ============================================
   板块背景色控制
   ============================================ */
/* 所有 bg-secondary 板块强制显示为灰色 */
section.bg-secondary {
    background-color: hsl(var(--secondary)) !important;
}

/* 权威认证板块 - 灰色背景 */
section.bg-secondary:has(h2:contains("权威认证")),
section.bg-secondary:first-of-type {
    background-color: hsl(var(--secondary)) !important;
}

/* 满足您的多种加速需求板块 - 灰色背景 */
section#solutions.bg-secondary {
    background-color: hsl(var(--secondary)) !important;
}

/* 用户见证板块 - 灰色背景 */
section.bg-secondary:has(h2:contains("他们都在用轻蜂")) {
    background-color: hsl(var(--secondary)) !important;
}

/* ============================================
   最新动态区域样式
   ============================================ */
/* 最新动态标题 - 单行显示，颜色为黑色 */
section#news .news-title a {
    color: #111827 !important; /* slate-900 / 黑色 */
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

section#news .news-title a:hover {
    color: hsl(var(--primary)) !important;
}

/* 最新动态摘要 - 2行显示，第二行21个字符超出省略（由JavaScript精确控制） */
section#news .news-excerpt {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.5;
    max-height: 3em; /* 2行的高度 */
    word-break: break-word; /* 允许在单词边界换行 */
    color: #63748A !important; /* 浅色字体 */
}

/* ============================================
   文字颜色控制
   ============================================ */
/* 场景类板块摘要文字 - 浅色字体 */
section#solutions .bg-card p.text-muted-foreground {
    color: #63748A !important;
}

/* 用户见证部分文字颜色 - 浅色字体 */
section#testimonials .bg-card p.text-muted-foreground.italic {
    color: #63748A !important;
}

/* 用户见证部分身份文字颜色 - 浅色字体 */

/* ============================================
   核心特性展示区域优化
   ============================================ */
/* 确保核心特性卡片中的图标不被压缩 */
.taxonomy-scenario-category .core-feature-icon {
    min-width: 3rem !important;
    min-height: 3rem !important;
    flex-shrink: 0 !important;
    width: 3rem !important;
    height: 3rem !important;
}

/* 确保核心特性卡片使用flex布局 */
.taxonomy-scenario-category .core-feature-card {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
}

/* 确保核心特性卡片中的标题不被压缩 */
.taxonomy-scenario-category .core-feature-title {
    flex-shrink: 0 !important;
}

/* 确保核心特性卡片中的描述文字可以扩展 */
.taxonomy-scenario-category .core-feature-desc {
    flex-grow: 1 !important;
    min-height: 0 !important;
}
section#testimonials .bg-card p.text-sm.text-muted-foreground {
    color: #63748A !important;
}

/* Q&A部分答案文字颜色 - 浅色字体 */
section#support p.text-muted-foreground.mt-2 {
    color: #63748A !important;
}

/* 导航栏链接默认颜色 */
header nav a.nav-link,
header .nav-link {
    color: #63748A !important;
}

/* 导航栏链接悬停颜色 - 保持原色（text-foreground/80） */
/* ============================================
   导航菜单下拉菜单样式
   ============================================ */

/* 桌面端下拉菜单 */
header nav .menu-item-has-children {
    position: relative;
}

/* 下拉菜单默认隐藏 */
header nav .menu-item-has-children > ul.submenu,
header nav .menu-item-has-children > .submenu {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 0.5rem;
    min-width: 200px;
    background-color: white;
    border-radius: 0.375rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    border: 1px solid hsl(var(--border) / 0.4);
    padding: 0.5rem 0;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.2s ease, visibility 0.2s ease, transform 0.2s ease;
    transform: translateY(-10px);
    z-index: 9999;
}

/* 悬停时显示下拉菜单 */
header nav .menu-item-has-children.group:hover > ul.submenu,
header nav .menu-item-has-children.group:hover > .submenu,
header nav .menu-item-has-children:hover > ul.submenu,
header nav .menu-item-has-children:hover > .submenu {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
}

header nav .menu-item-has-children > ul.submenu li,
header nav .menu-item-has-children > .submenu li {
    margin: 0;
    list-style: none;
}

header nav .menu-item-has-children > ul.submenu a,
header nav .menu-item-has-children > .submenu a {
    display: block;
    padding: 0.5rem 1rem;
    color: hsl(var(--foreground) / 0.8);
    text-decoration: none;
    transition: all 0.2s;
    white-space: nowrap;
}

header nav .menu-item-has-children > ul.submenu a:hover,
header nav .menu-item-has-children > .submenu a:hover {
    background-color: hsl(var(--secondary));
    color: hsl(var(--foreground));
}

/* 移动端子菜单 */
@media (max-width: 768px) {
    .submenu-toggle {
        padding: 0.5rem;
        background: none;
        border: none;
        cursor: pointer;
        transition: transform 0.2s;
    }
    
    .submenu-toggle[aria-expanded="true"] {
        transform: rotate(180deg);
    }
    
    .submenu {
        transition: all 0.3s ease;
    }
    
    .submenu.hidden {
        display: none;
    }
}

header nav a.nav-link:hover,
header .nav-link:hover {
    color: hsl(var(--foreground) / 0.8) !important;
}

/* 所有板块的副标题（描述文字）颜色 - #63748A */
section#solutions .text-center .text-muted-foreground,
section#news .text-center .text-muted-foreground,
section#testimonials .text-center .text-muted-foreground,
section#support .text-center .text-muted-foreground,
section.bg-blue-50 .text-center .text-muted-foreground,
section .text-center p.text-muted-foreground[class*="max-w"],
section .text-center .text-muted-foreground {
    color: #63748A !important;
}

/* 权威认证板块副标题 */
section.bg-secondary .text-center .text-muted-foreground {
    color: #63748A !important;
}

/* "为什么选择我们"板块的正文文字颜色 - #63748A */
section .text-muted-foreground.mt-1 {
    color: #63748A !important;
}

/* 定价页面副标题颜色 - #63748A */
section#pricing .text-center .text-muted-foreground,
section.bg-secondary .text-center .text-muted-foreground {
    color: #63748A !important;
}

/* ============================================
   定价页面功能特性图标颜色
   ============================================ */
/* 功能特性区域的图标容器 */
section.bg-secondary .flex.flex-col.items-center .rounded-full {
    background-color: hsl(var(--primary) / 0.1) !important;
}

/* 功能特性区域的图标颜色 - 蓝色 */
section.bg-secondary .flex.flex-col.items-center .rounded-full i,
section.bg-secondary .flex.flex-col.items-center .rounded-full i.fas,
section.bg-secondary .flex.flex-col.items-center .rounded-full i.fab,
section.bg-secondary .flex.flex-col.items-center .text-primary i,
section.bg-secondary .flex.flex-col.items-center .text-primary i.fas,
section.bg-secondary .flex.flex-col.items-center .text-primary i.fab {
    color: hsl(var(--primary)) !important;
}

/* 备用规则：直接针对包含图标的div */
section.bg-secondary div.h-12.w-12.rounded-full i {
    color: hsl(var(--primary)) !important;
}

section.bg-secondary div.h-12.w-12.rounded-full {
    background-color: hsl(var(--primary) / 0.1) !important;
}

/* ============================================
   卡片背景色强制应用
   ============================================ */
.bg-card {
    background-color: hsl(var(--card)) !important;
    color: hsl(var(--card-foreground)) !important;
}

section.bg-secondary .bg-card {
    background-color: hsl(var(--card)) !important;
}

section#download .bg-card {
    background-color: hsl(var(--card)) !important;
}

/* ============================================
   按钮背景色强制应用
   ============================================ */
/* 英雄区立即免费试用按钮 - 蓝色背景 */
section.hero-section button[class*="bg-primary"][class*="text-primary-foreground"]:first-of-type,
section.bg-sky-100 button[class*="bg-primary"][class*="text-primary-foreground"]:first-of-type {
    background-color: hsl(var(--primary)) !important;
    color: hsl(var(--primary-foreground)) !important;
}

/* 英雄区下载客户端按钮 - 白色背景 */
section.hero-section a[class*="bg-background"],
section.hero-section button[class*="bg-background"],
section.bg-sky-100 a[class*="bg-background"],
section.bg-sky-100 button[class*="bg-background"] {
    background-color: hsl(var(--background)) !important;
    color: hsl(var(--foreground)) !important;
    border-color: hsl(var(--border)) !important;
}

/* 号召区域按钮 - 蓝色背景 */
section.bg-blue-50 button[class*="bg-primary"][class*="text-primary-foreground"],
section.bg-blue-50 button.bg-primary.text-primary-foreground {
    background-color: hsl(var(--primary)) !important;
    color: hsl(var(--primary-foreground)) !important;
}

/* 首页加速场景卡片 hover 效果（参考 index1.html 的 solution-card） */
.scenario-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.scenario-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 12px 24px rgba(15, 23, 42, 0.06);
}

/* 导航栏客户端下载按钮 - 确保蓝色背景 */
header a[class*="bg-primary"][class*="text-primary-foreground"],
header a.bg-primary.text-primary-foreground {
    background-color: hsl(var(--primary)) !important;
    color: hsl(var(--primary-foreground)) !important;
}

/* 首页英雄区标题两部分之间的间距 */
.hero-title-spaced .hero-title-part1 {
    margin-right: 0.4em; /* 适中的间距，既不会太紧也不会太松 */
}

/* 首页英雄区平台图标按钮样式 - 亮蓝色渐变背景，增强视觉效果 */
.hero-platform-btn {
    position: relative;
    overflow: hidden;
    /* 亮蓝色渐变：从左上角的亮蓝色到右下角的深蓝色 */
    background: linear-gradient(135deg, #60A5FA 0%, #3B82F6 50%, #2563EB 100%) !important;
    color: hsl(var(--primary-foreground)) !important;
    border-color: #3B82F6 !important;
    /* 增强阴影效果，让按钮更显眼 */
    box-shadow: 0 10px 25px -5px rgba(59, 130, 246, 0.4), 0 8px 10px -6px rgba(59, 130, 246, 0.3) !important;
    /* 添加轻微的内阴影，增加立体感 */
    border-width: 2px !important;
    /* 确保按钮有足够的视觉重量 */
    min-height: 56px;
    font-weight: 600 !important;
}

.hero-platform-btn::before {
    content: '';
    position: absolute;
    top: 0;
    left: -100%;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.4), transparent);
    transition: left 0.5s;
    z-index: 1;
}

.hero-platform-btn:hover::before {
    left: 100%;
}

.hero-platform-btn:hover {
    /* 悬停时使用更亮的渐变 */
    background: linear-gradient(135deg, #7BB3FF 0%, #60A5FA 50%, #3B82F6 100%) !important;
    /* 悬停时增强阴影 */
    box-shadow: 0 20px 40px -10px rgba(59, 130, 246, 0.5), 0 10px 20px -8px rgba(59, 130, 246, 0.4) !important;
    transform: translateY(-2px);
}

.hero-platform-btn:active {
    transform: translateY(0);
    box-shadow: 0 5px 15px -3px rgba(59, 130, 246, 0.3) !important;
}

.hero-platform-btn i,
.hero-platform-btn i.fab,
.hero-platform-btn i.fas {
    transition: transform 0.3s ease;
    color: hsl(var(--primary-foreground)) !important;
    position: relative;
    z-index: 2;
}

.hero-platform-btn span {
    color: hsl(var(--primary-foreground)) !important;
    position: relative;
    z-index: 2;
}

.hero-platform-btn:hover i {
    transform: scale(1.15) rotate(5deg);
}

/* 确保按钮在移动端也显示良好 */
@media (max-width: 640px) {
    .hero-platforms .grid {
        max-width: 100%;
        gap: 0.75rem;
    }
    
    .hero-platform-btn {
        padding: 0.875rem 1rem;
        font-size: 0.875rem;
        min-height: 48px;
    }
    
    .hero-platform-btn i {
        font-size: 1.125rem;
    }
}

/* 桌面端进一步优化 */
@media (min-width: 768px) {
    .hero-platform-btn {
        padding: 1rem 1.5rem;
        font-size: 1rem;
        min-height: 60px;
    }
    
    .hero-platform-btn i {
        font-size: 1.5rem;
    }
}

/* ============================================
   关于我们页面卡片样式优化
   ============================================ */
/* 核心优势卡片 hover 效果 */
.about-advantage-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.about-advantage-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.1);
    border-color: hsl(var(--primary) / 0.3);
}

/* 产品矩阵卡片 hover 效果 */
.about-product-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.about-product-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.1);
    border-color: hsl(var(--primary) / 0.3);
}

/* 企业文化卡片 hover 效果 */
.about-culture-card {
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.about-culture-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 24px -5px rgba(0, 0, 0, 0.08);
    border-color: hsl(var(--primary) / 0.2);
}

/* ============================================
   链接和标题颜色
   ============================================ */
/* 官方查询、了解更多、阅读更多链接 - 蓝色 */
a.text-primary:not([class*="text-primary-foreground"]),
a[class~="text-primary"]:not([class*="text-primary-foreground"]) {
    color: hsl(var(--primary)) !important;
}

a.text-primary:hover:not([class*="text-primary-foreground"]),
a[class~="text-primary"]:hover:not([class*="text-primary-foreground"]) {
    color: hsl(var(--primary)) !important;
    opacity: 0.8;
}

/* 准备好体验极致的网络自由了吗？标题 - 蓝色 */
h2.text-primary,
h2[class*="text-primary"] {
    color: hsl(var(--primary)) !important;
}

/* 首页场景解决方案模块卡片标题 - 强制黑色 */
section#solutions h3 a,
section#solutions h3 {
    color: #111827 !important; /* 近黑色，和正文标题保持一致 */
}

/* ============================================
   手风琴（Accordion）样式
   ============================================ */
.accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out, padding 0.3s ease-out;
}

details[open] .accordion-content {
    max-height: 500px;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

details[open] .accordion-icon {
    transform: rotate(180deg);
}

.accordion-icon {
    transition: transform 0.3s ease;
}

/* ============================================
   标签页面样式
   ============================================ */
.tag-filter {
    cursor: pointer;
}

.tag-item {
    transition: all 0.3s ease;
}

/* ============================================
   小部件（Widget）样式
   ============================================ */
.widget {
    margin-bottom: 2rem;
}

/* 右侧边栏小工具边框颜色 */
.archive aside .widget,
.archive aside .bg-white.rounded-lg.border,
.archive aside div[class*="bg-white"][class*="rounded-lg"][class*="border"] {
    border-color: #FFFFFF !important;
    border-width: 1px !important;
    border-style: solid !important;
}

.widget-title {
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 1rem;
    color: rgb(17 24 39);
}

.widget ul {
    list-style: none;
    padding: 0;
    margin: 0;
}

.widget li {
    margin-bottom: 0.5rem;
}

.widget a {
    color: rgb(55 65 81);
    text-decoration: none;
    transition: color 0.2s ease;
}

.widget a:hover {
    color: hsl(var(--primary));
}

/* 热门文章小部件链接颜色 */
.widget.popular-posts a {
    color: rgb(55 65 81);
}

.widget.popular-posts a:hover {
    color: hsl(var(--primary));
}

/* ============================================
   文章列表页新样式优化
   ============================================ */
/* 文章卡片样式 */
.archive article.bg-white {
    transition: all 0.3s ease;
}

.archive article.bg-white:hover {
    border-color: #d1d5db; /* 更浅的灰色 */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

/* 文章缩略图样式 */
.archive article a img {
    transition: transform 0.3s ease;
}

.archive article:hover a img {
    transform: scale(1.05);
}

/* 文章元数据图标样式 */
.archive article .fa-clock,
.archive article .fa-eye,
.archive article .fa-tag {
    color: hsl(var(--muted-foreground));
    font-size: 0.875rem;
}

.archive article .fa-tag {
    margin-right: 0.375rem;
}

/* 移动端响应式优化 */
@media (max-width: 768px) {
    .archive article {
        flex-direction: column !important;
    }
    
    .archive article > a {
        width: 100% !important;
        height: 200px !important;
    }
    
    .archive article .flex-grow {
        padding: 1rem !important;
    }
    
    .archive article h2 {
        font-size: 1.25rem !important;
        margin-bottom: 0.75rem !important;
    }
    
    .archive article p {
        font-size: 0.875rem !important;
        margin-bottom: 1rem !important;
    }
    
    .archive article .text-xs {
        font-size: 0.75rem !important;
    }
}

/* 标签链接悬停效果 */
.archive article a[href*="tag"]:hover {
    color: hsl(var(--primary)) !important;
}

/* 文章列表页标题和摘要颜色 */
.archive article.bg-white h2 a,
.archive article.bg-white h2 a.text-black {
    color: #000000 !important;
}

.archive article.bg-white h2 a:hover {
    color: hsl(var(--primary)) !important;
}

.archive article.bg-white p.text-gray-500,
.archive article.bg-white .flex-grow p {
    color: #6b7280 !important;
}

/* ============================================
   列表页左右侧顶对齐
   ============================================ */
.archive .grid.lg\\:items-start > div:first-child,
.archive .grid.lg\\:items-start > aside,
.archive .flex.lg\\:flex-row > div:first-child,
.archive .flex.lg\\:flex-row > aside {
    align-self: start !important;
}

.archive .grid.lg\\:items-start > div:first-child > div,
.archive .flex.lg\\:flex-row > div:first-child > div {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

.archive aside.space-y-6 > *:first-child {
    margin-top: 0 !important;
}

/* 确保Flex布局的宽度正确应用 */
/* 移动端：全宽（小于1024px） */
@media (max-width: 1023px) {
    .archive-main-content,
    .archive-sidebar,
    .single-main-content,
    .single-sidebar {
        width: 100% !important;
        flex: none !important;
        max-width: 100% !important;
    }
}

/* ============================================
   列表页和详情页布局 - 桌面端
   ============================================ */
@media (min-width: 1024px) {
    /* 强制覆盖 flex-col，确保使用 flex-row */
    .archive-layout.flex-col,
    .single-layout.flex-col,
    .archive-layout[class*="flex-col"],
    .single-layout[class*="flex-col"] {
        flex-direction: row !important;
    }
    
    /* 确保flex容器正确 - 使用最高优先级 */
    .archive-layout,
    .single-layout,
    .archive-layout.flex,
    .single-layout.flex,
    .archive-layout.flex-col,
    .single-layout.flex-col,
    .archive-layout.flex.lg\\:flex-row,
    .single-layout.flex.lg\\:flex-row,
    div.archive-layout,
    div.single-layout,
    div[class*="archive-layout"],
    div[class*="single-layout"],
    .flex.archive-layout,
    .flex.single-layout,
    .flex.flex-col.archive-layout,
    .flex.flex-col.single-layout,
    .archive-layout[class*="items-start"],
    .single-layout[class*="items-start"],
    .archive-layout.lg\\:items-start,
    .single-layout.lg\\:items-start {
        display: flex !important;
        flex-direction: row !important;
        flex-wrap: nowrap !important;
        gap: 24px !important; /* 左右间距24px */
        column-gap: 24px !important; /* 列间距24px */
        row-gap: 0 !important; /* 行间距为0 */
        align-items: flex-start !important;
        align-content: flex-start !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
    
    /* 强制覆盖任何可能的gap类 */
    .archive-layout[class*="gap"],
    .single-layout[class*="gap"] {
        gap: 24px !important;
        column-gap: 24px !important;
    }
    
    /* 先重置移动端的 flex: none 样式 */
    .archive-main-content,
    .archive-sidebar,
    .single-main-content,
    .single-sidebar {
        flex: 0 0 auto !important; /* 重置 flex: none */
        box-sizing: border-box !important;
    }
    
    /* ============================================
       列表页（archive.php）- 左侧内容区68%
       使用gap时：calc((100% - 24px) * 0.68)
       使用margin时：calc(68% - 12px) 确保总宽度100%
       ============================================ */
    .archive-layout .archive-main-content,
    .archive-layout > .archive-main-content,
    .archive-layout > div.archive-main-content,
    div.archive-main-content {
        flex: 0 0 calc(68% - 12px) !important;
        width: calc(68% - 12px) !important;
        max-width: calc(68% - 12px) !important;
        min-width: 0 !important;
        flex-shrink: 0 !important;
        flex-grow: 0 !important;
        margin-right: 24px !important; /* 使用margin确保间距 */
        align-self: flex-start !important; /* 确保顶对齐 */
        margin-top: 0 !important; /* 移除顶部边距 */
        padding-top: 0 !important; /* 移除顶部内边距 */
    }
    
    /* ============================================
       列表页（archive.php）- 右侧边栏28%
       使用gap时：calc((100% - 42px) * 0.28)
       使用margin时：28% 确保总宽度100%
       ============================================ */
    .archive-layout .archive-sidebar,
    .archive-layout > .archive-sidebar,
    .archive-layout > aside.archive-sidebar,
    aside.archive-sidebar {
        flex: 0 0 28% !important;
        width: 28% !important;
        max-width: 28% !important;
        min-width: 0 !important;
        flex-shrink: 0 !important;
        flex-grow: 0 !important;
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        order: 2 !important; /* 确保在右侧 */
        align-self: flex-start !important; /* 确保顶对齐 */
        margin-top: 0 !important; /* 移除顶部边距 */
        padding-top: 0 !important; /* 移除顶部内边距 */
    }
    
    /* ============================================
       详情页（single.php）- 左侧文章68%
       使用gap时：calc((100% - 24px) * 0.68)
       使用margin时：calc(68% - 12px) 确保总宽度100%
       ============================================ */
    .single-layout .single-main-content,
    .single-layout > .single-main-content,
    .single-layout > article.single-main-content,
    article.single-main-content {
        flex: 0 0 calc(68% - 12px) !important;
        width: calc(68% - 12px) !important;
        max-width: calc(68% - 12px) !important;
        min-width: 0 !important;
        flex-shrink: 0 !important;
        flex-grow: 0 !important;
        order: 1 !important; /* 确保在左侧 */
        margin-right: 24px !important; /* 使用margin确保间距 */
        align-self: flex-start !important; /* 确保顶对齐 */
        margin-top: 0 !important; /* 移除顶部边距 */
    }
    
    /* 详情页标题样式 - 参考示例页面 */
    article.single-main-content h1.text-2xl:first-of-type,
    article.single-main-content > h1:first-child {
        margin-top: 0 !important;
        padding-top: 0 !important;
        font-size: 1.5rem !important; /* text-2xl = 24px */
        font-weight: 700 !important;
        line-height: 1.3 !important;
        margin-bottom: 1rem !important; /* mb-4 = 16px */
        color: #111827 !important;
        border-bottom: none !important; /* 去掉标题下面的横线 */
        text-align: center !important; /* 标题居中 */
    }
    
    /* 详情页元信息样式 */
    article.single-main-content .flex.items-center.flex-wrap {
        margin-bottom: 2rem !important; /* mb-8 = 32px */
        padding-bottom: 1rem !important; /* pb-4 = 16px */
        border-bottom: none !important; /* 去掉元信息下面的横线 */
        justify-content: center !important; /* 元信息居中 */
    }
    
    /* 详情页正文内容样式 */
    article.single-main-content .prose.entry-content {
        margin-top: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        font-size: 1rem !important;
        line-height: 1.8 !important;
    }
    
    article.single-main-content .prose.entry-content p:first-child {
        margin-top: 0 !important;
    }
    
    /* 确保正文内容内部元素的左右间距一致 */
    article.single-main-content .prose.entry-content > * {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    article.single-main-content .prose.entry-content img,
    article.single-main-content .prose.entry-content figure,
    article.single-main-content .prose.entry-content blockquote,
    article.single-main-content .prose.entry-content ul,
    article.single-main-content .prose.entry-content ol {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    /* ============================================
       详情页（single.php）- 右侧边栏28%
       使用gap时：calc((100% - 42px) * 0.28)
       使用margin时：28% 确保总宽度100%
       ============================================ */
    .single-layout .single-sidebar,
    .single-layout > .single-sidebar,
    .single-layout > aside.single-sidebar,
    aside.single-sidebar {
        flex: 0 0 28% !important;
        width: 28% !important;
        max-width: 28% !important;
        min-width: 0 !important;
        flex-shrink: 0 !important;
        flex-grow: 0 !important;
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        order: 2 !important; /* 确保在右侧 */
        align-self: flex-start !important; /* 确保顶对齐 */
        margin-top: 0 !important; /* 移除顶部边距 */
        padding-top: 0 !important; /* 移除顶部内边距 */
    }
}

/* ============================================
   导航菜单当前项样式
   ============================================ */
header nav .nav-link-current,
header nav .current-menu-item > a,
header nav .current_page_item > a,
header nav .current-menu-ancestor > a,
header nav .current-page-ancestor > a {
    color: #3D83F5 !important;
}

/* ============================================
   分页导航样式
   ============================================ */
.pagination,
.wp-pagenavi,
.page-numbers {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: 2rem;
    margin-bottom: 2rem;
}

/* 隐藏分页导航中的"文章分页"文字 */
.pagination .screen-reader-text,
.page-numbers .screen-reader-text,
nav .screen-reader-text {
    display: none !important;
    visibility: hidden !important;
    width: 0 !important;
    height: 0 !important;
    overflow: hidden !important;
    position: absolute !important;
    clip: rect(0, 0, 0, 0) !important;
}

.pagination a,
.pagination span,
.page-numbers a,
.page-numbers span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5rem;
    height: 2.5rem;
    padding: 0 0.75rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #6b7280;
    background-color: white;
    border: 1px solid #e5e7eb;
    border-radius: 0.375rem;
    text-decoration: none;
    transition: all 0.2s ease;
}

.pagination a:hover,
.page-numbers a:hover {
    color: hsl(var(--primary));
    background-color: hsl(var(--primary) / 0.1);
    border-color: hsl(var(--primary));
}

.pagination .current,
.pagination span.current,
.page-numbers .current,
.page-numbers span.current {
    color: white;
    background-color: hsl(var(--primary));
    border-color: hsl(var(--primary));
    cursor: default;
}

.pagination .prev,
.pagination .next,
.page-numbers .prev,
.page-numbers .next {
    padding-left: 1rem;
    padding-right: 1rem;
}

.pagination .dots,
.page-numbers .dots {
    border: none;
    background: transparent;
    cursor: default;
}

.pagination .dots:hover,
.page-numbers .dots:hover {
    background: transparent;
    border: none;
}

/* ============================================
   竞品分类页面样式（仅限 taxonomy-compare-category.php）
   基于 web/jsq-posts.html 构建的本地 CSS
   ============================================ */

/* ============================================
   自定义颜色变量（基于 jsq-posts.html 的 Tailwind 配置）
   确保与 HTML 中的 tailwind.config 完全匹配
   ============================================ */
:root {
    /* 使用 hsl() 格式的颜色变量（用于直接使用） */
    --color-background: hsl(210, 40%, 98%);
    --color-foreground: hsl(215, 25%, 27%);
    --color-card: hsl(0, 0%, 100%);
    --color-card-foreground: hsl(215, 25%, 27%);
    --color-primary: hsl(217, 91%, 60%);
    --color-primary-foreground: hsl(0, 0%, 100%);
    --color-muted-foreground: hsl(214, 15%, 55%);
    --color-border: hsl(210, 40%, 94%);
    --color-accent: hsl(210, 40%, 96.1%);
    
    /* Tailwind HSL 格式（空格分隔，用于 hsl() 函数） */
    --background: 210 40% 98%;
    --foreground: 215 25% 27%;
    --card: 0 0% 100%;
    --card-foreground: 215 25% 27%;
    --primary: 217 91% 60%;
    --primary-foreground: 0 0% 100%;
    --muted-foreground: 214 15% 55%;
    --border: 210 40% 94%;
    --accent: 210 40% 96.1%;
    
    /* Border radius 配置（匹配 tailwind.config） */
    --radius-lg: 0.75rem;
    --radius-md: 0.5rem;
}

/* Tailwind 自定义类定义（用于 web/jsq-posts.html） */
.bg-background {
    background-color: var(--color-background);
}

.text-foreground {
    color: var(--color-foreground);
}

.bg-card {
    background-color: var(--color-card);
}

.text-card-foreground {
    color: var(--color-card-foreground);
}

.bg-primary {
    background-color: var(--color-primary);
}

.text-primary-foreground {
    color: var(--color-primary-foreground);
}

.text-muted-foreground {
    color: var(--color-muted-foreground);
}

.border-border {
    border-color: var(--color-border);
}

.bg-accent {
    background-color: var(--color-accent);
}

.hover\:bg-accent:hover {
    background-color: var(--color-accent);
}

.hover\:text-foreground:hover {
    color: var(--color-foreground);
}

/* ============================================
   三栏布局网格类（用于 jsq-posts.html）
   补充本地 Tailwind CSS 中缺失的网格类
   ============================================ */
/* 4列网格系统 */
@media (min-width: 1024px) {
    .lg\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    
    .lg\:col-span-1 {
        grid-column: span 1 / span 1;
    }
    
    .lg\:col-span-2 {
        grid-column: span 2 / span 2;
    }
}

/* 移除卡片背景色和阴影 - 使用更通用的选择器确保样式生效 */
main .compare-category-layout .bg-white,
main .compare-category-sidebar-left .bg-white,
main .compare-category-main .bg-white,
main .compare-category-sidebar-right .bg-white,
.compare-category-layout .bg-white,
.compare-category-sidebar-left .bg-white,
.compare-category-main .bg-white,
.compare-category-sidebar-right .bg-white,
main .compare-category-layout div[class*="bg-white"],
main .compare-category-sidebar-left div[class*="bg-white"],
main .compare-category-main div[class*="bg-white"],
main .compare-category-sidebar-right div[class*="bg-white"] {
    background-color: transparent !important;
    background: none !important;
}

main .compare-category-layout .shadow-sm,
main .compare-category-sidebar-left .shadow-sm,
main .compare-category-main .shadow-sm,
main .compare-category-sidebar-right .shadow-sm,
.compare-category-layout .shadow-sm,
.compare-category-sidebar-left .shadow-sm,
.compare-category-main .shadow-sm,
.compare-category-sidebar-right .shadow-sm {
    box-shadow: none !important;
}

/* 卡片样式 - 只保留边框和内边距 */
main .compare-category-layout .p-6.rounded-lg.border,
main .compare-category-sidebar-left .p-6.rounded-lg.border,
main .compare-category-main .p-6.rounded-lg.border,
main .compare-category-sidebar-right .p-6.rounded-lg.border {
    padding: 1.5rem !important;
    border-radius: 0.75rem !important;
    border: 1px solid var(--color-border) !important;
    background-color: transparent !important;
    box-shadow: none !important;
}

/* 激活状态链接背景色 - 使用 bg-gray-100 */
main .compare-category-sidebar-left a.bg-gray-100,
.compare-category-sidebar-left a.bg-gray-100,
main .compare-category-sidebar-left a[class*="bg-gray-100"] {
    background-color: #f3f4f6 !important;
    color: var(--color-foreground) !important;
    font-weight: 600 !important;
}

/* 导航链接 hover 效果 */
main .compare-category-sidebar-left a:hover:not(.bg-gray-100) {
    background-color: var(--color-accent) !important;
    color: var(--color-foreground) !important;
}

/* 下载图标颜色 - 统一为灰色 */
main .compare-category-sidebar-right .fa-apple.text-gray-500,
main .compare-category-sidebar-right .fa-android.text-gray-500,
.compare-category-sidebar-right .fa-apple.text-gray-500,
.compare-category-sidebar-right .fa-android.text-gray-500,
main .compare-category-sidebar-right .fa-brands.fa-apple,
main .compare-category-sidebar-right .fa-brands.fa-android,
main .compare-category-sidebar-right i[class*="fa-apple"],
main .compare-category-sidebar-right i[class*="fa-android"] {
    color: #6b7280 !important;
    font-size: 1.25rem !important;
}

main .compare-category-sidebar-right a:hover .fa-apple,
main .compare-category-sidebar-right a:hover .fa-android,
main .compare-category-sidebar-right .group:hover .fa-apple,
main .compare-category-sidebar-right .group:hover .fa-android,
.compare-category-sidebar-right a:hover .fa-apple,
.compare-category-sidebar-right a:hover .fa-android,
main .compare-category-sidebar-right a:hover i[class*="fa-apple"],
main .compare-category-sidebar-right a:hover i[class*="fa-android"] {
    color: #1f2937 !important;
}

/* 下载链接文字颜色 */
main .compare-category-sidebar-right a[class*="text-muted-foreground"] {
    color: var(--color-muted-foreground) !important;
}

main .compare-category-sidebar-right a:hover {
    color: var(--color-foreground) !important;
}

/* 标题颜色 */
main .compare-category-layout h2[style*="color: hsl(215, 25%, 27%)"] {
    color: var(--color-card-foreground) !important;
}

/* 文字颜色 */
main .compare-category-layout [style*="color: hsl(214, 15%, 55%)"] {
    color: var(--color-muted-foreground) !important;
}

/* 卡片边框颜色 */
main .compare-category-layout .border[style*="border-color: hsl(210, 40%, 94%)"] {
    border-color: var(--color-border) !important;
}

/* 标题和边框颜色 */
main .compare-category-layout h2[style*="color: hsl(215, 25%, 27%)"] {
    color: var(--color-card-foreground) !important;
}

main .compare-category-layout .border-b[style*="border-color: hsl(210, 40%, 94%)"] {
    border-color: var(--color-border) !important;
}

/* 使用特定的类名确保样式生效 */
.compare-category-layout {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 1.5rem !important;
    align-items: start !important;
    align-content: start !important;
}

@media (min-width: 1024px) {
    /* 确保4列网格布局正确应用（按照 jsq-posts.html 的 1-2-1 布局） */
    .compare-category-layout {
        grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
        display: grid !important;
        gap: 2rem !important;
        align-items: start !important;
        align-content: start !important;
        justify-items: start !important;
    }
    
    /* 确保左侧栏占1列，顶部对齐 */
    .compare-category-sidebar-left {
        grid-column: span 1 / span 1 !important;
        grid-row: 1 !important;
        align-self: start !important;
        justify-self: start !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
    
    /* 确保中间内容占2列，顶部对齐 */
    .compare-category-main {
        grid-column: span 2 / span 2 !important;
        grid-row: 1 !important;
        align-self: start !important;
        justify-self: start !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
    
    /* 确保右侧栏占1列，顶部对齐 */
    .compare-category-sidebar-right {
        grid-column: span 1 / span 1 !important;
        grid-row: 1 !important;
        align-self: start !important;
        justify-self: start !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }
    
    /* 确保所有直接子元素顶部对齐 */
    .compare-category-layout > * {
        align-self: start !important;
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
    
    /* 确保中间内容的第一个div没有顶部间距 */
    .compare-category-main > div:first-child,
    .compare-category-main > *:first-child {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
    
    /* 确保左侧栏的第一个div没有顶部间距 */
    .compare-category-sidebar-left > div:first-child,
    .compare-category-sidebar-left > *:first-child {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
    
    /* 确保右侧栏的第一个div没有顶部间距 */
    .compare-category-sidebar-right > div:first-child,
    .compare-category-sidebar-right > *:first-child {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
    
    /* 覆盖space-y-6类对第一个子元素的影响 */
    .compare-category-main.space-y-6 > *:first-child {
        margin-top: 0 !important;
    }
    
    .compare-category-sidebar-right.space-y-6 > *:first-child {
        margin-top: 0 !important;
    }
    
    /* 确保所有栏的第一个内容块顶部对齐 */
    .compare-category-sidebar-left > div:first-child > div,
    .compare-category-main > div:first-child,
    .compare-category-sidebar-right > div:first-child {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
    
    /* 统一section之间的间距为32px（space-y-8） */
    .compare-category-main.space-y-8 > * + * {
        margin-top: 2rem !important;
    }
    
    .compare-category-sidebar-right.space-y-8 > * + * {
        margin-top: 2rem !important;
    }
}

/* 确保侧边栏内容正确显示（仅限竞品分类页面） */
main .container .grid[class*="lg:grid-cols-12"] > aside[class*="lg:sticky"][class*="top-24"] {
    position: sticky !important;
    top: 6rem !important;
    align-self: start !important;
}

/* 确保grid容器正确显示 */
main .container .grid[class*="lg:grid-cols-12"] {
    width: 100% !important;
    box-sizing: border-box !important;
}

/* 竞品分类页面三栏布局优化 */
main .container .grid[class*="lg:grid-cols-12"] > aside[class*="lg:col-span-2"],
main .container .grid[class*="lg:grid-cols-12"] > section[class*="lg:col-span-7"],
main .container .grid[class*="lg:grid-cols-12"] > aside[class*="lg:col-span-3"] {
    display: block;
    width: 100%;
}

@media (min-width: 1024px) {
    main .container .grid[class*="lg:grid-cols-12"] {
        display: grid;
        grid-template-columns: repeat(12, minmax(0, 1fr));
        gap: 1.5rem; /* gap-6 = 1.5rem */
    }
    
    main .container .grid[class*="lg:grid-cols-12"] > aside[class*="lg:col-span-2"] {
        grid-column: span 2 / span 2;
    }
    
    main .container .grid[class*="lg:grid-cols-12"] > section[class*="lg:col-span-7"] {
        grid-column: span 7 / span 7;
    }
    
    main .container .grid[class*="lg:grid-cols-12"] > aside[class*="lg:col-span-3"] {
        grid-column: span 3 / span 3;
    }
}

/* 确保容器顶部没有多余间距 */
.compare-category-container {
    padding-top: 1.5rem !important;
}

/* 确保面包屑导航后没有多余间距 */
.compare-category-container > .compare-category-layout {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* 全宽标题区域样式 */
main section.bg-white.border-b {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}

    /* 确保三栏的第一个内容块完全顶部对齐 */
@media (min-width: 1024px) {
    .compare-category-sidebar-left > div:first-child,
    .compare-category-main > div:first-child,
    .compare-category-sidebar-right > div:first-child {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
    
    /* 确保左侧栏第一个div内的内容顶部对齐 */
    .compare-category-sidebar-left > div:first-child > *:first-child {
        margin-top: 0 !important;
        padding-top: 0 !important;
    }
    
    /* 确保第一个div的第一个子元素顶部对齐 */
    .compare-category-main > div:first-child > *:first-child {
        margin-top: 0 !important;
    }
    
    .compare-category-sidebar-left > div:first-child > *:first-child {
        margin-top: 0 !important;
    }
    
    .compare-category-sidebar-right > div:first-child > *:first-child {
        margin-top: 0 !important;
    }
}

/* 文章列表项样式（仅限竞品分类页面） */
main section[class*="bg-white"] article {
    transition: background-color 0.2s ease !important;
}

main section[class*="bg-white"] article:hover {
    background-color: #f9fafb !important;
}

/* 导航链接 hover 效果（移除内联 JavaScript 后） */
.compare-nav-item:hover {
    background-color: #f9fafb !important;
}

.compare-nav-current {
    background-color: rgba(59, 130, 246, 0.1) !important;
}

.compare-nav-current:hover {
    background-color: rgba(59, 130, 246, 0.1) !important;
}

/* line-clamp-2 样式 */
.line-clamp-2 {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* ============================================
   竞品分类页面特定样式修复（仅限 taxonomy-compare-category.php）
   ============================================ */
/* 右侧下载图标样式优化 - 使用更通用的选择器 */
main .container aside:last-of-type .fab.fa-apple,
main .container aside:last-of-type .fab.fa-android {
    font-size: 1.5rem !important;
    color: #3b82f6 !important;
    transition: transform 0.2s ease, color 0.2s ease !important;
    min-width: 32px !important;
}

main .container aside:last-of-type a:hover .fab.fa-apple,
main .container aside:last-of-type a:hover .fab.fa-android {
    transform: scale(1.15) !important;
    color: #2563eb !important;
}

/* 下载链接样式优化 - 使用更通用的选择器 */
main .container aside:last-of-type .space-y-0 > li > a {
    padding: 1rem !important;
    border-radius: 0.5rem !important;
    transition: background-color 0.2s ease !important;
    font-weight: 500 !important;
}

main .container aside:last-of-type .space-y-0 > li > a:hover {
    background-color: #eff6ff !important;
}

/* 分享按钮样式 */
.share-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    font-size: 18px;
    border-radius: 50%;
    background-color: transparent;
    cursor: pointer;
    transition: opacity 0.3s ease;
    border: 1px solid;
    margin: 0 6px 12px;
}

.share-icon i {
    font-size: 18px;
}

.share-icon:hover {
    opacity: 0.8;
}

/* 微信分享图标 */
.share-wechat {
    color: rgb(123, 197, 73);
    border-color: rgb(123, 197, 73);
}

/* 新浪微博分享图标 */
.share-weibo {
    color: rgb(255, 118, 59);
    border-color: rgb(255, 118, 59);
}

/* QQ分享图标 */
.share-qq {
    color: rgb(86, 182, 231);
    border-color: rgb(86, 182, 231);
}

/* 海报分享图标 */
.share-poster {
    color: rgb(113, 123, 231);
    border-color: rgb(113, 123, 231);
}

/* 点赞按钮样式 */
.like-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 16px;
    background-color: #3D83F5;
    color: #ffffff;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 500;
    border: none;
    cursor: pointer;
    transition: background-color 0.3s ease;
    gap: 6px;
}

.like-button:hover {
    background-color: #2d6fd1;
}

.like-button.liked {
    background-color: #2563eb;
}

.like-button i {
    font-size: 16px;
}

.like-button .like-count {
    font-weight: 600;
}

/* ============================================
   移动端菜单优化样式
   ============================================ */
@media (max-width: 767px) {
    /* 移动端菜单容器 */
    #mobile-menu {
        max-height: calc(100vh - 3.5rem);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
    }
    
    /* 移动端菜单项 */
    #mobile-menu ul.space-y-1 > li {
        margin-bottom: 0.25rem;
    }
    
    /* 移动端菜单链接样式 */
    #mobile-menu a {
        display: block;
        padding: 0.75rem 1rem;
        font-size: 0.9375rem;
        font-weight: 500;
        border-radius: 0.375rem;
        transition: all 0.2s ease;
    }
    
    /* 移动端菜单当前项 */
    #mobile-menu a.bg-primary\/10 {
        background-color: rgba(59, 130, 246, 0.1);
        color: hsl(217, 91%, 60%);
    }
    
    /* 移动端子菜单切换按钮 */
    .submenu-toggle {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 36px;
        height: 36px;
        border-radius: 0.375rem;
        transition: background-color 0.2s;
        margin-left: 0.5rem;
        flex-shrink: 0;
    }
    
    .submenu-toggle:hover {
        background-color: rgba(0, 0, 0, 0.05);
    }
    
    .submenu-toggle[aria-expanded="true"] {
        background-color: rgba(0, 0, 0, 0.1);
    }
    
    .submenu-toggle i {
        transition: transform 0.2s ease;
    }
    
    .submenu-toggle[aria-expanded="true"] i {
        transform: rotate(180deg);
    }
    
    /* 移动端子菜单 */
    #mobile-menu .submenu {
        transition: max-height 0.3s ease, opacity 0.3s ease, padding 0.3s ease;
        max-height: 500px;
        overflow: hidden;
    }
    
    #mobile-menu .submenu.hidden {
        max-height: 0;
        padding-top: 0;
        padding-bottom: 0;
        opacity: 0;
    }
    
    #mobile-menu .submenu li {
        margin-bottom: 0.125rem;
    }
    
    #mobile-menu .submenu a {
        padding-left: 2rem;
        font-size: 0.875rem;
        color: hsl(215, 16%, 47%);
    }
    
    #mobile-menu .submenu a:hover {
        background-color: rgba(0, 0, 0, 0.03);
        color: hsl(215, 25%, 27%);
    }
}