/* =========================================
   1. 基础重置与通用样式
   ========================================= */
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: "Microsoft YaHei", "Helvetica Neue", Helvetica, Arial, sans-serif; font-size: 16px; color: #333; background-color: #ededed;/*#f5f7fa;*/ line-height: 1.6; }
a { text-decoration: none; color: #333; transition: color 0.2s; }
a:hover { color: #d32f2f; }
ul, li { list-style: none; }
img { border: 0; vertical-align: middle; }
.w1200 { width: 1200px; margin: 0 auto; }
.flex { display: flex; justify-content: space-between; }
.fl-main { width: 860px; }
.fr-side { width: 320px; }
.pageleft{ width: 823px; float: left; margin-bottom: 30px;}
.pageright{ width: 354px; float: right; }
.bgfff{ background: #fff; }   
.fl { float: left; }
.fr { float: right; }
.clearfix::after { content: ""; display: table; clear: both; }

/* =========================================
   2. 头部、导航、搜索、底部 (统一为蓝色导航风格)
   ========================================= */
.header { background-color: #fff; border-bottom: 1px solid #e0e0e0; padding: 15px 0; }
.header .w1200 { display: flex; align-items: center; justify-content: space-between; }
.logo h1 { font-size: 24px; color: #1565c0; font-weight: bold; margin: 0; }
.logo a { display: block; }

/* 导航样式：统一为蓝色背景+白色文字 */
.nav { background-color: #1565c0; }
.nav ul { display: flex; }
.nav ul li { margin: 0; }
.nav ul li a { display: block; padding: 12px 20px; font-size: 16px; font-weight: 500; color: #fff; }
.nav ul li a:hover, .nav ul li.active a { background-color: #0d47a1; }

.search-box input[type="text"] { padding: 8px 12px; border: 1px solid #ddd; border-radius: 4px 0 0 4px; outline: none; width: 200px; }
.search-box button { padding: 8px 15px; border: 1px solid #1565c0; background-color: #1565c0; color: #fff; border-radius: 0 4px 4px 0; cursor: pointer; }
.search-box button:hover { background-color: #0d47a1; }

.footer { text-align: center; padding: 30px 0; background: #fff; color: #999; font-size: 12px; margin-top: 30px; border-top: 1px solid #eee; }
.footer a { color: #999; }
.footer a:hover { color: #d32f2f; }

/* =========================================
   3. 通用模块样式
   ========================================= */
.block { background: #fff; padding: 20px; margin-bottom: 20px; border-radius: 6px; box-shadow: 0 1px 3px rgba(0,0,0,0.05); border: 1px solid #eee; }
.title-h2 { font-size: 20px; color: #333; border-left: 4px solid #d32f2f; padding-left: 12px; margin-bottom: 20px; font-weight: bold; }
.title-h3 { font-size: 18px; color: #333; border-bottom: 2px solid #eee; padding-bottom: 10px; margin-bottom: 15px; }
.title-h4 { font-size: 16px; color: #555; margin: 15px 0 10px 0; font-weight: 600; }
.more { display: block; text-align: right; margin-top: 15px; color: #777; font-size: 13px; }
.more:hover { color: #d32f2f; }

/* =========================================
   4. 首页特有样式
   ========================================= */
.news-tip { background-color: #e3f2fd; color: #0d47a1; padding: 10px 20px; border-radius: 4px; font-size: 13px; margin-bottom: 20px; border-left: 4px solid #1565c0; }

/* 今日涨停列表 */
.zt-list { list-style: none; padding: 0; margin: 0; }
.zt-list__item { border-bottom: 1px dashed #eee; transition: background-color 0.2s; }
.zt-list__item:last-child { border-bottom: none; }
.zt-list__item:hover { background-color: #f8f9fa; }
.zt-list__link { display: flex; align-items: center; padding: 14px 10px; text-decoration: none; color: inherit; width: 100%; box-sizing: border-box; }
.zt-list__link:hover { color: inherit; }
.zt-list__stock-name { font-weight: bold; color: #d32f2f; width: 90px; flex-shrink: 0; }
.zt-list__stock-code { color: #666; width: 80px; flex-shrink: 0; font-family: Arial, sans-serif; }
.zt-list__reason { flex: 1; color: #555; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 0 15px; font-size: 14px; }
.zt-list__date { color: #999; width: 100px; text-align: right; flex-shrink: 0; font-size: 13px; }

/* 资金流向表格 */
.fund-table { width: 100%; border-collapse: collapse; margin-bottom: 10px; }
.fund-table th { background-color: #f8f9fa; color: #555; font-weight: 600; padding: 10px; text-align: left; border-bottom: 2px solid #ddd; font-size: 13px; }
.fund-table td { padding: 10px; border-bottom: 1px solid #eee; font-size: 13px; }
.fund-table tr:hover { background-color: #fdfdfd; }
.text-red { color: #d32f2f; font-weight: bold; font-family: Arial, sans-serif; }
.text-green { color: #2e7d32; font-weight: bold; font-family: Arial, sans-serif; }
.text-gray { color: #999; font-weight: bold; font-family: Arial, sans-serif; }
.btn-detail { display: inline-block; padding: 5px 16px; background-color: #1565c0; color: #fff; font-size: 12px; border-radius: 4px; text-decoration: none; transition: all 0.2s; white-space: nowrap; }
.btn-detail:hover { background-color: #0d47a1; color: #fff; box-shadow: 0 2px 4px rgba(21, 101, 192, 0.3); }

/* 个股题材标签 (Grid网格对齐) */
.tag-box { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px 10px; margin-bottom: 15px; }
.tag-box li { width: 100%; background-color: #e8f5e9; padding: 8px 12px; border-radius: 4px; border: 1px solid #c8e6c9; transition: all 0.2s; display: flex; align-items: center; justify-content: center; min-height: 36px; }
.tag-box li:hover { background-color: #c8e6c9; transform: translateY(-2px); box-shadow: 0 2px 8px rgba(46, 125, 50, 0.15); }
.tag-box li a { color: #2e7d32; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 100%; }

/* 侧边栏搜索与历史记录 */
.fr-side .block { position: sticky; top: 20px; }
.fr-side .search-form { display: flex; margin-bottom: 20px; }
.fr-side .search-form input[type="text"] { flex: 1; padding: 8px; border: 1px solid #ddd; border-radius: 4px 0 0 4px; outline: none; }
.fr-side .search-form button { padding: 8px 12px; background: #d32f2f; border: 1px solid #d32f2f; color: #fff; border-radius: 0 4px 4px 0; cursor: pointer; }
.fr-side .search-form button:hover { background: #b71c1c; }
.history-list li { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px dashed #eee; }
.history-list li:last-child { border: none; }
.history-list a { color: #555; font-size: 14px; display: block; }
.history-list a:hover { color: #d32f2f; }

/* =========================================
   5. 文章页特有样式
   ========================================= */
.breadcrumb { padding: 10px 0; font-size: 14px; color: #666; }
.breadcrumb a { color: #666; }
.breadcrumb a:hover { color: #d32f2f; }
.breadcrumb i { margin: 0 8px; color: #ccc; }
.art-header .block { background: #fff; padding: 30px; box-shadow: 0 0 15px rgba(0,0,0,0.08); border-radius: 4px; }
.art-header { text-align: center; border-bottom: 1px solid #eee; padding-bottom: 15px; margin-bottom: 20px; }
.art-title { font-size: 26px; color: #333; margin-bottom: 10px; line-height: 1.4; }
.art-meta { font-size: 14px; color: #999; }
.art-meta span { margin-right: 20px; }
.art-content { font-size: 16px; color: #444; line-height: 2; position: relative; }
/* 内容包裹层：默认限制高度并隐藏溢出 */
.art-content__body {
    max-height: 400px; /* 根据实际行高调整，建议为行高的整数倍 */
    overflow: hidden;
    transition: max-height 0.3s ease;
}
.art-content__body.is-expanded {
    max-height: none;
}
.art-content__toggle {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    margin-top: 15px;
    padding: 8px 20px;
    background: #f5f7fa;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    color: #1565c0;
    font-size: 14px;
    cursor: pointer;
    transition: all 0.2s;
    width: 100%;
}
.art-content__toggle:hover {
    background: #e3f2fd;
    border-color: #1565c0;
}
.art-content__toggle-text {
    font-weight: 500;
}
.art-content__toggle-icon {
    font-size: 12px;
    transition: transform 0.3s ease;
}
.art-content__toggle[aria-expanded="true"] .art-content__toggle-icon {
    transform: rotate(180deg);
}
.art-content p { margin: 15px 0; }
.art-content h3 { font-size: 20px; color: #333; margin: 25px 0 15px; }
.art-nav { height: 52px;line-height: 52px; border-top:1px solid #eeeeee; border-bottom:1px solid #eeeeee; font-size: 14px; color: #666;}
.art-nav li{overflow: hidden;text-overflow: ellipsis;white-space: nowrap;width: 350px;}
.art-nav span { margin-right: 10px; }
.art-related { margin-top: 20px; }
.art-related .related-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 20px; }
.art-related .related-list li { padding: 0; border-bottom: none; overflow: hidden; }
.art-related .related-list a { display: block; font-size: 15px; color: #555; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 8px 0; border-bottom: 1px dotted #eee; }
.art-related .related-list a:hover { color: #d32f2f; }

/* =========================================
   9. 内容页表格与标签样式
   ========================================= */
.data-table { width: 100%; border-collapse: collapse; margin: 20px 0; font-size: 15px; text-align: left; }
.data-table caption { text-align: left; font-size: 14px; color: #777; padding: 10px 0; }
.data-table thead { background-color: #d32f2f; color: #fff; }
.data-table th, .data-table td { padding: 15px 12px; border-bottom: 1px solid #ddd; vertical-align: top; }
.data-table tbody tr:hover { background-color: #fdfdfd; }
.col-date { width: 110px; text-align: center; white-space: nowrap; }
.col-concept { width: 220px; }
.concept-tag { display: inline-block; background: #e3f2fd; color: #1565c0; padding: 4px 8px; border-radius: 4px; margin: 2px; font-weight: bold; }
.reason-text { line-height: 1.8; color: #444; }
.reason-tag { display: inline-block; padding: 2px 8px; border-radius: 4px; font-weight: bold; margin-right: 5px; vertical-align: top; }
.tag-industry { background-color: #fff3e0; color: #e65100; border: 1px solid #ffcc80; }
.tag-company { background-color: #e8f5e9; color: #2e7d32; border: 1px solid #a5d6a7; }

/* =========================================
   9. 暗盘资金内容页表格与标签样式
   ========================================= */
/*暗盘资金*/
.stock-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
    margin-bottom: 20px;
}
.stock-item {
    background: #fff;
    padding: 15px;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.stock-item:hover {
    box-shadow: 0 4px 8px rgba(0,0,0,0.1);
}
.stock-info .name { font-size: 16px; font-weight: bold; }
.stock-info .name a { color: #333; text-decoration: none; }
.stock-info .code { font-size: 12px; color: #888; margin-top: 4px; }
.stock-time { font-size: 12px; color: #999; white-space: nowrap; }


article {
    max-width: 900px;
    margin: 0 auto;
}
h1 {
    font-size: 24px;
    color: #222;
    text-align: center;
    margin-bottom: 24px;
    font-weight: 700;
}

/* ===== 资金流向主表格（原 .table-container 内的表格）===== */
.table-container {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    overflow: hidden;
    margin-bottom: 24px;
}
/* 关键修改：用 .table-container table 替代全局 table */
.table-container table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}
.table-container th,
.table-container td {
    padding: 16px 12px;
    text-align: center;
    border-bottom: 1px solid #ebeef5;
    font-size: 15px;
}
/* 关键修改：用 .table-container th 替代全局 th */
.table-container th {
    background-color: #d32f2f;
    color: #fff;
    font-weight: bold;
    font-size: 16px;
}

/* ===== 明盘资金流向表格（.fund-table）===== */
.fund-table {
    border-collapse: collapse;
    width: 100%;
    max-width: 1000px;
    margin-bottom: 20px;
}
.fund-table th,
.fund-table td {
    border: 1px solid #ddd;
    padding: 10px;
    text-align: center;
}
.fund-table th {
    background-color: #f2f2f2;
    font-weight: bold;
}

/* ===== 说明文字区块 ===== */
.desc-box {
    background: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    padding: 24px;
    font-size: 16px;
    line-height: 2;
    color: #333;
}
.desc-box strong {
    font-weight: bold;
    color: #222;
}

/* =========================================
   6. 栏目页特有样式
   ========================================= */
.loch { padding: 15px 15px; font-size: 14px; color: #666; background: #fff; margin-bottom: 20px; border-radius: 6px; box-shadow: 0 1px 3px rgba(0,0,0,0.05); border: 1px solid #eee; }
.loch a { color: #666; }
.loch a:hover { color: #d32f2f; }
.loch i { margin: 0 8px; color: #ccc; }
.stock-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.stock-item { background: #fff; border: 1px solid #eee; border-radius: 6px; padding: 15px; transition: all 0.3s ease; box-shadow: 0 1px 3px rgba(0,0,0,0.05); display: flex; justify-content: space-between; align-items: center; }
.stock-item:hover { transform: translateY(-3px); box-shadow: 0 4px 12px rgba(0,0,0,0.1); border-color: #1565c0; }
.stock-info { flex: 1; }
.stock-info .name { font-size: 16px; font-weight: bold; color: #333; margin-bottom: 5px; }
.stock-info .name span { font-size: 14px; color: #999; }
.stock-info .code { font-size: 14px; color: #999; }
.stock-time { font-size: 14px; white-space: nowrap; margin-left: 15px; }
.stock-time .date-highlight {color: #d32f2f; font-weight: bold;}
.pager { text-align: center; margin: 30px 0; }
.page-btn { display: inline-block; }
.page-btn a { display: inline-block; padding: 8px 14px; margin: 0 3px; border: 1px solid #ddd; border-radius: 4px; color: #666; background: #fff; }
.page-btn a:hover { border-color: #1565c0; color: #1565c0; background: #f0f8ff; }
.page-btn a.active { background: #1565c0; border-color: #1565c0; color: #fff; cursor: default; }

/* =========================================
   6. 暗盘资金栏目页特有样式
   ========================================= */
.glzwlist li{ border-bottom:1px solid #ebebeb; padding: 30px 20px; overflow: hidden; }   
.stock-row {
    display: flex;
    align-items: center;
    padding: 12px 16px;
    border-bottom: 1px solid #ebeef5;
    font-size: 14px;
    list-style: none;
}

.stock-row:hover {
    background-color: #f5f7fa;
}

/* 股票名称：固定宽度，不再自动撑满 */
.stock-name {
    width: 200px;  */         /* 根据实际名称长度调整 */
    flex-shrink: 0;         /* 防止名称过长时被压缩 */
    font-weight: bold;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.stock-name a {
    color: #333;
    text-decoration: none;
    transition: color 0.2s ease;
}

.stock-name a:hover {
    color: #e74c3c;
}

/* 资金数据：固定宽度 + 左右内边距制造间隔 */
.stock-data {
    width: 140px;           /* 根据数据长度调整 */
    text-align: left;
    padding: 0 12px;        /* 关键：左右各12px间隔 */
    font-family: "DIN Alternate", "Arial", sans-serif;
    font-weight: 600;
    color: #666;
    box-sizing: border-box; /* 确保padding不撑大宽度 */
}

/* 颜色兜底 */
.stock-data[style*="#e74c3c"] { color: #e74c3c !important; }
.stock-data[style*="#27ae60"] { color: #27ae60 !important; }

.pageright .ranking1{ padding: 0 14px 10px; }
.mb20{margin-bottom: 20px;}
.pageright .tithd_11{ height: 50px; line-height: 50px; }
.pageright .tithd_11 .tt{ float: left; font-size: 20px; color: #333; font-weight: 700; border-bottom: 4px solid #ebebeb; padding: 0 15px; height: 45px;}

/* =========================================
   6. 个股题材栏目页特有样式
   ========================================= */

/* 列表外层容器 */
.ticai-list-wrapper {
    background: #fff;
    border-radius: 6px;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
    border: 1px solid #eee;
    overflow: hidden; /* 防止圆角被子元素溢出遮挡 */
}

/* 列表容器 */
.ticai-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

/* 列表项：Flex布局 + 底部分隔线 */
.stock-ticai-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 14px 20px;
    border-bottom: 1px dashed #e8e8e8;
    transition: background-color 0.2s;
}

/* 最后一项去掉分隔线 */
.stock-ticai-item:last-child {
    border-bottom: none;
}

/* 鼠标悬停整行高亮 */
.stock-ticai-item:hover {
    background-color: #f8f9fa;
}

/* 标题区域 */
.stock-ticai-title {
    flex: 1;
    font-size: 15px;
    font-weight: 600;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-right: 15px;
}

.stock-ticai-title a {
    color: inherit;
    text-decoration: none;
}

.stock-ticai-title a:hover {
    color: #d32f2f;
}

/* 题材标签 */
.stock-ticai-tag {
    font-size: 13px;
    color: #666;
    background: #f0f2f5;
    padding: 3px 10px;
    border-radius: 4px;
    margin-right: 12px;
    flex-shrink: 0;
}

/* 日期 */
.stock-ticai-date {
    font-size: 13px;
    color: #999;
    flex-shrink: 0;
    white-space: nowrap;
}


/* =========================================
   7. 侧边栏排行榜样式
   ========================================= */
.ranking1 li { display: flex; align-items: center; padding: 10px 0; border-bottom: 1px dotted #eee; }
.ranking1 li:last-child { border-bottom: none; }
.ranking1 .num { display: inline-block; width: 20px; height: 20px; line-height: 20px; text-align: center; border-radius: 50%; background: #ccc; color: #fff; font-size: 12px; margin-right: 10px; font-style: normal; }
.ranking1 .num_1 { background: #ff5722; }
.ranking1 .num_2 { background: #ff9800; }
.ranking1 .num_3 { background: #ffc107; }
.ranking1 h4 {
    font-size: 15px;
    font-weight: normal;
    flex: 1;
	min-width: 0; /* 【新增关键代码】允许flex容器压缩宽度，触发文字省略 */
}
.ranking1 h4 a {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%; /* 兜底，确保宽度继承父容器flex宽度 */
}

/* =========================================
   10. 移动端完整适配样式 (Max-width: 768px)
   ========================================= */
@media screen and (max-width: 768px) {
    /* --- 1. 基础布局重置 --- */
    .w1200 {
        width: 100%;
        padding: 0 10px;
        box-sizing: border-box;
    }

    /* 主内容区占满100%宽度 */
    .pageleft, .fl-main, .art-content {
        width: 100%;
        float: none;
        margin-bottom: 20px;
    }

    /* 【关键】强制隐藏右侧边栏，释放空间 */
    .pageright, .fr-side {
        display: none !important;
    }

    /* --- 2. 头部与导航适配 --- */
    .header .w1200 {
        flex-direction: column;
        align-items: flex-start;
        gap: 15px;
    }

    .search-box {
        width: 100%;
    }

    .search-box input[type="text"] {
        width: 70%;
    }

    .nav ul {
        flex-wrap: wrap;
        justify-content: center;
    }

    .nav ul li {
        width: 33.33%;
        text-align: center;
    }

    .nav ul li a {
        padding: 10px 5px;
        font-size: 14px;
    }

    /* --- 3. 网格与卡片通用适配 --- */
    /* 多列网格强制变为单列 */
    .stock-grid, .tag-box, .art-related .related-list {
        grid-template-columns: 1fr !important;
        gap: 10px;
    }

    /* 个股卡片垂直堆叠 */
    .stock-item {
        padding: 15px;
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
    }

    .stock-info {
        width: 100%;
        display: flex;
        justify-content: space-between;
        align-items: center;
    }

    .stock-time {
        margin-left: 0;
        margin-top: 5px;
    }

    /* --- 4. 题材列表适配 --- */
    .stock-ticai-item {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px;
        padding: 15px;
    }

    .stock-ticai-title {
        width: 100%;
        padding-right: 0;
        font-size: 16px;
    }

    .stock-ticai-tag, .stock-ticai-date {
        font-size: 13px;
        margin-right: 0;
    }

    /* --- 5. 文章页表格终极修复 (针对 .table-container) --- */
    /* 容器开启横向滚动 + iOS惯性滚动 + 视觉提示阴影 */
    .art-content .table-container {
        overflow-x: auto !important;
        -webkit-overflow-scrolling: touch !important;
        width: 100% !important;
        margin-bottom: 20px;
        box-shadow: inset 0 0 6px rgba(0,0,0,0.15);
        border-radius: 4px;
    }

    /* 表格强制撑开宽度以触发滚动条 */
    .art-content .table-container table {
        min-width: 600px !important;
        width: auto !important;
        border-collapse: separate !important;
        border-spacing: 0;
        margin: 0;
    }

    /* 单元格禁止换行 + 内联样式兼容 */
    .art-content .table-container th,
    .art-content .table-container td {
        white-space: nowrap !important;
        padding: 12px 10px !important;
        font-size: 14px;
        border: none;
        box-sizing: border-box;
    }

    /* --- 6. 文章页内容适配 --- */
    .art-header .block {
        padding: 20px;
    }

    .art-title {
        font-size: 22px;
    }

    .art-content {
        font-size: 16px;
        line-height: 1.8;
    }

    /* --- 7. 底部与分页适配 --- */
    .footer {
        padding: 20px 10px;
        font-size: 12px;
    }

    .page-btn a {
        padding: 6px 10px;
        margin: 0 2px;
        font-size: 12px;
    }
	
}
