@charset "utf-8";
/* ==========================================================================
   销售云 · 层级导航条 (面包屑 + 返回上级)
   2026-09-11

   背景：销售云这条链路 产品概览 → 销售云 → 功能 → 13 个功能子页
         原先只有「下行」链接, 没有任何「上行」路径 —— 进去只能靠浏览器后退。
         桌面端和移动端同样缺。

   用法：作为 .pro-right 的第一个子元素插入（即 <div class="pro-one"> 之前）。
         为什么不在 .pro-one 里面：
         salecloud.html 的 .pro-ding（横幅文字遮罩）是 position:absolute;
         top:281px, 若在 .pro-one 内部插元素只会把横幅图往下推、遮罩不动 → 错位。
         插在 .pro-one 之前则整块位移, 绝对定位跟随, 不会错位。
         同时避免破坏 .pro-one > div:first-child 这类既有选择器。

   修饰类：.sale-crumb--sub  功能子页（内容左基准 x=290, 故左内边距 50px）
   ========================================================================== */

.sale-crumb {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 4px 18px;
  box-sizing: border-box;
  width: 100%;
  padding: 12px 20px 10px 40px;
  border-bottom: 1px solid #eef1f6;
  font-size: 13px;
  line-height: 20px;
  color: #8b93a1;
  background: #ffffff;
}
.sale-crumb--sub { padding-left: 50px; }

/* ---- 左：返回上级 ---- */
.sale-crumb .sale-crumb-back {
  display: inline-flex;
  align-items: center;
  flex: none;
  color: #0564F5;
  text-decoration: none;
  white-space: nowrap;
}
.sale-crumb .sale-crumb-back:hover { color: #0348b0; text-decoration: underline; }
.sale-crumb .sale-crumb-back .arw {
  margin-right: 5px;
  font-size: 15px;
  line-height: 1;
  font-family: Arial, sans-serif;
}

/* ---- 右：路径 ---- */
.sale-crumb .sale-crumb-path {
  display: flex;
  align-items: center;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
}
.sale-crumb .sale-crumb-path a {
  color: #8b93a1;
  text-decoration: none;
}
.sale-crumb .sale-crumb-path a:hover { color: #0564F5; text-decoration: underline; }
.sale-crumb .sale-crumb-path .sep {
  margin: 0 7px;
  color: #c9cfda;
  font-family: Arial, sans-serif;
}
.sale-crumb .sale-crumb-path .cur { color: #333333; }

/* ==========================================================================
   移动端：两行 —— 返回在上、路径在下（路径过长时横向滑动, 不出现滚动条）
   ========================================================================== */
@media (max-width: 768px) {
  .sale-crumb {
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    padding: 10px 16px 8px;
  }
  .sale-crumb .sale-crumb-back { font-size: 14px; }
  .sale-crumb .sale-crumb-path {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .sale-crumb .sale-crumb-path::-webkit-scrollbar { display: none; }
  .sale-crumb .sale-crumb-path .cur { color: #8b93a1; }
}

/* ==========================================================================
   变体 A：.sale-crumb--single —— 仅移动端显示的「当前位置」条   2026-09-11
   布局：  产品概览 › 销售云          ← 单行；两级文字本身都可点, 无独立「返回」按钮
   视觉：  上一层 = 链接蓝 #0564F5 ／ 当前页 = 浅蓝胶囊 #eef3ff + 深蓝字
           分隔符 › 淡灰 #c2cad8, 前后 8px
   适用范围：仅 salecloud.html（该页桌面端左栏已有 概述/功能/价格 导航, 不重复）
   注：  基类桌面端是 display:flex（左右分栏）、移动端是两行；
         这里一律用复合选择器 .sale-crumb.sale-crumb--single(0,2,0) 覆盖,
         不依赖 <link> 先后顺序。
   ========================================================================== */
.sale-crumb.sale-crumb--single { display: none; }   /* 桌面端不显示 */

@media (max-width: 768px) {
  .sale-crumb.sale-crumb--single {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    padding: 8px 16px;          /* 2026-09-11 用户要求高度再收一档: 13/12 -> 8/8, 条高 52 -> 43px */
    font-size: 14px;
    line-height: 20px;
  }
  /* 基类移动端给的是 width:100%（两行版用）, 单行版必须让出来, 否则撑满整行 */
  .sale-crumb.sale-crumb--single .sale-crumb-path {
    width: auto;
    flex: 0 1 auto;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .sale-crumb.sale-crumb--single .sale-crumb-path::-webkit-scrollbar { display: none; }

  /* 上一层：普通链接样式 */
  .sale-crumb.sale-crumb--single .sale-crumb-path a {
    color: #0564F5;
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
  }
  /* 当前页：浅蓝胶囊（仍可点, 用户要求两级文字都有链接） */
  .sale-crumb.sale-crumb--single .sale-crumb-path a.is-cur {
    padding: 3px 11px;
    border-radius: 999px;
    background: #eef3ff;
    color: #1c3d7a;
    font-weight: 600;
    font-size: 13.5px;
  }
  .sale-crumb.sale-crumb--single .sale-crumb-path .sep {
    margin: 0 8px;
    color: #c2cad8;
    font-size: 13px;
  }
}

/* ==========================================================================
   PC 端隐藏整条层级导航条 (2026-09-11 用户要求: "pc 端这个导航条去掉")
   理由: PC 端左栏菜单 (销售云 / 概述/功能/价格 + 功能子项) 已承担定位与跳转,
         这条「‹ 返回销售云 + 产品概览›销售云›功能」在 PC 端冗余;
   移动端 (≤768px) 不受影响 —— 左栏隐藏后, 本条是唯一的吸附定位导航。
   salecloud.html 的 --single 变体本就桌面 display:none, 此规则对其无变化。
   ========================================================================== */
@media (min-width: 769px) {
  .sale-crumb { display: none !important; }
}