/**
 * 深色影院主题
 * ===================================================================
 * 加载顺序：common.css -> theme-enhance.css -> 本文件
 *
 * 三条与浅色主题相反的规则（深色能否做出质感的关键）：
 *   1. 层级靠表面亮度，不靠阴影 —— 深色底上投影几乎不可见
 *   2. 去掉描边 —— 卡片边界由表面色差界定，而非 1px 灰线
 *   3. 悬停 = 提亮 + 缩放，不是变色描边
 *
 * 字体：不引 Google Fonts。目标用户在大陆，Google Fonts 被墙会拖慢
 * 首屏甚至加载失败，与既有性能/收录优化冲突。改用系统中文栈，
 * 个性从字重跨度、字距、字号跨度上做。
 */

/* ===================================================================
   0. 令牌
   ------------------------------------------------------------------
   同时覆盖 theme-enhance.css 的变量，使其规则自动转为深色。
   =================================================================== */

:root {
    /* 表面分层：靠亮度递增表达层级 */
    --s-0: #0b0b0d;   /* 页面底 */
    --s-1: #14141a;   /* 卡片、面板 */
    --s-2: #1c1c24;   /* 悬停、输入框 */
    --s-3: #262631;   /* 更高层：弹窗、下拉 */

    /* 文字阶 */
    --t-1: #f0f0f2;
    --t-2: #a8a8b3;
    --t-3: #6e6e78;

    --accent: #e0143c;
    --accent-hi: #ff2d56;
    --accent-soft: rgba(224, 20, 60, .14);

    /* 覆盖 theme-enhance.css 的令牌 */
    --c-text: var(--t-1);
    --c-text-soft: var(--t-2);
    --c-text-faint: var(--t-3);
    --c-line: rgba(255, 255, 255, .07);
    --c-bg-soft: var(--s-2);
    --c-accent: var(--accent);
    --c-accent-soft: var(--accent-soft);
    /* 标签光晕：深色底上要更亮更实才看得出，故比浅色层的 .34 提到 .5 */
    --tag-glow: rgba(224, 20, 60, .5);

    /* 深色下阴影极弱，仅用于脱离文档流的浮层 */
    --shadow-1: none;
    --shadow-2: 0 8px 24px rgba(0, 0, 0, .55);

    /* 中文系统字体栈 */
    --font-sans: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei",
                 "Source Han Sans CN", "Noto Sans CJK SC", sans-serif;
}

/* ===================================================================
   1. 页面底：带极细噪点，避免大面积纯黑发闷与 OLED 色带
   =================================================================== */

html {
    background-color: var(--s-0);
    /* 关键：让浏览器把 <select> 下拉列表、checkbox/radio、日期选择、
       滚动条、自动填充等「原生控件」整体按深色渲染。这些控件由操作系统
       渲染，逐条 CSS 改不掉，此一句话即可一劳永逸。 */
    color-scheme: dark;
}

body,
body.skin-white {
    background-color: var(--s-0);
    color: var(--t-1);
    font-family: var(--font-sans);
}

/* 噪点层：CSS 生成，无额外请求 */
body::before {
    content: '';
    position: fixed;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    opacity: .022;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* 内容需在噪点之上
   ------------------------------------------------------------------
   注意：此处只能包含「本身没有定位」的元素。
   #floatbtn 与 .mobile-tabbar 原本是 position:fixed，若写进这条规则会被
   relative 覆盖而回到正常文档流 —— 浮动按钮会堆在页面底部撑出大片空白，
   移动端底栏也不再吸底。二者已分别带 z-index 80 / 1030，天然高于
   z-index:0 的噪点层，无需在此声明。 */
.main-content,
footer {
    position: relative;
    z-index: 1;
}

/* 头部须高于正文
   ------------------------------------------------------------------
   此前 header.header 与 .main-content 同为 z-index:1，同层级时 DOM
   靠后者胜出，导致滚动时正文盖住吸顶导航。
   吸顶导航 .navbar-fixed-top 在 bootstrap 中为 1030，此处给外层 header
   同一量级以保证其内的 fixed 元素不被正文覆盖。 */
header.header {
    position: relative;
    z-index: 1030;
}

/* 数字等宽，播放量与时长对齐后更利落 */
.video-meta,
.video-duration,
.article-tag {
    font-variant-numeric: tabular-nums;
    font-feature-settings: "tnum";
}

/* ===================================================================
   2. 面板：去描边，改用表面色差
   =================================================================== */

.panel,
.panel-default,
.well,
.panel-blockimg {
    background-color: var(--s-1);
    border: none;
    box-shadow: none;
    color: var(--t-1);
}

.panel-heading,
.panel-default > .panel-heading {
    background-color: transparent;
    border-bottom: 1px solid var(--c-line);
    color: var(--t-1);
}

.panel-footer {
    background-color: transparent;
    border-top: 1px solid var(--c-line);
    color: var(--t-2);
}

.panel-title,
.panel-heading .panel-title {
    color: var(--t-1);
    font-weight: 600;
}

.panel-title small {
    color: var(--t-3);
    font-weight: 400;
}

/* 悬停不再加阴影，改为提亮 */
/* 悬停反馈：仅用于可点击的卡片，不用于内容面板
   ------------------------------------------------------------------
   原先对所有 .panel 加 hover 提亮至 --s-2，但：
     1. 正文面板本身不可点击，给它悬停反馈没有意义
     2. --c-bg-soft 也等于 --s-2，导致面板悬停后底色与内部小板块
        （person-stats-grid / person-facts 等）完全相同，小块视觉上消失
   故取消面板级 hover，仅保留链接与卡片自身的反馈。 */
@media (hover: hover) and (pointer: fine) {
    .panel.is-clickable:hover {
        background-color: var(--s-2);
        box-shadow: none;
    }
}

/* ===================================================================
   3. 文字与链接
   =================================================================== */

h1, h2, h3, h4, h5, h6 {
    color: var(--t-1);
}

a {
    color: var(--t-1);
}

a.link-dark {
    color: var(--t-2);
}

@media (hover: hover) and (pointer: fine) {
    a:hover,
    a.link-dark:hover {
        color: var(--accent-hi);
    }
}

p, li, dd, dt, span, div {
    border-color: var(--c-line);
}

.text-muted {
    color: var(--t-3) !important;
}

small {
    color: var(--t-3);
}

hr {
    border-top-color: var(--c-line);
}

/* 正文：深色下适当降低字重与亮度，减轻眩光 */
.article-text {
    color: #dcdce2;
    font-weight: 400;
}

.article-text a {
    color: var(--accent-hi);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.article-text blockquote {
    background-color: var(--s-1);
    border-left: 3px solid var(--accent);
    color: var(--t-2);
}

.article-text code,
.article-text pre {
    background-color: var(--s-2);
    color: #e6e6ea;
    border: none;
}

/* ===================================================================
   4. 导航栏
   ------------------------------------------------------------------
   .navbar-white 本身已是 #0c0c0c，深色下天然契合，仅需精修。
   =================================================================== */

.navbar-white,
.navbar-default {
    background-color: rgba(11, 11, 13, .92);
    -webkit-backdrop-filter: saturate(180%) blur(14px);
    backdrop-filter: saturate(180%) blur(14px);
    border: none;
    border-bottom: 1px solid var(--c-line);
    box-shadow: none;
}

.navbar-white .navbar-nav > li > a,
.navbar-default .navbar-nav > li > a {
    color: var(--t-2);
    font-weight: 400;
}

@media (hover: hover) and (pointer: fine) {
    .navbar-white .navbar-nav > li > a:hover,
    .navbar-white .navbar-nav > li > a:focus {
        color: var(--t-1);
        background-color: transparent;
    }
}

.navbar-white .navbar-nav > .active > a,
.navbar-white .navbar-nav > .active > a:hover,
.navbar-white .navbar-nav > .active > a:focus {
    color: var(--t-1);
    background-color: transparent;
    position: relative;
}

/* 当前栏目：底部强调条，而非背景块 */
.navbar-white .navbar-nav > .active > a::after {
    content: '';
    position: absolute;
    left: 50%;
    bottom: 8px;
    transform: translateX(-50%);
    width: 16px;
    height: 2px;
    background-color: var(--accent);
    border-radius: 2px;
}

.navbar-toggle {
    border-color: var(--c-line);
}

.navbar-toggle .icon-bar {
    background-color: var(--t-2);
}

@media (hover: hover) and (pointer: fine) {
    .navbar-toggle:hover,
    .navbar-toggle:focus {
        background-color: var(--s-2);
    }
}

.navbar-collapse {
    border-color: var(--c-line);
    box-shadow: none;
}

/* -------------------------------------------------------------------
   移动端导航抽屉：深色配色（结构见 theme-enhance.css 第 20 节后）
   ------------------------------------------------------------------
   common.css 的抽屉是白底 + #fbfbfb 圆角条目，深色主题下整体重涂：
   表面色抽屉、右缘细线 + 深投影、扁平条目分隔、主色当前栏、暗化遮罩。
   ------------------------------------------------------------------- */
@media (max-width: 767px) {
    #navbar-collapse {
        background-color: var(--s-1);
        border-right: 1px solid var(--c-line);
        box-shadow: 8px 0 32px rgba(0, 0, 0, .55);
    }

    /* 条目分隔线（替代灰底卡片） */
    #navbar-collapse .navbar-nav > li {
        border-bottom: 1px solid var(--c-line);
    }

    #navbar-collapse .navbar-nav > li > a {
        color: var(--t-2);
    }

    /* 当前栏目：主色文字 + 微强调底色，替代桌面端底部横条 */
    #navbar-collapse .navbar-nav > .active > a,
    #navbar-collapse .navbar-nav > .active > a:hover,
    #navbar-collapse .navbar-nav > .active > a:focus {
        color: var(--accent-hi);
        background-color: var(--accent-soft);
        border-radius: var(--radius-sm);
    }

    /* 桌面端底部强调条在抽屉内不适用 */
    #navbar-collapse .navbar-nav > .active > a::after {
        display: none;
    }

    /* 子菜单：去悬停底色，仅提亮文字 */
    #navbar-collapse .navbar-nav .open .dropdown-menu > li > a {
        color: var(--t-2);
    }

    #navbar-collapse .navbar-nav .open .dropdown-menu > li.active > a {
        color: var(--accent-hi);
        background-color: transparent;
    }

    /* 遮罩：暗化页面、聚焦抽屉 */
    .navbar .navbar-collapse-bg {
        background-color: rgba(0, 0, 0, .55);
        -webkit-backdrop-filter: blur(2px);
        backdrop-filter: blur(2px);
    }
}

