/* ==========================================================================
 * header2026.css — 官网首页顶部导航现代化外观（新增文件，2026-09）
 *
 * 只作用于带 .sk-header2026 的 #hdw 导航（目前仅 PC 官网首页引入本文件）。
 * 原导航样式全是标签上的 inline style，本文件用 !important 逐项覆盖；
 * 不修改任何旧 CSS / 模板结构 / 导航文字与链接。
 * 去掉本文件的 link 引用即可完全回退。
 * ========================================================================== */

/* ---- 导航条本体：去青色顶条，改半透明毛玻璃 ---- */
#hdw.sk-header2026 {
    border-top: none !important;
    background: rgba(255, 255, 255, .82) !important;
    -webkit-backdrop-filter: blur(14px) saturate(1.5);
    backdrop-filter: blur(14px) saturate(1.5);
    border-bottom: 1px solid rgba(15, 40, 45, .08) !important;
    box-shadow: none !important;
    transition: background-color .3s ease, box-shadow .3s ease;
}
/* 滚动后（header2026.js 加 .sk-scrolled）：更不透明 + 细阴影，增强层次 */
#hdw.sk-header2026.sk-scrolled {
    background: rgba(255, 255, 255, .93) !important;
    box-shadow: 0 6px 24px rgba(15, 40, 45, .10) !important;
}
/* 老浏览器不支持毛玻璃时退回近实色白底 */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    #hdw.sk-header2026 { background: rgba(255, 255, 255, .97) !important; }
}

/* ---- 布局：不改动 table 结构，用 display:flex 覆盖获得现代对齐 ---- */
#hdw.sk-header2026 table,
#hdw.sk-header2026 tbody,
#hdw.sk-header2026 tr {
    display: flex !important;
    align-items: center;
    width: 100% !important;
    height: 100% !important; /* 随各页容器实际高度（80/74+6/136 变体）自适应 */
}
#hdw.sk-header2026 td {
    display: flex !important;
    align-items: center;
}
/* 左列：logo，与下方轮播卡片左边线大致对齐 */
#hdw.sk-header2026 td:first-child {
    width: auto !important;
    flex: 0 0 auto;
    text-align: left !important;
    padding-left: max(20px, calc((100vw - 1600px) / 2 + 12px)) !important;
}
/* 右列：导航链接组，靠右排列 */
#hdw.sk-header2026 td:last-child {
    width: auto !important;
    flex: 1 1 auto;
    justify-content: flex-end;
    gap: 4px;
    text-align: right !important;
    padding: 0 !important;
    padding-right: max(20px, calc((100vw - 1600px) / 2 + 12px)) !important;
    line-height: normal !important;
    letter-spacing: .02em !important;
}

/* ---- logo：保持模板内联的原始大小（72px），不做缩放 ---- */

/* ---- 文字导航链接：圆角 hover 热区 ---- */
#hdw.sk-header2026 td:last-child a {
    font-size: 15px !important;
    padding: 6px 12px !important;
    border-radius: 8px;
    transition: background-color .2s ease, color .2s ease;
}
#hdw.sk-header2026 td:last-child a:hover {
    background: rgba(51, 204, 204, .12);
    color: #0aa8a8 !important;
}
/* 当前页高亮（模板用 inline 的 3px 下划线实现，改写为胶囊底色） */
#hdw.sk-header2026 td:last-child a[style*="border-bottom"] {
    border-bottom: none !important;
    padding-bottom: 6px !important;
    background: rgba(51, 204, 204, .14);
}

/* ---- 实心按钮（咨询客服/商户收银/管理中心/手机后台）：胶囊化、去旧式辉光 ---- */
#hdw.sk-header2026 td:last-child a[style*="background:#33CCCC"] {
    border-radius: 20px !important;
    padding: 7px 16px !important;
    font-size: 13px !important;
    font-weight: bold;
    box-shadow: 0 2px 8px rgba(51, 204, 204, .35) !important;
}
#hdw.sk-header2026 td:last-child a[style*="background:#33CCCC"]:hover {
    background: #25b8b8 !important;
    color: #fff !important;
}

/* ---- 描边按钮（后退/前进/代理中心/管理登录/软件下载/退出）：统一胶囊描边 ---- */
#hdw.sk-header2026 td:last-child a[style*="border:#33CCCC"]:not([style*="background:#33CCCC"]) {
    border-radius: 20px !important;
    padding: 6px 14px !important;
    font-size: 13px !important;
}
#hdw.sk-header2026 td:last-child a[style*="border:#33CCCC"]:not([style*="background:#33CCCC"]):hover {
    background: rgba(51, 204, 204, .10);
    color: #0aa8a8 !important;
}

/* ---- 胶囊按钮（带底色/描边的）不显示旧版悬停下划线 ----
   各模板内联样式里有 #hd a::after { width:0→100% } 的青色下划线展开动画，
   文字链接保留该效果，按钮类悬停出下划线不好看，这里关掉 */
