/* =====================================================================
 * 英文站主题覆盖 v1（2026-10-22 方案一 第 1 批）
 * 说明：本文件必须「最后加载」。英文站多数页面把 normalize.css 放在
 *      header.min.css 之后，之前把覆盖写进 header.min.css 会被 normalize
 *      的 .header-slider-product-* 规则覆盖，导致颜色看起来"没改"。
 *      现在所有覆盖集中到这里，并在每个页面 </head> 前最后引入。
 * ===================================================================== */

/* ---------------- 1.1 顶栏：深墨绿 #245756 ---------------- */
.syb-pagetop {
    background: #245756 !important;
}
.syb-pagetop a,
.syb-pagetop span,
.syb-pagetop .syb-lang-switch__current,
.syb-pagetop .syb-user-dropdown__current {
    color: #ffffff;
}
.syb-pagetop .syb-user-dropdown__caret,
.syb-pagetop .syb-lang-switch__caret {
    border-top-color: #ffffff;
}
.syb-lang-switch__menu,
.syb-user-dropdown__menu {
    border-top: 2px solid #245756;
}

/* ---------------- 1.2 产品中心下拉：三级色阶整块铺满 ----------------
 * 一级：白底（当前项 #245756 底白字 / 悬停 #31968D 底白字）
 * 二级：整列 #31968D 中湖绿底白字（悬停/选中 #245756）
 * 三级：整区 #62C0BD 浅青绿底（白色产品卡 + 深色字）
 */
.header-slider-product {
    background-color: #62c0bd !important;
    align-items: stretch !important;
    border-top: 3px solid #245756;
    box-shadow: 0 8px 20px rgba(36, 87, 86, .16);
}
.header-slider-product-box {
    min-height: 240px;
}
#header-slider-product-box1,
.header-slider-product-box:first-child {
    background-color: #ffffff !important;
}
#header-slider-product-box2,
.header-slider-product-box:nth-child(2) {
    background-color: #31968d !important;
}
.header-slider-product-left {
    background-color: #ffffff !important;
}
.header-slider-product-left a {
    background-color: #ffffff !important;
    color: #333333 !important;
    border-right: 1px solid #eef4f3;
}
.header-slider-product-left a:hover {
    background-color: #31968d !important;
    color: #ffffff !important;
}
.header-slider-product-left .active,
.header-slider-product-left a.active {
    background-color: #245756 !important;
    color: #ffffff !important;
}
.header-slider-product-left a:hover .header-slider-product-right-img,
.header-slider-product-left .active .header-slider-product-right-img {
    filter: brightness(0) invert(1);
}
.header-slider-product-right,
.header-slider-product-box2 .header-slider-product-box2 {
    background-color: #31968d !important;
}
.header-slider-product-right a {
    background-color: #31968d !important;
    color: #ffffff !important;
    border-bottom: 1px solid rgba(255, 255, 255, .18);
}
.header-slider-product-right a:hover {
    background-color: #245756 !important;
    color: #ffffff !important;
}
.header-slider-product-right .active,
.header-slider-product-right a.active {
    background-color: #245756 !important;
    color: #ffffff !important;
}
.header-slider-product-right .header-slider-product-right-img,
.header-slider-product-right a:hover .header-slider-product-right-img,
.header-slider-product-right .active .header-slider-product-right-img {
    filter: brightness(0) invert(1);
    opacity: .92;
}
.header-slider-product-list {
    background-color: #62c0bd !important;
    /* 2026-10-24 方案二 第 2 条：菜单中间那条「白线」就是这里的 border-left + normalize 里的 margin-left:40px，
       两者一起去掉，三列贴合，不再露浅色缝 */
    border-left: 0 !important;
    min-height: 220px;
    padding: 14px 8px 14px 16px;
}
.jd-category-level3-item {
    background-color: #ffffff;
    border-radius: 6px;
    transition: box-shadow .2s ease-in-out;
}
.jd-category-level3-item:hover {
    box-shadow: 0 0 0 2px #245756;
}
.jd-category-level3-name {
    color: #0f2f2e;
    padding: 2px 6px 6px;
}
.jd-category-level3-item:hover .jd-category-level3-name {
    color: #245756;
    font-weight: 600;
}
.header-slider-product-box2 .header-slider-product-loading,
.header-slider-product-list .header-slider-product-loading {
    padding: 24px 20px;
    color: #ffffff;
    font-size: 13px;
}