@media (max-width: 767px) and (hover: hover) and (pointer: fine) {
    #navbar-collapse .navbar-nav > li > a:hover,
    #navbar-collapse .navbar-nav > li > a:focus {
        color: var(--t-1);
        background-color: transparent;
    }

    #navbar-collapse .navbar-nav .open .dropdown-menu > li > a:hover,
    #navbar-collapse .navbar-nav .open .dropdown-menu > li > a:focus {
        color: var(--t-1);
        background-color: transparent;
    }
}

/* ===================================================================
   5. 下拉菜单
   =================================================================== */

.dropdown-menu {
    background-color: var(--s-3);
    border: 1px solid var(--c-line);
    box-shadow: var(--shadow-2);
}

.dropdown-menu > li > a {
    color: var(--t-2);
}

@media (hover: hover) and (pointer: fine) {
    .dropdown-menu > li > a:hover,
    .dropdown-menu > li > a:focus {
        background-color: var(--s-2);
        color: var(--t-1);
    }
}

.dropdown-menu > .active > a,
.navbar-nav ul.dropdown-menu > li.active > a {
    background-color: var(--s-2);
    color: var(--accent-hi);
}

.dropdown-menu .divider {
    background-color: var(--c-line);
}

.dropdown-header {
    color: var(--t-3);
}

/* 移动端展开的下拉：插件设为 #222，统一到表面色 */
@media (max-width: 767px) {
    .navbar-white .navbar-nav .open .dropdown-menu,
    ul.dropdown-menu {
        background-color: var(--s-1);
    }

    .navbar-white .navbar-nav .open .dropdown-menu > li > a {
        color: var(--t-2);
    }
}

/* ===================================================================
   6. 表单
   =================================================================== */

.form-control {
    background-color: var(--s-2);
    border: 1px solid transparent;
    color: var(--t-1);
    box-shadow: none;
}

.form-control:focus {
    background-color: var(--s-2);
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
    color: var(--t-1);
}

.form-control::placeholder {
    color: var(--t-3);
}

.form-control[disabled],
.form-control[readonly] {
    background-color: var(--s-1);
    color: var(--t-3);
}

textarea.form-control {
    resize: vertical;
}

.input-group-addon {
    background-color: var(--s-3);
    border-color: transparent;
    color: var(--t-2);
}

label {
    color: var(--t-2);
    font-weight: 400;
}

/* 搜索框 */
.form-search .form-control,
#searchinput {
    background-color: rgba(255, 255, 255, .06);
    border: none;
    color: var(--t-1);
}

#searchinput:focus {
    background-color: rgba(255, 255, 255, .1);
}

/* 自动补全下拉 */
.autocomplete-suggestions {
    background-color: var(--s-3);
    border: 1px solid var(--c-line);
    color: var(--t-2);
    box-shadow: var(--shadow-2);
}

.autocomplete-suggestion {
    color: var(--t-2);
}

.autocomplete-selected {
    background-color: var(--s-2);
    color: var(--t-1);
}

.autocomplete-suggestions strong {
    color: var(--accent-hi);
}

/* ===================================================================
   7. 按钮
   =================================================================== */

.btn {
    border: none;
    font-weight: 500;
    transition: background-color .2s var(--ease), color .2s var(--ease);
}

.btn-default {
    background-color: var(--s-2);
    color: var(--t-1);
}

@media (hover: hover) and (pointer: fine) {
    .btn-default:hover,
    .btn-default:focus {
        background-color: var(--s-3);
        color: var(--t-1);
    }
}

.btn-primary {
    background-color: var(--accent);
    color: #fff;
}

@media (hover: hover) and (pointer: fine) {
    .btn-primary:hover,
    .btn-primary:focus {
        background-color: var(--accent-hi);
        color: #fff;
    }
}

.btn-outline-primary {
    background-color: transparent;
    border: 1px solid var(--accent);
    color: var(--accent-hi);
}

@media (hover: hover) and (pointer: fine) {
    .btn-outline-primary:hover {
        background-color: var(--accent);
        color: #fff;
    }
}

/* 加载更多：深色下改为通栏浅表面按钮 */
.btn-loadmore {
    background-color: var(--s-1);
    color: var(--t-2);
}

@media (hover: hover) and (pointer: fine) {
    .btn-loadmore:hover {
        background-color: var(--s-2);
        color: var(--t-1);
    }
}

.btn-like,
.btn-donate {
    background-color: var(--s-2);
    color: var(--t-1);
}

/* ===================================================================
   8. 卡片（视频/内容网格）—— 无边框，悬停提亮 + 缩放
   =================================================================== */

.video-card {
    background-color: transparent;
}

/* 圆角与 theme-enhance.css 第 6 节保持一致（--radius-lg）。
   本文件在其后加载且特异性相同（0,2,0），此处若写 --radius 会把卡片
   圆角压回 6px，等于反向覆盖——踩过一次，勿改小。 */
.video-card .video-thumb {
    background-color: var(--s-2);
    border-radius: var(--radius-lg);
    box-shadow: none;
    overflow: hidden;
}

.video-card .video-title a {
    color: var(--t-1);
    font-weight: 500;
}

.video-card .video-meta {
    color: var(--t-3);
}

