/* 列表页侧栏「Products by material」导航样式 v5
   v3 版的 Material 复选框筛选已按用户要求下线（2026-10-29），
   本文件只保留分类直达链接组的样式 + AJAX 局部刷新时的加载态。

   注意 1：/_assets/* 是 immutable 一年缓存，改内容必须换文件名（v4 → index5.css）。
   注意 2：模板 CSS（rightint_goods_list/index.css）里
            .rightint-goods-list .sidemenu ul li { margin/border-bottom }
            的特异性高于本文件的裸选择器，规则都带
            .rightint-goods-list .sidemenu 前缀来确保覆盖生效。 */

.rightint-goods-list .sidemenu.nf-sidebar > h2 {
  background: var(--color-primary, #038076);
}

/* 模板里 .sidemenu ul 有边框，导航组内的 ul 要清掉 */
.rightint-goods-list .sidemenu.nf-sidebar .nf-group-body ul {
  border: 0;
  border-top: none;
}

/* ---------- 折叠组 ---------- */
.rightint-goods-list .sidemenu.nf-sidebar .nf-group {
  border: 1px solid #ededed;
  background: #fff;
}

.rightint-goods-list .sidemenu.nf-sidebar .nf-group:first-of-type {
  border-top: 1px solid #ededed;
}

.rightint-goods-list .sidemenu.nf-sidebar .nf-group-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin: 0;
  padding: 16px 18px;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.4;
  text-align: left;
  color: #212121;
  cursor: pointer;
  user-select: none;
  transition: color .2s;
}

.rightint-goods-list .sidemenu.nf-sidebar .nf-group-head:hover {
  color: var(--color-primary, #038076);
}

/* 箭头：展开态朝下（rotate 45deg），折叠态朝右（rotate -45deg） */
.rightint-goods-list .sidemenu.nf-sidebar .nf-group-head .nf-arrow {
  flex: none;
  width: 10px;
  height: 10px;
  border-right: 2px solid #8a9198;
  border-bottom: 2px solid #8a9198;
  transform: rotate(45deg) translate(-2px, -2px);
  transition: transform .25s ease;
}

.rightint-goods-list .sidemenu.nf-sidebar .nf-group.is-collapsed .nf-arrow {
  transform: rotate(-45deg) translate(-1px, 1px);
}

.rightint-goods-list .sidemenu.nf-sidebar .nf-group-body {
  padding: 2px 18px 16px;
  overflow: hidden;
  max-height: 1200px;
  transition: max-height .28s ease, opacity .2s ease, padding .28s ease;
}

.rightint-goods-list .sidemenu.nf-sidebar .nf-group.is-collapsed .nf-group-body {
  max-height: 0;
  opacity: 0;
  padding-top: 0;
  padding-bottom: 0;
}

/* ---------- 分类直达链接组 ---------- */
.rightint-goods-list .sidemenu.nf-sidebar ul.nf-cats {
  list-style: none;
  margin: 0;
  padding: 0;
}

.rightint-goods-list .sidemenu.nf-sidebar ul.nf-cats li {
  margin: 0;
  border-bottom: 1px solid #ededed;
}

.rightint-goods-list .sidemenu.nf-sidebar ul.nf-cats li:last-child {
  border-bottom: 0;
}

.rightint-goods-list .sidemenu.nf-sidebar ul.nf-cats a {
  display: block;
  padding: 12px 18px;
  font-size: 15px;
  line-height: 1.4;
  color: #3d444b;
  text-decoration: none;
  transition: color .2s, background .2s;
}

/* 型号级链接缩进一级，视觉上从属于上级材料大类 */
.rightint-goods-list .sidemenu.nf-sidebar ul.nf-cats li.nf-sub a {
  padding-left: 34px;
  font-size: 14px;
  color: #5a6169;
}

.rightint-goods-list .sidemenu.nf-sidebar ul.nf-cats li.nf-sub a::before {
  content: '';
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 9px;
  vertical-align: middle;
  border-radius: 50%;
  background: #c3c8cd;
}

.rightint-goods-list .sidemenu.nf-sidebar ul.nf-cats li.nf-sub a:hover {
  color: var(--color-primary, #038076);
  background: #f7f8f9;
}

/* 当前页高亮 */
.rightint-goods-list .sidemenu.nf-sidebar ul.nf-cats a.is-active {
  color: var(--color-primary, #038076);
  font-weight: 600;
  background: #f7f8f9;
}

/* 二级分类（PLA+ / ABS / PETG-CF …）的高亮色
   上面那条 a.is-active 特异性是 (0,5,2)，而 li.nf-sub a 是 (0,5,3)，
   于是子项只拿到背景和字重、颜色仍被压成灰色 #5a6169 —— 一级橙、二级灰，
   高亮不一致。这里补一条 (0,6,3) 的规则专门覆盖子项。 */
.rightint-goods-list .sidemenu.nf-sidebar ul.nf-cats li.nf-sub a.is-active {
  color: var(--color-primary, #038076);
  font-weight: 600;
  background: #f7f8f9;
}

@media (max-width: 900px) {
  .rightint-goods-list .sidemenu.nf-sidebar .nf-group-head {
    padding: 13px 15px;
    font-size: 16px;
  }
  .rightint-goods-list .sidemenu.nf-sidebar .nf-group-body {
    padding: 2px 15px 13px;
  }
}

/* ---------- AJAX 局部刷新：加载态 ---------- */
/* 局部刷新时右侧商品网格轻微降透明 + 骨架闪烁，提示正在加载（不整页重载） */
.rightint-goods-list .main-right .prolist.is-loading {
  opacity: .45;
  transition: opacity .15s ease;
  pointer-events: none;
}

/* 顶部细进度条 */
body.nf-ajax-loading::after {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  height: 2px;
  width: 100%;
  z-index: 9999;
  background: linear-gradient(90deg,
    var(--color-primary, #e58722) 0%,
    var(--color-primary, #e58722) 60%,
    rgba(229, 135, 34, .25) 100%);
  background-size: 40% 100%;
  background-repeat: no-repeat;
  animation: nf-ajax-progress .9s ease-in-out infinite;
}

@keyframes nf-ajax-progress {
  0%   { background-position: -40% 0; }
  100% { background-position: 140% 0; }
}

/* 尊重用户的减少动效偏好 */
@media (prefers-reduced-motion: reduce) {
  body.nf-ajax-loading::after {
    animation: none;
    background-size: 100% 100%;
  }
  .rightint-goods-list .main-right .prolist.is-loading {
    transition: none;
  }
}