/* =================================================================
   英文版全局样式整合（手机端适配 + 导航栏优化 + 菜单左对齐）
   引入即用，无需再分散调整
   ================================================================= */

/* ==================== 全局隐藏默认三角箭头 ==================== */
.nav-link.dropdown-toggle::after {
  display: none !important;
}

/* ==================== 自定义下拉箭头（手机端使用） ==================== */
.custom-arrow {
  color: black;
  font-size: 12px;
  position: absolute;
  right: 10px;                /* 箭头距右侧的距离，可按需调整 */
  top: 50%;
  transform: translateY(-50%);
}

/* ==================== 手机端下拉菜单项预留箭头空间 ==================== */
.mobile-dropdown > .dropdown-toggle {
  position: relative;
  padding-right: 25px !important;
  text-align: left;            /* 保持文字左对齐 */
}

/* ==================== 导航链接通用文字换行 ==================== */
.navbar #navbarTogglerDemo01 .navbar-nav .nav-item .nav-link {
  word-break: break-word;      /* 必要时在单词内断开，防止溢出 */
  text-align: center;          /* 文字居中 */
}

/* ==================== 手机端导航栏优化（字号、换行、菜单左对齐） ==================== */
@media (max-width: 991.98px) {
  /* 主导航链接：缩小字号，允许换行 */
  .navbar #navbarTogglerDemo01 .navbar-nav .nav-item .nav-link {
    font-size: 1.1rem !important;     /* 【可调】手机端导航文字大小 */
    white-space: normal !important;   /* 允许换行 */
    text-align: left;
    word-break: break-word;
  }

  /* 下拉菜单容器：宽度自适应 */
  .mobile-dropdown > .dropdown-menu {
    width: auto !important;           /* 宽度由内容决定 */
    min-width: 13rem !important;      /* 最小宽度 */
    max-width: 90vw !important;       /* 限制最大宽度，防止超出屏幕 */
  }

  /* 下拉菜单项：缩小字号，允许换行，左对齐 */
  .mobile-dropdown .dropdown-menu .dropdown-item {
    font-size: 1.1rem !important;     /* 与主菜单字号保持一致 */
    white-space: normal !important;   /* 允许长单词换行 */
    line-height: 1.4 !important;
    padding: 0.8rem 1.2rem !important;
    height: auto !important;
    text-align: left !important;      /* 左对齐 */
  }
/* 覆盖 nav-phone.css 中香港服务子菜单的居中对齐，改为左对齐 */
#hongkongNestedMenu .dropdown-item {
  justify-content: flex-start !important; /* 内容左对齐 */
  text-align: left !important;
}
  /* 嵌套子菜单同样处理 */
  .mobile-dropdown .dropdown-menu .dropdown-submenu .dropdown-menu .dropdown-item {
    font-size: 1.1rem !important;
    white-space: normal !important;
    line-height: 1.4 !important;
    padding: 0.8rem 1.2rem !important;
    height: auto !important;
    text-align: left !important;
  }
}

/* ==================== PC 端导航栏下拉菜单优化（宽度、字号、左对齐） ==================== */
@media (min-width: 577px) {
  /* 下拉菜单容器：取消固定宽度，由内容撑开 */
  .navbar #navbarTogglerDemo01 .navbar-nav .nav-item .dropdown .dropdown-menu {
    width: auto !important;
    min-width: 13.4rem !important;
    max-width: 22rem !important;       /* 防止过长菜单超出屏幕 */
  }

  /* 菜单项：允许换行，缩小字号，左对齐 */
  .navbar #navbarTogglerDemo01 .navbar-nav .nav-item .dropdown .dropdown-menu .dropdown-item {
    line-height: 4rem !important;
    padding: 0.8rem 1.2rem !important;
    font-size: 1.4rem !important;     /* 【可调】PC 端英文菜单字号 */
    height: auto !important;
    text-align: left !important;      /* 左对齐 */
  }

  /* 嵌套子菜单同样应用 */
  .navbar #navbarTogglerDemo01 .navbar-nav .nav-item .dropdown .dropdown-menu .dropdown-submenu .dropdown-menu .dropdown-item {
    line-height: 4rem !important;
    padding: 0.8rem 1.2rem !important;
    font-size: 1.4rem !important;
    height: auto !important;
    text-align: left !important;
  }
}

/* =================================================================
   手机端英文版适配样式（屏幕宽度 ≤ 576px）
   包含标题装饰、卡片布局、标签两列、查询按钮等
   ================================================================= */
