/* Theme 2.0 category page (country | sector | asset class | manager). Owner: Frontend Builder B.
   Prefix .cat-. Tokens and shared classes only: no hex, no literal gaps other than --gap. */

.cat-top { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.cat-back { display: inline-block; margin-bottom: 12px; }
.cat-back:hover { color: var(--tx); }
.cat-eyebrow { margin-top: 10px; }
.cat-top .t2-tabs { padding-top: 0; }
.cat-top-r { display: flex; align-items: center; gap: 14px; padding-top: 34px; }
.cat-top-r .t2-iconbtn[aria-pressed="true"] svg { fill: currentColor; }
.cat-herosub { margin: 10px 0 0; color: var(--t2); }

.cat-hero { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; margin-top: 28px; }
.cat-hero .t2-lead { margin-top: 10px; max-width: 640px; }
.cat-hero .t2-sub { margin-top: 6px; max-width: 640px; }
.cat-arrow { font-size: 0.4em; vertical-align: 0.55em; }
.cat-hero .t2-legend { padding-bottom: 6px; }

/* Salient prints a global `body h1, body h2` font rule (specificity 0,0,2) that beats the theme font on headings. */
.cat h1, .cat h2, .cat h3 { font-family: var(--font); text-transform: none; letter-spacing: inherit; }
.cat .t2-h1 { letter-spacing: -0.03em; }
.cat b, .cat strong, .cat summary { font-family: inherit; }

/* hero chart: full bleed, transparent, sits on the canvas */
.cat-chartwrap { margin-top: 12px; }
.cat-chart { height: 380px; }
.cat-caption { margin: 8px 0 0; max-width: 820px; }
.cat-comp { margin-top: 6px; }
.cat-comp summary { cursor: pointer; display: inline-block; }
.cat-comp-list { list-style: none; margin: 8px 0 0; padding: 0; columns: 2; column-gap: 24px; }
.cat-comp-list li { margin: 0 0 4px; break-inside: avoid; }
.cat-comp-list a { color: var(--t2); }
.cat-comp-list a:hover { color: var(--tx); text-decoration: underline; }

.cat-empty { padding: 28px 18px; border: 1px dashed var(--grid); border-radius: var(--rad-panel); color: var(--td); font-size: 13px; text-align: center; margin: 0; }
.cat-empty--chart { margin: 0 var(--page-x); min-height: 180px; display: flex; align-items: center; justify-content: center; }

.cat-stats, .cat-mixrow, .cat-listrow { margin-top: var(--gap); }
.cat-stat { min-height: 104px; display: flex; flex-direction: column; justify-content: space-between; gap: 8px; }

/* mix gauge + drill row (design 2fr) */
.cat-mixrow { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: var(--gap); }
.cat-mix, .cat-drill { min-height: 380px; }
.cat-gauge-big { text-align: left; margin: 4px 0 6px; }
.cat-gauge-big .t2-label { margin-top: 6px; }
.cat-gauge svg { display: block; width: 100%; max-width: 420px; height: auto; overflow: visible; }
.cat-arc { fill: none; stroke-width: 9; stroke-linecap: butt; cursor: pointer; transition: opacity var(--dur); }
.cat-arc.is-others { cursor: default; }
.cat-arc.is-dim { opacity: 0.25; }
.cat-arc:focus-visible { outline: none; stroke-width: 12; }
.cat-legend { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 16px; }
.cat-legend li { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; }
.cat-legend b { font-weight: 700; color: var(--tx); }
.cat-legend .t2-dot { width: 10px; height: 10px; }
.cat-basis { margin-top: 10px; }

.cat-drill-ctl { display: flex; align-items: center; gap: 6px; }
.cat-car { grid-auto-columns: calc((100% - 2 * var(--gap)) / 3.05); padding-bottom: 2px; }
.cat-card { display: flex; flex-direction: column; align-items: stretch; gap: 8px; text-align: left; padding: 16px; border-radius: var(--rad-tile); border: 1.5px solid transparent; background: var(--ghost); color: var(--tx); cursor: pointer; font: inherit; min-width: 0; transition: background var(--dur), border-color var(--dur); }
.cat-card:hover { background: var(--seg); }
.cat-card[aria-pressed="true"] { border-color: var(--tx); background: var(--panelsolid); }
.cat-card-num { font-size: 48px; font-weight: 400; letter-spacing: -0.03em; line-height: 1.1; margin-top: 6px; }
.cat-card-bar { width: 100%; margin-top: auto; }
.cat-card-bar > i { background: var(--c, var(--r2)); }

/* funds and holdings row */
.cat-listrow { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--gap); }
.cat-listrow.is-single { grid-template-columns: minmax(0, 1fr); }
.cat-fund-actions { display: flex; align-items: center; gap: 14px; }
.cat-compare { height: 36px; padding: 0 16px; font-size: 13px; }
.cat-row, .cat-hold { text-decoration: none; color: inherit; }
.cat-row:hover .t2-name { text-decoration: underline; }
.cat-row-main { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cat-hold .t2-rampbar { margin-top: 2px; }
.cat-funds.is-loading #catFunds { opacity: 0.45; transition: opacity var(--dur); }

/* tablet (900 to 1279): panel rows collapse */
@media (max-width: 1279px) {
  .cat-mixrow, .cat-listrow { grid-template-columns: minmax(0, 1fr); }
  .cat-car { grid-auto-columns: calc((100% - var(--gap)) / 2.2); }
  .cat-h1 { font-size: 44px; }
  .cat-hero .t2-hero-num { font-size: 60px; }
}

/* manager SEO sections */
.cat-intro, .cat-theme, .cat-all, .cat-cta, .cat-faq { margin-top: var(--gap); }
.cat-intro p { margin: 0; max-width: 860px; }
.cat-intro p + p { margin-top: 10px; }
.cat-intro a, .cat-faq a { color: var(--tx); text-decoration: underline; }
.cat-table th[scope="row"] { font-weight: 500; color: var(--tx); white-space: normal; min-width: 260px; }
.cat-table th[scope="row"] a:hover { text-decoration: underline; }
.cat-isin { display: block; margin-top: 2px; }
.cat-all > summary { cursor: pointer; list-style: none; display: flex; align-items: baseline; gap: 6px; }
.cat-all > summary::-webkit-details-marker { display: none; }
.cat-all-group { margin-top: 16px; }
.cat-all-group h3 { margin: 0 0 8px; }
.cat-cta { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.cat-cta p { margin: 6px 0 0; max-width: 620px; }
.cat-faq h3 { font-size: 15px; font-weight: 500; margin: 18px 0 4px; color: var(--tx); }
.cat-faq p { margin: 0; color: var(--t2); max-width: 820px; font-size: 14px; }

.cat-gaugebox { max-width: 420px; min-height: 0; }
.cat-gaugebox:not(.is-ready)::before { display: none; }
.cat-gaugebox[hidden], #catGaugeFallback[hidden] { display: none; }
#catAllocNote:empty { display: none; }

.cat-crumbs { display: block; margin-bottom: 12px; }
.cat-crumbs a:hover { color: var(--tx); text-decoration: underline; }
.cat-note { margin: 12px 2px 0; max-width: 820px; }
.cat-brow { display: grid; grid-template-columns: 220px minmax(0, 1fr) 40px; gap: 14px; align-items: center; padding: 6px 0; }
.cat-brow .t2-strong { text-align: right; font-size: 13px; }
.cat-filter { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: 12px; }
.cat-filter[hidden] { display: none; }
.cat-filter-note { flex-basis: 100%; margin: 6px 0 0; }
.cat-all-group[hidden] { display: none; }

/* "provisional": exposure levels or shifts that still come from the allocation source being corrected (GM data warning, Sun 11 Oct). Small, quiet, not a sample label. */
.t2-prov, .cat .t2-prov { display: inline-block; margin-left: 6px; padding: 1px 7px; border: 1px solid var(--grid); border-radius: 999px; font-size: 11px; font-weight: 500; line-height: 1.5; color: var(--td); background: var(--ghost); vertical-align: 2px; letter-spacing: 0; text-transform: none; cursor: help; }

.t2-prov[hidden], .cat .t2-prov[hidden] { display: none; }

.cat-top .t2-tabs button[disabled] { opacity: 0.45; cursor: not-allowed; }

/* drill deeper card (target 04-components): name + arrow button, dotted subtitle, big return, small arrow caption, weight bar */
.cat-card-top { width: 100%; display: flex; align-items: flex-start; justify-content: space-between; gap: 8px; }
.cat-card-go { text-decoration: none; }
.cat-card:focus-visible { outline: 2px solid var(--r3); outline-offset: 2px; }
.cat-card:hover .cat-card-go { background: var(--seg); color: var(--tx); }
.cat-card-num { color: var(--tx); }
.cat-card-cap { display: block; margin-top: -2px; }
.cat-card-arr { font-size: 11px; margin-right: 2px; }

.cat-fund-actions .t2-link { white-space: nowrap; }
.cat-fund-actions { flex: none; }

/* C13 drill cards: 12 month dotted path (this sub-category in ink, category average in grey) */
.cat-card-path { display: block; margin-top: 4px; font-size: 11px; line-height: 1.4; text-align: left; white-space: normal; }

/* phone width: header controls wrap under the title instead of pushing the page wider */
@media (max-width: 700px) {
  .cat-top { flex-direction: column; gap: 8px; }
  .cat-top-r { padding-top: 0; flex-wrap: wrap; width: 100%; justify-content: space-between; }
  .cat-card-num { font-size: 32px; }
}
.cat-next { margin: 8px 0 0; }

/* ═══ Below 900px (GM gate 11): one column, no sideways page scroll, text 16px, tap targets 44px. Menus' base rules do the layout; these cover this page's controls and lists. ═══ */
@media (max-width: 899px) {
  body.t2 .t2-page.cat :is(p, li, .t2-body, .t2-lead, .t2-sub:is(p)) { font-size: 16px !important; line-height: 1.55; }   /* !important: base.css sets max(14px, 1em) on paragraphs with a long :not() chain; the gate wants 16px body text */
  body.t2 .t2-page.cat .cat-back { display: inline-flex; align-items: center; min-height: 44px; }
  body.t2 .t2-page.cat .cat-top .t2-tabs button { min-height: 44px; min-width: 44px; padding: 0 12px; }
  body.t2 .t2-page.cat .t2-iconbtn { width: 44px; height: 44px; }
  body.t2 .t2-page.cat .t2-chip, body.t2 .t2-page.cat #catLegend button { min-height: 44px; padding-left: 16px; padding-right: 16px; }
  body.t2 .t2-page.cat summary { min-height: 44px; display: flex; align-items: center; }
  body.t2 .t2-page.cat .t2-link { display: inline-flex; align-items: center; min-height: 44px; }
  body.t2 .t2-page.cat .t2-btn { min-height: 44px; max-width: 100%; white-space: normal; text-align: center; box-sizing: border-box; }
  body.t2 .t2-page.cat .cat-compare { align-self: stretch; }
  body.t2 .t2-page.cat .cat-comp-list a, body.t2 .t2-page.cat .cat-all li a, body.t2 .t2-page.cat .cat-themes-nav a, body.t2 .t2-page.cat .cat-next a { display: inline-block; padding: 12px 0; min-height: 44px; min-width: 44px; box-sizing: border-box; }
  body.t2 .t2-page.cat .cat-row { min-height: 56px; }
  body.t2 .t2-page.cat .cat-fund-actions { flex-wrap: wrap; gap: 8px; }
  /* cards sit side by side and scroll inside their container (a 260px minimum on a 145px step made them overprint each other) */
  body.t2 .t2-page.cat .cat-car { grid-auto-columns: min(80vw, 280px); scroll-snap-type: x proximity; }
  body.t2 .t2-page.cat .cat-card { min-width: 0; scroll-snap-align: start; }
  body.t2 .t2-page.cat .cat-crumbs a { display: inline-flex; align-items: center; min-height: 44px; }
  body.t2 .t2-page.cat .cat-table th a { display: block; padding: 12px 0; min-height: 44px; box-sizing: border-box; }
  body.t2 .t2-page.cat .cat-faq p a { display: inline-block; padding: 12px 2px; margin: -12px 0; }
  body.t2 .t2-page.cat .cat-crumbs a { min-width: 44px; justify-content: center; }
  body.t2 .t2-page.cat .cat-hero { flex-direction: column; align-items: flex-start; gap: 12px; margin-top: 16px; }
  body.t2 .t2-page.cat .cat-chart { height: 260px; }
  body.t2 .t2-page.cat .cat-cta { flex-direction: column; align-items: stretch; gap: 12px; }
  body.t2 .t2-page.cat .cat-comp-list { columns: 1; }
  body.t2 .t2-page.cat .cat-hero-num, body.t2 .t2-page.cat .t2-hero-num { font-size: 48px; }
  body.t2 .t2-page.cat .t2-chip { min-width: 44px; justify-content: center; }
  body.t2 .t2-page.cat .cat-table th a { min-width: 44px; }
}

/* drill cards (Luke's target): name + open icon, subtitle, big return with the legend stacked at its right, whisker dots, weight bar last */
.cat-card-sub { display: block; }
.cat-card-mid { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; margin-top: 4px; width: 100%; }
.cat-card-ret { display: flex; flex-direction: column; min-width: 0; }
.cat-card-leg { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--t2); text-align: left; padding-bottom: 4px; }
.cat-card-leg span { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.cat-card-leg i { display: inline-block; border-radius: 50%; flex: none; }
.cat-card-leg i.cat-dot--sub { width: 9px; height: 9px; background: var(--ink); }
.cat-card-leg i.cat-dot--parent { width: 6px; height: 6px; background: var(--td); opacity: 0.7; margin: 0 1.5px; }
.cat-whisk { position: relative; display: block; width: 100%; height: 100px; margin-top: 4px; }
.cat-whisk svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.cat-whisk line { stroke: var(--td); stroke-opacity: 0.45; stroke-width: 1; vector-effect: non-scaling-stroke; }
.cat-whisk .cat-dot { position: absolute; border-radius: 50%; transform: translate(-50%, -50%); }
.cat-whisk .cat-dot--sub { width: 8px; height: 8px; background: var(--ink); }
.cat-whisk .cat-dot--parent { width: 5px; height: 5px; background: var(--td); opacity: 0.75; }
.cat-card-bar { margin-top: 6px; }
.cat-drill-note { margin: 10px 0 0; max-width: 820px; }
.cat-card-ret .cat-card-cap { white-space: nowrap; }
.cat-card-leg { font-size: 11px; }

/* click-through rule caption under the funds table (category-drill-detail) */
body.t2 .t2-page.cat .cat-rule{margin:var(--sp-3,12px) 0 0}

/* axis labels never wrap letter by letter at the chart edge (375px check) */
.cat-chart .t2-sub { white-space: nowrap; }

/* the enlarged FAQ link tap box (12px above and below the text) must not reach the neighbouring H3 */
@media (max-width: 899px) { body.t2 .t2-page.cat .cat-faq p { margin-top: 14px; margin-bottom: 14px; } }