#hdw.sk-header2026 td:last-child a[style*="background:#33CCCC"]::after,
#hdw.sk-header2026 td:last-child a[style*="border:#33CCCC"]:not([style*="background:#33CCCC"])::after {
    content: none !important;
    display: none !important;
}

/* ---- 登录后的账户信息文字 ---- */
#hdw.sk-header2026 .account-info {
    color: #888;
    font-size: 12px !important;
}

/* ---- 窄屏适配：窗口拉窄时缩小字号与间距，防止换行挤出 ---- */
@media (max-width: 1200px) {
    #hdw.sk-header2026 td:last-child a { font-size: 13px !important; padding: 5px 8px !important; }
}

/* ==========================================================================
 * wz.sekahui.com 文章中心导航适配（flex 结构 .hdw-logo/.hdw-menu，无 table）
 * 文章中心由 scripts/templates 生成静态 HTML，导航已加 sk-header2026。
 * 桌面端布局/间距与主站精确一致：logo 左对齐、菜单右对齐、
 * 左右安全边距用同一响应式公式、链接与按钮 padding 同主站。
 * 布局规则限定 min-width:769px，避免覆盖 head.njk 的手机端汉堡布局。
 * logo 保持内联 72px 原始大小，不做缩放。
 * ========================================================================== */
@media (min-width: 769px) {
    #hdw.sk-header2026 {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    /* 左列：logo，对齐主站左边线 */
    #hdw.sk-header2026 .hdw-logo {
        width: auto !important;
        flex: 0 0 auto;
        justify-content: flex-start !important;
        padding-right: 0 !important;
        padding-left: max(20px, calc((100vw - 1600px) / 2 + 12px)) !important;
    }
    /* 右列：菜单靠右排列，右边距与主站一致 */
    #hdw.sk-header2026 .hdw-menu {
        width: auto !important;
        flex: 1 1 auto;
        justify-content: flex-end !important;
        gap: 4px !important;
        letter-spacing: .02em !important;
        padding-right: max(20px, calc((100vw - 1600px) / 2 + 12px)) !important;
    }
    #hdw.sk-header2026 .hdw-menu a {
        font-size: 15px !important;
        padding: 6px 12px !important;
        line-height: normal !important; /* 覆盖菜单容器 30px 行高与按钮内联 1.4，避免按钮被撑高 */
    }
    /* 实心按钮（咨询客服）：padding 与主站一致 */
    #hdw.sk-header2026 .hdw-menu a[style*="background:#33CCCC"] {
        padding: 7px 16px !important;
        font-size: 13px !important;
    }
    /* 描边按钮（管理登录/软件下载）：padding 与主站一致 */
    #hdw.sk-header2026 .hdw-menu a[style*="border:#33CCCC"]:not([style*="background:#33CCCC"]) {
        padding: 6px 14px !important;
        font-size: 13px !important;
    }
    /* 窄屏适配：与主站同规则缩小字号与间距 */
    @media (max-width: 1200px) {
        #hdw.sk-header2026 .hdw-menu a { font-size: 13px !important; padding: 5px 8px !important; }
    }
}

/* ---- 皮肤（全端适用）：悬停药丸、当前页胶囊底色、按钮胶囊化 ---- */
#hdw.sk-header2026 .hdw-menu a {
    border-radius: 8px;
    transition: background-color .2s ease, color .2s ease;
}
#hdw.sk-header2026 .hdw-menu a:hover {
    background: rgba(51, 204, 204, .12);
    color: #0aa8a8 !important;
}
/* 当前页（文章中心，inline 3px 下划线 → 胶囊底色） */
#hdw.sk-header2026 .hdw-menu a[style*="border-bottom"] {
    border-bottom: none !important;
    background: rgba(51, 204, 204, .14);
}
/* 实心按钮（咨询客服）：胶囊化、去旧式辉光 */
#hdw.sk-header2026 .hdw-menu a[style*="background:#33CCCC"] {
    border-radius: 20px !important;
    box-shadow: 0 2px 8px rgba(51, 204, 204, .35) !important;
}
#hdw.sk-header2026 .hdw-menu a[style*="background:#33CCCC"]:hover {
    background: #25b8b8 !important;
    color: #fff !important;
}
/* 描边按钮（管理登录/软件下载）：胶囊描边 */
#hdw.sk-header2026 .hdw-menu a[style*="border:#33CCCC"]:not([style*="background:#33CCCC"]) {
    border-radius: 20px !important;
}
#hdw.sk-header2026 .hdw-menu a[style*="border:#33CCCC"]:not([style*="background:#33CCCC"]):hover {
    background: rgba(51, 204, 204, .10);
    color: #0aa8a8 !important;
}

/* ==========================================================================
 * 产品页二级导航（animenu，136px 变体）
 * 保持原有黑色风格不动（用户确认以原样为准），本文件不做任何覆盖。
 * ========================================================================== */