/* Theme Name: 二维码导航 Theme URI: https://www.i049.com/ Description: 基于 prototype/index.html 现代化原型全新重写的网址导航 WordPress 主题（方案C）。玻璃态顶栏、多引擎聚合搜索、深浅色一键切换、移动端适配，导航数据使用 WordPress 自带链接(Blogroll)与链接分类(link_category)。 Version: 1.0.0 Author: i049 Text Domain: ewm-pro Tags: navigation, dark-mode, responsive, search */ /* ============================================================ 设计变量（浅色 / 深色），与 prototype 保持一致 ============================================================ */ :root{ --bg:#f4f5f7; --surface:#ffffff; --surface-2:#f7f8fa; --muted:#8a93a3; /* 原 :root 漏定义，导致多处 var(--muted) 声明失效 */ --text-2:#4b5563; --ok:#2e9e5b; --danger:#c0392b; --danger-weak:#fde8e8; --highlight:#fff3bf; /* 搜索/标签命中高亮底色 */ --info:#1a73e8; --info-weak:#e8f0fe; --text:#1f2330; --text-weak:#6b7280; --border:#e7e9ee; --primary:#e91e63; --primary-weak:#fbe7ef; --primary-2:#7c4dff; --accent:#ff4d6a; --glass:rgba(255,255,255,.62); --glass-strong:rgba(255,255,255,.82); --shadow:0 6px 24px rgba(20,23,40,.08); --shadow-hover:0 14px 38px rgba(20,23,40,.16); --radius:18px; --radius-sm:12px; } [data-theme="dark"]{ --bg:#0e1014; --surface:#171a21; --surface-2:#1d212b; --text:#e8eaf0; --text-weak:#9aa1ad; --muted:#8b92a0; --text-2:#c7cddb; --ok:#4ade80; --danger:#ff6b6b; --danger-weak:#3a1f22; --highlight:#4a3f1a; --info:#7ab8ff; --info-weak:#1e2a3a; --border:#2a2f3a; --primary:#ff5c8a; --primary-weak:#3a1f29; --primary-2:#9a7bff; --accent:#ff7a9f; --glass:rgba(23,26,33,.6); --glass-strong:rgba(23,26,33,.82); --shadow:0 6px 24px rgba(0,0,0,.4); --shadow-hover:0 14px 38px rgba(0,0,0,.55); } /* ============================================================ 基础重置 ============================================================ */ *{box-sizing:border-box;margin:0;padding:0} html{scroll-behavior:smooth} body{font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Hiragino Sans GB",sans-serif;background:var(--bg);color:var(--text);line-height:1.6;-webkit-tap-highlight-color:transparent;transition:background .35s,color .35s} a{color:inherit;text-decoration:none} .container{max-width:1180px;margin:0 auto;padding:0 20px} img{max-width:100%;display:block} ul,ol{list-style:none} /* ============================================================ 玻璃态顶栏 ============================================================ */ header{position:fixed;top:0;left:0;right:0;z-index:100;background:var(--glass);backdrop-filter:saturate(180%) blur(18px);-webkit-backdrop-filter:saturate(180%) blur(18px);border-bottom:1px solid transparent;transition:all .3s} header.scrolled{background:var(--glass-strong);border-bottom:1px solid var(--border);box-shadow:var(--shadow)} .header-inner{display:flex;align-items:center;height:66px;gap:24px} .logo{display:flex;align-items:center;gap:10px;font-weight:700;font-size:19px;white-space:nowrap} .logo img{height:34px;width:auto} .logo .mark{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,var(--primary),var(--primary-2));display:grid;place-items:center;color:#fff;font-size:16px;flex:none} nav.pc{display:flex;gap:6px;margin-left:8px} /* 主导航：一级横向，二级下拉（修复二级菜单错乱） */ nav.pc>ul{display:flex;gap:6px} nav.pc ul ul{display:none} nav.pc li{list-style:none;position:relative} nav.pc a{padding:8px 14px;border-radius:10px;color:var(--text-weak);font-size:15px;transition:.2s;display:block;white-space:nowrap} nav.pc a:hover,nav.pc li.current-menu-item>a,nav.pc li.current-menu-ancestor>a{color:var(--primary);background:var(--primary-weak)} /* 二级菜单：绝对定位下拉，父级 hover 显示 */ nav.pc li.menu-item-has-children>ul.sub-menu{ position:absolute;top:calc(100% + 6px);left:0;z-index:50;min-width:170px; display:none;flex-direction:column;gap:2px;padding:6px; background:var(--surface);border:1px solid var(--border);border-radius:12px; box-shadow:var(--shadow); } nav.pc li.menu-item-has-children:hover>ul.sub-menu{display:flex} nav.pc li.menu-item-has-children>a::after{content:"▾";font-size:10px;margin-left:4px;opacity:.6} nav.pc li.menu-item-has-children>ul.sub-menu a{padding:7px 12px;border-radius:8px;font-size:14px} nav.pc li.menu-item-has-children>ul.sub-menu li{width:100%} /* 三级及以上：在父级右侧展开 */ nav.pc li.menu-item-has-children>ul.sub-menu li.menu-item-has-children:hover>ul.sub-menu{top:0;left:calc(100% + 6px)} .header-right{margin-left:auto;display:flex;align-items:center;gap:12px} .icon-btn{width:40px;height:40px;border-radius:50%;border:1px solid var(--border);background:var(--surface);display:grid;place-items:center;cursor:pointer;color:var(--text-weak);transition:.2s} .icon-btn:hover{color:var(--primary);border-color:var(--primary)} .i049-user-btn{width:40px;height:40px;border-radius:50%;border:1px solid var(--border);background:var(--surface);padding:0;cursor:pointer;overflow:hidden;display:grid;place-items:center;transition:.2s} .i049-user-btn:hover{border-color:var(--primary)} .i049-user-btn img{width:100%;height:100%;object-fit:cover;display:block} .btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;border:0;padding:9px 18px;border-radius:12px;font-size:14px;cursor:pointer;font-weight:600;transition:.2s;display:inline-block;line-height:1.4} .btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover)} .hamburger{display:none;width:40px;height:40px;border-radius:10px;border:1px solid var(--border);background:var(--surface);cursor:pointer;flex-direction:column;gap:4px;align-items:center;justify-content:center} .hamburger span{width:18px;height:2px;background:var(--text);border-radius:2px} /* 移动端抽屉 */ .drawer{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.4);opacity:0;pointer-events:none;transition:.3s} .drawer.open{opacity:1;pointer-events:auto} .drawer-panel{position:absolute;top:0;right:0;height:100%;width:78%;max-width:320px;background:var(--surface);padding:24px;transform:translateX(100%);transition:.3s;display:flex;flex-direction:column;gap:6px;overflow-y:auto} .drawer.open .drawer-panel{transform:translateX(0)} .drawer-panel a{padding:14px 12px;border-radius:12px;color:var(--text);font-size:16px} .drawer-panel a:hover{background:var(--primary-weak);color:var(--primary)} .drawer-panel .drawer-apply{margin-top:8px;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;text-align:center;font-weight:600} /* ============================================================ 主区域 / Hero / 搜索（双层：分类标签 + 引擎） ============================================================ */ main{padding-top:66px;min-height:60vh} .hero{position:relative;padding:64px 0 26px;overflow:hidden} .hero::before{content:"";position:absolute;inset:-20% -10% auto -10%;height:420px;background:radial-gradient(60% 80% at 20% 0,rgba(233,30,99,.18),transparent),radial-gradient(60% 80% at 85% 10%,rgba(124,77,255,.18),transparent);filter:blur(10px);z-index:0} .hero .container{position:relative;z-index:1;text-align:center} .hero h1{font-size:34px;font-weight:800;letter-spacing:-.5px;margin-bottom:8px} .hero p{color:var(--text-weak);margin-bottom:22px;font-size:15px} /* 注意：必须写成 div.search——WordPress 在搜索结果页会给 加 .search 类， 若用裸 .search 会把 body 套成 max-width:660px 的居中 Flex，导致整页被压窄。 */ div.search{display:flex;max-width:660px;margin:0 auto;background:var(--glass-strong);backdrop-filter:blur(14px);border:1px solid var(--border);border-radius:16px;box-shadow:var(--shadow);padding:8px;gap:8px} .engine-ind{display:flex;align-items:center;gap:8px;padding:0 14px;height:46px;border-radius:10px;color:var(--text);font-size:15px;font-weight:600;white-space:nowrap;background:var(--surface-2);flex:none} .engine-ind .dot{width:18px;height:18px;border-radius:6px;background:linear-gradient(135deg,var(--primary),var(--primary-2));display:grid;place-items:center;color:#fff;font-size:11px;font-weight:700} div.search input{flex:1;height:46px;border:0;background:transparent;color:var(--text);font-size:16px;outline:0;padding:0 8px;min-width:120px} div.search .go{height:46px;padding:0 28px;border:0;border-radius:12px;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;font-weight:600;cursor:pointer;font-size:15px;flex:none} div.search .go:hover{transform:translateY(-1px)} .search-panel{margin:18px auto 0;max-width:760px} .search-tabs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:14px} .search-tabs button{padding:7px 16px;border-radius:20px;border:1px solid var(--border);background:var(--surface);color:var(--text-weak);font-size:14px;cursor:pointer;transition:.2s} .search-tabs button:hover{color:var(--text)} .search-tabs button.active{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;border-color:transparent;box-shadow:var(--shadow)} .search-engines{display:flex;flex-wrap:wrap;gap:10px;justify-content:center} .engine-chip{display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:12px;background:var(--surface);border:1px solid var(--border);cursor:pointer;font-size:14px;color:var(--text);transition:.2s;box-shadow:var(--shadow)} .engine-chip:hover{transform:translateY(-2px);border-color:var(--primary)} .engine-chip.active{border-color:var(--primary);background:var(--primary-weak);color:var(--primary);font-weight:600} .engine-chip .e-ico{width:22px;height:22px;border-radius:7px;display:grid;place-items:center;color:#fff;font-size:12px;font-weight:700;flex:none} /* ============================================================ 站点动态（替代原 article swiper，置于搜索框下方） ============================================================ */ .dynamics{margin-top:30px} .dyn-track{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:4px 2px 10px;scrollbar-width:none} .dyn-track::-webkit-scrollbar{display:none} .dyn-card{flex:0 0 auto;width:300px;scroll-snap-align:start;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:16px 18px;box-shadow:var(--shadow);display:flex;gap:12px;align-items:flex-start;transition:.22s;cursor:pointer} .dyn-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover);border-color:transparent} .dyn-card .badge{font-size:22px;flex:none;width:42px;height:42px;border-radius:12px;background:var(--primary-weak);display:grid;place-items:center} .dyn-card .txt h4{font-size:15px;font-weight:700;margin-bottom:3px} .dyn-card .txt p{font-size:12.5px;color:var(--text-weak);line-height:1.5} .dyn-card .txt time{font-size:11px;color:var(--text-weak);opacity:.7} .empty-tip{color:var(--text-weak);font-size:14px;padding:24px;text-align:center;border:1px dashed var(--border);border-radius:var(--radius-sm);background:var(--surface)} /* ============================================================ 区块 / 卡片 ============================================================ */ section.block{margin-top:34px;animation:fade .4s ease} @keyframes fade{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}} .block-head{display:flex;align-items:center;gap:12px;margin-bottom:16px} .block-head h2{font-size:20px;font-weight:700;position:relative;padding-left:14px} .block-head h2::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:5px;height:20px;border-radius:4px;background:linear-gradient(var(--primary),var(--primary-2))} .block-head .more{margin-left:auto;color:var(--text-weak);font-size:14px} .block-head .more:hover{color:var(--primary)} .block-head .apply{margin-left:auto;color:var(--primary);font-size:13px;padding:5px 12px;border:1px solid var(--primary);border-radius:20px;transition:.2s} .block-head .apply:hover{background:var(--primary);color:#fff} .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(168px,1fr));gap:14px} .card{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:8px;display:flex;gap:12px;align-items:flex-start;transition:.22s;box-shadow:var(--shadow)} .card:hover{transform:translateY(-4px);box-shadow:var(--shadow-hover);border-color:transparent} .card .ico{width:42px;height:42px;border-radius:12px;flex:none;display:grid;place-items:center;color:#fff;font-weight:700;font-size:17px;position:relative;overflow:hidden} .card h3{font-size:15px;font-weight:600;margin-bottom:4px;display:flex;align-items:center;gap:6px} .card p{font-size:12.5px;color:var(--text-weak);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden} .card .direct{position:absolute;top:14px;right:12px;color:var(--text-weak);opacity:0;transition:.2s;font-size:13px} .card:hover .direct{opacity:1} .tag-promo{font-size:11px;background:var(--primary);color:#fff;padding:1px 7px;border-radius:8px;font-weight:600} /* 序号：角标样式，悬浮于 logo 左上角，不占文字区空间 */ .rank{position:absolute;left:-6px;top:-6px;display:grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--surface-2);color:var(--text-weak);font-size:11px;font-weight:700;box-shadow:0 2px 6px rgba(0,0,0,.08);line-height:1} .rank.top{background:var(--primary-weak);color:var(--primary)} .rank.top1{background:linear-gradient(135deg,#ff7a45,#ff4d4f);color:#fff} .rank.top2{background:linear-gradient(135deg,#ffd666,#ff7a45);color:#fff} .rank.top3{background:linear-gradient(135deg,#ffc53d,#ffa940);color:#fff} .hot .card p{color:var(--primary-2);font-weight:600} /* 友情链接 */ .friends{display:flex;flex-wrap:wrap;gap:8px;align-items:center} .friends a{font-size:13px;color:var(--text-weak);padding:5px 14px;border:1px solid var(--border);border-radius:20px;transition:.2s;line-height:1.6;white-space:nowrap;display:inline-block} .friends a:hover{color:var(--primary);border-color:var(--primary);background:var(--surface-2)} .friends .empty-tip{width:100%} /* ============================================================ 网址详情/文章页（single） ============================================================ */ .crumbs{margin:22px 0 14px;color:var(--text-weak);font-size:13px} .crumbs a:hover{color:var(--primary)} .detail-hero{display:flex;gap:22px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:22px;box-shadow:var(--shadow)} .shot{width:300px;height:190px;border-radius:14px;flex:none;background:linear-gradient(135deg,var(--surface-2),var(--border));display:grid;place-items:center;color:var(--muted);font-size:15px;font-weight:600;text-align:center;padding:10px} .detail-info{flex:1;min-width:0} .detail-info h1{font-size:24px;font-weight:800;margin-bottom:14px} .detail-info ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:10px 18px} .detail-info li{font-size:14px;color:var(--text-weak)} .detail-info li b{color:var(--text);font-weight:600;margin-right:6px} .visit{margin-top:16px;display:inline-flex;align-items:center;gap:8px;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;padding:11px 22px;border-radius:12px;font-weight:600} .visit:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover)} .panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:20px;margin-top:18px;box-shadow:var(--shadow)} .panel h2{font-size:18px;font-weight:700;margin-bottom:12px;padding-left:14px;position:relative} .panel h2::before{content:"";position:absolute;left:0;top:3px;width:5px;height:18px;border-radius:4px;background:linear-gradient(var(--primary),var(--primary-2))} .panel p{color:var(--text-weak);font-size:14.5px;line-height:1.8} /* ============================================================ 分类列表页（历史分类归档，现链接分类无单页） ============================================================ */ .cat-banner{height:200px;border-radius:var(--radius);margin-top:18px;background:linear-gradient(120deg,var(--primary),var(--primary-2));display:grid;place-items:center;color:#fff;font-size:26px;font-weight:800;box-shadow:var(--shadow);padding:0 20px;text-align:center} .list-item{display:flex;gap:18px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:8px;margin-top:14px;box-shadow:var(--shadow);transition:.22s} .list-item:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover)} .list-item .thumb{width:140px;aspect-ratio:1/1;height:auto;border-radius:12px;flex:none;background:linear-gradient(135deg,var(--surface-2),var(--border));display:grid;place-items:center;color:var(--muted);font-weight:700;font-size:20px;overflow:hidden} .list-item .thumb img{width:100%;height:100%;object-fit:cover;display:block} .list-item .body{flex:1;min-width:0} .list-item h3{font-size:18px;font-weight:700;margin-bottom:8px} .list-item p{color:var(--text-weak);font-size:14px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden} .list-item .meta{margin-top:10px;color:var(--text-weak);font-size:13px;display:flex;gap:18px;flex-wrap:wrap} .pager{display:flex;justify-content:center;gap:8px;margin:22px 0;flex-wrap:wrap} .pager a,.pager span{padding:8px 14px;border:1px solid var(--border);border-radius:10px;color:var(--text-weak);font-size:14px} .pager .cur,.pager a.current,.pager a:hover{background:var(--primary);color:#fff;border-color:var(--primary)} /* 分类区块操作组（查看更多 + 申请收录） */ .block-head .head-actions{margin-left:auto;display:flex;align-items:center;gap:10px} .block-head .head-actions .more{margin-left:0;font-size:13px;padding:5px 12px;border:1px solid var(--border);border-radius:20px;color:var(--text-weak);transition:.2s} .block-head .head-actions .more:hover{color:var(--primary);border-color:var(--primary)} .block-head .head-actions .apply{margin-left:0} /* 分类归档页 */ .cat-head{margin-top:20px} .cat-desc{color:var(--text-weak);font-size:13px;margin:-8px 0 16px} /* ============================================================ 文章阅读页（single 站点动态） ============================================================ */ .article-page{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:28px;margin-top:18px;box-shadow:var(--shadow)} .article-page h1{font-size:27px;font-weight:800;margin-bottom:14px;letter-spacing:-.3px;line-height:1.35} .article-meta{display:flex;flex-wrap:wrap;gap:18px;color:var(--text-weak);font-size:13.5px;padding-bottom:16px;border-bottom:1px solid var(--border);margin-bottom:20px} .article-meta b{color:var(--text);font-weight:600} .article-body{font-size:15.5px;line-height:1.9;color:var(--text)} .article-body h2{font-size:20px;font-weight:700;margin:24px 0 10px} .article-body p{margin-bottom:14px} .article-body blockquote{margin:18px 0;padding:12px 18px;border-left:4px solid var(--primary);background:var(--primary-weak);border-radius:0 10px 10px 0;color:var(--text-weak)} /* 该选择器在「正文图片幻灯」段已有完整定义（合并去重，避免两处冲突） */ .article-body a{color:var(--primary);text-decoration:underline} .article-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:26px} .article-tags span{font-size:13px;color:var(--primary);background:var(--primary-weak);padding:5px 12px;border-radius:20px} /* 文章互动栏：点赞 / 分享 */ .article-engage{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:22px 0 6px} .engage-btn{display:inline-flex;align-items:center;gap:7px;background:var(--surface-2);border:1px solid var(--border);color:var(--text);padding:8px 16px;border-radius:22px;font-size:14px;cursor:pointer;font-weight:600;transition:.2s} .engage-btn:hover{transform:translateY(-1px);box-shadow:var(--shadow-hover)} .engage-btn .e-ico{font-size:15px;line-height:1} .engage-like.is-liked{background:var(--primary-weak);border-color:var(--primary);color:var(--primary)} .engage-like.is-liked .e-ico{color:var(--primary)} .engage-share{position:relative} .share-menu{position:absolute;top:calc(100% + 8px);left:0;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow-hover);padding:6px;display:none;flex-direction:column;min-width:140px;z-index:20} .share-menu.open{display:flex} .share-item{background:none;border:0;text-align:left;padding:9px 12px;border-radius:8px;cursor:pointer;font-size:14px;color:var(--text)} .share-item:hover{background:var(--surface-2)} /* 文章底部版权/留言提示 */ .ewm-copyright{margin-top:28px;padding:14px 16px;border-left:3px solid var(--primary);background:var(--surface-2);border-radius:0 12px 12px 0;color:var(--text-weak);font-size:13.5px;line-height:2} .ewm-copyright .ec-line{padding:2px 0} .ewm-copyright .ec-link{color:var(--primary);text-decoration:none;font-weight:600} .ewm-copyright .ec-link:hover{text-decoration:underline} .ewm-copyright .ec-copy{color:var(--muted)} /* 文章内嵌联盟商品卡（CPS 导购） */ .ewm-union-card{margin-top:28px;border:1px solid var(--border);border-radius:16px;padding:16px;background:var(--surface-2)} .euc-head{font-weight:700;margin-bottom:12px;color:var(--text)} .euc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px} .euc-item{display:flex;flex-direction:column;gap:6px;background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:10px;text-decoration:none;color:var(--text);transition:.2s} .euc-item:hover{transform:translateY(-2px);box-shadow:var(--shadow-hover);border-color:var(--primary)} .euc-img{height:90px;border-radius:8px;background-size:cover;background-position:center;background-color:var(--surface-2);display:flex;align-items:center;justify-content:center;font-size:26px;color:var(--muted)} .euc-title{font-size:13px;line-height:1.4;height:36px;overflow:hidden} .euc-price{color:var(--primary);font-weight:700} /* 提交页付费套餐 */ .paid-tiers{display:flex;flex-direction:column;gap:8px;margin-top:6px} .pt-opt{display:flex;align-items:center;gap:10px;background:var(--surface-2);border:1px solid var(--border);border-radius:10px;padding:10px 12px;cursor:pointer} .pt-opt .pt-name{font-weight:600} .pt-opt .pt-price{color:var(--primary);font-weight:700} .pt-opt .pt-desc{color:var(--text-weak);font-size:13px} @media (max-width:600px){.euc-grid{grid-template-columns:repeat(2,1fr)}} .back-home{display:inline-block;margin-top:22px;color:var(--primary);font-size:14px;font-weight:600} /* ============================================================ 评论区（comments.php）—— 紧凑排版，参考 CorePress 要点：表单置顶、字段 placeholder 化、一条评论 = 头像左 + 名称/时间/回复同一行 + 正文 ============================================================ */ .comments-area{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:18px 20px;margin-top:18px;box-shadow:var(--shadow)} .comments-area .comments-title{position:relative;padding-left:14px;font-size:16px;font-weight:700;margin:16px 0 10px} .comments-area .comments-title::before{content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);width:4px;height:16px;border-radius:3px;background:linear-gradient(var(--primary),var(--primary-2))} /* 列表 */ .comments-area .comment-list{list-style:none;margin:0;padding:0} .comments-area .comment-body{position:relative;padding:10px 0 10px 42px;border-bottom:1px dashed var(--border)} .comments-area .comment-list > li:last-child > .comment-body:last-child{border-bottom:0} .comments-area .comment-meta .avatar{position:absolute;left:0;top:10px;width:32px;height:32px;border-radius:50%;object-fit:cover;margin:0} /* 元信息一行：名称 + 说道 + 时间（重置 WP 默认的块级堆叠，并抵消主题里 footer 元素选择器的影响） */ .comments-area .comment-meta{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin:0;padding:0;font-size:13px;text-align:left;background:none;border:0;min-height:20px} .comments-area .comment-meta .comment-author{display:flex;align-items:baseline;gap:6px} .comments-area .comment-meta .fn{font-style:normal;font-weight:600;font-size:13.5px} .comments-area .comment-meta .says{color:var(--text-weak)} .comments-area .comment-metadata,.comments-area .comment-metadata a{font-size:12px;color:var(--text-weak)} .comments-area .comment-metadata a:hover{color:var(--primary)} .comments-area .comment-content{font-size:14.5px;line-height:1.7;margin-top:3px;color:var(--text)} .comments-area .comment-content p{margin:0 0 6px} .comments-area .comment-content p:last-child{margin:0} /* 「回复」固定在右上角，不单独占一行 */ .comments-area .comment-body > .reply{position:absolute;right:0;top:9px} .comments-area .comment-body > .reply a{font-size:12.5px;color:var(--text-weak);padding:2px 8px;border:1px solid var(--border);border-radius:8px;transition:.15s} .comments-area .comment-body > .reply a:hover{color:#fff;background:var(--primary);border-color:var(--primary)} /* 子评论：每级缩进克制（约 10px），层级靠左侧细线区分，深嵌套也不会把正文挤窄 */ .comments-area .comment-list > .children{margin:0 0 0 12px;padding-left:10px;border-left:2px solid var(--border)} .comments-area .comment-list .children .children{margin-left:10px;padding-left:0;border-left:0} /* 表单：头像与输入区并排，字段一行，按钮右对齐 */ .comments-area .comment-respond{margin-bottom:4px} .comments-area .comment-reply-title{font-size:15px;font-weight:700;margin:0 0 10px} .comments-area .comment-reply-title small{font-size:12px;font-weight:400} .comments-area .comment-reply-title small a{color:var(--primary)} .comments-area .comment-form input[type=text],.comments-area .comment-form input[type=email],.comments-area .comment-form input[type=url],.comments-area .comment-form textarea{width:100%;padding:9px 12px;border:1px solid var(--border);border-radius:10px;background:var(--surface-2);color:var(--text);font-size:14.5px;line-height:1.6;font-family:inherit;outline:0;resize:vertical;transition:border-color .15s,box-shadow .15s} .comments-area .comment-form input:focus,.comments-area .comment-form textarea:focus{border-color:var(--primary);box-shadow:0 0 0 3px var(--primary-weak)} .comments-area .cmt-compose{display:flex;gap:10px;align-items:flex-start} .comments-area .cmt-compose .cmt-avatar{width:32px;height:32px;border-radius:50%;object-fit:cover;flex:none;margin-top:5px} .comments-area .cmt-compose textarea{flex:1;min-width:0} .comments-area .cmt-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;margin-top:10px} .comments-area .cmt-actions .cmt-submit{padding:8px 20px;border:0;border-radius:10px;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;font-size:14px;font-weight:600;cursor:pointer;transition:filter .15s} .comments-area .cmt-actions .cmt-submit:hover{filter:brightness(1.07)} .comments-area .comment-form-cookies-consent{display:flex;align-items:center;gap:6px;margin:8px 0 0;font-size:12px;color:var(--text-weak)} .comments-area .comment-form-cookies-consent input{width:auto;margin:0} /* 未登录且后台要求登录时：紧凑引导卡片（替代默认整块表单） */ .comments-area .cmt-login{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 14px;border:1px dashed var(--border);border-radius:12px;background:var(--surface-2)} .comments-area .cmt-login-text{font-size:14px;color:var(--text-weak)} .comments-area .cmt-login-btn{padding:7px 18px;border:0;border-radius:10px;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff;font-size:13.5px;font-weight:600;cursor:pointer} /* 空态 / 已关闭 / 分页 */ .comments-area .cmt-empty{display:flex;align-items:center;justify-content:center;gap:8px;padding:18px 0 4px;color:var(--text-weak);font-size:14px} .comments-area .no-comments{color:var(--text-weak);font-size:13px} .comments-area .comment-navigation .nav-links{display:flex;justify-content:center;gap:8px;flex-wrap:wrap} .comments-area .comment-navigation a,.comments-area .comment-navigation span{padding:6px 12px;border:1px solid var(--border);border-radius:9px;font-size:13px;color:var(--text-weak)} .comments-area .comment-navigation a:hover{border-color:var(--primary);color:var(--primary)} @media(max-width:560px){ .comments-area{padding:16px 14px} .comments-area .comment-body{padding-left:38px} .comments-area .comment-meta .avatar, .comments-area .cmt-compose .cmt-avatar{width:28px;height:28px} .comments-area .cmt-actions .cmt-submit{width:100%} } /* ============================================================ * 登录弹窗（template-parts/login-modal.php + js/ewm-auth.js） * ============================================================ */ .ewm-login{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;background:rgba(0,0,0,.45);padding:16px} .ewm-login-card{position:relative;width:100%;max-width:380px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:26px 22px} .ewm-login-close{position:absolute;top:10px;right:12px;width:30px;height:30px;border:0;background:transparent;color:var(--muted,#8a90a0);font-size:24px;line-height:1;cursor:pointer;border-radius:8px} .ewm-login-close:hover{background:var(--bg)} .ewm-tabs{display:flex;gap:6px;margin-bottom:18px;margin-top:18px} .ewm-tab{flex:1;padding:9px 0;border:1px solid var(--border);background:var(--bg);color:var(--text);font-size:14px;border-radius:8px;cursor:pointer;transition:.15s} .ewm-tab-active{border-color:transparent;background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff} .ewm-field{margin-bottom:14px} .ewm-field label{display:block;font-size:13px;margin-bottom:5px;color:var(--text)} .ewm-field input{width:100%;padding:10px 12px;border:1px solid var(--border);border-radius:8px;background:var(--bg);color:var(--text);font-size:14px;box-sizing:border-box} .ewm-field input:focus{outline:none;border-color:var(--primary)} .ewm-btn{display:block;width:100%;padding:10px 0;border:0;border-radius:8px;font-size:15px;cursor:pointer;box-sizing:border-box} .ewm-btn-primary{background:linear-gradient(135deg,var(--primary),var(--primary-2));color:#fff} .ewm-btn-primary:hover{opacity:.92} .ewm-switch-line{text-align:center;margin:14px 0 0;font-size:13px;color:var(--muted,#8a90a0)} .ewm-switch-line a{color:var(--primary);text-decoration:none} /* 微信扫码面板（erphp-weixin-scan 渲染，覆写其内联默认样式以贴合主题） */ .ewm-scan{margin:0 auto;max-width:300px;text-align:center} .ewm-scan .ews-title{text-align:center;font-size:16px;font-weight:600;margin-bottom:10px;color:var(--text)} .ewm-scan img{max-width:200px;height:auto;border:1px solid var(--border);border-radius:8px;margin: 0 auto} .ewm-scan .ews-box{margin-top:12px} .ewm-scan .ews-input{border:1px solid var(--border);border-radius:8px;padding:8px 12px;width:140px;height:38px;box-sizing:border-box;background:var(--bg);color:var(--text)} .ewm-scan .ews-button{background:#07C160;border:0;padding:8px 16px;color:#fff;border-radius:8px;font-size:14px;cursor:pointer;height:38px;box-sizing:border-box} .ewm-scan .ews-tips{text-align:center;font-size:13px;color:var(--muted,#8a90a0);margin-top:10px} .ewm-scan-empty{text-align:center;color:var(--muted,#8a90a0);font-size:14px;padding:30px 0} /* 社交登录（复用 Erphplogin get_erphplogin() 输出，仅覆写外观） */ .ewm-social{margin-top:18px;padding-top:16px;border-top:1px dashed var(--border);text-align:center} .ewm-social .erphplogin-box{display:inline-flex;gap:14px;justify-content:center;margin:0} .ewm-social .erphplogin-box a{display:inline-flex;align-items:center;justify-content:center;width:42px;height:42px;border-radius:50%;color:#fff;text-decoration:none;transition:.15s} .ewm-social .erphplogin-box a:hover{opacity:.88;transform:translateY(-1px)} .ewm-social .erphplogin-qq-a{background:#12B7F5} .ewm-social .erphplogin-weibo-a{background:#E6162D} .ewm-social .erphplogin-weixin-a{background:#07C160} .ewm-social .erphploginfont{font-size:20px !important;color:#fff} /* 已登录账户视图 */ .ewm-loggedin{text-align:center;padding:10px 0} .ewm-loggedin-avatar{width:84px;height:84px;border-radius:50%;object-fit:cover;border:3px solid var(--primary)} .ewm-loggedin-name{margin:12px 0 18px;font-size:16px;font-weight:600;color:var(--text)} /* toast */ .ewm-toast{display:none;position:fixed;left:50%;top:24px;transform:translateX(-50%);z-index:10000;max-width:80%;padding:10px 18px;border-radius:8px;background:rgba(0,0,0,.82);color:#fff;font-size:14px;box-shadow:0 6px 20px rgba(0,0,0,.25)} .ewm-toast-error{background:#e74c3c} .ewm-toast-success{background:#1d9e75} /* 名称/邮箱/网址 三个字段排成一行（flex，无空白缝隙；评论区用 placeholder 代替 label） */ .cf-row{display:flex;gap:10px;margin:10px 0 0} .cf-row .comment-form-author, .cf-row .comment-form-email, .cf-row .comment-form-url{flex:1;min-width:0;margin:0} .cf-row input{width:100%} @media(max-width:560px){ .cf-row{flex-direction:column;gap:0;margin-bottom:0} .cf-row .comment-form-author, .cf-row .comment-form-email, .cf-row .comment-form-url{margin:0 0 12px} } /* ============================================================ 普通页面 / 404 / 申请收录 ============================================================ */ .page-wrap{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:28px;margin-top:18px;box-shadow:var(--shadow)} .page-wrap h1{font-size:26px;font-weight:800;margin-bottom:16px} .page-wrap p{color:var(--text-weak);line-height:1.8;margin-bottom:12px} .entry-content{font-size:15.5px;line-height:1.9;color:var(--text)} .entry-content h2{font-size:20px;font-weight:700;margin:22px 0 10px} .entry-content p{margin-bottom:14px} .entry-content a{color:var(--primary);text-decoration:underline} .submit-form{display:grid;gap:16px;max-width:560px;margin-top:10px} .submit-form label{font-size:14px;font-weight:600;display:block;margin-bottom:6px} .submit-form input,.submit-form textarea,.submit-form select{width:100%;padding:11px 14px;border:1px solid var(--border);border-radius:12px;background:var(--surface-2);color:var(--text);font-size:15px;outline:0;font-family:inherit} .submit-form input:focus,.submit-form textarea:focus,.submit-form select:focus{border-color:var(--primary)} .submit-form .hint{font-size:12.5px;color:var(--text-weak);font-weight:400;margin-top:4px} .submit-note{margin-top:18px;padding:12px 16px;border-radius:12px;font-size:14px} .submit-note.ok{background:var(--primary-weak);color:var(--primary)} .submit-note.err{background:var(--danger-weak);color:var(--danger)} /* ============================================================ 页脚 ============================================================ */ /* 站点页脚是 的直接子元素，必须限定作用域：裸 footer 选择器会命中评论的