/*
Theme Name:		导航侠-子主题
Theme URI:		https://www.xintheme.com/
Description:	由Ai驱动的网址导航主题...
Author:			XinTheme 新主题 + WordPress果酱
Author URI:		https://www.xintheme.com/
Template:		NavXia
Version:		1.0.0
*/



.page-container{max-width:1440px}
.header-menu>ul>.menu-item>a{color:#191919}
.site-header .custom-button a{border-radius:.25rem!important;}
.search-banner .container-wrapper{color: #7150e6;}
.site-main .search-banner .banner-text p{color: #677897;}
.site-main .search-banner .search-type{margin-right: 18px}
.site-main .module-head .post-more a{font-size: 14px;color: #191919;border: 1px solid #d5d5d5;border-radius:5px}
.module-head-wrapper .sorting-dropdown .sort-select .select_text{font-size: 14px;color: #191919;border: 1px solid #d5d5d5;border-radius:5px}
.module-theme-tool-v3 .list-nav ul li{font-size: 16px;height: 40px;line-height: 40px;}
.tool-list-v2 .post-item .item-title{font-size: 16px;}
.post-content .post-body ul li:not(:last-child){margin-bottom: 16px;}
.sidebar-widget .widget_nav_menu ul li a{font-size:16px}
.tool-list-v2 .post-item{box-shadow: 0 0 20px 0 rgba(0, 0, 0, .08);border-radius: 8px;}
.post-list-v1 .post-item{box-shadow: 0 0 20px 0 rgba(0, 0, 0, .08)}
.site-main .search-banner .search-form-v1 button{color: #ffffff;background:var(--main_color);margin-right: 8px;padding: 6px 18px 6px 18px;border-radius: 6px;}
.site-main .search-banner .search-type {
    margin-right: 8px;
}
.tool-details-v2 .post-body h2{font-size: 22px;}
.site-main .search-banner .banner-text h2{color:var(--main_color)}
.site-main .search-banner .banner-text h2 span{background: linear-gradient(87deg, #487cf8 6.96%, #8d67ea 44.33%, #c28ef0 58.89%, #ef9a8f 100%);background-clip: text;-webkit-text-fill-color: transparent;color: transparent;}
/* 1. 主容器 .item-inner */
.item-inner {
    display: flex;
    flex-direction: column; /* 垂直堆叠 */
    gap: 8px;
    align-items: stretch; /* 新增：确保子元素撑满宽度，从而实现整体靠左对齐 */
}

/* 2. 顶部容器 .item-top */
.item-top {
    display: flex;
    align-items: center; /* 修改：实现 Logo 和标题在垂直方向上始终居中对齐 */
}

/* 3. Logo 样式 */
.itme-logo {
    margin-right: 12px;
    flex-shrink: 0;
}

/* 4. 标题 h2 及其内部链接的样式 */
.item-title {
    flex-grow: 1;
    min-width: 0;
    margin: 0;
}

.item-title a {
    /* 文本截断，最多显示2行 */
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    
    /* 链接样式 */
    color: inherit;
    text-decoration: none;
}


/* 5. 描述部分的样式 */
.item-desc {
    /* 保持您网站的默认样式或自定义 */
}

/* 1. 外层容器：控制滚动与整体轮廓 */
.post-content .table-wrapper {
    overflow-x: auto; /* 关键：超出宽度显示横向滚动条 */
    margin-bottom: 30px; /* 增加下间距，避免与正文太挤 */
    border-radius: 8px;
    box-shadow: 0 4px 6px -1px rgba(0, 70, 150, 0.05), 0 2px 4px -1px rgba(0, 70, 150, 0.03); /* 更现代的层叠阴影 */
    border: 1px solid #e1eaf7;
    background: #fff;
    /* 关键：确保内部表格的圆角不溢出 */
    overflow-y: hidden; 
}

/* 2. 表格基础重置 */
.post-content table {
    width: 100%;
    border-collapse: separate; /* 必须为 separate 才能实现圆角和 sticky */
    border-spacing: 0;
    margin: 0;
    font-size: 15px; /* 稍微调整字体大小，适合阅读 */
    line-height: 1.6;
    background-color: #fff;
    min-width: 100%; /* 确保在滚动容器内撑开 */
}

/* 3. 表头样式：吸顶效果与视觉增强 */
.post-content table thead th {
    background-color: #e3f2fd;
    color: #0d47a1;
    font-weight: 600;
    text-align: left;
    padding: 16px 20px;
    white-space: nowrap; /* 表头尽量不换行 */
    border-bottom: 2px solid #bbdefb;
    
    /* 关键升级：表头垂直方向固定 */
    position: sticky;
    top: 0;
    z-index: 10; /* 确保表头在内容之上 */
}

/* 4. 单元格通用样式 */
.post-content table td {
    padding: 14px 20px; /* 上下 padding 微调，看起来更紧凑一点 */
    border: 1px solid #f1f5f9;
    color: #334155;
    transition: all 0.2s ease;
    
    /* 针对数字优化：开启等宽数字，让金额/参数对齐更整齐 */
    font-variant-numeric: tabular-nums; 
}

/* 5. 移动端与桌面端的换行策略 */
/* 默认（移动端优先）：防止表格过长导致布局崩坏，保持不换行，依靠 wrapper 滚动 */
.post-content table td {
    white-space: nowrap;
}

/* 桌面端：如果屏幕够宽，允许换行，阅读体验更好 */
@media (min-width: 768px) {
    .post-content table td {
        white-space: normal;
        word-break: break-word; /* 防止长链接撑破表格 */
    }
}

/* 6. 斑马纹与首列强调 */
.post-content table tbody tr:nth-of-type(even) {
    background-color: #f8fafc;
}

/* 可选：第一列如果是“项目名称”，稍微加粗一点点，提升层级 */
.post-content table tbody tr td:first-child {
    font-weight: 500;
    color: #1e293b;
}

/* 7. 悬停效果优化 (Hover) */
.post-content table tbody tr:hover td {
    background-color: #e1f5fe; /* 保持浅蓝背景 */
    color: #01579b; /* 文字颜色加深，而不是变亮，对比度更好 */
}

/* 8. 细节打磨：最后一行去除底边框 */
.post-content table tbody tr:last-child td {
    border-bottom: none;
}
.post-content h2 {
    position: relative;
    padding-left: 16px;
    margin-bottom: 20px;
    font-weight: 700;
    line-height: 1.4;
    border-left: 5px solid #3b82f6; /* 边框颜色 */
    background: linear-gradient(to right, #f0f9ff, transparent);
}

.post-content ol,.post-content ul {
    list-style-position: outside;
    margin-bottom: 20px;
    padding-left: 2em
}

.post-content li {
    line-height: 1.8;
    margin-bottom: .5em
}