/* ---------------- 9.1 右侧智能工具栏：贴边 + 默认收起 ---------------- */
.syb-toosybar {
    right: 8px !important;
    bottom: 24px !important;
    width: 46px !important;
    z-index: 990;
    opacity: .92;
    transition: opacity .2s ease-in-out;
}
.syb-toosybar:hover {
    opacity: 1;
}
#toosybarMain,
.syb-toosybar .syb-toosybar__toggle {
    border-radius: 23px;
    overflow: hidden;
    background-color: #ffffff;
    box-shadow: 0 4px 16px rgba(36, 87, 86, .18);
}
.syb-toosybar__item {
    background-image: linear-gradient(90deg, #f2f5f5, #f2f5f5, #245756, #31968d) !important;
}
.syb-toosybar .syb-toosybar__text {
    display: none;
}
.syb-toosybar .syb-toosybar__link,
.syb-toosybar .syb-toosybar__item_new {
    justify-content: center;
}
.syb-toosybar .syb-toosybar__item_new {
    width: 46px;
    transition: width .2s ease-in-out, background-color .2s ease-in-out;
}
.syb-toosybar .syb-toosybar__item_new:hover {
    width: 156px;
    justify-content: flex-start;
    padding: 0 12px;
    border-radius: 23px;
    background-color: #245756;
    background-image: none;
}
.syb-toosybar .syb-toosybar__item_new:hover .syb-toosybar__text {
    display: inline;
    color: #ffffff;
}
.syb-toosybar .syb-toosybar__item_new:hover .syb-toosybar__ic {
    color: #ffffff;
}

@media screen and (max-width: 820px) {
    .syb-toosybar {
        right: 6px !important;
        bottom: 70px !important;
    }
}

/* =====================================================================
 * 2026-10-23 修复：产品下拉面板宽度被压成 ~100px（三列被挤成细条）
 * 原因：产品中心页给 `<body id="productClassification">` 加了
 *       `.productClassification .is-active-product { position: relative }`，
 *       于是「面板」的定位父级变成了那个很窄的导航项，`width:90%` 只有 ~100px。
 * 处理：① 让该导航项回到 static，使面板相对 `.syb-header` 定位
 *       ② 面板宽度撑开、三列宽度固定 + 第三列吃掉剩余宽度
 * ===================================================================== */
.syb-topnav__item.is-active-product,
.productClassification .is-active-product,
.productClassifications .is-active-product,
body#productClassification .is-active-product {
    position: static !important;
}
.header-slider-product {
    left: 0 !important;
    right: 0 !important;
    top: 100% !important;
    width: 90% !important;
    max-width: 1440px !important;
    margin: 0 auto !important;
    box-sizing: border-box;
}
#header-slider-product-box1,
.header-slider-product-box:first-child {
    flex: 0 0 230px !important;
    width: 230px !important;
    max-width: 230px !important;
}
#header-slider-product-box2,
.header-slider-product-box:nth-child(2) {
    flex: 0 0 240px !important;
    width: 240px !important;
    max-width: 240px !important;
}
#header-slider-product-list {
    flex: 1 1 auto !important;
    min-width: 320px !important;
    box-sizing: border-box;
    margin-left: 0 !important;   /* 方案二 第 2 条：去掉 normalize 的 40px 间隙 */
}
#header-slider-product-list::-webkit-scrollbar {
    width: 6px;
}
#header-slider-product-list::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, .6);
    border-radius: 3px;
}
/* 2026-10-22 English site (doc item 2): three sign-in modes and two sign-up modes */
.syb-login2__type {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: center;
    align-items: center;
    gap: 6px;
}
#loginType span,
#registerType span {
    flex: 0 1 auto !important;
    margin: 0 6px !important;
    padding: 0 !important;
    font-size: 13px;
    line-height: 20px;
    white-space: nowrap;
}
#loginType,
#registerType {
    margin: 26px 0 12px;
}
#registerType {
    margin-bottom: 10px;
}
#register-form-phone,
#register-form-email {
    width: 100%;
}
#login-form-email .syb-login2input__label {
    min-width: 66px;
    padding-right: 4px;
}
#register-form-email .syb-login2input__label {
    min-width: 66px;
    padding-right: 4px;
}
@media (max-width: 480px) {
    #loginType span,
    #registerType span {
        font-size: 11px;
        margin: 0 3px !important;
    }
}
/* ================= 2026-10-24 方案二（1023）批 1 ================= */

