@charset "UTF-8";
/* ============================================================
   Icefox × 微信朋友圈 视觉覆盖层  v2.1  (zhu.ee / 2026-11-10)
   v2: 默认头像改人像剪影 / 封面按手机比例 / 首屏顶栏只留返回+相机 /
       正文与昵称排版收紧 / 点赞评论气泡 / 桌面窄列窗口感
   - 只改主题目录内文件，不动 nginx / vhost / 数据库
   v2.1: 恢复低调白底回顶按钮 + 点顶栏标题回顶
   - 删除本文件 + header.php 里的一行 link 即可完整还原
   - 后台自行设置 topImage / logoUrl 时 inline 样式优先
   ============================================================ */

:root {
    --wx-bg: #ededed;
    --wx-card: #ffffff;
    --wx-blue: #576b95;
    --wx-text: #191919;
    --wx-sub: #b2b2b2;
    --wx-line: #e4e4e4;
    --wx-panel: #f7f7f7;
    --wx-green: #07c160;
}
:root.dark {
    --wx-bg: #191919;
    --wx-card: #242424;
    --wx-blue: #8296bd;
    --wx-text: #d6d6d6;
    --wx-sub: #777777;
    --wx-line: #303030;
    --wx-panel: #2c2c2c;
}

html, body { background-color: var(--wx-bg) !important; }
body {
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC",
                 "Hiragino Sans GB", "Microsoft YaHei", "Helvetica Neue", sans-serif !important;
    -webkit-font-smoothing: antialiased;
}
.content-container { background-color: var(--wx-bg); margin-top: 0 !important; }

/* 桌面：模拟微信 PC 版朋友圈的窄窗口，而不是一整页网页 */
main {
    max-width: 500px !important;
    box-shadow: 0 0 0 1px rgba(0,0,0,.05), 0 6px 28px rgba(0,0,0,.06);
}

/* ---------------- 顶栏：首屏只有「<」和相机 ---------------- */
.top-container {
    max-width: 500px !important;
    height: 44px !important;
    padding: 0 10px !important;
    align-items: center;
    background: linear-gradient(180deg, rgba(0,0,0,.18), rgba(0,0,0,0)) !important;
}
.top-container.scrolled,
.top-container.wx-scrolled {
    background: var(--wx-card) !important;
    box-shadow: 0 1px 0 var(--wx-line);
}
.top-container > .top-container-left,
.top-container > .top-container-right { display: flex; align-items: center; gap: 4px; }
.top-container svg {
    width: 21px; height: 21px;
    color: #fff;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,.35));
}
.top-container.scrolled svg,
.top-container.wx-scrolled svg { filter: none; color: var(--wx-text); }

/* 微信朋友圈封面态没有登录/设置/编辑入口；滑过封面(JS 加 .scrolled)后再出现，功能不丢 */
.top-container:not(.scrolled) .tc-user,
.top-container:not(.scrolled) .tc-setting,
.top-container:not(.scrolled) .tc-edit { display: none !important; }
.top-container.scrolled .tc-user,
.top-container.scrolled .tc-setting,
.top-container.scrolled .tc-edit { opacity: .72; }

.wx-back, .wx-camera {
    display: inline-flex; align-items: center; justify-content: center;
    width: 30px; height: 30px;
    color: #fff; text-decoration: none; cursor: pointer; flex: 0 0 auto;
}
.wx-back svg, .wx-camera svg { width: 22px; height: 22px; }
.top-container.scrolled .wx-back,
.top-container.scrolled .wx-camera,
.top-container.wx-scrolled .wx-back,
.top-container.wx-scrolled .wx-camera { color: var(--wx-text); }
.wx-camera { order: 9; margin-left: 2px; }
.wx-nav-title {
    position: absolute; left: 50%; transform: translateX(-50%);
    font-size: 16px; font-weight: 600; letter-spacing: .5px;
    color: #fff; text-shadow: 0 1px 3px rgba(0,0,0,.4);
    opacity: 0; transition: opacity .25s ease;
    pointer-events: none; white-space: nowrap;
}
.top-container.scrolled .wx-nav-title,
.top-container.wx-scrolled .wx-nav-title {
    opacity: 1; color: var(--wx-text); text-shadow: none;
}