/* 卡片悬停的 transform 统一由 theme-enhance.css 定义；此处只加颜色反馈。
   勿给 .video-thumb 再加 transform：会与图片自身的 scale 复合成两段错位位移。 */
@media (hover: hover) and (pointer: fine) {
    .video-card:hover .video-title a {
        color: var(--accent-hi);
    }
}

@media (hover: none) {
    .video-card:active .video-thumb {
        opacity: .75;
    }
}

/* 时长/清晰度角标：形状与底色由 theme-enhance.css 第 6 节统一（胶囊 +
   半透明深底 + 模糊），深色下无需再改底色——角标本就压在图片上，
   与主题底色无关。
   清晰度原为实心 var(--accent) 红底白字，像贴在封面上的贴纸；现改为
   与时长同一形态，仅靠位置（左上/右下）区分，图面更干净。 */
.video-card .video-duration,
.video-card .video-resolution {
    color: #fff;
}

/* ===================================================================
   9. 首页板块与分类菜单
   =================================================================== */

.category-nav {
    border-bottom-color: var(--c-line);
}

.category-nav a {
    background-color: var(--s-1);
    color: var(--t-2);
    border: none;
}

@media (hover: hover) and (pointer: fine) {
    .category-nav a:hover {
        background-color: var(--accent);
        color: #fff;
    }
}

/* 板块头（重构后结构：block-head 容器 + 标题/子分类/筛选/更多） */
.index-block .block-head {
    border-bottom-color: var(--c-line);
}

.index-block .block-head .block-title > a {
    color: var(--t-1);
    /* 字重加大，深色下更有力量 */
    font-weight: 700;
    letter-spacing: .01em;
}

.index-block .block-head .block-more {
    color: var(--t-3);
}

/* 子分类 chip */
.index-block .block-subs a {
    background-color: var(--s-1);
    color: var(--t-2);
}

/* 筛选切换控件 */
.index-block .block-tabs {
    background-color: var(--s-1);
}

.index-block .block-tabs button {
    color: var(--t-2);
}

.index-block .block-tabs button.is-active {
    background-color: var(--accent);
    color: #fff;
}

@media (hover: hover) and (pointer: fine) {
    .index-block .block-subs a:hover {
        background-color: var(--s-2);
        color: var(--accent-hi);
    }

    /* 覆盖浅色层的 rgba(0,0,0,.04)：深色下叠黑不可见，须改为提亮 */
    .index-block .block-tabs button:not(.is-active):hover {
        background-color: var(--s-2);
        color: var(--t-1);
    }

    .index-block .block-head .block-more:hover {
        color: var(--accent-hi);
    }
}

/* ===================================================================
   10. 通栏焦点图
   =================================================================== */

.index-focus-full {
    background-color: #000;
}

.index-focus-full .carousel-caption h2 {
    color: #fff;
    font-weight: 700;
}

.carousel-indicators li {
    background-color: rgba(255, 255, 255, .3);
    border: none;
}

.carousel-indicators .active {
    background-color: var(--accent);
    border: none;
}

.carousel-control {
    color: #fff;
    text-shadow: none;
}

/* ===================================================================
   11. 列表页
   =================================================================== */

.list-header .breadcrumb,
.breadcrumb {
    background-color: transparent;
    color: var(--t-3);
}

.breadcrumb > li + li::before {
    color: var(--t-3);
}

.breadcrumb a {
    color: var(--t-3);
}

@media (hover: hover) and (pointer: fine) {
    .breadcrumb a:hover {
        color: var(--accent-hi);
    }
}

.list-title {
    color: var(--t-1);
    font-weight: 700;
}

.list-desc {
    color: var(--t-2);
}

.list-toolbar {
    border-bottom-color: var(--c-line);
}

.list-toolbar .toolbar-title {
    color: var(--t-1);
}

.list-toolbar .list-order a {
    color: var(--t-2);
}

.list-toolbar .list-order a.active {
    background-color: var(--accent);
    color: #fff;
}

.list-filter .filter-label {
    color: var(--t-3);
}

.list-filter .filter-items a {
    color: var(--t-2);
}

.list-filter .filter-items a.active {
    background-color: var(--accent-soft);
    color: var(--accent-hi);
}

/* 筛选面板（插件 tabs 结构） */
.tabs-wrapper .tabs-group {
    border-color: var(--c-line);
}

.tabs-wrapper .tabs-group .title {
    color: var(--t-3);
}

.tabs-wrapper .tabs-group .content > li > a {
    color: var(--t-2);
}

.tabs-wrapper .tabs-group .content > li.active > a {
    background-color: var(--accent-soft);
    color: var(--accent-hi);
}

/* 列表底部内链 */
.list-footer {
    border-top-color: var(--c-line);
}

/* ===================================================================
   12. 文章列表（media 结构）
   =================================================================== */

/* 容器本体：common.css 给 .article-list 写了 background:#fff，此前深色层只改了
   它的子元素（标题/摘要/标签/缩略图底），漏了容器自身，于是列表整片是白底。
   透明化让所在面板（.tab-inner / .panel）的底色透出，而非再指定一个具体色 ——
   该组件同时用于会员主页、搜索、专题、下载列表，各处外层面板底色不同。 */
.article-list {
    background-color: transparent;
}

.article-list .article-item {
    border-bottom-color: var(--c-line);
}

.article-list .article-title a {
    color: var(--t-1);
}

.article-list .article-intro {
    color: var(--t-2);
}

.article-list .article-tag {
    color: var(--t-3);
}

.article-list .media-left a {
    background-color: var(--s-2);
}

/* 侧栏排行 media-number */
.media-number .num.tag {
    background-color: var(--s-2);
    color: var(--t-3);
    border: none;
}

.media-number:nth-child(-n+3) .num.tag {
    background-color: var(--accent);
    color: #fff;
}

/* ===================================================================
   13. 标签（tag 高频出现 213 次）
   =================================================================== */

.tag,
a.tag {
    background-color: var(--s-2);
    color: var(--t-2);
    border: none;
}

@media (hover: hover) and (pointer: fine) {
    a.tag:hover {
        background-color: var(--accent);
        color: #fff;
        text-decoration: none;
    }
}

.tag-primary {
    background-color: var(--accent-soft);
    color: var(--accent-hi);
}

.hot-tags .tags a.tag {
    background-color: var(--s-2);
}

.label {
    background-color: var(--s-2);
    color: var(--t-2);
}

.badge {
    background-color: var(--s-2);
    color: var(--t-2);
}

/* ===================================================================
   14. 详情页
   =================================================================== */

.article-content .article-metas {
    border-bottom-color: var(--c-line);
}

.article-content .metas-title {
    color: var(--t-1);
    font-weight: 700;
}

.article-content .metas-body {
    color: var(--t-3);
}

.entry-meta {
    color: var(--t-2);
}

.entry-meta ul > li {
    border-color: var(--c-line);
    color: var(--t-2);
}

.entry-meta .article-prevnext {
    border-top-color: var(--c-line);
}

.entry-meta .article-prevnext > li {
    border-bottom-color: var(--c-line);
}

.entry-meta .article-prevnext > li > span {
    color: var(--t-3);
}

/* 通用表格 */
.table {
    color: var(--t-1);
}

.table > thead > tr > th,
.table > tbody > tr > td,
.table > tbody > tr > th {
    border-color: var(--c-line);
}

.table-striped > tbody > tr:nth-of-type(odd) {
    background-color: rgba(255, 255, 255, .02);
}

@media (hover: hover) and (pointer: fine) {
    .table-hover > tbody > tr:hover {
        background-color: var(--s-2);
    }
}

/* 相关推荐 */
.related-article .related-title a {
    color: var(--t-2);
}

@media (hover: hover) and (pointer: fine) {
    .related-article .related-title a:hover {
        color: var(--accent-hi);
    }
}

.section-title {
    color: var(--t-1);
    border-bottom-color: var(--c-line);
    font-weight: 600;
}

