/* ==========================================================================
   主题：黑夜 / 白天
   —— 默认沿用 main.css 的深色基调（:root 变量）
   —— html[data-theme="light"] 只覆盖「页面结构色」，不动压在图片上的白字
   切换逻辑见 js/theme.js，按钮由 js/site.js 渲染
   ========================================================================== */

:root {
    color-scheme: dark;
}

html[data-theme="light"] {
    color-scheme: light;

    /* 底色 / 分隔线 */
    --bg: #f4f5f7;
    --bg-2: #ffffff;
    --bg-3: #eceef1;
    --bg-4: #ffffff;
    --line: #e0e3e7;
    --line-2: #c9ced5;

    /* 品牌色：浅底上加深，保证对比度 */
    --gold: #977b2e;
    --gold-soft: rgba(151, 123, 46, .22);
    --blue: #0f7fc0;

    /* 文字 */
    --t1: #2c333a;
    --t2: #68727d;
    --t3: #7b848e;
}

/* ---------- 顶栏 ---------- */
html[data-theme="light"] .site-header {
    background: #fff;
    border-bottom-color: #e4e7ea;
}

html[data-theme="light"] .site-header.is-solid {
    background: rgba(255, 255, 255, .96);
    box-shadow: 0 6px 22px rgba(0, 0, 0, .08);
}

/* 原样式写死的白色标题，浅底上统一压深 */
html[data-theme="light"] .brand .names b,
html[data-theme="light"] .sec-head h2,
html[data-theme="light"] .notice-bar .tag,
html[data-theme="light"] .news-top .info h3,
html[data-theme="light"] .foot-links dt,
html[data-theme="light"] .side .side-head,
html[data-theme="light"] .side .side-box h3,
html[data-theme="light"] .col-info h3,
html[data-theme="light"] .article-head h1,
html[data-theme="light"] .article-body th {
    color: #1a1f24;
}

/* 下拉面板 */
html[data-theme="light"] .mega {
    background: #fff;
    box-shadow: 0 18px 30px rgba(0, 0, 0, .12);
}

html[data-theme="light"] .mega .col .links a {
    border-bottom-color: #e8eaee;
}

/* ---------- 首页 ---------- */
html[data-theme="light"] .news-top .pic,
html[data-theme="light"] .news-list .pic,
html[data-theme="light"] .gallery-grid a {
    background: #e6e9ed;
}

html[data-theme="light"] .news-list li {
    border-bottom-color: #e4e7ea;
}

/* ---------- 内页 ---------- */
html[data-theme="light"] .crumb {
    border-bottom-color: #e4e7ea;
}

html[data-theme="light"] .crumb .sep {
    color: #a8afb8;
}

html[data-theme="light"] .side .side-nav a {
    border-bottom-color: #e4e7ea;
}

html[data-theme="light"] .side .side-nav a.on {
    background: rgba(151, 123, 46, .1);
}

html[data-theme="light"] .art-list li {
    border-bottom-color: #e4e7ea;
}

html[data-theme="light"] .art-list li:hover {
    background: rgba(0, 0, 0, .025);
}

html[data-theme="light"] .pager .disabled {
    color: #a8afb8;
}

/* 社团活动 */
html[data-theme="light"] .club-card .pic,
html[data-theme="light"] .club-profile .pic {
    background: #e6e9ed;
}

html[data-theme="light"] .club-card .info h3,
html[data-theme="light"] .club-profile .txt h1 {
    color: #1a1f24;
}

/* ---------- 页脚 ---------- */
html[data-theme="light"] .site-footer {
    background: #eef0f3;
}

html[data-theme="light"] .foot-links {
    border-bottom-color: #e0e3e7;
}

html[data-theme="light"] .foot-qr .box {
    background: #fff;
}

html[data-theme="light"] .copyright {
    color: #838c96;
}

/* ---------- 返回顶部 ---------- */
html[data-theme="light"] .to-top {
    background: rgba(255, 255, 255, .95);
    box-shadow: 0 6px 18px rgba(0, 0, 0, .12);
}

/* ==========================================================================
   切换按钮（两种主题共用）
   ========================================================================== */
.theme-toggle {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    margin-left: 18px;
    padding: 0;
    color: var(--t2);
    background: transparent;
    border: 1px solid var(--line);
    border-radius: 50%;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    transition: color .2s, border-color .2s, background .2s;
}

.theme-toggle:hover {
    color: var(--gold);
    border-color: var(--gold);
}

.theme-toggle svg {
    display: block;
    width: 17px;
    height: 17px;
}

/* 深色模式显示「太阳」（点了切到白天），浅色模式显示「月亮」 */
.theme-toggle .i-moon {
    display: none;
}

html[data-theme="light"] .theme-toggle .i-sun {
    display: none;
}

html[data-theme="light"] .theme-toggle .i-moon {
    display: block;
}
