/* ═══════════════════════════════════════════════════════════════════
   simple-view.css — Simple / More detail on Portfolio and Risk mix (simple-view.js, overnight B2).
   More detail is the page as it was; everything here is scoped to a view carrying .sv-simple, except the
   switch itself, which is the Tracker's "Simple · More detail" pair (30px quiet pills, the chosen one amber
   on the amber tint). Simple: what a reader wants at a glance, in larger type; the rest waits in More detail.
   Loaded last, after house-match.css.
   ═══════════════════════════════════════════════════════════════════ */

/* ── the switch: as the Tracker's, after the page's tabs ────────────────────────────────────────────── */
body:not(#_) .sv-switch { display: inline-flex; align-items: center; gap: 2px; flex: none; margin-left: 14px; padding-left: 14px; border-left: 1px solid var(--border); align-self: center; }
body:not(#_) .sv-switch .sv-switch__b {
  display: inline-flex; align-items: center; height: 30px; min-height: 30px; padding: 0 12px; margin: 0;
  border: 1px solid transparent; border-radius: 999px; background: transparent; box-shadow: none;
  font:650 var(--hm-b, 13px)/1 var(--sans); letter-spacing: normal; color: var(--text-2); white-space: nowrap; cursor: pointer;
}
body:not(#_) .sv-switch .sv-switch__b:hover { color: var(--text); background: var(--soft-2, rgba(255, 255, 255, .06)); }
body:not(#_) .sv-switch .sv-switch__b.is-active { color: var(--accent-soft, var(--accent)); background: var(--accent-bg, rgba(224, 168, 46, .14)); border-color: var(--border-accent, var(--accent)); }
body:not(#_) .sv-switch .sv-switch__b:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
/* Risk mix's bar has no tabs: the pair sits after the page name */
body:not(#_) #viewRisk > .viewbar .sv-switch { margin-left: 18px; }

/* ── Holdings, Simple ───────────────────────────────────────────────────────────────────────────────── */
#svHoldHero[hidden] { display: none !important; }
body:not(#_) #viewPortfolio:not(.sv-simple) #svHoldHero { display: none; }
body:not(#_) #viewPortfolio.sv-simple :is(#portfolioSummaryCard, #portfolioInsightsCard, #bdPane, #portfolioAuditCard, #portfolioHoldActions, #portfolioAccounts, #portfolioHoldNote) { display: none !important; }
body:not(#_) #viewPortfolio.sv-simple .pb-hold .px-tags { display: none; }

/* the three figures: the Tracker's "so far" strip — a hairline pane, cells split by hairlines — in larger type */
body:not(#_) #svHoldHero {
  display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr) minmax(0, 1fr); margin: 22px 0 30px;
  border: 1px solid var(--border); border-radius: 12px; background: var(--surface, transparent); overflow: hidden;
}
body:not(#_) #svHoldHero .sv-hero__c { min-width: 0; padding: 18px 24px 20px; }
body:not(#_) #svHoldHero .sv-hero__c + .sv-hero__c { border-left: 1px solid var(--border); }
body:not(#_) #svHoldHero .sv-hero__l { font:500 15px/1.35 var(--sans); color: var(--text-2); }
body:not(#_) #svHoldHero .sv-hero__v { margin-top: 6px; font:650 32px/1.15 var(--sans); letter-spacing: -.01em; color: var(--text); font-variant-numeric: tabular-nums; white-space: nowrap; }
body:not(#_) #svHoldHero .sv-hero__c--lead .sv-hero__v { font-size:38px; }
body:not(#_) #svHoldHero .sv-hero__s { margin-top: 6px; font:500 15px/1.4 var(--sans); color: var(--text-2); font-variant-numeric: tabular-nums; }
body:not(#_) #svHoldHero .sv-hero__s .px-delta { display: block; margin: 0; }
body:not(#_) #svHoldHero .sv-hero__s .px-delta__i { font-size:15px; }
body:not(#_) #svHoldHero .sv-hero__s .px-delta__k { font-size:15px; color: var(--text-2); }
body:not(#_) #svHoldHero .px-up { color: var(--green); }

/* the list: four columns, larger type, more room per row; the fund keeps its ticker, kind and name */
body:not(#_) #viewPortfolio.sv-simple .pb-hold.px-tbl { font-size:16px; }
body:not(#_) #viewPortfolio.sv-simple .pb-hold.px-tbl thead th { font-size:13px; }
body:not(#_) #viewPortfolio.sv-simple .pb-hold.px-tbl :is(tbody, tfoot) td { padding-top: 13px; padding-bottom: 13px; }
body:not(#_) #viewPortfolio.sv-simple .pb-hold.px-tbl :is(tbody, tfoot) td .pb-fig { font-size:17px; }
body:not(#_) #viewPortfolio.sv-simple .pb-hold.px-tbl :is(tbody, tfoot) td small { font-size:14px; }
body:not(#_) #viewPortfolio.sv-simple .pb-hold.px-tbl .pb-tk { font-size:17px; }
body:not(#_) #viewPortfolio.sv-simple .pb-hold.px-tbl .pb-nm { max-width: none; font-size:15px; color: var(--text-2); }
body:not(#_) #viewPortfolio.sv-simple .pb-hold.px-tbl .pb-fundc { width: 40%; }
body:not(#_) #viewPortfolio.sv-simple .pb-hold.px-tbl tr.sv-cash td { border-top: 1px solid var(--border); }
body:not(#_) #viewPortfolio.sv-simple .pb-hold.px-tbl tr.sv-cash .pb-nm { white-space: nowrap; }

/* ── Trades, Simple: the headline figures and Trade history ────────────────────────────────────────── */
body:not(#_) #viewTradelog.sv-simple :is(.tb-chart, .tb-periods__r, .tb-sum, .tb-sec--hits, .tl-pane--open, .tb-pt) { display: none !important; }
body:not(#_) #viewTradelog.sv-simple .tb-hero { grid-template-columns: minmax(0, 1fr); padding-bottom: 14px; }
body:not(#_) #viewTradelog.sv-simple .tb-periods { margin-top: 16px; }
body:not(#_) #viewTradelog.sv-simple .tb-delta { font-size:15px; }
body:not(#_) #viewTradelog.sv-simple .tb-tbl { font-size:15px; }

/* ── Income, Simple: the headline figures and the payments received ────────────────────────────────── */
body:not(#_) #viewIncome.sv-simple :is(#incomeTrackerBars, #incomeProjCard, #incomeAuditCard, #incomeGridCards, #incomePnlCard, #incomeGrid2Cards, #toggleAuditBtn) { display: none !important; }
body:not(#_) #viewIncome.sv-simple #incomeRecentDivTable { font-size:15px; }

/* ── Risk mix, Simple: the mix in words, the pyramid, a sentence a level ───────────────────────────── */
body:not(#_) #viewRisk:not(.sv-simple) .sv-rk { display: none; }
.sv-rk[hidden] { display: none !important; }
body:not(#_) #viewRisk.sv-simple :is(.rkb-hero > .lk-v, .rkb-hero .rkb-sum, .rkb-hero .pyx__me, .rkb-levels, .pyx-list, .pyx__note, #rkTop, .pyx__cta, .viewbar > .lk-reset) { display: none !important; }
body:not(#_) #viewRisk.sv-simple .rkb-hero { display: block !important; }
body:not(#_) #viewRisk.sv-simple .rkb-hero .rkb-pyr { margin-top: 26px; }

body:not(#_) #viewRisk .sv-rk .rkb-h2 { margin: 0 0 14px; }
body:not(#_) #viewRisk .sv-rk .rkb-h2 small { margin-left: 4px; font:500 var(--hm-m, 13px)/1.3 var(--sans); letter-spacing: 0; text-transform: none; color: var(--text-2); }
body:not(#_) #viewRisk .sv-rk--mix { padding-top: 0; }
body:not(#_) #viewRisk.sv-simple .rkb-hero { padding-top: 22px; }
body:not(#_) #viewRisk .sv-rk__mix { display: flex; flex-wrap: wrap; gap: 10px 40px; margin: 0; padding: 0; list-style: none; }
body:not(#_) #viewRisk .sv-rk__mix li { display: inline-flex; align-items: baseline; gap: 8px; font:500 20px/1.3 var(--sans); color: var(--text); font-variant-numeric: tabular-nums; }
body:not(#_) #viewRisk .sv-rk__mix .sv-rk__k { display: inline-flex; align-items: center; gap: 9px; color: var(--text-2); }
body:not(#_) #viewRisk .sv-rk__mix b { font-weight: 700; font-size:26px; color: var(--text); }
body:not(#_) #viewRisk .sv-rk__mix .sv-rk__g { color: var(--text-2); }
body:not(#_) #viewRisk .sv-rk__say { margin: 14px 0 0; font:500 17px/1.45 var(--sans); color: var(--text); }
body:not(#_) #viewRisk .sv-rk__say .rkb-vs { font-size:17px; }

body:not(#_) #viewRisk .sv-rk--lv { margin-top: 30px; padding-top: 22px; border-top: 1px solid var(--border); }
body:not(#_) #viewRisk .sv-rk__lv { margin: 0; padding: 0; list-style: none; max-width: 980px; }
body:not(#_) #viewRisk .sv-rk__lv li { display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: baseline; gap: 4px 14px; padding: 12px 0; border-bottom: 1px solid var(--border); }
body:not(#_) #viewRisk .sv-rk__lv .rkb-badge { justify-self: start; }
body:not(#_) #viewRisk .sv-rk__t { font:500 17px/1.45 var(--sans); color: var(--text); }
body:not(#_) #viewRisk .sv-rk__t .rkb-vs { font-size:17px; }
body:not(#_) #viewRisk .sv-rk__d { font:500 15px/1.4 var(--sans); color: var(--text-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
body:not(#_) #viewRisk .sv-rk__even { margin: 12px 0 0; font:500 15px/1.4 var(--sans); color: var(--text-2); }

/* ── Large text: one step up again ──────────────────────────────────────────────────────────────────── */
body[data-text-size="large"]:not(#_) #svHoldHero .sv-hero__v, body[data-text-size="xlarge"]:not(#_) #svHoldHero .sv-hero__v { font-size:34px; }
body[data-text-size="large"]:not(#_) #svHoldHero .sv-hero__c--lead .sv-hero__v, body[data-text-size="xlarge"]:not(#_) #svHoldHero .sv-hero__c--lead .sv-hero__v { font-size:40px; }

/* ── narrower screens ───────────────────────────────────────────────────────────────────────────────── */
@media (max-width: 1100px) {
  body:not(#_) #svHoldHero .sv-hero__v { font-size:28px; }
  body:not(#_) #svHoldHero .sv-hero__c--lead .sv-hero__v { font-size:32px; }
}
@media (max-width: 760px) {
  body:not(#_) .sv-switch { margin-left: 0; padding-left: 0; border-left: 0; }
  body:not(#_) #viewRisk > .viewbar .sv-switch { margin-left: 12px; }
  body:not(#_) #svHoldHero { grid-template-columns: minmax(0, 1fr); margin: 14px 0 22px; }
  body:not(#_) #svHoldHero .sv-hero__c { padding: 14px 16px 15px; }
  body:not(#_) #svHoldHero .sv-hero__c + .sv-hero__c { border-left: 0; border-top: 1px solid var(--border); }
  body:not(#_) #svHoldHero .sv-hero__v { font-size:28px; }
  body:not(#_) #svHoldHero .sv-hero__c--lead .sv-hero__v { font-size:34px; }
  body:not(#_) #viewPortfolio.sv-simple .pb-hold.px-tbl .pb-fundc { width: auto; }
  body:not(#_) #viewRisk .sv-rk__mix { flex-direction: column; gap: 8px; }
  body:not(#_) #viewRisk .sv-rk__mix li { font-size:17px; }
  body:not(#_) #viewRisk .sv-rk__mix b { font-size:22px; }
  body:not(#_) #viewRisk .sv-rk__lv li { grid-template-columns: 40px minmax(0, 1fr); }
  body:not(#_) #viewRisk .sv-rk__d { grid-column: 2; white-space: normal; }
}