/* 打赏区 */
.article-donate {
    background-color: var(--s-1);
    border: none;
}

/* ===================================================================
   15. 评论区
   =================================================================== */

.comment-list .media,
.comment-item {
    border-bottom-color: var(--c-line);
}

.comment-list .media-heading,
.comment-item .name {
    color: var(--t-1);
}

.comment-list .comment-content {
    color: var(--t-2);
}

.comment-list .comment-meta,
.comment-item .time {
    color: var(--t-3);
}

.comment-num,
.views-num,
.like-num {
    color: var(--t-3);
}

/* ===================================================================
   16. 分页
   =================================================================== */

.pager .pagination > li > a,
.pager .pagination > li > span,
.pagination > li > a,
.pagination > li > span {
    background-color: var(--s-1);
    border: none;
    color: var(--t-2);
    margin: 0 3px;
    border-radius: var(--radius-sm);
}

@media (hover: hover) and (pointer: fine) {
    .pagination > li > a:hover,
    .pagination > li > span:hover {
        background-color: var(--s-2);
        color: var(--t-1);
    }
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover {
    background-color: var(--accent);
    border: none;
    color: #fff;
}

.pagination > .disabled > a,
.pagination > .disabled > span {
    background-color: var(--s-1);
    color: var(--t-3);
    opacity: .5;
}

/* 加载更多提示条 */
.loadmore {
    color: var(--t-3);
}

.loadmore-line .loadmore-tips {
    background-color: var(--s-0);
    color: var(--t-3);
}

.loadmore-line::before,
.loadmore-line::after {
    border-color: var(--c-line);
    background-color: var(--c-line);
}

/* ===================================================================
   17. 浮动按钮与移动端底栏
   ------------------------------------------------------------------
   注：上一轮 theme-enhance.css 把 .mobile-tabbar 设为近白底，
   深色下必须翻转，否则底栏刺眼且图标不可见。
   =================================================================== */

#floatbtn > a,
#floatbtn .floatbtn-item {
    background-color: var(--s-1);
    border: none;
    color: var(--t-2);
}

#floatbtn > a i,
#floatbtn .floatbtn-item i {
    color: var(--t-2);
}

#floatbtn > a em {
    color: var(--t-3);
}

@media (hover: hover) and (pointer: fine) {
    #floatbtn > a.hover:hover,
    #floatbtn .floatbtn-item.hover:hover {
        background-color: var(--accent);
    }

    #floatbtn > a.hover:hover i,
    #floatbtn > a.hover:hover em {
        color: #fff;
    }
}

.floatbtn-wrapper {
    background-color: var(--s-3);
    border: 1px solid var(--c-line);
    color: var(--t-2);
    box-shadow: var(--shadow-2);
}

.floatbtn-wrapper::before,
.floatbtn-wrapper::after {
    border-left-color: var(--s-3);
    border-right-color: var(--s-3);
}

.floatbtn-wrapper p {
    color: var(--t-2);
}

@media (max-width: 767px) {
    .mobile-tabbar {
        background-color: rgba(11, 11, 13, .96);
        border-top: 1px solid var(--c-line);
        box-shadow: 0 -1px 12px rgba(0, 0, 0, .5);
    }

    .mobile-tabbar > a {
        color: var(--t-3);
    }

    .mobile-tabbar > a.active {
        color: var(--accent-hi);
    }

    .mobile-tabbar > a:active {
        background-color: rgba(255, 255, 255, .05);
    }
}

/* ===================================================================
   18. 页脚
   =================================================================== */

footer,
#footer {
    background-color: var(--s-1);
    border-top: 1px solid var(--c-line);
    color: var(--t-3);
}

footer a,
#footer a {
    color: var(--t-2);
}

@media (hover: hover) and (pointer: fine) {
    footer a:hover {
        color: var(--accent-hi);
    }
}

/* 页脚三列（重构后结构） */
.footer-col h3 {
    color: var(--t-1);
}

.footer-desc {
    color: var(--t-2);
}

.footer-inner .links li a {
    color: var(--t-2);
}

@media (hover: hover) and (pointer: fine) {
    .footer-inner .links li a:hover {
        color: var(--accent-hi);
    }
}

.footer-bottom {
    border-top-color: var(--c-line);
    color: var(--t-3);
}

/* 导航搜索框：深色下须为浅色表面，否则与导航栏融为一体不可辨 */
.navbar .nav-search .form-search input[type=search] {
    background-color: rgba(255, 255, 255, .07);
    color: var(--t-1);
}

.navbar .nav-search .form-search input[type=search]:hover {
    background-color: rgba(255, 255, 255, .1);
}

.navbar .nav-search .form-search input[type=search]:focus {
    background-color: rgba(255, 255, 255, .12);
    color: var(--t-1);
}

.navbar .nav-search .form-search input::-webkit-input-placeholder {
    color: var(--t-3);
}

.navbar .nav-search .form-search input::-moz-placeholder {
    color: var(--t-3);
}

/* ===================================================================
   19. 提示与弹窗
   =================================================================== */

.alert {
    border: none;
    background-color: var(--s-2);
    color: var(--t-1);
}

.alert-success {
    background-color: rgba(40, 167, 69, .16);
    color: #6ddc8b;
}

.alert-danger {
    background-color: rgba(224, 20, 60, .16);
    color: #ff8095;
}

.alert-warning {
    background-color: rgba(255, 193, 7, .14);
    color: #ffd662;
}

.alert-info {
    background-color: rgba(13, 110, 253, .14);
    color: #7db1ff;
}

/* Bootstrap 弹窗 */
.modal-content {
    background-color: var(--s-1);
    border: 1px solid var(--c-line);
    box-shadow: var(--shadow-2);
}

.modal-header,
.modal-footer {
    border-color: var(--c-line);
}

.modal-backdrop {
    background-color: #000;
}

.close {
    color: var(--t-1);
    text-shadow: none;
    opacity: .6;
}

.close:hover {
    color: var(--t-1);
    opacity: 1;
}

/* layer 弹窗（fastadmin-layer 独立样式文件） */
.layui-layer {
    background-color: var(--s-1) !important;
    box-shadow: var(--shadow-2) !important;
    color: var(--t-1);
}

.layui-layer-title {
    background-color: var(--s-2) !important;
    border-bottom: 1px solid var(--c-line) !important;
    color: var(--t-1) !important;
}

.layui-layer-content {
    color: var(--t-1) !important;
}

.layui-layer-btn {
    border-top: 1px solid var(--c-line);
}

.layui-layer-btn a {
    background-color: var(--s-2);
    border: none;
    color: var(--t-1);
}

.layui-layer-btn .layui-layer-btn0 {
    background-color: var(--accent);
    color: #fff;
}

.layui-layer-setwin a {
    color: var(--t-2);
}

/* ===================================================================
   20. 图片：深色下略降亮度，减轻与暗背景的反差刺激
   ------------------------------------------------------------------
   缩略图是内容主体，仅做极轻微处理，悬停恢复全亮。
   =================================================================== */

/* 缩略图降亮改由 theme-enhance.css 的遮罩层（::after + opacity）实现：
   filter 动画不走合成器快路径，每帧触发重绘，叠在 transform 之上会掉帧。
   此处只给遮罩设定深色下的初始不透明度，不参与任何过渡计算。 */
.video-card .video-thumb {
    --thumb-veil: .07;
}

/* 列表缩略图与相关推荐无缩放动画，可直接用静态 filter（不过渡） */
.article-list .media-left img,
.related-article img {
    filter: brightness(.94);
}

/* 懒加载占位背景 */
img[loading="lazy"] {
    background-color: var(--s-2);
}

/* 热门导航图标墙：深色下需提亮而非降亮 */
.list-partner img {
    filter: brightness(.9);
    opacity: 1;
}

@media (hover: hover) and (pointer: fine) {
    .list-partner img:hover {
        filter: brightness(1.05);
    }
}

