/* 页头一级导航的排布修正（桌面端）
 *
 * 原站页头按 5 个栏目设计，规则是 .p_level1Item{width:calc(100%/5)}，
 * 每项固定占导航区 20%。栏目增到 9 个后总宽需要 180%，装不下，
 * flex 只能强行压缩每一项，结果是标题被裁断（「网站首页」显示成「网站首」）。
 *
 * 这里改成宽度随标题字数走、间距统一，栏目再增减都不会截断。
 *
 * 三点说明：
 *   1. 只作用于 769px 以上。手机端另有 .p_level1Item{width:100%} 的竖排规则
 *      （在 max-width:768px 内），完全不受影响。
 *   2. 桌面端页头是纯 flex 行：logo(cbox-14-0) | 导航(cbox-14-1) |
 *      搜索(cbox-14-2, flex:0 0 80px) | 语言(cbox-14-3, flex:0 0 auto)。
 *      搜索键的 position:absolute 只在 max-width:768px 段里，桌面端不生效，
 *      所以这两格自己占位，导航不需要额外让出右侧 padding。
 *   3. 刻意不用 !important，而是用元素选择器把权重抬到原规则之上
 *      （原规则 1 个 ID + 2 个类，这里 1 个 ID + 3 个类 + 2~3 个元素），
 *      这样无论样式表加载顺序如何都能生效 —— 页头样式在每份页面模板 CSS 里
 *      都有一份，而模板 CSS 由各 page 自己 link，会排在 layout 的引入之后。
 */

@media screen and (min-width: 769px) {
  /* 导航吃掉 logo 之后的剩余宽度，作为排布基准 */
  #c_navigation_0061635239687823 .e_container-14 div.p_item.cbox-14-1 {
    flex: 1 1 auto;
    min-width: 0;
    margin-left: 3%;
  }

  /* 原规则的 padding-right:50px 是按 5 项排版留的空隙，9 项时会把菜单
     整体挤向左侧、右边空出一块。桌面端右侧两格是流式的，这段留白多余。

     justify-content:center 是配 li 的 width:auto 用的：原规则 5 项各占 20%
     正好铺满，改成内容宽度后各项加起来不足 100%，余量会全堆到右端，
     菜单看着贴左、和搜索键之间空一大块。居中让余量两侧均分。 */
  #c_navigation_0061635239687823 .e_navigationA-16 ul.p_level1Box {
    width: 100%;
    padding-right: 0;
    justify-content: center;
  }

  /* 宽度随内容，不再写死 1/5。短标题（车用油）不会和长标题（冷冻机油）
     拿到同样宽度，视觉间距靠 a 的左右 padding 统一给。 */
  #c_navigation_0061635239687823 .e_navigationA-16 ul.p_level1Box > li.p_level1Item {
    width: auto;
    flex: 0 1 auto;
    min-width: 0;
  }

  #c_navigation_0061635239687823 .e_navigationA-16 ul.p_level1Box > li.p_level1Item > p.p_menu1Item > a {
    white-space: nowrap;
    text-align: center;
    padding: 0 16px;
  }
}

/* 中等宽度（1440 一类）：先收间距，字号不动 */
@media screen and (min-width: 1101px) and (max-width: 1440px) {
  #c_navigation_0061635239687823 .e_navigationA-16 ul.p_level1Box > li.p_level1Item > p.p_menu1Item > a {
    padding: 0 10px;
  }
}

/* 窄屏（1024 一类）：间距已收到底，再降一档字号，保证 9 项仍是一行 */
@media screen and (min-width: 769px) and (max-width: 1100px) {
  #c_navigation_0061635239687823 .e_navigationA-16 ul.p_level1Box > li.p_level1Item > p.p_menu1Item > a {
    padding: 0 8px;
    font-size: 14px;
  }
}