/* ===========================================
 * 文章封面图 响应式高度
 * =========================================== */
.article-cover {
    transition: height 0.2s ease;
}
@media (max-width: 1024px) {
    .article-cover {
        height: 220px !important;
    }
}
@media (max-width: 768px) {
    .article-cover {
        height: 120px !important;
    }
}
/* ===========================================
 * 状态栏安全间距：只对导航内部这一层加间距，不改动.header外层容器本身的高度/层级，
 * 避免破坏按钮点击响应（之前直接在.header上加padding导致按钮失效）
 * =========================================== */
.navbar-header {
    padding-top: max(env(safe-area-inset-top), 0px);
}
.headroom {
    transition: transform 0.2s ease, top 0.2s ease;
}
/* 顶部：用top位移 */
.header.headroom--unpinned {
    top: -125px !important;
}
.header.headroom--pinned {
    top: 0px;
}
/* 底部：用transform位移 */
.footer-tabbar.headroom--unpinned {
    transform: translateY(100%) !important;
}
.footer-tabbar.headroom--pinned {
    transform: translateY(0) !important;
}

/* 导航栏隐藏时，让占位块（撑出导航栏高度的空白区域）跟着收缩为0，避免滑到底部时露出空白 */
.footer-tabbar-placeholder {
    transition: height 0.2s ease;
}
.footer-tabbar.headroom--unpinned ~ .footer-tabbar-placeholder {
    height: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    overflow: hidden !important;
}

/* 底部导航收缩后，会露出手机底部安全区域（比如iPhone Home指示条那一小条），
   给html/body也设成深色背景，避免露出默认的白色空隙 */
html, body {
    background-color: #1a1a1a;
}

/* 如果导航栏显示靠下高度过高，取消下面这条注释，再适当调整数值 */
/* .header { top: -18px !important; } */
/* ===========================================
 * 隐藏指定元素
 * 注意：.relative 这条因为是全站通用的定位工具类，风险太高，暂未采纳，
 * 需要你确认具体想隐藏的元素后再加回来
 * =========================================== */
.article-avatar {
    display: none !important;
}
.line-form-line {
    display: none !important;
}
.post-metas {
    display: none !important;
}
.meta-right {
    display: none !important;
}
.tag-posts {
    display: none !important;
}
.tag-view {
    display: none !important;
}
.tag-like {
    display: none !important;
}
/* 原写法 ".em09 opacity5 mt6" 缺少点号，已修正为三个class连写 */
.em09.opacity5.mt6 {
    display: none !important;
}
/* 仅在纯文字列表中隐藏副标题 */
ul.no-thumb li.icon-circle {
    display: none !important;
}
/* ===========================================
 * "最近浏览"小工具 sticky 固定
 * =========================================== */
.widget_recently_viewed_posts {
    position: sticky;
    top: 80px; /* 根据实际导航高度调整 */
    z-index: 10;
}
.widget_recently_viewed_posts ul {
    margin: 0;
    padding-left: 1em;
    list-style: disc;
}
/* ===========================================
 * 列表缩略图覆盖
 * =========================================== */
.item-thumbnail .thumbnail-wrapper {
    position: relative !important;
    display: inline-block !important;
    width: 100% !important;
}
.item-thumbnail .thumbnail-overlay {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    pointer-events: none !important;
    z-index: 99 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}
.item-thumbnail .thumbnail-overlay img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}
/* ===========================================
 * 卡片缩略图覆盖
 * =========================================== */
.thumbnail-wrapper {
    position: relative !important;
    display: inline-block !important;
    width: 100% !important;
}
.thumbnail-overlay {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    pointer-events: none !important;
    z-index: 99 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important; /* 原来漏了开头的 j，已修正 */
}
.thumbnail-overlay img {
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
}
/* ===========================================
 * 侧边悬浮工具按钮：滚动透明效果
 * =========================================== */
.float-right.square.position-bottom {
    transition: opacity 0.3s ease-in-out;
}
.float-btn-transparent {
    opacity: 0.1 !important;
}
.float-btn-transparent:hover {
    opacity: 0.7 !important;
}
/* ===========================================
 * 横向滑动卡片：PC端4张/手机端2张，右侧露出下一张边沿
 * =========================================== */
.widget-main-post .swiper-container.swiper-scroll .posts-item.card {
    width: calc(24% - 10px) !important;
}
@media (max-width: 991px) {
    .widget-main-post .swiper-container.swiper-scroll .posts-item.card {
        width: calc(48% - 10px) !important;
        margin: 5px !important;
    }
}