/* ===================================================================
   21. 滚动条与选中态
   =================================================================== */

::selection {
    background-color: var(--accent);
    color: #fff;
}

@media (min-width: 768px) {
    ::-webkit-scrollbar {
        width: 10px;
        height: 10px;
    }

    ::-webkit-scrollbar-track {
        background-color: var(--s-0);
    }

    ::-webkit-scrollbar-thumb {
        background-color: #2e2e3a;
        border-radius: 5px;
        border: 2px solid var(--s-0);
    }

    ::-webkit-scrollbar-thumb:hover {
        background-color: #3d3d4c;
    }
}

/* 键盘焦点：深色下用强调色轮廓 */
a:focus-visible,
button:focus-visible,
input:focus-visible,
.btn:focus-visible {
    outline: 2px solid var(--accent-hi);
    outline-offset: 2px;
}

.skip-to-content {
    background-color: var(--s-3);
    color: var(--t-1);
}

/* 表单自动填充：覆盖浏览器强制的白底 */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--t-1);
    -webkit-box-shadow: 0 0 0 1000px var(--s-2) inset;
    caret-color: var(--t-1);
}

/* ===================================================================
   22. 高对比偏好
   =================================================================== */

@media (prefers-contrast: more) {
    :root {
        --t-2: #cfcfd6;
        --t-3: #9a9aa4;
        --c-line: rgba(255, 255, 255, .18);
    }
}

/* ===================================================================
   23. 交叉核对补漏
   ------------------------------------------------------------------
   以「实际渲染出的 class」逐项比对覆盖情况后发现的两处遗漏。
   （另有 4 项经核实为误报：navbar-userinfo / hot-article 不含颜色声明；
   panel-body 的浅色仅存在于未渲染的 panel-primary/panel-gray 变体；
   dropdown-toggle 的浅色仅在 .open > .dropdown-toggle.btn-default 组合下生效，
   本站该元素并非按钮。）
   =================================================================== */

/* bootstrap 的 .navbar-default .navbar-form 带 #e7e7e7 浅灰边框 */
.navbar-default .navbar-form,
.navbar-white .navbar-form {
    border-color: transparent;
    box-shadow: none;
}

/* 注：原 .footer-inner .footer-logo 规则已随页脚重构删除
   （该元素已不在模板中，属死代码）。 */

/* 防御性：面板内的表格分隔线与折叠面板边框（bootstrap 默认 #ddd） */
.panel > .panel-body + .table,
.panel > .table + .panel-body,
.panel-group .panel-heading + .panel-collapse > .panel-body {
    border-color: var(--c-line);
}

/* 防御性：若下拉按钮以 btn-default 形态出现，展开态不应回到浅灰 */
.open > .dropdown-toggle.btn-default,
.open > .dropdown-toggle.btn-default:hover,
.open > .dropdown-toggle.btn-default:focus {
    background-color: var(--s-3);
    border-color: transparent;
    color: var(--t-1);
}

/* ===================================================================
   24. 特异性修正
   ------------------------------------------------------------------
   以下规则此前因特异性不足而失效，被 common.css 的 ID 级选择器压制。
   媒体查询与加载顺序都不增加特异性，必须以同等或更高特异性重写。
   =================================================================== */

/* 面板头部的面包屑：common.css 用
   .article-content > .panel-heading > .breadcrumb {background:#fff} (0,3,0)，
   而深色层原先只写 .breadcrumb (0,1,0)，故头部出现白底。 */
.article-content > .panel-heading > .breadcrumb,
.panel-heading > .breadcrumb,
.panel-heading .breadcrumb {
    background-color: transparent;
    background: none;
}

/* ===================================================================
   25. 评论区（需 #comment-container 前缀才能覆盖 common.css）
   =================================================================== */

/* common.css: #comment-container h3 {background:#fff} —— 评论区白底的来源 */
#comment-container h3,
#comment-container #postcomment h3 {
    background: none;
    background-color: transparent;
    color: var(--t-1);
}

#comment-container #commentlist dl {
    border-bottom-color: var(--c-line);
}

#comment-container #commentlist dl dd cite a {
    color: var(--t-1);
}

@media (hover: hover) and (pointer: fine) {
    #comment-container #commentlist dl dd cite a:hover {
        color: var(--accent-hi);
    }
}

#comment-container #commentlist dl dd small {
    color: var(--t-3);
}

#comment-container #commentlist dl dd small a.reply {
    color: var(--accent);
}

#comment-container #commentlist dl dd p {
    color: var(--t-1);
}

/* @提及：原为 #e5f2ff 浅蓝底 + #007bff 亮蓝字，深色下刺眼 */
#comment-container #commentlist dl dd p em {
    color: var(--accent-hi);
    background: var(--accent-soft);
    font-style: normal;
}

#comment-container #commentlist dl dd dl {
    border-top-color: var(--c-line);
    border-left-color: var(--c-line);
}

#comment-container #postcomment {
    border-top-color: var(--c-line);
}

#comment-container #postcomment textarea.form-control {
    background-color: var(--s-2);
    border-color: transparent;
    color: var(--t-1);
}

#comment-container #postcomment textarea.form-control:focus {
    background-color: var(--s-2);
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
}

#comment-container #postcomment .checkbox label {
    color: var(--t-2);
}

#comment-container #actiontips {
    color: var(--t-2);
}

#comment-container .loadmore-tips {
    background-color: var(--s-1);
    color: var(--t-3);
}

/* 相关推荐（重构后新增的类，深色层此前无覆盖） */
.related-item {
    border-bottom-color: var(--c-line);
}

.related-thumb {
    background-color: var(--s-2);
}

.related-title a {
    color: var(--t-1);
}

.related-meta {
    color: var(--t-3);
}

@media (hover: hover) and (pointer: fine) {
    .related-title a:hover {
        color: var(--accent-hi);
    }
}

/* 详情页元信息（重构后新增的类） */
.meta-facts {
    background-color: var(--s-2);
}

.meta-facts > dt {
    color: var(--t-3);
}

.meta-facts > dd {
    color: var(--t-1);
}

.entry-nav-item {
    background-color: var(--s-2);
    color: var(--t-1);
}

.entry-nav-item .nav-label {
    color: var(--t-3);
}

/* 列表页分类切换（深色） */
.cate-switch a {
    background-color: var(--s-1);
    color: var(--t-2);
}

.cate-switch a.is-active {
    background-color: var(--accent);
    color: #fff;
}

@media (hover: hover) and (pointer: fine) {
    .cate-switch a:not(.is-active):hover {
        background-color: var(--s-2);
        color: var(--accent-hi);
    }
}

/* 工具条重构后的深色覆盖（第 30 节）
   注：特异性须匹配 theme-enhance 中的对应规则 */
.list-toolbar .list-order {
    background-color: var(--s-1);
}

.list-toolbar .list-order a {
    color: var(--t-2);
    background-color: transparent;
}

.list-toolbar .list-order a.active {
    background-color: var(--accent);
    color: #fff;
}

.list-filter .filter-items a {
    background-color: transparent;
}

.list-filter .filter-items a.active {
    color: var(--accent-hi);
    background-color: transparent;
    border-bottom-color: var(--accent);
}

@media (hover: hover) and (pointer: fine) {
    /* 浅色层用 rgba(0,0,0,.05)，深色下叠黑不可见，须改为提亮 */
    .list-toolbar .list-order a:not(.active):hover {
        background-color: var(--s-2);
        color: var(--t-1);
    }
}

/* 筛选区堆叠块（第 31 节）深色覆盖 */
.list-toolbar .list-filter {
    border-top-color: var(--c-line);
}

.list-filter .filter-label {
    color: var(--t-3);
}

.list-filter .filter-items a {
    color: var(--t-2);
    background-color: transparent;
}

.list-filter .filter-items a.active {
    color: var(--accent-hi);
    background-color: transparent;
    border-bottom-color: var(--accent);
}