/* 第 1 条：页脚 Logo 透明化（已换 lumibird-logo-t.png，这里再做一层保险，避免浅底上出现白块） */
.syb-footer__logo img {
    background: transparent !important;
}
.syb-footer__logo {
    line-height: 0;
}

/* 第 1 条：界面小元素统一 #62c0bd —— 服务中心左侧标题块（原为墨绿→金色渐变） */
.syb-user-sidebar__header {
    background: linear-gradient(90deg, #245756, #31968d) !important;
    color: #fff !important;
}

/* 第 1 条：服务中心 / 关于我们 二级导航（文字与图标） */
.syb-subnav2-wrapper {
    background: #f3f9f9 !important;
}
.syb-subnav2 dd {
    color: #3d4b4a;
}
.syb-subnav2 dl.is-active dd,
.syb-subnav2 dl:hover dd {
    color: #245756;
    font-weight: 600;
}
.syb-subnav2 dl.is-active:after {
    color: #62c0bd !important;
}
.syb-subnav2 dl:hover,
.syb-subnav2 dl.is-active {
    background-color: #eaf6f4 !important;
}

/* 第 1 条：右侧智能插件 hover 边框改为 #62c0bd（原为品牌红调 #f0d5d6） */
#toosybarMain {
    border: 1px solid #e3f0ee !important;
    transition: border-color .18s ease-in-out, box-shadow .18s ease-in-out;
}
.syb-toosybar:hover #toosybarMain {
    border-color: #62c0bd !important;
    box-shadow: 0 6px 20px rgba(98, 192, 189, .35) !important;
}
.syb-toosybar .syb-toosybar__item_new:hover {
    background-color: #245756;
    color: #fff;
}

