/*
Theme Name: 途悦笔记 · 游记攻略
Theme URI: https://www.jobonce.com/
Author: jobonce
Description: 途悦笔记旅游攻略网专用主题：左侧文章列表 + 右侧热门文章/标签/搜索，与主站统一视觉。
Version: 1.0
Requires PHP: 7.0
*/

/* 全站主样式由 /css/style.css 通过 functions.php 统一加载 */
/* 以下为 WordPress 专属补充样式 */

/* 搜索结果高亮 */
.search .blog-main .art-body h2 mark{background:var(--accent-light);color:var(--accent-dark);padding:0 4px;border-radius:4px}

/* 文章页标签 */
.single-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.single-tags a{font-size:13px;padding:7px 16px;border-radius:100px;background:var(--cream);color:var(--ink-soft);transition:.25s}
.single-tags a:hover{background:var(--accent-light);color:var(--accent-dark)}

/* 侧栏"关于"小组件 */
.widget-about-mini{display:flex;gap:14px;align-items:center}
.widget-about-mini img{width:84px;height:84px;border-radius:14px;object-fit:cover;flex-shrink:0}
.widget-about-mini p{font-size:13px;color:var(--muted);line-height:1.7}

/* 无文章提示 */
.no-posts{text-align:center;padding:60px 20px;color:var(--muted)}
.no-posts i{font-size:48px;color:var(--line);margin-bottom:16px;display:block}
.no-posts h3{font-family:var(--serif);font-size:20px;color:var(--ink);margin-bottom:8px}

/* 面包屑 */
.wp-breadcrumb{font-size:13px;color:var(--muted);margin-bottom:24px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.wp-breadcrumb a{color:var(--muted);transition:.25s}
.wp-breadcrumb a:hover{color:var(--accent-dark)}
.wp-breadcrumb .sep{color:var(--line)}
.wp-breadcrumb .current{color:var(--ink-soft);font-weight:600}

/* 文章列表 - 分类筛选标签 */
.cat-filter{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:30px}
.cat-filter a{font-size:13.5px;padding:8px 20px;border-radius:100px;background:var(--cream);color:var(--ink-soft);transition:.25s;border:1px solid transparent}
.cat-filter a:hover,.cat-filter a.active{background:var(--primary);color:#fff;border-color:var(--primary)}

/* 文章卡片内 - 阅读更多 */
.art-read-more{margin-top:14px;display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:700;color:var(--accent-dark)}
.art-read-more i{transition:transform .3s}
.art-card:hover .art-read-more i{transform:translateX(5px)}

/* 评论区域（隐藏注册，仅展示） */
.comments-area{margin-top:50px;padding-top:30px;border-top:1px solid var(--line)}
.comments-title{font-family:var(--serif);font-size:20px;font-weight:800;margin-bottom:20px}
.comment-list{list-style:none;padding:0}
.comment-list li{padding:16px 0;border-bottom:1px dashed var(--line)}
.comment-author{font-weight:700;font-size:14px}
.comment-metadata{font-size:12px;color:var(--muted)}
.comment-metadata a{color:var(--muted)}
.comment-content{font-size:14.5px;margin-top:6px;color:var(--ink-soft)}

/* 文章导航 */
.post-navigation{display:flex;justify-content:space-between;gap:20px;margin-top:44px;padding-top:26px;border-top:1px solid var(--line)}
.post-navigation .nav-prev,.post-navigation .nav-next{max-width:48%}
.post-navigation a{font-size:14px;color:var(--muted);display:flex;align-items:center;gap:8px;transition:.25s}
.post-navigation a:hover{color:var(--accent-dark)}
.post-navigation .label{font-size:12px;color:var(--muted);display:block;margin-bottom:4px}

/* 404 页面 */
.error-404{text-align:center;padding:120px 20px}
.error-404 .code{font-family:var(--serif);font-size:120px;font-weight:900;color:var(--line);line-height:1}
.error-404 h1{font-family:var(--serif);font-size:28px;margin:20px 0 12px}
.error-404 p{color:var(--muted);margin-bottom:30px}

/* 分页 - WordPress 数字分页 */
.wp-pagination{display:flex;justify-content:center;gap:8px;margin-top:40px;flex-wrap:wrap}
.wp-pagination a,.wp-pagination span{
  min-width:42px;height:42px;display:grid;place-items:center;padding:0 14px;
  border-radius:11px;background:#fff;box-shadow:var(--shadow-sm);
  font-size:14.5px;font-weight:600;color:var(--ink-soft);transition:.25s;
}
.wp-pagination a:hover{color:var(--accent-dark);transform:translateY(-2px);box-shadow:var(--shadow)}
.wp-pagination .current{background:var(--primary);color:#fff}
.wp-pagination .dots{background:none;box-shadow:none;color:var(--muted)}

/* 响应式补充 */
@media(max-width:640px){
  .art-card{flex-direction:column}
  .art-thumb{width:100%;aspect-ratio:16/9}
  .post-navigation{flex-direction:column}
  .post-navigation .nav-prev,.post-navigation .nav-next{max-width:100%}
}