.filter-more {
    color: var(--accent-hi);
}

@media (hover: hover) and (pointer: fine) {
    .list-filter .filter-items a:not(.active):hover {
        color: var(--accent-hi);
    }
}

/* 视频详情页（深色覆盖） */
.video-head,
.video-actions {
    border-bottom-color: var(--c-line);
}

.video-h1 {
    color: var(--t-1);
}

.video-facts {
    color: var(--t-3);
}

.video-actions .act-btn {
    background-color: var(--s-1);
    color: var(--t-2);
}

@media (hover: hover) and (pointer: fine) {
    .video-actions .act-btn:hover {
        background-color: var(--s-2);
        color: var(--accent-hi);
    }
}

/* 文章频道封面焦点区（深色） */
.focus-hero .focus-main,
.focus-hero .focus-item {
    background-color: var(--s-2);
}

.block-head .block-count {
    background-color: var(--s-1);
    color: var(--t-2);
}

/* ===================================================================
   26. 侧栏推荐板块（深色）
   ------------------------------------------------------------------
   板块外框与文字色均走设计令牌已自动适配，此处只需把标题悬停色
   统一为全站的强调高亮色（浅色层用的是 --c-accent）。
   =================================================================== */

@media (hover: hover) and (pointer: fine) {
    .sr-title:hover {
        color: var(--accent-hi);
    }
}

/* ===================================================================
   27. 会员中心 / 登录 / 注册（index 模块用户页）
   ------------------------------------------------------------------
   用户模块页面（application/index/view/user/*）原本只加载 FastAdmin
   核心的 frontend.css + user.css（浅色），不加载本站主题 CSS。现于
   layout/default.html 引入 theme-enhance.css + theme-dark.css 后，
   body / 导航 / 下拉 / 面板 / 表单 / 按钮等基础件已由上文规则自动转深。
   本节仅需覆盖 frontend.css / user.css 中「硬编码浅色」的用户页专属组件：
     - .user-section      登录 / 注册卡片（#fff）
     - .logon-tab         登录 / 注册顶部分页（#efefef / #fff）
     - .sidenav           会员侧栏（#fff + #007bff 高亮）
     - .avatar-img        头像占位底（#e8ecf3）
     - .page-header       面板标题分隔线（#f5f5f5）
     - footer.footer      页脚（#555 / #393939）
     - .btn-info          「修改 / 获取验证码」次按钮（Bootstrap 浅蓝）
   =================================================================== */

/* 登录 / 注册卡片：表面 + 极细描边，与全站面板一致 */
.user-section {
    background-color: var(--s-1);
    border: 1px solid var(--c-line);
    border-radius: var(--radius);
    box-shadow: var(--shadow-1);
}

/* 顶部分页：活动项 = 底部强调条 + 高亮文字，非活动项 = 透明 + 弱文字 */
.login-section .logon-tab {
    border-bottom: 1px solid var(--c-line);
}

.login-section .logon-tab > a {
    color: var(--t-3);
    background-color: transparent;
}

.login-section .logon-tab > a:hover {
    color: var(--t-1);
    background-color: rgba(255, 255, 255, .03);
}

.login-section .logon-tab > a.active {
    color: var(--t-1);
    background-color: transparent;
    box-shadow: inset 0 -2px 0 var(--accent);
}

/* 会员侧栏：表面 + 描边；激活项走强调色 */
.sidenav {
    background-color: var(--s-1);
    border: 1px solid var(--c-line);
    border-radius: var(--radius);
}

/* 关键：Bootstrap .list-group-item 自带 background:#fff，而 frontend.css
   只清了 border 没清背景，导致每项仍是一片白。此处透明化让容器底色透出。 */
.sidenav .list-group .list-group-item {
    background-color: transparent;
}

.sidenav .list-group .list-group-heading {
    color: var(--t-3);
}

.sidenav .list-group .list-group-item > a {
    color: var(--t-2);
}

.sidenav .list-group .list-group-item:hover {
    background-color: rgba(255, 255, 255, .03);
    border-left-color: rgba(255, 255, 255, .12);
}

.sidenav .list-group .list-group-item.active {
    background-color: var(--accent-soft);
    border-left: 2px solid var(--accent);
}

.sidenav .list-group .list-group-item.active > a {
    color: var(--accent-hi);
}

/* 头像占位底：无图时的浅灰圆底改深色表面 */
.avatar-text,
.avatar-img {
    background-color: var(--s-3);
    color: var(--t-2);
}

/* 面板标题分隔线（Bootstrap 默认 #eee / 核心 #f5f5f5） */
.page-header,
.panel-default h2.page-header {
    border-bottom-color: var(--c-line);
}

/* 「修改 / 获取验证码」次按钮：Bootstrap .btn-info 浅蓝 → 深色次按钮 */
.btn-info {
    background-color: var(--s-3);
    border-color: transparent;
    color: var(--t-2);
}

@media (hover: hover) and (pointer: fine) {
    .btn-info:hover,
    .btn-info:focus {
        background-color: var(--s-3);
        color: var(--t-1);
    }
}

/* 页脚（用户模块为单行版权条，非 CMS 三列页脚） */
footer.footer {
    background-color: var(--s-1);
    border-top: 1px solid var(--c-line);
    color: var(--t-3);
}

footer.footer .copyright {
    background-color: transparent;
    color: var(--t-3);
}

footer.footer .copyright a {
    color: var(--t-2);
}

@media (hover: hover) and (pointer: fine) {
    footer.footer .copyright a:hover {
        color: var(--accent-hi);
    }
}

/* 弹窗表单底栏（改邮箱 / 手机号的 Layer 弹窗；模板内联 #ecf0f1 已改 var(--s-1)） */
.form-layer .form-footer {
    background-color: var(--s-1);
    border-top: 1px solid var(--c-line);
}

/* 移动端汉堡按钮：frontend.css 的 .navbar-white .navbar-toggle（0,2,0）
   与 .icon-bar（0,3,0）均高于上文 .navbar-toggle（0,1,0），须同量级覆盖，
   否则深色导航上残留浅灰描边与浅灰横条。 */
.navbar-white .navbar-toggle {
    border-color: var(--c-line);
}

.navbar-white .navbar-toggle .icon-bar {
    background-color: var(--t-2);
}

/* ===================================================================
   28. 全局深色扫尾：一次性覆盖散落的浅色表面
   ------------------------------------------------------------------
   「为什么很多页面反复出现白底」——浅色来自三个层面，且都不在本站模板里：
     1. 浏览器原生控件（<select> 下拉列表、checkbox/radio、日期、滚动条、
        自动填充）—— 由操作系统渲染，逐条 CSS 改不掉；已用
        html{color-scheme:dark}（第 1 节）一句话整体切换。
     2. Bootstrap 写死的浅色表面（.list-group-item、.thumbnail、.nav-tabs、
        .popover、.label、.badge、.jumbotron 等）—— 本节统一覆盖。
     3. 第三方插件自带浅色（bootstrap-tagsinput、autocomplete、
        bootstrap-select、selectpage 等）—— 本节一并覆盖。
   以后再发现白底：若属原生控件则已被 color-scheme 覆盖；否则把对应选择器
   追加到本节即可，无需再零散散落各处。
   =================================================================== */

/* --- Bootstrap 浅色表面 --- */

/* 列表组：Bootstrap .list-group-item 默认 #fff，全局透明化让容器底色透出 */
.list-group-item {
    background-color: transparent;
    border-color: var(--c-line);
    color: var(--t-1);
}

.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
    background-color: var(--accent-soft);
    border-color: var(--accent);
    color: var(--accent-hi);
}

/* 缩略图 / 巨幕 */
.thumbnail {
    background-color: var(--s-1);
    border-color: var(--c-line);
}

.jumbotron {
    background-color: var(--s-1);
    color: var(--t-1);
}

/* 标签 / 徽章（Bootstrap 默认灰 / 蓝） */
.label-default {
    background-color: var(--s-3);
    color: var(--t-2);
}

