/*
 Theme Name:   Zhujiceping
 Theme URI:    https://cp.acc159.com
 Description:  国外主机测评风格主题（仿 Dux 视觉语言的自定义主题）
 Author:       ops
 Version:      1.0.0
 License:      MIT
*/
:root{
  --blue:#007bff;
  --blue-2:#1faeff;
  --blue-dark:#0062cc;
  --text:#333;
  --muted:#999;
  --bg:#f2f3f5;
  --card:#ffffff;
  --border:#ececec;
  --header-bg:#ffffff;
  --header-line:#e6e6e6;
  --cat:#00a9ee;
  --footer-bg:#202935;
  --footer-text:#9aa6b5;
  --maxw:1400px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",Roboto,Helvetica,Arial,sans-serif;font-size:15px;line-height:1.7;-webkit-font-smoothing:antialiased;padding:0!important}
a{color:var(--text);text-decoration:none;transition:color .15s}
a:hover{color:var(--blue)}
img{max-width:100%;height:auto;display:block}
.container{width:100%;max-width:1240px;margin:0 auto;padding:0 24px}
.site-header{background:var(--header-bg);border-bottom:1px solid var(--header-line);position:sticky;top:0;z-index:50}
.header-inner{display:flex;align-items:center;height:64px;gap:24px}
.logo{font-size:22px;font-weight:800;color:var(--text);white-space:nowrap}
.logo b{color:var(--blue)}
.main-nav{flex:1}
.main-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:4px;flex-wrap:wrap}
.main-nav li a{display:block;padding:8px 14px;font-size:15px;font-weight:600;border-radius:6px}
.main-nav li a:hover{background:#f0f7ff;color:var(--blue)}
.search-box{display:flex;align-items:center}
.search-box input{border:1px solid var(--border);border-radius:6px;padding:7px 12px;width:180px;outline:none}
.search-box input:focus{border-color:var(--blue)}

/* 汉堡按钮：默认隐藏，移动端显示 */
.nav-toggle{display:none;flex-direction:column;justify-content:center;gap:4px;width:40px;height:40px;flex:none;padding:0;border:1px solid var(--border);background:#fff;border-radius:8px;cursor:pointer;transition:border-color .15s}
.nav-toggle:hover{border-color:var(--blue)}
.nav-toggle-bar{display:block;width:20px;height:2px;margin:0 auto;background:#444;border-radius:2px;transition:transform .2s ease,opacity .2s ease}
.nav-toggle.active .nav-toggle-bar:nth-child(1){transform:translateY(6px) rotate(45deg)}
.nav-toggle.active .nav-toggle-bar:nth-child(2){opacity:0}
.nav-toggle.active .nav-toggle-bar:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* 左侧抽屉遮罩 */
.nav-overlay{position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:999;opacity:0;visibility:hidden;transition:opacity .28s ease,visibility .28s ease}
.nav-overlay.open{opacity:1;visibility:visible}

/* 抽屉内搜索（仅移动端显示） */
.drawer-search{display:none}
/* 桌面端默认隐藏子菜单，避免嵌套样式错乱；移动端在展开时显示 */
.main-nav .sub-menu{display:none}

.topbar{background:#fafbfc;border-bottom:1px solid var(--border);font-size:13px;color:var(--muted)}
.topbar .container{display:flex;justify-content:space-between;height:36px;align-items:center}

.layout{display:flex;gap:24px;margin-top:22px;align-items:stretch}
.main{flex:1;min-width:0}
.sidebar{width:320px;flex:none}

.top-ads{background:#fff;border:1px solid var(--border);border-radius:10px;padding:10px;margin-bottom:18px;overflow:hidden}
.top-ads .banner{margin:0;padding:0;background:none;border:none;border-radius:0;overflow:hidden}
.top-ads .banner img{width:100%;border-radius:0;display:block}

.section-title{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-size:18px;font-weight:800}
.section-title::before{content:"";width:4px;height:18px;background:var(--blue);border-radius:2px}
.section-title a.more{margin-left:auto;font-size:13px;font-weight:500;color:var(--muted)}

.post-card{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:14px;margin-bottom:16px;display:flex;gap:16px}
.post-card .thumb{flex:none;width:240px;height:150px;border-radius:8px;overflow:hidden;background:#eef1f5}
.post-card .thumb img{width:100%;height:100%;object-fit:cover}
.post-card .body{flex:1;min-width:0;display:flex;flex-direction:column}
.post-card h2{margin:0 0 8px;font-size:18px;line-height:1.4;font-weight:700}
.post-card h2 a{color:#222}
.post-card .excerpt{color:#666;font-size:14px;margin:0 0 auto;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.post-card .meta{margin-top:10px;font-size:13px;color:var(--muted);display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.cat-tag{display:inline-block;background:rgba(0,169,238,.1);color:var(--cat);padding:2px 10px;border-radius:20px;font-size:12px;font-weight:600}

.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.grid .post-card{flex-direction:column;margin-bottom:0}
.grid .post-card .thumb{width:100%;height:170px}

.widget{background:var(--card);border:1px solid var(--border);border-radius:10px;padding:14px;margin-bottom:18px}
.widget h3{margin:0 0 12px;font-size:15px;font-weight:800;padding-left:10px;border-left:3px solid var(--blue)}
.widget ul{list-style:none;margin:0;padding:0}
.widget li{padding:8px 0;border-bottom:1px dashed var(--border);font-size:14px}
.widget li:last-child{border-bottom:0}
.widget li a{color:#444}
.widget .rank{display:inline-block;width:20px;height:20px;line-height:20px;text-align:center;background:var(--blue);color:#fff;border-radius:4px;font-size:12px;margin-right:8px}

.site-footer{background:var(--footer-bg);color:var(--footer-text);margin-top:40px;padding:36px 0 20px;font-size:13px}
.site-footer a{color:var(--footer-text)}
.site-footer a:hover{color:#fff}
.footer-cols{display:flex;gap:40px;flex-wrap:wrap}
.footer-cols .col{flex:1;min-width:200px}
.footer-cols h4{color:#fff;font-size:15px;margin:0 0 12px}
.footer-bottom{border-top:1px solid #2c3744;margin-top:24px;padding-top:16px;text-align:center;color:#7c8a9c}
.links-inline{display:flex;flex-wrap:wrap;gap:10px}

.pagination{display:flex;gap:6px;justify-content:center;margin:24px 0}
.pagination a,.pagination span{padding:8px 13px;background:#fff;border:1px solid var(--border);border-radius:6px;color:#555}
.pagination .current{background:var(--blue);color:#fff;border-color:var(--blue)}

.single{background:#fff;border:1px solid var(--border);border-radius:10px;padding:28px}
.single h1{font-size:26px;line-height:1.4;margin:0 0 12px}
.single .meta{color:var(--muted);font-size:13px;margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid var(--border)}
.single .content{font-size:16px;line-height:1.9;color:#2c2c2c;max-width:900px}
body.single .main{display:flex;flex-direction:column}
body.single .single{flex:1;min-height:0}
.single .content p{margin:0 0 18px}
.single .content img{border-radius:8px;margin:14px 0}

.breadcrumb{font-size:13px;color:var(--muted);margin-bottom:14px}
.breadcrumb a{color:var(--blue)}

@media (max-width: 900px) {
  .layout { flex-direction: column; }
  .sidebar { width: 100%; }
  .post-card { flex-direction: column; }
  .post-card .thumb { width: 100%; height: 190px; }
  .grid { grid-template-columns: 1fr; }
  /* 移动端：显示汉堡，隐藏头部内联搜索 */
  .nav-toggle { display: flex; }
  .search-box { display: none; }
  .header-inner { flex-direction: row; align-items: center; height: 64px; gap: 14px; }
  /* 主导航变为左侧滑出抽屉 */
  .main-nav {
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    width: 240px;
    max-width: 84vw;
    background: #fff;
    z-index: 1000;
    flex: none;
    padding: 72px 12px 16px;
    box-shadow: 4px 0 24px rgba(0,0,0,.12);
    transform: translateX(-100%);
    transition: transform .28s ease;
    overflow-y: auto;
  }
  .main-nav.open { transform: translateX(0); }
  .main-nav > ul { flex-direction: column; gap: 2px; }
  .main-nav li a { padding: 12px 14px; font-size: 15px; font-weight: 600; border-radius: 8px; }
  .main-nav li a:hover { background: #f0f7ff; color: var(--blue); }
  .main-nav li.menu-item-has-children > a { position: relative; }
  .main-nav li.open > .sub-menu { display: block; padding-left: 14px; }
  .main-nav .sub-menu li a { font-weight: 500; }
  .drawer-search { display: block; margin-top: 14px; }
  .drawer-search input { width: 100%; border: 1px solid var(--border); border-radius: 8px; padding: 9px 12px; outline: none; }
  .drawer-search input:focus { border-color: var(--blue); }
  /* 打开时整页右推（仿 DUX）：移动 body 而非各子元素，避免横向溢出 */
  body { transition: left .28s ease; }
  body.nav-show { position: relative; left: 240px; overflow-x: hidden; }
  body.nav-show > .site-header { z-index: 1001; }
}

@media (max-width: 768px) {
  .container { padding: 0 12px; }
  .logo { font-size: 20px; }
  .main-nav { width: auto; overflow: visible; -webkit-overflow-scrolling: auto; }
  .main-nav ul { flex-wrap: wrap; }
  .topbar { font-size: 12px; }
  .topbar .container { flex-wrap: wrap; }
  .layout { gap: 16px; margin-top: 16px; }
  .post-card .thumb { height: 180px; }
  .post-card h2 { font-size: 16px; }
  .single { padding: 18px; }
  .single h1 { font-size: 21px; }
  .single .content { font-size: 15px; }
  .section-title { font-size: 16px; }
  .footer-cols .col { min-width: 100%; }
}