/* ---------------- 封面：手机比例 + 昵称 + 白边头像 ---------------- */
.header-container {
    height: 360px;
    background-image: url('../img/moments-cover.svg');
    background-size: cover;
    background-position: center;
}
.header-container::after {
    content: ""; position: absolute;
    left: 0; right: 0; bottom: 0; height: 90px;
    background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.24));
    pointer-events: none;
}
.header-container > .header-info {
    left: 50%; transform: translateX(-50%);
    max-width: 500px; width: 100%;
    bottom: -26px; z-index: 2;
}
.header-container > .header-info > .header-user {
    padding-right: 16px !important;
    align-items: flex-start !important;
}
.header-container > .header-info > .header-user > .header-site-title {
    margin-right: 14px !important;
    margin-top: 9px !important;
}
.header-container > .header-info > .header-user > .header-site-title > span {
    font-size: 16px !important;
    font-weight: 500 !important;
    letter-spacing: .3px;
    text-shadow: 0 1px 5px rgba(0,0,0,.6);
}
.header-container > .header-info > .header-user > .header-avatar-link,
.header-container > .header-info > .header-user > .header-avatar-nolink {
    width: 68px; height: 68px;
    border: 3px solid #fff;
    border-radius: 8px !important;
    box-shadow: 0 2px 10px rgba(0,0,0,.22);
    background: #fff; flex: 0 0 auto;
}
.header-container > .header-info > .header-user > .header-avatar-link > img,
.header-container > .header-info > .header-user > .header-avatar-nolink > img {
    width: 62px !important; height: 62px !important;
    border-radius: 5px !important; object-fit: cover;
}
.header-logo-placeholder {
    width: 62px !important; height: 62px !important;
    border-radius: 5px !important;
    background: url('../img/wechat-avatar.svg') center/cover no-repeat, #c9c9cd !important;
    color: transparent !important; font-size: 0 !important;
}
/* 微信朋友圈封面不显示签名，签名留给 meta description / 个人资料 */
.header-container > .header-info > .header-description { display: none !important; }

/* ---------------- 时间线：连续白底 + 细分隔线 ---------------- */
.scrollload-container {
    max-width: 500px; width: 100%;
    margin: 0 auto;
    background: var(--wx-card);
    padding-top: 38px;
    box-sizing: border-box;
}
.post-list { gap: 0 !important; }
.post-item {
    padding: 14px 14px 0 14px !important;
    background: var(--wx-card);
}
.post-item-left { width: 44px; flex: 0 0 44px; }
.post-item-left img {
    width: 40px !important; height: 40px !important;
    border-radius: 4px !important; object-fit: cover;
    background: #e8e8e8;
    box-shadow: 0 0 0 1px rgba(0,0,0,.04);
}
.post-item-right {
    border-bottom: 1px solid var(--wx-line) !important;
    padding-bottom: 12px !important;
    width: calc(100% - 44px);
}
.post-title { margin: 0 0 2px 0 !important; }
.post-title a {
    color: var(--wx-blue) !important;
    font-size: 16px !important;
    font-weight: 500 !important;
}
.post-content {
    color: var(--wx-text) !important;
    font-size: 16px !important;
    line-height: 1.45 !important;
}
.post-content p { margin: 0 0 4px !important; }
.post-content a { text-decoration: none !important; }
/* 摘要里的段落连排，让「全文」紧跟正文，像微信而不是分段列表 */
.post-content [class^="summary-"] p { margin: 0 0 2px !important; }
.post-content [class^="summary-"] p:last-of-type { display: inline; margin: 0 !important; }
.post-content a,
.show_all_btn, .hide_all_btn { color: var(--wx-blue) !important; }
.show_all_btn, .hide_all_btn { font-size: 16px; }
.post-time { margin-top: 7px; }
.post-time time { color: var(--wx-sub) !important; font-size: 12px !important; }

