[data-category-panel][hidden] { display: none !important; }
[data-category-pager][hidden] { display: none !important; }

/* Chỉ tab tổng hợp nhiều section mới cần cột số thứ tự. */
.resource-catalog--parent:not(.is-showing-all) .section-header {
  grid-template-columns: minmax(0, 1fr);
}
.resource-catalog--parent:not(.is-showing-all) .section-header__number {
  display: none;
}

/* Một nhịp layout thống nhất cho cả bốn catalog mẹ. */
.study-layout {
  display: block;
  padding-bottom: 88px;
}

.resource-catalog--parent .section-header {
  margin-bottom: calc(clamp(40px, 4vw, 56px) - 3px);
}

.resource-catalog--parent .category-sidebar {
  margin-bottom: calc(clamp(40px, 4vw, 56px) - 2px);
}

[data-category-tabs] {
  --category-tab-active-background: #292d33;
  overflow-anchor: none;
}

.category-sidebar--top .category-link {
  margin-block: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.category-sidebar--top .category-link:hover { color: var(--white); background: rgb(255 255 255 / 0.06); }
.category-sidebar--top .category-link.is-active {
  color: var(--white);
  background: var(--category-tab-active-background);
}
.category-sidebar--top .category-link.is-active .material-symbols-outlined { color: var(--white); }

/* Token Stage dùng chung: số 1–5 ở Course/Doc/Ask và chữ S/O/M ở Tool. */
.category-sidebar--catalog-nav .category-name-detail { color: inherit; }
.category-sidebar--catalog-nav .category-icon--number,
.category-sidebar--catalog-nav .category-icon--stage-badge:not(.category-icon--stage-group) {
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 7px;
  color: inherit;
  background: transparent;
  font-size: 20px;
  font-weight: 500;
  line-height: 1;
  box-shadow: none;
}

.category-pager {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: clamp(20px, 3vw, 44px);
  margin-top: 64px;
  padding: clamp(22px, 2.4vw, 32px);
  border: 1px solid rgb(255 255 255 / 14%);
  border-radius: 10px;
  background:
    linear-gradient(135deg, rgb(255 255 255 / 6%), transparent 42%),
    #191c21;
  box-shadow: 0 18px 44px rgb(0 0 0 / 18%);
}

.category-pager__link {
  display: grid;
  min-width: 0;
  gap: 9px;
  padding: 0;
  border-radius: 6px;
  color: var(--body);
  transition: color 180ms ease, background-color 180ms ease;
}
.category-pager__link--next { justify-items: end; text-align: right; }
.category-pager__link:hover,
.category-pager__link:focus-visible { color: var(--white);}
.category-pager__link.is-disabled { cursor: default; opacity: 0.38; pointer-events: none; }
.category-pager__direction { display: inline-flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; }
.category-pager__direction .material-symbols-outlined { font-size: 19px; }
.category-pager__link strong { overflow: hidden; color: var(--white); font-size: 17px; font-weight: 700; line-height: 1.4; text-overflow: ellipsis; white-space: nowrap; }
.category-pager__link strong span { display: block; }
.category-pager__link:hover strong { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 4px; }
.category-pager__link.is-disabled:hover strong { text-decoration: none; }
.category-pager__position {
  display: inline-flex;
  min-width: 62px;
  min-height: 42px;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding-inline: 12px;
  border: 1px solid rgb(255 255 255 / 12%);
  border-radius: 999px;
  color: var(--muted);
  background: rgb(0 0 0 / 18%);
  font-size: 12px;
  font-variant-numeric: tabular-nums;
}
.category-pager__position strong { color: var(--white); font-size: 17px; }

@media (max-width: 767px) {
  .category-sidebar--catalog-nav .category-icon--number,
  .category-sidebar--catalog-nav .category-icon--stage-badge:not(.category-icon--stage-group) { width: 28px; height: 28px; border-radius: 6px; font-size: 14px; }
  .category-pager { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 8px; margin-top: 44px; padding: 16px 10px; border-radius: 8px; }
  .category-pager__link { gap: 6px; padding: 8px 6px; }
  .category-pager__link strong { font-size: 12px; white-space: normal; }
  .category-pager__direction { gap: 4px; font-size: 9px; }
  .category-pager__direction .material-symbols-outlined { font-size: 16px; }
  .category-pager__position { min-width: 48px; min-height: 36px; padding-inline: 8px; }
}