@media (max-width: 576px) {

  /* ===== 优势模块标题 + 左右装饰 ===== */
  body .service .titleview .title {
    color: #595959;
    padding: 0;
    position: relative;
    font-weight: bold;
    font-size: 2rem !important;                /* 【可调】优势模块手机端标题大小 */
  }
  body .service .titleview .title::before {
    left: -7rem !important;                    /* 【可调】左侧装饰水平偏移 */
  }
  body .service .titleview .title::after {
    right: -10.5rem !important;                /* 【可调】右侧装饰水平偏移 */
  }

  /* ===== 未来集运模块标题 + 左右装饰 ===== */
  body .futuregroup .titleview .title {
    color: #595959;
    padding: 0;
    position: relative;
    font-weight: bold;
    font-size: 2rem !important;    /* 【可调】未来集运手机端标题大小 */
  }
  body .futuregroup .titleview .title::before {
    left: -7rem;                   /* 【可调】左侧装饰偏移 */
  }
  body .futuregroup .titleview .title::after {
    right: -9.5rem;                /* 【可调】右侧装饰偏移 */
  }

  /* ===== 视频模块标题 + 左右装饰 ===== */
  body .videomodule .titleview .title {
    color: #595959;
    padding: 0;
    position: relative;
    font-weight: bold;
    font-size: 2rem;              /* 【可调】视频模块手机端标题大小 */
  }
  body .videomodule .titleview .title::before {
    left: -7rem;                  /* 【可调】左侧装饰偏移 */
  }
  body .videomodule .titleview .title::after {
    right: -7rem;                 /* 【可调】右侧装饰偏移 */
  }

  /* ===== 视频步骤区域：两列自动换行，每行两个 ===== */
  body .videomodule .content .procedures {
    flex-wrap: wrap;               /* 允许换行 */
    justify-content: space-evenly; /* 均匀对齐 */
    gap: 10px;                     /* 卡片间距 */
    overflow-x: visible;           /* 取消横向滚动条 */
  }
  body .videomodule .content .procedures .step {
    width: calc(50% - 10px);       /* 每行两个，减去间距防止溢出 */
    flex: 0 0 auto;                /* 不拉伸，保持自身宽度 */
    height: auto;                  /* 高度自适应 */
    margin: 0;                     /* 清除原有外边距 */
  }

  /* ===== 未来集运体验区子标题（Features） ===== */
  body .futuregroup .content .classify-box .tese-cont .title {
    font-size: 1.5rem !important;  /* 【可调】手机端子标题大小 */
  }
  .futuregroup .content .nav .nav-item .nav-link {
    font-size: 1.4rem !important;  /* 小标签文字大小 */
  }

  /* ===== 发展历程区域 ===== */
  body .choices {
    padding-top: 1rem !important;
  }
  .choices .titleview .title {
    font-size: 2rem !important;    /* 【可调】发展历程手机端标题大小 */
  }
  body .choices .titleview .info {
    line-height: 1.1 !important;   /* 缩小行高，信息区更紧凑 */
    letter-spacing: 0 !important;
    text-align: left !important;
  }

  /* 彻底覆盖原始横向滚动样式，改为两列换行 */
  html body .choices .content .row .other .list {
    flex-wrap: wrap !important;          /* 强制允许换行 */
    overflow-x: visible !important;     /* 移除横向滚动条 */
    overflow-y: visible !important;
    gap: 8px;                            /* 标签间距 */
    justify-content: space-evenly;       /* 均匀分布 */
    padding: 0 !important;
    margin-bottom: 1rem;
  }

  /* 每个小标签：宽度接近一半，蓝色选中态 */
  html body .choices .content .row .other .list .item {
    width: calc(50% - 8px) !important;  /* 每行两个，减去间距 */
    flex: 0 0 auto;
    height: auto;
    min-height: 44px;                    /* 保证触摸友好 */
    margin: 0 !important;
    padding: 8px 6px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    word-break: break-word;
    white-space: normal;
    background: #f5f5f5;                /* 默认浅灰背景 */
    border-radius: 8px;
    color: #333;
  }
  /* 选中状态：蓝色背景、白色文字 */
  html body .choices .content .row .other .list .item.selected {
    background: #326CFE !important;
    color: #ffffff !important;
  }

  /* ===== 未来集运小标签栏：每行两个，宽度自适应 ===== */

    .nav-pills.mobile-tab-bar {
        /* 用 !important 强制覆盖所有原有样式 */
        display: grid !important;
        grid-template-columns: 1fr 1fr !important;
        gap: 1rem !important;
        padding: 0 0.8rem 0.5rem 0.8rem !important;
        
        /* 强制清除所有可能的Flex属性干扰 */
        flex-wrap: initial !important;
        justify-content: initial !important;
        overflow: initial !important;
    }
    
    /* 让每个按钮在格子里居中 */
    .nav-pills.mobile-tab-bar .nav-item {
        display: flex !important;
        justify-content: center !important;
        width: 100% !important;
    }

  /* ===== 价格优势卡片标题左对齐微调 ===== */
  body .service .content .item-1 .name {
    margin-left: 0rem;               /* 清除 PC 端可能遗留的负边距 */
  }

  /* ===== 查询按钮区域（I want to ship 等） ===== */
  body .inquireview .inquireview-btn {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: center;
  }
  body .inquireview .func {
    flex: 1 1 0;                      /* 每个按钮等分可用空间，强制等宽 */
    padding: 0 2px;                    /* 左右留一点缝隙，防止文字贴边 */
    font-size: 1.1rem;                 /* 【可调】按钮文字大小 */
    text-align: center;                /* 文字居中，换行后更整齐 */
    white-space: normal;               /* 允许自动换行 */
    word-break: break-word;            /* 超长单词可断行 */
    hyphens: auto;                     /* 英文换行时自动添加连字符 */
    min-width: 0;                      /* 防止 flex 弹性溢出 */
  }
  body .inquireview .func a {
    display: block;                    /* 让链接铺满整个按钮区域 */
    white-space: normal;
    word-break: break-word;
    font-size: inherit;
    color: inherit;
  }

  /* ===== 蓝色价格卡片（item-1）内部格子间距 ===== */
  body .service .content .item-1 .item-div {
    margin-bottom: 2rem;            /* 每个小格子底部留白，增大行距 */
  }

  /* ===== 白色卡片（时效/服务/品牌）的标题与描述文字 ===== */
  body .service .content .item-2 .name {
    font-size: 1.5rem !important;   /* 【可调】卡片标题手机端字号 */
  }
  /* 标题装饰短线位置微调 */
  body .service .content .item-2 .name::before {
    left: -3rem !important;
  }
  body .service .content .item-2 .name::after {
    right: -4.2rem !important;
  }

  /* 品牌优势卡片内的图片大小 */
  .express-img img {
    width: 60% !important;          /* 【可调】图片宽度 */
  }

  /* 白色卡片描述文字区域：左对齐、纵向排列、字号调整 */
  body .service .content .item-2 .express .express-text {
    justify-content: left !important;
    width: 100%;
    display: flex;
    flex-direction: column;
    font-size: 1.1rem !important;   /* 【可调】描述文字大小 */
  }
  /* 取消白色卡片的固定高度，让内容自然撑开 */
  body .service .content .item-2 .express {
    height: auto;
  }
  /* 白色卡片去掉多余内边距 */
  body .service .content .item-2 .express,
  body .service .content .item-3 .express,
  body .service .content .item-4 .express {
    padding: 0 !important;
  }

  /* 价格优势卡片标题左对齐微调（再次保险） */
  body .service .content .item-1 .name {
    margin-left: 0rem;
  }

  /* 未来集运小标签宽度微调（你的自定义数值） */
  body .futuregroup .content .nav .nav-item .nav-link {
    width: 95% !important;
    text-align: center;
  }
}
/* PC端底部三个图标组顶部对齐 */
@media (min-width: 577px) {
  .box2 {
    align-items: flex-start !important;   /* 顶部对齐，取消默认的拉伸等高 */
  }
}
/* =================================================================
   英文版左侧菜单适配（修复长英文换行遮挡问题）
   ================================================================= */
