/* 网站平铺：给 bookmarks 组件加 css-class: site-tiles 即可生效 */
.site-tiles .dynamic-columns { display: block; }
.site-tiles .bookmarks-group ul.list {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(92px, 1fr));
    gap: 1.8rem 0.8rem;
}
.site-tiles .bookmarks-group ul.list > li { margin: 0 !important; }
.site-tiles .bookmarks-group li > .flex {
    position: relative;
    flex-direction: column;
    gap: 0.7rem;
    text-align: center;
}
.site-tiles .bookmarks-icon-container {
    padding: 0;
    width: 52px;
    height: 52px;
    border-radius: 14px;
    opacity: 1;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform .15s;
}
.site-tiles .bookmarks-icon { width: 100%; height: 100%; opacity: 1; object-fit: contain; }
.site-tiles .bookmarks-icon.flat-icon { width: 60%; height: 60%; }
.site-tiles .bookmarks-link {
    font-size: var(--font-size-h5);
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.site-tiles .bookmarks-link::after {
    content: "" !important;
    position: absolute;
    inset: 0;
    margin: 0 !important;
}
.site-tiles li:hover .bookmarks-icon-container { transform: translateY(-2px); }

/* NewsNow 热榜（首页资讯组）：单行紧凑列表，字体加大 */
ul.list.collapsible-container[data-collapse-after="10"] > li > a[title][target="_blank"] {
    font-size: var(--font-size-h3);
    line-height: 1.6;
}

/* 自建页右侧「服务器」栏加宽：默认 .page-column-small 为 300px（site.css），这里只对 slug=selfhost 的页面改为 390px（+30%）。
   以当前导航项 href 识别页面；仅桌面宽度生效（≤1190px 时 glance 的 mobile.css 将其设为 100%，不受影响）。 */
@media (min-width: 1191px) {
    body:has(.nav-item-current[href$="/selfhost"]) .page-column-small {
        width: 390px;
    }
}

/* 滴答清单组件（Home 右栏）：分区标题、可点击勾选框（边框颜色=优先级）、同步按钮。
   勾选/同步是普通表单 POST 到 /tt/*（OpenResty 校验 glance 登录后转给 127.0.0.1:8095 的 ticktick-bridge）。 */
.tt-widget .tt-section { font-size: var(--font-size-h5); color: var(--color-text-highlight); margin: 1.4rem 0 0.8rem; }
.tt-widget .tt-section:first-child { margin-top: 0; }
.tt-widget .tt-item { display: flex; align-items: flex-start; gap: 10px; }
.tt-widget .tt-done { flex-shrink: 0; margin: 0; padding-top: 0.15em; }
.tt-widget .tt-check {
    display: block; width: 16px; height: 16px; padding: 0; cursor: pointer;
    border: 2px solid var(--color-text-subdue); border-radius: 4px; background: transparent;
    transition: background-color .15s, border-color .15s;
}
.tt-widget .tt-check.tt-p5 { border-color: #e5484d; }
.tt-widget .tt-check.tt-p3 { border-color: #f5a524; }
.tt-widget .tt-check.tt-p1 { border-color: #4d8df6; }
.tt-widget .tt-check:hover { background: var(--color-widget-background-highlight); }
.tt-widget .tt-checked .tt-check { background: var(--color-primary); border-color: var(--color-primary); }
.tt-widget .tt-checked + div { opacity: .5; text-decoration: line-through; }
.tt-widget .tt-sync { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 1.4rem 0 0; }
.tt-widget .tt-sync-btn {
    flex-shrink: 0; cursor: pointer; font: inherit; font-size: var(--font-size-h6);
    color: var(--color-text-highlight); background: transparent;
    border: 1px solid var(--color-separator); border-radius: var(--border-radius); padding: 0.3rem 0.9rem;
}
.tt-widget .tt-sync-btn:hover { border-color: var(--color-primary); color: var(--color-primary); }

/* 顶部导航栏（Home / 自建 / 网站）吸顶：仅桌面宽度（>1190px）。手机/小屏 glance 隐藏这一栏，页面切换在
   底部固定的 mobile-navigation 里（本身就一直可见），这里不动它，避免遮挡。
   用 padding-top 代替原来的 margin-top，并给容器铺页面背景色，滚动时内容不会从上方/两侧缝隙透出；
   z-index 15：高于组件内部层级(≤10)，低于弹出层 popover/搜索下拉(20)。 */
@media (min-width: 1191px) {
    .header-container {
        position: sticky;
        top: 0;
        z-index: 15;
        margin-top: 0;
        padding-top: calc(var(--widget-gap) / 2);
        background-color: var(--color-background);
    }
}
