/**
 * ja_nexora — Category LIST view (com_content category, item-419) isolated overlay.
 * Loaded via addCustomTag in html/com_content/category/default.php (never absorbed
 * by T4 optimize bundle — same pattern as team.css / darkmode.css / changelog.css).
 * All rules scoped body:has(.nx-cat-header) (0,2,0 specificity) — no shared page is affected.
 *
 * Token map (live var names — confirmed via getPropertyValue probe):
 *   --color-muted    = $text-muted  (#A2A8C0 dark / #4C5268 light)
 *   --color-text-dim = $text-dim    (#6B7196 dark / #888EA6 light)
 *   --color-text     = 4th token    (#C3C8DE dark / #2B3048 light) — NOT .pen $text
 *
 * Defects fixed:
 *   CAT1 [DARK-HEX-IN-LIGHT]  --cat-dim hardcoded #6B7196 (dark $text-dim) in
 *         body:has(.nx-cat-header) → leaks into LIGHT (should be #888EA6). Fix: remap via
 *         html:not([data-bs-theme=dark]) body:has(.nx-cat-header).
 *         Affected: breadcrumb ancestor links, article-count, meta author/date,
 *                   sort-chevron svg, sidebar rail label.
 *   CAT2 [4TH-TOKEN-LEAK]     .nx-side-cat-name uses var(--color-text) (#C3C8DE dark /
 *         #2B3048 light). Should be var(--color-muted) = $text-muted (#A2A8C0/#4C5268).
 *   CAT3 [4TH-TOKEN-LEAK]     .nx-side-tag uses var(--color-text) → same.
 *         Should be var(--color-muted) per .pen jrT6V "$text-muted".
 *   CAT4 [4TH-TOKEN-LEAK]     .nx-cat-pagination .page-link uses var(--color-text) →
 *         same. Should be var(--color-muted) per .pen J9x5RW inactive label.
 *   CAT5 [4TH-TOKEN-LEAK]     .nx-cat-sort uses var(--color-text) → same.
 *         Should be var(--color-muted) per .pen q0gcOo label.
 *   CAT6 [HARDCODED-DARK-HEX] .nx-cat-pagination .nx-pag-ico uses #A2A8C0 (dark
 *         $text-muted) — leaks wrong color in LIGHT. Fix: var(--color-muted).
 */

/* ── CAT1: light-mode --cat-dim remap ───────────────────────────────────────── */
/* In dark, body:has(.nx-cat-header) already defines --cat-dim:#6B7196 (correct for dark). */
html:not([data-bs-theme="dark"]) body:has(.nx-cat-header) {
  --cat-dim: #888EA6; /* $text-dim LIGHT */
}

/* ── CAT2: inactive sidebar category name ────────────────────────────────────── */
body:has(.nx-cat-header) .nx-side-cat-name {
  color: var(--color-muted) !important; /* was var(--color-text) 4th-token */
}
body:has(.nx-cat-header) .nx-side-cat.is-active .nx-side-cat-name {
  color: #fff !important; /* active row = $accent-on, stays white both modes */
}
/* CAT2b: .pen "Hover (inactive): label → $text" — brighten name on row hover
   (the CAT2 --color-muted default out-specifies the scss hover, so re-assert here). */
body:has(.nx-cat-header) .nx-side-cat:not(.is-active) > a:hover .nx-side-cat-name {
  color: var(--color-text) !important;
}

/* ── CAT3: tag chip text ─────────────────────────────────────────────────────── */
body:has(.nx-cat-header) .nx-side-tag {
  color: var(--color-muted) !important; /* was var(--color-text) 4th-token */
}

/* ── CAT4: pagination inactive page-link ─────────────────────────────────────── */
body:has(.nx-cat-header) .nx-cat-pagination .page-link {
  color: var(--color-muted) !important; /* was var(--color-text) 4th-token */
}
/* keep active cell white */
body:has(.nx-cat-header) .nx-cat-pagination .page-item.active .page-link {
  color: #fff !important;
}

/* ── CAT5: sort pill — now a REAL ordering control (was a dead aria-hidden span) ─ */
body:has(.nx-cat-header) .nx-cat-sort {
  color: var(--color-muted) !important; /* was var(--color-text) 4th-token */
  cursor: pointer;
  position: relative;
}
/* the "Sort:" prefix reads as the dim label */
body:has(.nx-cat-header) .nx-cat-sort .nx-cat-sort-vt {
  color: var(--cat-dim, var(--color-muted));
}
/* the native <select> blends into the pill: borderless, transparent, no native arrow */
body:has(.nx-cat-header) .nx-cat-sort .nx-cat-sort-sel {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: 0;
  margin: 0;
  padding: 0 2px 0 0;
  font-family: inherit;
  font-size: 13px;
  font-weight: 500;
  color: var(--color-text);
  line-height: 1.2;
  cursor: pointer;
  outline: none;
}
body:has(.nx-cat-header) .nx-cat-sort .nx-cat-sort-sel:focus-visible {
  outline: 2px solid var(--color-primary, #2563EB);
  outline-offset: 2px;
  border-radius: 4px;
}
body:has(.nx-cat-header) .nx-cat-sort .nx-cat-sort-ch { color: var(--cat-dim); flex: 0 0 auto; pointer-events: none; }

/* ── CAT6: nav-icon color (prev/next chevrons in pager) ─────────────────────── */
body:has(.nx-cat-header) .nx-cat-pagination .nx-pag-ico {
  color: var(--color-muted) !important; /* was #A2A8C0 hardcoded dark hex */
}
body:has(.nx-cat-header) .nx-cat-pagination .page-item.active .nx-pag-ico {
  color: #fff !important;
}