/* 首页中部小元素的英文小标题也统一为品牌深绿，避免残留红调 */
.syb-homepage__title-english {
    color: #245756 !important;
}
/* ================= 2026-10-24 方案二 第 4 条：汇款页面 ================= */
.syb-remitbox {
    margin: 22px 0 0;
}
.syb-remitbox__title {
    font-size: 16px;
    font-weight: 700;
    color: #245756;
    margin-bottom: 10px;
}
.syb-remitbox__body {
    border: 1px solid #62c0bd !important;
    border-radius: 6px;
    background: #fff;
    min-height: 180px;
    padding: 16px 18px;
    font-size: 14px;
    color: #3d4b4a;
    line-height: 1.9;
}
.syb-remittips {
    margin-top: 18px;
    color: #4a5a59;
    font-size: 13px;
    line-height: 1.9;
}
.syb-remittips p {
    margin: 2px 0;
}
.syb-remitbtns {
    margin-top: 20px;
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
.syb-remit-hint {
    margin-top: 18px;
    padding: 14px 16px;
    border: 1px solid #62c0bd;
    background: #f3fbfa;
    border-radius: 6px;
    color: #3d4b4a;
    font-size: 14px;
    line-height: 1.8;
}
.syb-remit-hint p {
    margin: 4px 0;
}
@media (max-width: 768px) {
    .syb-remitbox__body {
        min-height: 120px;
        padding: 12px 14px;
    }
    .syb-remitbtns {
        flex-direction: column;
        align-items: stretch;
    }
}
/* 汇款页：修正订单信息块排版（原 payment.css 的固定宽高会让下载按钮挤压换行） */
.syb-paymentbox {
    margin: 20px 0 0 !important;
    padding: 26px 30px !important;
    border-radius: 6px;
}
.syb-paymentbox__headline {
    height: auto !important;
    line-height: 1.4 !important;
    font-size: 22px !important;
    display: block !important;
    margin-bottom: 16px !important;
}
.syb-paymentbox__text {
    display: block !important;
    margin-top: 10px !important;
    line-height: 1.6 !important;
    font-size: 15px !important;
}
#payExpectedRow {
    color: #888;
}
.syb-paymentbox__download {
    display: inline-flex !important;
    width: auto !important;
    height: auto !important;
    padding: 8px 20px !important;
    margin-top: 18px !important;
    font-size: 14px !important;
    line-height: 1.4 !important;
    border-radius: 999px !important;
    cursor: pointer;
}
.syb-paymentbox__download:hover {
    background: #f3fbfa !important;
}
.syb-remitbox__title {
    margin-top: 8px;
}
/* 2026-10-24 EN: layui 弹窗按钮英文过长会被裁切；标题默认英文体系下的深绿色样式 */
.layui-layer-dialog .layui-layer-btn a,
.layui-layer-page .layui-layer-btn a,
.layui-layer-prompt .layui-layer-btn a {
    white-space: nowrap !important;
    min-width: 0 !important;
    width: auto !important;
    height: auto !important;
    line-height: 32px !important;
    padding: 0 22px !important;
}
.layui-layer-title {
    font-size: 15px !important;
    font-weight: 600 !important;
    color: #245756 !important;
}
/* 2026-10-24 币种切换器（顶栏，位于语言切换左侧） */
.syb-currency-switch {
    position: relative;
    display: inline-flex;
    align-items: center;
    margin-right: 18px;
    font-size: 13px;
    line-height: 1;
    cursor: pointer;
}
.syb-currency-switch__current {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #ffffff;
}
.syb-currency-switch__caret {
    display: inline-block;
    width: 0;
    height: 0;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    border-top: 5px solid #ffffff;
    transition: transform .2s;
}
.syb-currency-switch.is-open .syb-currency-switch__caret {
    transform: rotate(180deg);
}
.syb-currency-switch__menu {
    display: none;
    position: absolute;
    top: calc(100% + 10px);
    right: 0;
    min-width: 132px;
    padding: 4px 0;
    background: #ffffff;
    border-top: 2px solid #245756;
    box-shadow: 0 8px 20px rgba(36, 87, 86, .16);
    z-index: 1200;
}
.syb-currency-switch.is-open .syb-currency-switch__menu {
    display: block;
}
.syb-currency-switch__option {
    display: block;
    padding: 8px 14px;
    color: #333333 !important;
    font-size: 13px;
    white-space: nowrap;
    text-decoration: none;
}
.syb-currency-switch__option:hover {
    background: #f3fbfa;
    color: #245756 !important;
}
.syb-currency-switch__option.is-active {
    color: #245756 !important;
    font-weight: 600;
}
/* 2026-10-25 商品页价格条款三行（Delivery / Payment Terms / Shipping） */
.syb-product-terms {
    margin: 0 0 18px;
    padding: 14px 18px;
    background: #f6fbfa;
    border-left: 4px solid #62c0bd;
    border-radius: 4px;
    font-size: 13px;
    line-height: 1.9;
    color: #555;
}
.syb-product-terms__row {
    display: block;
}
.syb-product-terms__k {
    display: inline-block;
    min-width: 118px;
    color: #245756;
    font-weight: 600;
}