/* 「··」两点胶囊按钮（微信是两点、浅灰底） */
.post-time-comment {
    background: var(--wx-panel) !important;
    border-radius: 4px; width: 30px;
}
.post-time-comment:hover { background: #e8e8e8 !important; }
.ptc-more {
    width: 30px !important; height: 20px !important;
    display: flex; align-items: center; justify-content: center;
    padding: 0 !important;
}
.ptc-more svg { width: 17px; height: 17px; }
.ptc-more svg path { fill: #7d7d7d; }
.post-time-comment-modal {
    background-color: #4c4c4c !important;
    border-radius: 4px !important;
    box-shadow: 0 2px 10px rgba(0,0,0,.2);
}

/* ---------------- 点赞 / 评论区：浅灰气泡 + 小三角 ---------------- */
.post-comment-container {
    background: var(--wx-panel) !important;
    border-radius: 4px; position: relative;
    margin-top: 8px !important;
    padding: 5px 9px !important;
}
.post-comment-container::before {
    content: ""; position: absolute; top: -6px; right: 12px;
    width: 0; height: 0;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-bottom: 6px solid var(--wx-panel);
}
.pcc-like-list {
    border-bottom: 1px solid var(--wx-line) !important;
    color: var(--wx-blue) !important;
    padding-bottom: 3px;
}
.pcc-like-summary, .like-users-text,
.pcc-comment-item a, .pcc-comment-author { color: var(--wx-blue) !important; }
.pcc-comment-item a { font-weight: 500; }
.pcc-comment-content { color: var(--wx-text) !important; }
.pcc-comment-item { line-height: 1.55; }
/* 主题输出的是半角「 : 」，微信是「昵称：内容」 */
.pcc-comment-item > span:first-of-type { display: none; }
.pcc-comment-item > a::after { content: "："; color: var(--wx-text); }

/* 九宫格图片：小间距、方形、微圆角（微信风格） */
.post-images .grid, .fixed-grid > .grid { gap: 4px !important; }
.post-image img, .post-image-one img { border-radius: 2px !important; }

/* ---------------- 移动端 ---------------- */
@media (max-width: 680px) {
    main { box-shadow: none; }
    .top-container { max-width: 100% !important; }
    .header-container { height: 281px; }
    .header-container > .header-info {
        left: 0 !important; transform: none !important; max-width: 100%;
    }
    .scrollload-container { padding-top: 36px; }
    .post-item { padding: 13px 12px 0 12px !important; }
    .post-item-right { width: calc(100% - 44px); }
}

/* 友情链接入口已在 Icefox 主题源码中移除（head.php + 各页 modal 引用） */


/* ---------------- v2.1 微调 ---------------- */
.post-comment-container { overflow: visible !important; }
.post-comment-container .pcc-like-list,
.post-comment-container .pcc-like-list * { color: var(--wx-blue) !important; }
.post-comment-container .pcc-like-list svg { stroke: var(--wx-blue) !important; }
/* ---------------- 回到顶部：低调白底 + 点顶栏标题（微信习惯） ----------------
   主题自带 JS(assets/js/icefox.js initBackToTop)：滚动 >320px 加 .show，点击平滑回顶。
   这里只重绘外观并恢复显示，不动 30 天缓存的 JS。 */
.back-to-top {
    width: 38px !important;
    height: 38px !important;
    right: 14px !important;
    bottom: 22px !important;
    background: rgba(255,255,255,.92) !important;
    border: 1px solid rgba(0,0,0,.08) !important;
    border-radius: 50% !important;
    box-shadow: 0 2px 10px rgba(0,0,0,.12) !important;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    opacity: 0 !important;
    visibility: hidden !important;
    transform: translateY(8px) !important;
    transition: opacity .22s ease, visibility .22s ease, transform .22s ease !important;
    z-index: 900 !important;
}
.back-to-top.show {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) !important;
}
.back-to-top:hover,
.back-to-top:active {
    background: #ffffff !important;
    box-shadow: 0 3px 14px rgba(0,0,0,.16) !important;
    transform: translateY(0) !important;
}
.back-to-top svg { color: var(--wx-blue) !important; width: 20px; height: 20px; stroke-width: 2.2; }
:root.dark .back-to-top { background: rgba(44,44,44,.92) !important; border-color: rgba(255,255,255,.12) !important; }
:root.dark .back-to-top svg { color: var(--wx-blue) !important; }

/* 桌面：按钮贴着 500px 内容列的右外侧，不飘在大片留白里 */
@media (min-width: 900px) {
    .back-to-top { right: calc(50% - 250px - 56px) !important; bottom: 28px !important; width: 40px !important; height: 40px !important; }
}
@media (max-width: 899px) {
    .back-to-top { right: 14px !important; bottom: 20px !important; }
}

/* 滚动后的白底顶栏，点「朋友圈」三个字也能回顶（等同微信点顶部状态栏） */
.top-container.scrolled .wx-nav-title,
.top-container.wx-scrolled .wx-nav-title { pointer-events: auto; cursor: pointer; }