.badge {
    background-color: var(--s-3);
    color: var(--t-2);
}

/* 标签页 */
.nav-tabs {
    border-bottom-color: var(--c-line);
}

.nav-tabs > li > a {
    color: var(--t-2);
}

.nav-tabs > li > a:hover,
.nav-tabs > li > a:focus {
    background-color: var(--s-2);
    border-color: var(--c-line);
    color: var(--t-1);
}

.nav-tabs > li.active > a,
.nav-tabs > li.active > a:hover,
.nav-tabs > li.active > a:focus {
    background-color: var(--s-1);
    border-color: var(--c-line);
    border-bottom-color: transparent;
    color: var(--t-1);
}

/* 气泡 */
.popover {
    background-color: var(--s-3);
    border-color: var(--c-line);
}

.popover-title {
    background-color: var(--s-2);
    border-bottom-color: var(--c-line);
    color: var(--t-1);
}

.popover-content {
    color: var(--t-2);
}

.popover.top > .arrow,
.popover.top > .arrow:after {
    border-top-color: var(--s-3);
}

/* --- 第三方插件浅色 --- */

/* bootstrap-tagsinput（标签输入框，frontend.css #fff/#ccc/#555） */
.bootstrap-tagsinput {
    background-color: var(--s-2);
    border-color: var(--c-line);
    color: var(--t-1);
    box-shadow: none;
}

.bootstrap-tagsinput input {
    color: var(--t-1);
}

.bootstrap-tagsinput input::-webkit-input-placeholder,
.bootstrap-tagsinput input::-moz-placeholder {
    color: var(--t-3);
}

.bootstrap-tagsinput .tag {
    background-color: var(--accent-soft);
    color: var(--accent-hi);
}

.bootstrap-tagsinput .tag [data-role="remove"]:hover {
    background-color: rgba(255, 255, 255, .16);
}

/* jQuery tagsinput（标签输入：div.tagsinput 容器）
   注意：jquery.tagsinput.min.css 经 RequireJS css! 在运行时动态注入 <head>，
   晚于本主题静态样式，故此处颜色声明一律加 !important 才能压过插件白底。 */
div.tagsinput {
    background-color: var(--s-2) !important;
    border-color: var(--c-line) !important;
    color: var(--t-1) !important;
    box-shadow: none !important;
}

div.tagsinput input {
    color: var(--t-1) !important;
    background: transparent !important;
}

div.tagsinput span.tag {
    color: var(--accent-hi) !important;
    background: var(--accent-soft) !important;
    border-color: var(--accent) !important;
}

div.tagsinput span.tag a {
    color: var(--accent-hi) !important;
}

div.tagsinput input::-webkit-input-placeholder,
div.tagsinput input::-moz-placeholder {
    color: var(--t-3) !important;
}

/* jQuery autocomplete（标题联想 / 标签联想，插件自带 white） */
.autocomplete-suggestions {
    background-color: var(--s-3) !important;
    border-color: var(--c-line) !important;
    box-shadow: var(--shadow-2) !important;
}

.autocomplete-suggestions .autocomplete-suggestion,
.autocomplete-tags .autocomplete-suggestion {
    color: var(--t-2) !important;
}

.autocomplete-suggestions .autocomplete-suggestion strong {
    color: var(--t-1) !important;
    font-weight: 600;
}

.autocomplete-suggestions .autocomplete-suggestion.selected,
.autocomplete-suggestions .autocomplete-suggestion:hover,
.autocomplete-tags .autocomplete-suggestion.selected,
.autocomplete-tags .autocomplete-suggestion:hover,
.autocomplete-search .autocomplete-questions.selected,
.autocomplete-search .autocomplete-questions:hover {
    background-color: var(--s-2) !important;
}

/* bootstrap-select（下拉选择）：占位文字、展开描边、无结果、搜索框 */
.bootstrap-select > .dropdown-toggle.bs-placeholder,
.bootstrap-select > .dropdown-toggle.bs-placeholder:hover,
.bootstrap-select > .dropdown-toggle.bs-placeholder:focus,
.bootstrap-select > .dropdown-toggle.bs-placeholder:active {
    color: var(--t-3);
}

.bootstrap-select .dropdown-toggle:focus {
    outline: none !important;
}

.bootstrap-select .dropdown-menu {
    border-color: var(--c-line);
    box-shadow: var(--shadow-2);
}

.bootstrap-select .dropdown-menu.inner > li > a {
    color: var(--t-2);
}

.bootstrap-select .dropdown-menu.inner > li > a:hover,
.bootstrap-select .dropdown-menu.inner > li.selected > a,
.bootstrap-select .dropdown-menu.inner > li.selected > a:hover {
    background-color: var(--s-2);
    color: var(--t-1);
}

.bootstrap-select .no-results,
.bootstrap-select .dropdown-menu .notify {
    background: var(--s-2);
    border-color: var(--c-line);
    color: var(--t-3);
}

.bootstrap-select .bs-searchbox input {
    background-color: var(--s-2);
    border-color: var(--c-line);
    color: var(--t-1);
}

/* selectpage（选择分页下拉，FastAdmin 插件） */
.selectpage .dropdown-menu {
    background-color: var(--s-3);
    border-color: var(--c-line);
}

.selectpage .dropdown-menu > li > a {
    color: var(--t-2);
}

.selectpage .dropdown-menu > li > a:hover,
.selectpage .dropdown-menu > li.active > a {
    background-color: var(--s-2);
    color: var(--t-1);
}

/* ===================================================================
   29. 发布/投稿页控件白底：缩略图·组图·标签·内容
   ------------------------------------------------------------------
   「发布文档」页四个控件的白底来源：
     1. 缩略图 / 组图：上传按钮条在 `.input-group .input-group-addon` 里，
        fastadmin.css 用 `.input-group .input-group-addon`(0,2,0) 写了
        background:#fff，压过本节 `.input-group-addon`(0,1,0)，须同量级覆盖。
     2. 标签 / selectpage：FastAdmin selectpage 插件自带浅色
        （.sp_container/.sp_input/.sp_element_box 等，selectpage.css）。
     3. 内容：TinyMCE 5 oxide 皮肤自带白色 chrome（.tox-* 命名空间），
        + 编辑区 iframe 白底（需配合 addons.js 的 content_style 一起生效）。
   =================================================================== */

/* --- 缩略图 / 组图：上传按钮条 --- */
.input-group .input-group-addon {
    background-color: var(--s-3);
    border-color: transparent;
    color: var(--t-2);
}

.input-group .input-group-addon .btn {
    border-radius: 0;
}

/* --- 标签 / selectpage（选择分页下拉）--- */
.sp_container_combo,
div.sp_container_combo {
    border-color: var(--c-line);
    background-color: var(--s-2);
    box-shadow: none;
}

.sp_container .sp_input,
div.sp_container input.sp_input {
    background-color: var(--s-2);
    border-color: var(--c-line);
    color: var(--t-1);
    box-shadow: none;
}

.sp_container .sp_input:focus {
    border-color: var(--accent);
    box-shadow: 0 0 0 3px var(--accent-soft);
}

/* 下拉结果区 */
.sp_result_area,
.sp_results {
    background-color: var(--s-3);
    border-color: var(--c-line);
}

.sp_results > li {
    color: var(--t-2);
}

.sp_results > li.sp_over {
    background-color: var(--s-2) !important;
    color: var(--t-1) !important;
}

.sp_results > li.sp_selected {
    color: var(--t-3);
}

/* 多选标签盒 */
ul.sp_element_box li.selected_tag {
    background-color: var(--accent-soft);
    border-color: var(--accent);
    color: var(--accent-hi);
    box-shadow: none;
}

ul.sp_element_box li.selected_tag:hover {
    background-color: var(--s-3);
    border-color: var(--c-line);
    box-shadow: none;
}

ul.sp_element_box li.selected_tag i {
    color: var(--t-3);
}

