/* ============================================================
 * 前台浅色主题（v1.3.60）· html.site-light body 作用域
 * 后台「网站设置 → 外观主题」选择浅色模式时，由 header 模板给 <body> 加 site-light。
 * 范围：主要处理首页（Neko 深色 hero / 雨珠层）与全局文字对比度；
 *       其它前台页面本来就是白底深字，无需大改。
 * ============================================================ */

/* ---- 雨珠背景层：浅色下调淡，不抢正文 ---- */
html.site-light body #glass-rain {
    opacity: 0.16 !important;
    filter: saturate(0.5) brightness(1.75);
}

/* ---- 首页 hero：蓝色渐变换成浅色渐变（后台未自定义渐变时的默认浅色） ---- */
html.site-light body #header-holder.main-header .bg-animation {
    background: linear-gradient(135deg, #eaf2ff 0%, #dbeafe 55%, #e0e7ff 100%) !important;
}
/* hero 文字转深色 */
html.site-light body #top-content .big-title,
html.site-light body #main-slider .big-title,
html.site-light body .big-title,
html.site-light body .big-title span {
    color: #0f172a !important;
}
html.site-light body #main-slider p.main-title,
html.site-light body #top-content p.main-title {
    color: #334155 !important;
}
html.site-light body #main-slider .noti {
    background: rgba(255, 255, 255, 0.85) !important;
}
html.site-light body #main-slider .noti .text {
    color: #334155 !important;
}
html.site-light body .ybtn.ybtn-white {
    color: #1d4ed8 !important;
}

/* ---- 浅色下顶栏保持纯白（与默认一致），页脚浅灰底 ---- */
html.site-light body header.glass-topbar {
    background: rgba(255, 255, 255, 0.96) !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}
html.site-light body footer.glass-footer {
    background: #f8fafc !important;
}

/* ---- 手机底部 Tab 浅色 ---- */
html.site-light body .mobile-tabbar {
    background: rgba(255, 255, 255, 0.96) !important;
}

/* ---- 猫娘/内容区块：白底区块不变，CTA 卡片底色转浅 ---- */
html.site-light body #message2.cta-section .cta-card {
    background: linear-gradient(135deg, #eff6ff, #e0e7ff) !important;
}
html.site-light body .cta-title span {
    color: #1d4ed8 !important;
}
html.site-light body .cta-subtitle {
    color: #334155 !important;
}

/* ---- v1.3.112：底部「一大片模糊」的根因修复 ----
   inline-extra.css 里 `#message2{background:#ffffff}` 被 neko/index.css 的
   `.cta-section{background:transparent!important}` 压掉了（后者带 !important 且加载更晚）。
   于是 CTA 区整块透明 → 整页 fixed 的雨珠画布（#glass-rain，浅色下被调成
   opacity .16 + saturate(.5) brightness(1.75)）从这片空白里直接透出来，
   看上去就是一整条"糊掉的光斑"。这里用更高特异性 + !important 把白底拉回来
   （顺序无关，靠特异性赢）。
   ⚠️ 两条作用域限制，改之前先看清楚：
   ① 只在 site-light 下改 —— 深色模式故意让这片透出雨珠；
   ② 只在桌面端（≥901px）改 —— 手机端首页是深空底皮肤的「深底 + 浅紫卡片」，
      把 CTA 区铺白会在深色页面上切出一块白板（实测 390 宽就是白块两边露深色条）。
      手机端 ≤900px 时 #glass-rain 本身已被 mobile-app-v2.css 隐藏，不存在这个问题。 */
@media screen and (min-width: 901px) {
    html.site-light body #message2.cta-section {
        background: #ffffff !important;
    }

    /* 页脚上方给猫娘留出的那 200px 空白段同理：深色下"雨珠 + 猫娘"是刻意的，
       浅色下只会是一片糊。用伪元素只铺到「页脚顶边」为止（wrap 带 margin-bottom:-95px，
       盒子底部已经插进页脚 95px，所以白色必须提前 95px 收住，否则会在页脚里压出一道白边）。 */
    html.site-light body.nk-home .footer-neko-wrap::before {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        bottom: 95px;
        background: #ffffff;
        z-index: -1;
        pointer-events: none;
    }

    /* 首页内联 <style> 里这两块用的是
       `linear-gradient(180deg, rgba(241,245,251,.6), rgba(255,255,255,.25))`
       —— 底部只有 25% 白，等于半透明。整页 fixed 的雨珠画布就从它们**下缘**透出来，
       表现为「每个区块底部都有一条横向的糊带」（用户看到的是最下面那一条）。
       浅色下改成不透明：顶部保留一点冷灰调，底部收到纯白，与其它 #fff 区块接平。 */
    html.site-light body.nk-home .nk-dc,
    html.site-light body.nk-home .nk-highlights {
        background: linear-gradient(180deg, #f6f9fe 0%, #ffffff 55%, #ffffff 100%) !important;
    }
}

/* ---- CTA 两个按钮在浅色卡片上要能看清 ----
   .cta-btn--primary 原本是「白底蓝字」、.cta-btn--ghost 是「12% 白 + 白字 + backdrop-blur」，
   都是给深蓝卡片配的。挪到浅色卡片上，ghost 等于白字压白底 → 只剩一团发虚的白影。
   这里把主按钮改成实心蓝、次按钮改成白底描边，形成主次层次。 */
html.site-light body #message2 .cta-btn--primary {
    background: #1d4ed8 !important;
    color: #ffffff !important;
    box-shadow: 0 10px 24px rgba(29, 78, 216, .28);
}
html.site-light body #message2 .cta-btn--primary:hover,
html.site-light body #message2 .cta-btn--primary:focus-visible {
    background: #1e40af !important;
    color: #ffffff !important;
}
html.site-light body #message2 .cta-btn--ghost {
    background: rgba(255, 255, 255, .92) !important;
    border-color: rgba(29, 78, 216, .22) !important;
    color: #1d4ed8 !important;
    box-shadow: 0 6px 16px rgba(29, 78, 216, .10);
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}
html.site-light body #message2 .cta-btn--ghost:hover,
html.site-light body #message2 .cta-btn--ghost:focus-visible {
    background: #ffffff !important;
    border-color: rgba(29, 78, 216, .38) !important;
    color: #1d4ed8 !important;
}