/**
 * KBG UI 3.0 —— 页面骨架：全站背景 + Header重构 + Footer重构（阶段一）
 *
 * 全部选择器基于真实DOM核对：
 *   Header 来自父主题 header.php（header.header > .container >
 *     .navbar-header(.logo > a > img) + [nav classes](.nav.navbar-nav +
 *     .navbar-action)）
 *   Footer 来自父主题 footer.php（footer.footer-xxx > .container >
 *     .footer-col-wrap > .footer-col-logo / .footer-col-copy / .footer-col-sns）
 * 不修改父主题任何文件，只用子主题CSS（必要处配合极小量JS，见kbg-ui2.js）
 * 覆盖视觉。此文件加载顺序在 kbg-ui2.css 里排在旧 desktop.css 之后，同
 * 选择器同优先级时新规则生效，不需要 !important，也不需要删除旧文件。
 *
 * 2026-07-22 Remediation修订：
 *   1. --kbg-text/--kbg-radius-sm 改名同步（见kbg-ui3-tokens.css）。
 *   2. #1a1200 硬编码替换为 var(--kbg-text-on-gold)。
 *   3. Header底部边线从中性灰 var(--kbg-border-neutral) 改为低透明金色
 *      var(--kbg-border-subtle)，符合冻结文档"低透明金色边线"的规格。
 *   4. Footer弱化版权链接不再用opacity衰减（真实计算发现opacity:.55会让
 *      对比度跌到2.14:1，不达WCAG AA标准），改用专门的
 *      --kbg-text-muted-accessible（5.90:1，有余量），只靠字号(11px)和
 *      位置做弱化，不牺牲可读性。
 *   5. .kbg-ui3-gallery 的容器宽度规则移交给新建的 kbg-ui3-grid.css
 *      的 .kbg-container 类，这里不再重复定义（Preview模板同步改用新class，
 *      见homepage-template.php）；.kbg-ui3-preview-main 保留（Preview区
 *      专属外层padding，不是通用容器概念，不迁移）。
 */

/* ---------- 全站背景：品牌层用主背景，取代UI 2.0遗留的浅灰蓝 ---------- */
body.kbg-ui-preview {
    background-color: var(--kbg-bg-0);
    color: var(--kbg-text-2);
}

/* ---------- Preview演示区专属外层（不是通用容器，不迁移进grid.css） ---------- */
body.kbg-ui-preview .kbg-ui3-preview-main {
    padding: var(--kbg-space-8) var(--kbg-space-6);
}

/* ============================================================
 * Header 重构
 * ============================================================ */
body.kbg-ui-preview header.header {
    background: var(--kbg-bg-0);
    border-bottom: var(--kbg-border-width) solid var(--kbg-border-subtle);
    box-shadow: none;
    transition: background var(--kbg-duration) var(--kbg-ease),
                backdrop-filter var(--kbg-duration) var(--kbg-ease);
}
/* 明确接管父主题 --header-bg-color 变量（真实核查过编译CSS里这个变量默认值
   是紫色 #9c4dff），双重保险防止任何紫色残留 */
body.kbg-ui-preview {
    --header-bg-color: var(--kbg-bg-0);
}
/* 滚动后：轻微半透明+blur，由 kbg-ui2.js 在 scrollY 超过阈值时给 header
   加 .kbg-header-scrolled class——要求"不能过度发光"，这里只做背景透明度
   和blur，不叠加任何金色光晕 */
body.kbg-ui-preview header.header.kbg-header-scrolled {
    background: rgba(5, 5, 5, .82);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* ---- Logo：真实DOM是 .logo > a > img，用 content:url() 做CSS级图片替换——
   保留原生 alt="东南亚快曝光" 不变（对无障碍/SEO更友好，不是display:none
   隐藏丢失语义），只替换视觉呈现的像素内容。图片文件来自
   tools.kuaibaoguang.cn 已经生产验证过的同一份 kbg-logo.webp（120x120，
   圆形徽章版，虎头+中英文名+Slogan+Telegram一体化），复制进子主题目录
   自己的 assets/img/ 下，不跨域引用，不修改源文件。 ---- */
body.kbg-ui-preview header.header .logo a {
    display: flex;
    align-items: center;
    gap: var(--kbg-space-3);
    text-decoration: none;
}
body.kbg-ui-preview header.header .logo a img {
    content: url('../img/kbg-logo.webp');
    width: 44px;
    height: 44px;
    min-width: 44px;
    border-radius: var(--kbg-radius-circle);
    object-fit: cover;
}
/* 品牌名文字：真实DOM里logo区域只有一张img，没有独立文字节点——用
   kbg-ui2.js 在 img 后面插入一个真实 <span class="kbg-brand-name"> 文本
   节点（不是CSS生成内容，保留可选中/可被搜索引擎索引的真实文字），这里
   只负责样式 */
body.kbg-ui-preview header.header .kbg-brand-name {
    font-family: var(--kbg-font-cn);
    font-size: 20px;
    font-weight: var(--kbg-fw-bold);
    color: var(--kbg-text-1);
    white-space: nowrap;
    letter-spacing: .5px;
}

/* ---- 菜单 ---- */
body.kbg-ui-preview .nav.navbar-nav > li.menu-item > a {
    color: var(--kbg-text-2);
    transition: color var(--kbg-duration) var(--kbg-ease);
    position: relative;
}
body.kbg-ui-preview .nav.navbar-nav > li.menu-item > a:hover {
    color: var(--kbg-gold-1);
}
body.kbg-ui-preview .nav.navbar-nav > li.menu-item.current-menu-item > a,
body.kbg-ui-preview .nav.navbar-nav > li.current_page_item > a {
    color: var(--kbg-gold-1);
    font-weight: var(--kbg-fw-bold);
}
@media (min-width: 992px) {
    body.kbg-ui-preview .nav.navbar-nav > li.menu-item.current-menu-item > a::after,
    body.kbg-ui-preview .nav.navbar-nav > li.current_page_item > a::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: -6px;
        height: 2px;
        background: var(--kbg-gold-1);
        border-radius: 2px;
    }
}