ul.sp_element_box li.selected_tag i:hover {
    color: var(--accent-hi);
}

/* 清除按钮 / 控制条 / 分页条 */
div.sp_clear_btn {
    color: var(--t-3);
}

div.sp_clear_btn:hover {
    color: var(--t-1);
}

.sp_control_box button {
    background: var(--s-3) none;
    color: var(--t-2);
}

.sp_control_box:hover,
.sp_control_box:hover button {
    background-color: var(--s-2);
}

.sp_control_box:hover button:hover {
    background-color: var(--s-3);
    color: var(--t-1);
}

.sp_navi {
    background: var(--s-2);
    border-bottom-color: var(--c-line);
}

div.sp_result_area div.sp_pagination > ul > li > a {
    background-color: var(--s-3);
    color: var(--t-2);
}

div.sp_result_area div.sp_pagination > ul > li > a:hover {
    color: var(--t-1);
    background-color: var(--s-2);
}

div.sp_result_area div.sp_pagination > ul > li.disabled > a,
div.sp_result_area div.sp_pagination > ul > li.disabled > a:hover {
    color: var(--t-3);
    background-color: transparent;
}

/* 禁用态 */
div.sp_container_combo.sp_disabled,
div.sp_container_combo.sp_disabled ul.sp_element_box,
div.sp_container_combo.sp_disabled .sp_input,
div.sp_container.sp_disabled .sp_input {
    background-color: var(--s-1);
}

input.sp_combo_input[readonly],
input.sp_combo_input[disabled] {
    background-color: var(--s-2);
}

/* --- 内容：TinyMCE 5 oxide 皮肤 ---
   注意：oxide 的 skin.css 由 TinyMCE 在 init 时动态注入 <head>，晚于本主题
   静态样式，故此处颜色类声明一律加 !important 才能压过皮肤默认白底。 */
.tox-tinymce {
    border-color: var(--c-line) !important;
}

.tox .tox-editor-header {
    background-color: var(--s-1) !important;
}

/* 菜单栏 / 工具栏 / 状态栏白色表面（含其 svg 分隔线背景图） */
.tox .tox-menubar,
.tox .tox-toolbar,
.tox .tox-toolbar__primary,
.tox .tox-toolbar__overflow,
.tox .tox-toolbar-overlord {
    background-color: var(--s-1) !important;
    background-image: none !important;
}

.tox .tox-menubar + .tox-toolbar,
.tox .tox-menubar + .tox-toolbar-overlord .tox-toolbar__primary {
    border-top-color: var(--c-line) !important;
}

.tox .tox-statusbar {
    background-color: var(--s-1) !important;
    border-top-color: var(--c-line) !important;
    color: var(--t-3) !important;
}

.tox .tox-statusbar a,
.tox .tox-statusbar__path-item,
.tox .tox-statusbar__wordcount {
    color: var(--t-3) !important;
}

.tox .tox-statusbar__resize-handle svg {
    fill: var(--t-3) !important;
}

/* 菜单 / 工具栏按钮文字与图标（默认 #222f3e 深字，深色底上不可见） */
.tox .tox-mbtn,
.tox .tox-tbtn {
    color: var(--t-1) !important;
    background: transparent !important;
}

.tox .tox-mbtn svg,
.tox .tox-tbtn svg {
    fill: var(--t-1) !important;
}

.tox .tox-mbtn:hover,
.tox .tox-mbtn:focus,
.tox .tox-tbtn:hover,
.tox .tox-tbtn:focus {
    background: var(--s-2) !important;
    color: var(--t-1) !important;
}

.tox .tox-tbtn:hover svg,
.tox .tox-tbtn:focus svg {
    fill: var(--t-1) !important;
}

.tox .tox-mbtn:active,
.tox .tox-mbtn--active,
.tox .tox-tbtn:active,
.tox .tox-tbtn--enabled,
.tox .tox-tbtn--enabled:hover {
    background: var(--s-3) !important;
    color: var(--accent-hi) !important;
}

.tox .tox-tbtn:active svg,
.tox .tox-tbtn--enabled svg,
.tox .tox-tbtn--enabled:hover svg {
    fill: var(--accent-hi) !important;
}

.tox .tox-tbtn--disabled,
.tox .tox-tbtn--disabled:hover,
.tox .tox-tbtn:disabled,
.tox .tox-tbtn:disabled:hover {
    color: var(--t-3) !important;
}

.tox .tox-tbtn--disabled svg,
.tox .tox-tbtn--disabled:hover svg,
.tox .tox-tbtn:disabled svg,
.tox .tox-tbtn:disabled:hover svg {
    fill: var(--t-3) !important;
}

/* 编辑区 iframe：白底 → 深色（配合 addons.js content_style 一起生效） */
.tox .tox-edit-area__iframe {
    background-color: var(--s-1) !important;
}

/* 下拉菜单 / 弹出面板 */
.tox .tox-menu,
.tox .tox-pop__dialog,
.tox .tox-collection--list,
.tox .tox-collection--grid,
.tox .tox-collection--horizontal {
    background-color: var(--s-3) !important;
    border-color: var(--c-line) !important;
}

.tox .tox-collection__item {
    color: var(--t-2) !important;
}

.tox .tox-collection--list .tox-collection__item--enabled {
    background-color: var(--s-3) !important;
    color: var(--t-2) !important;
}

.tox .tox-collection--list .tox-collection__item--active,
.tox .tox-collection--toolbar .tox-collection__item--active,
.tox .tox-collection--grid .tox-collection__item--active:not(.tox-collection__item--state-disabled) {
    background-color: var(--s-2) !important;
    color: var(--t-1) !important;
}

.tox .tox-collection__item--state-disabled {
    color: var(--t-3) !important;
}

.tox .tox-collection__group-heading {
    background-color: var(--s-2) !important;
    color: var(--t-3) !important;
}

/* 对话框（插入链接 / 图片等） */
.tox .tox-dialog {
    background-color: var(--s-1) !important;
    border-color: var(--c-line) !important;
}

.tox .tox-dialog__header,
.tox .tox-dialog__footer {
    background-color: var(--s-1) !important;
}

.tox .tox-dialog__title {
    color: var(--t-1) !important;
}

.tox .tox-dialog__body {
    color: var(--t-2) !important;
}

/* 文本域（源码查看等） */
.tox .tox-textarea {
    background-color: var(--s-2) !important;
    color: var(--t-1) !important;
}

/* ===================================================================
   底部推荐区（listfooter 三栏 + 通栏标签带）
   ------------------------------------------------------------------
   .lf-* 的分隔线与文字色全部走 --c-line / --c-text 等语义令牌，本文件
   顶部已把它们重映射到深色值，故三栏形态无需再补色。
   此处只处理一处：三栏形态去掉了 .panel 外框，而 .panel 在深色下提供
   --s-1 底色；扁平化后区块直接坐在页面底色上（与 .index-block 一致，
   即预期效果），但标签 chip 用的 --s-2 与页面底色对比偏弱，故给标签带
   的 chip 提一档表面色，保证可点区域可辨。
   =================================================================== */

/* 货架形态已无分隔线（原三栏竖线 / 条目横线全部去掉，分层交给留白与
   悬停反馈），故此处不再需要提亮线色。 */

/* 文章条目悬停底色：--c-bg-soft 在深色下等于 --s-2(#1c1c24)，与页面底
   --s-0(#0b0b0d) 有足够反差，直接可用，无需覆盖。 */

.list-footer .lf-tags .tags a.tag {
    background-color: var(--s-2);
    color: var(--t-2);
}

/* 大档标签（nums>=100）加一点强调色，强化标签云的层次 */
.list-footer .lf-tags .tags a.tag.tag-lg {
    color: var(--t-1);
}

@media (hover: hover) and (pointer: fine) {
    .list-footer .lf-tags .tags a.tag:hover {
        background-color: var(--accent);
        color: #fff;
    }
}