@media (min-width: 577px) {
  /* PC/平板端左侧菜单 */
  .page-main .left-menu .item ul li {
    height: auto !important;          /* 取消固定高度，让内容撑开 */
    line-height: 1.4 !important;      /* 使用紧凑行高，避免上下间距过大 */
    padding: 0.8rem 0 0.8rem 0 !important; /* 上下留出内边距，保证点击区域 */
    white-space: normal !important;   /* 允许文字换行 */
    word-break: break-word;           /* 英文单词过长时在边界处断行 */
  }
  
  /* 若需要，可以单独调整左侧菜单整体宽度，让文字更舒展 */
  .page-main .left-menu {
    min-width: 16rem;                 /* 稍微加宽侧边栏，给英文更多空间 */
  }
}

/* 手机端左侧菜单（如果存在）同样处理 */
@media (max-width: 991.98px) {
  .page-main .left-menu .item ul li {
    height: auto !important;
    line-height: 1.4 !important;
    padding: 0.8rem 0 !important;
    white-space: normal !important;
    word-break: break-word;
  }
}
.page-main .left-menu .item ul li.selected::before {
    left: -0.5rem !important;
}
.page-main .left-menu .item .menu-i {
    font-size: 1.6rem;
}
.floatzone .buttons .kefu {
    font-size: 1.5rem;
}
.page-bottom .quyu2 .links {
    width: auto !important;
}

/* PC底部导航栏电话号码位置修改 */
@media (min-width: 768px) {
.page-bottom .quyu1 {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.page-bottom .quyu1 .left {
  width: 45%;
}

.page-bottom .quyu1 .center {
  width: 25%;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-left: 0;
}

.page-bottom .quyu1 .right {
  width: 20%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.page-bottom .quyu1 .center img {
  max-width: 90%;
  height: auto;
  transform: translateX(-40px);
}
}
/* 首页恢复旧版footer */
@media (min-width: 768px) {

.home-page .page-bottom .quyu1 {
  justify-content: flex-start;
}

.home-page .page-bottom .quyu1 .left {
  width: auto;
}

.home-page .page-bottom .quyu1 .center {
  width: auto;
  margin-left: 80px;
  justify-content: flex-start;
}

.home-page .page-bottom .quyu1 .right {
  width: auto;
  align-items: flex-start;
}

.home-page .page-bottom .quyu1 .center img {
  max-width: 100%;
  transform: none;
}

}