/* 卖家精灵 2026 版顶部导航 —— 样式全部限定在 .navx 作用域内 */ /* ===== 中和层 ===== 老版 bootstrap.css / front.css 用元素级选择器接管了 a / ul / button / h1~h6， 这里把导航内部的基线恢复成设计稿假定的浏览器默认值。 特异性 (0,1,1)，高于老 CSS 的 (0,0,1)，低于下方设计稿自身的规则。 */ .navx,.navx *{box-sizing:border-box;margin:0;padding:0} .navx a{color:inherit;text-decoration:none;background-color:transparent} /* 只压 focus/active 蓝色文字和下划线。不要写 a:visited{color:inherit}，会盖掉 cta-btn 白字。 :focus/:active 特异性是 (0,2,1)，高于产品弹窗按钮这类两 class 规则 (0,2,0)； 这里不能写 background-color，点击后会把按钮底色清成透明。默认透明已由上面的 .navx a 覆盖。 */ .navx a:focus,.navx a:active{color:inherit;text-decoration:none} .navx ul,.navx ol{list-style:none} .navx img{max-width:100%;display:block;vertical-align:initial;border-style:none} .navx button{font-family:inherit;font-size:inherit;line-height:inherit;color:inherit;cursor:pointer;border:none;background:none;border-radius:0} /* 压过 bootstrap .btn 蓝色 focus 环，导航内不要描边 */ .navx a:focus,.navx a:active,.navx a:focus-visible, .navx button:focus,.navx button:active,.navx button:focus-visible{outline:0} .navx .btn:focus,.navx .btn.focus,.navx .btn:active, .navx .btn-primary:focus,.navx .btn-primary:active, .navx .btn-primary:not(:disabled):not(.disabled):active, .navx .btn-primary:not(:disabled):not(.disabled):active:focus{outline:0;box-shadow:none} .navx .btn-primary,.navx .btn-primary:hover,.navx .btn-primary:focus,.navx .btn-primary:active, .navx .btn-primary:not(:disabled):not(.disabled):active{color:#fff;background:#fb8c1e;border-color:#fb8c1e} .navx p{color:inherit;line-height:inherit} .navx b,.navx strong{font-weight:700} .navx s{text-decoration:none} /* ===== 中和层结束 ===== */ .navx{position:sticky;top:0;z-index:999;background:#fffdfb;box-shadow:0 4px 10px rgba(0,0,0,.04);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei","Segoe UI",Arial,sans-serif;font-synthesis:none} .navx .nav-inner{position:relative;max-width:1366px;height:64px;margin:0 auto;padding:0 24px;display:flex;align-items:center;gap:24px} .navx .brand-language-group{height:64px;display:flex;align-items:center;gap:16px;flex:0 0 auto} .navx .brand{width:126px;height:32px;display:flex;align-items:center;gap:4px;flex:0 0 126px} /* logo 整体展示，宽度对齐老版 header 的 122px */ .navx .brand-mark{width:122px;height:29px;flex:0 0 122px} .navx .brand-mark img{width:122px;height:29px;max-width:none} .navx .brand-wordmark{width:98px;height:21px;overflow:hidden;flex:0 0 98px} .navx .brand-wordmark img{width:95.2px;height:21px;max-width:none} .navx .language-selector{position:relative;align-self:stretch;height:64px;min-height:64px;display:flex;align-items:center} .navx .language-trigger{height:32px;padding:0 4px;display:flex;align-items:center;gap:4px;border-radius:4px;color:#1f2329;font-size:13px;font-weight:400;line-height:20px;white-space:nowrap} .navx .language-trigger .language-current{ font-size: 15px;font-weight: 500;} .navx .language-trigger:hover,.navx .language-trigger[aria-expanded="true"]{background:#fff7ef;color:#fb8c1e} /* 国旗用老版那套 flag-icon-css（4x3 底图），按设计稿收成 20×14； 它默认 background-size:contain，比例不同会两侧留白，这里改 cover 铺满 */ .navx .language-trigger .flag-icon,.navx .language-menu .flag-icon{width:20px;height:14px;line-height:14px;border-radius:2px;background-size:cover;flex:0 0 20px} /* 压过 customer.css 裸 .caret（margin-top/height/background），并把箭头用 translate 居中，展开只旋转、不再靠改 top 晃动 */ .navx .language-trigger .caret{width:12px;height:12px;flex:0 0 12px;margin:0;background:none;line-height:0;position:relative} .navx .language-trigger .caret::before{left:50%;top:50%;width:4px;height:4px;transform:translate(-50%,-50%) rotate(45deg)} .navx .language-trigger[aria-expanded="true"] .caret::before{top:50%;transform:translate(-50%,-50%) rotate(225deg)} .navx .language-menu,.navx #ssNavLanguageMenu{position:absolute;top:64px;left:0;z-index:30;width:128px;padding:8px;margin:0;border-radius:0;border-top-left-radius:0;border-top-right-radius:0;border-bottom-left-radius:8px;border-bottom-right-radius:8px;background:#fff;box-shadow:0 4px 20px rgba(0,0,0,.08)} .navx .language-menu[hidden]{display:none} .navx .language-menu a{width:100%;padding:8px 10px;border-radius:6px;display:flex;align-items:center;gap:8px;color:#1f2329;font-size:13px;line-height:20px;text-align:left} /* hover 只变主题色文字；当前选中语言保留背景色 */ .navx .language-menu a:hover,.navx .language-menu a:focus-visible{color:#fb8c1e} .navx .language-menu a[aria-checked="true"]{background:#fff7ef;color:#fb8c1e} .navx .menu{height:64px;display:flex;align-items:center;gap:24px;flex:1;list-style:none} .navx .menu>li{position:relative;height:64px;display:flex;align-items:center;list-style:none} .navx .menu>li>a,.navx .menu>li>button{height:64px;display:flex;align-items:center;gap:1px;color:#1f2329;font-size:14px;font-weight:500;line-height:20px;white-space:nowrap;cursor:pointer} .navx .menu>li:hover>a,.navx .menu>li:focus-within>a,.navx .menu>li:hover>button,.navx .menu>li:focus-within>button{color:#fb8c1e} /* 压过 customer.css 裸 .caret；箭头用 translate 在 16×16 盒内居中，展开只旋转、不改 top */ .navx .caret{position:relative;width:16px;height:16px;flex:0 0 16px;margin:0;background:none;line-height:0} .navx .caret::before{content:"";position:absolute;left:50%;top:50%;width:5px;height:5px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translate(-50%,-50%) rotate(45deg);transition:transform .16s} /* caret 跟随菜单展开翻转，触发条件与下面 .pop 的显隐规则一致。 触发器有 （学习中心、关于我们）和