/* ---- 投稿按钮：复用Primary Button视觉，不新建class，直接接管原生选择器 ---- */
body.kbg-ui-preview .navbar-action .publish {
    background: linear-gradient(135deg, var(--kbg-gold-1), var(--kbg-gold-2));
    border-color: transparent;
    color: var(--kbg-text-on-gold);
    border-radius: var(--kbg-radius-xs);
    box-shadow: var(--kbg-shadow-glow-sm);
    transition: box-shadow var(--kbg-duration) var(--kbg-ease);
}
body.kbg-ui-preview .navbar-action .publish:hover {
    box-shadow: var(--kbg-shadow-glow-md);
}
body.kbg-ui-preview .navbar-action .publish:focus-visible {
    outline: 2px solid var(--kbg-gold-1);
    outline-offset: 3px;
}

/* ---- 搜索：线性图标继承currentColor，只改颜色不改图标本身结构 ---- */
body.kbg-ui-preview .navbar-search-icon,
body.kbg-ui-preview .navbar-search-btn {
    color: var(--kbg-text-2);
    transition: color var(--kbg-duration) var(--kbg-ease);
}
body.kbg-ui-preview .navbar-search-icon:hover,
body.kbg-ui-preview .navbar-search-btn:hover {
    color: var(--kbg-gold-1);
}
body.kbg-ui-preview .navbar-search-input {
    background: var(--kbg-bg-1);
    color: var(--kbg-text-1);
    border-color: var(--kbg-border-neutral);
}

/* ============================================================
 * Footer 重构
 * ============================================================ */
body.kbg-ui-preview .footer {
    background: var(--kbg-bg-0);
    color: var(--kbg-text-2);
    border-top: var(--kbg-border-width) solid var(--kbg-border-neutral);
}
body.kbg-ui-preview .footer a {
    color: var(--kbg-text-2);
    transition: color var(--kbg-duration) var(--kbg-ease);
}
body.kbg-ui-preview .footer a:hover {
    color: var(--kbg-gold-1);
}
/* Footer Logo：真实DOM确认 footer_logo 选项已配置（非虎头素材），同样用
   content:url() 做视觉替换，保留原生alt文字 */
body.kbg-ui-preview .footer .footer-col-logo img {
    content: url('../img/kbg-logo.webp');
    width: 48px;
    height: 48px;
    border-radius: var(--kbg-radius-circle);
    object-fit: cover;
}
body.kbg-ui-preview .footer .copyright {
    color: var(--kbg-text-3);
    font-size: var(--kbg-fs-sm);
}
/* "Powered by WordPress"弱化：真实检查过默认版权文案里这部分是独立<a>标签
   （wpcom.cn链接），可以精确只弱化这一处，不影响版权文案其余部分。
   真实计算过 --kbg-text-3(#7A7A7A) + opacity:.55 在纯黑背景上混合后对比度
   只有2.14:1，不达WCAG AA(4.5:1)标准；--kbg-text-3在100%不透明时本身也只
   压线通过(4.75:1)，没有安全余量。改用专门的 --kbg-text-muted-accessible
   (#8A8A8A，5.90:1，有余量)，不用opacity衰减，只靠11px小字号和位置做
   视觉弱化，"最低视觉层级"的意图不变，但不牺牲可读性。 */
body.kbg-ui-preview .footer .copyright a {
    color: var(--kbg-text-muted-accessible);
    font-size: 11px;
}
body.kbg-ui-preview .footer .copyright a:hover {
    color: var(--kbg-text-2);
}
/* 社交图标：微信/微博图标继承currentColor变金色hover，图标本身结构不变 */
body.kbg-ui-preview .footer-sns a {
    color: var(--kbg-text-2);
}
body.kbg-ui-preview .footer-sns a:hover {
    color: var(--kbg-gold-1);
}

/* ============================================================
 * 品牌身份三段式（第六章要求，追加在Footer版权区下方，真实账号，不虚构）
 * ============================================================ */
body.kbg-ui-preview .kbg-footer-identity {
    display: flex;
    flex-wrap: wrap;
    gap: var(--kbg-space-4);
    margin-top: var(--kbg-space-3);
    font-size: var(--kbg-fs-xs);
    color: var(--kbg-text-3);
}
body.kbg-ui-preview .kbg-footer-identity a {
    color: var(--kbg-text-3);
}
body.kbg-ui-preview .kbg-footer-identity a:hover {
    color: var(--kbg-gold-1);
}
