/* 新闻专题彩色模板(模板2 酒红 / 模板3 青色)共用样式
   由 topic_tpl/colored.php 与 topic_tpl/rel_list.php 引用
   主题色通过 .tp-wrap 上的 --tp / --tp-soft 内联变量传入 */
.tp-wrap{
    background:#fff;
    color:#3a3030;
    direction:rtl;
}
.tp-wrap *{ box-sizing:border-box; }
.tp-wrap a{ text-decoration:none; color:inherit; }
.tp-wrap img{ max-width:100%; }

/* 顶部横幅 */
.tp-hero{
    position:relative;
    min-height:300px;
    display:flex;
    align-items:flex-end;
    background-color:#ddd;
    background-position:center;
    background-size:cover;
    background-repeat:no-repeat;
}
.tp-hero::after{
    content:'';
    position:absolute; inset:0;
    background:linear-gradient(135deg, rgba(0,0,0,.55), var(--tp) 130%);
    opacity:.88;
}
.tp-hero-inner{ position:relative; z-index:2; width:100%; padding:46px 0 34px; }
.tp-crumb{ list-style:none; display:flex; flex-wrap:wrap; gap:8px; padding:0; margin:0 0 12px; font-size:13px; color:rgba(255,255,255,.85); }
.tp-crumb a{ color:rgba(255,255,255,.9); }
.tp-crumb li::after{ content:'/'; margin-inline-start:8px; opacity:.6; }
.tp-crumb li:last-child::after{ content:''; }
.tp-hero h1{ color:#fff; font-size:34px; font-weight:800; margin:0; text-shadow:0 2px 10px rgba(0,0,0,.25); }

/* 主体 */
.tp-body{ max-width:1140px; margin:0 auto; padding:34px 16px 60px; background:#fff; }

/* 专题信息卡 */
.tp-info{
    display:flex; gap:22px; align-items:center;
    background:#fff;
    border:1px solid #eee;
    border-inline-start:6px solid var(--tp);
    border-radius:12px;
    padding:20px 24px;
    margin:-58px auto 38px;
    position:relative; z-index:5;
    max-width:1080px;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
}
.tp-info-cover{ flex:0 0 130px; width:130px; height:130px; border-radius:12px; overflow:hidden; background:#f5f5f5; }
.tp-info-cover img{ width:100%; height:100%; object-fit:cover; }
.tp-info-main{ flex:1; min-width:0; }
.tp-info-name{ font-size:24px; font-weight:800; color:var(--tp); margin:0 0 8px; }
.tp-info-desc{ color:#6b5f5f; font-size:14.5px; line-height:1.9; margin:0 0 12px; }
.tp-info-desc p{ margin:0; }
.tp-stats{ display:flex; flex-wrap:wrap; gap:8px; }
.tp-stat{
    display:inline-flex; align-items:center; gap:6px;
    background:var(--tp-soft); color:var(--tp);
    font-size:13px; font-weight:700;
    padding:5px 13px; border-radius:20px;
}

/* 区块标题 */
.tp-sec{ margin-bottom:46px; }
.tp-sec-head{
    display:flex; align-items:center; justify-content:space-between;
    margin-bottom:18px; padding-bottom:10px;
    border-bottom:2px solid #f0eaea;
}
.tp-sec-title{
    display:flex; align-items:center; gap:10px;
    font-size:21px; font-weight:800; color:var(--tp); margin:0;
}
.tp-sec-title::before{
    content:''; width:6px; height:23px; border-radius:3px; background:var(--tp); display:inline-block;
}
.tp-more{
    display:inline-flex; align-items:center; gap:6px;
    border:1.5px solid var(--tp); color:var(--tp);
    font-size:13px; font-weight:700; padding:5px 16px; border-radius:20px;
    transition:all .2s;
}
.tp-more:hover{ background:var(--tp); color:#fff; }
.tp-empty{ text-align:center; color:#a99; padding:38px 0; font-size:14px; background:var(--tp-soft); border-radius:10px; }

/* 新闻横卡 */
.tp-news-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.tp-news-card{
    display:flex; gap:14px;
    background:#fff; border:1px solid #eee; border-radius:12px; overflow:hidden;
    transition:all .25s;
}
.tp-news-card:hover{ border-color:var(--tp); box-shadow:0 8px 22px rgba(0,0,0,.08); transform:translateY(-2px); }
.tp-news-img{ flex:0 0 150px; height:118px; overflow:hidden; background:#f5f5f5; }
.tp-news-img img{ width:100%; height:100%; object-fit:cover; transition:transform .35s; }
.tp-news-card:hover .tp-news-img img{ transform:scale(1.07); }
.tp-news-body{ flex:1; min-width:0; padding:12px 12px 10px 0; display:flex; flex-direction:column; }
.tp-news-title{ font-size:16px; font-weight:700; color:#3a3030; margin:0 0 7px; line-height:1.5;
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tp-news-card:hover .tp-news-title{ color:var(--tp); }
.tp-news-info{ font-size:12.5px; color:#9a8f8f; margin:0 0 8px;
    overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tp-news-date{ margin-top:auto; font-size:12.5px; color:#b0a4a4; display:inline-flex; align-items:center; gap:5px; }

/* 歌曲行 */
.tp-song-list{ list-style:none; margin:0; padding:0; border:1px solid #eee; border-radius:12px; overflow:hidden; }
.tp-song{
    display:flex; align-items:center; gap:13px;
    padding:11px 16px; border-bottom:1px solid #f3eded;
    transition:background .2s;
}
.tp-song:last-child{ border-bottom:0; }
.tp-song:hover{ background:var(--tp-soft); }
.tp-song-num{ flex:0 0 26px; width:26px; height:26px; border-radius:50%; background:#f1ecec; color:#a99;
    display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; }
.tp-song:hover .tp-song-num{ background:var(--tp); color:#fff; }
.tp-song-cover{ flex:0 0 46px; width:46px; height:46px; border-radius:8px; overflow:hidden; background:#f5f5f5; position:relative; }
.tp-song-cover img{ width:100%; height:100%; object-fit:cover; }
.tp-song-cover .tp-play{
    position:absolute; inset:0; background:rgba(0,0,0,.4); color:#fff;
    display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity .2s; font-size:15px;
}
.tp-song:hover .tp-play{ opacity:1; }
.tp-song-text{ flex:1; min-width:0; }
.tp-song-name{ font-size:15px; font-weight:700; color:#3a3030; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tp-song:hover .tp-song-name{ color:var(--tp); }
.tp-song-meta{ font-size:12.5px; color:#a99; margin-top:2px; }
.tp-song-btn{
    flex:0 0 auto; font-weight:700; padding:7px 18px;
    width:52px; height:52px; border-radius:50%;
    border:2px solid var(--tp); background:#fff;
    font-size:1.15rem; display:flex; align-items:center; justify-content:center;
    transition:all .25s ease;
}
.tp-song-btn .icon{ color:var(--tp); }
.tp-song-btn:hover{ border-color:var(--tp); background:var(--tp); }
.tp-song-btn:hover .icon{ color:#fff; }

/* 视频/图片竖卡网格 */
.tp-card-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.tp-card-grid > div{ min-width:0; }

/* 分页 */
.tp-wrap .ma-pagination{ margin-top:34px; }

/* ===== 专题内内容详情页 (item_view) ===== */
.tp-item-pic{ border-radius:12px; overflow:hidden; margin:0 0 20px; background:#f5f5f5; }
.tp-item-pic img{ width:100%; display:block; }
.tp-art{ font-size:15px; line-height:2; color:#4a4040; }
.tp-art p{ margin:0 0 14px; }
.tp-art img{ border-radius:10px; margin:8px 0; max-width:100%; height:auto; }
.tp-art h1,.tp-art h2,.tp-art h3,.tp-art h4{ color:var(--tp); margin:18px 0 10px; }
.tp-art a{ color:var(--tp); }
.tp-art table{ max-width:100%; }
/* 详情页内播放器/面板与主题色协调 */
.tp-sec .kz-player{ border-radius:14px; }
.tp-sec .panel{ border:1px solid #eee; border-radius:12px; }
.tp-sec .panel-title{ color:var(--tp); }
.tp-sec .ep-list .butn{ margin:0 6px 8px 0; }
.tp-sec .info .title{ color:var(--tp); }
.tp-sec .comments-area{ margin-top:26px; }

@media (max-width:900px){
    .tp-news-grid{ grid-template-columns:1fr; }
    .tp-card-grid{ grid-template-columns:repeat(2,1fr); }
    .tp-info{ flex-direction:column; text-align:center; margin-top:-46px; }
    .tp-stats{ justify-content:center; }
    .tp-hero h1{ font-size:26px; }
}