/* Shared v5 light / dark presentation. The page-specific layouts remain in their
   templates; this file only changes their material, ink and supplied artwork. */
:root {
  --theme-paper: #f1e9da;
  --theme-ink: #082849;
  --theme-cream: #f1e9da;
  --theme-dark: #061725;
}

/* Feed overview subtitle deliberately mirrors the Results subtitle typography.
   The two report stages that live inside /feed/ — Market Pulse and US Indicators —
   are the same page and must read as the same document, so their subtitle takes the
   identical treatment instead of live-pages.css's larger 1.4cqw serif-stack default.
   Typography only: .descriptor's hairline rule is not copied, because the report
   titles sit ~0.65cqw above their subtitle and a rule in that gap collides with the
   display face's descenders ("market pulse."). */
.v5-feed .overview .descriptor,
.v5-feed .report-view .report-subtitle {
  font-family: "Boti Sans", Arial, sans-serif !important;
  font-size: clamp(18px, 1.42vw, 24px) !important;
  font-weight: 400 !important;
  letter-spacing: -.025em !important;
  line-height: normal !important;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --navy: #f3ead8;
  --cream: #f3ead8;
  --cream-dim: #e5d9c5;
  --muted: #b9af9f;
  --faint: #8f9aa4;
  --panel: rgba(4, 20, 33, .78);
  --panel-2: rgba(7, 29, 47, .72);
  --panel-line: rgba(243, 234, 216, .30);
  --hair: rgba(243, 234, 216, .19);
  --gold: #e1ad28;
  --gold-soft: #c99a28;
  --blue: #2d77df;
  --blue-2: #397fdf;
  --t-green: #54d59d;
  --t-red: #ff8580;
  --t-amber: #e1ad28;
  --green: #54d59d;
  --red: #ff8580;
}

html[data-theme="dark"] body {
  color: var(--cream-dim) !important;
  background-color: var(--theme-dark) !important;
  background-image: url("/static/v5%20templates/original%20images/back_dark.png") !important;
  background-image: image-set(url("/static/v5%20templates/original%20images/back_dark.webp") type("image/webp"),url("/static/v5%20templates/original%20images/back_dark.png") type("image/png")) !important;
  background-position: center top !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
  background-attachment: fixed !important;
}

/* The control stays deliberately editorial: one thin rule, one gold state. */
.theme-toggle {
  position: relative;
  z-index: 170;
  display: inline-flex;
  min-width: 92px;
  height: 34px;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 0 12px;
  border: 1px solid rgba(8, 40, 73, .50);
  border-radius: 999px;
  color: #082849;
  background: rgba(241, 233, 218, .68);
  font: 700 10px/1 "Boti Sans", Arial, sans-serif;
  letter-spacing: .12em;
  text-transform: uppercase;
  cursor: pointer;
  -webkit-backdrop-filter: blur(7px);
  backdrop-filter: blur(7px);
  transition: color .18s, border-color .18s, background-color .18s, transform .18s;
}
.theme-toggle::before {
  width: 10px;
  height: 10px;
  content: "";
  border: 1px solid currentColor;
  border-radius: 50%;
  background: linear-gradient(90deg, currentColor 50%, transparent 50%);
}
.theme-toggle:hover { border-color: #d2a42e; transform: translateY(-1px); }
.theme-toggle:focus-visible { outline: 2px solid #d2a42e; outline-offset: 3px; }
html[data-theme="dark"] .theme-toggle {
  color: #f3ead8;
  border-color: rgba(243, 234, 216, .48);
  background: rgba(4, 20, 33, .66);
}
html[data-theme="dark"] .theme-toggle::before {
  color: var(--gold);
  background: linear-gradient(90deg, transparent 50%, currentColor 50%);
}
.theme-toggle--home { position: fixed; top: 18px; right: clamp(78px, 6.4vw, 102px); }
.v5-auth .theme-toggle { position: fixed; top: 22px; right: 30px; }
.v5-feed .section-nav .theme-toggle { flex: none; }

/* Dark artwork routing. */
html[data-theme="dark"] .v5-home .hero {
  background-color: var(--theme-dark) !important;
  background-image: url("/static/v5%20templates/original%20images/home_dark.png") !important;
  background-image: image-set(url("/static/v5%20templates/original%20images/home_dark.webp") type("image/webp"),url("/static/v5%20templates/original%20images/home_dark.png") type("image/png")) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}
html[data-theme="dark"] .v5-home .page-section:not(.hero),
html[data-theme="dark"] .v5-feed .stage,
html[data-theme="dark"] .v5-feed .overview,
html[data-theme="dark"] .v5-feed .report-view {
  background-color: var(--theme-dark) !important;
  background-image: url("/static/v5%20templates/original%20images/back_dark.png") !important;
  background-image: image-set(url("/static/v5%20templates/original%20images/back_dark.webp") type("image/webp"),url("/static/v5%20templates/original%20images/back_dark.png") type("image/png")) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}
html[data-theme="dark"] .v5-feed .indicators-report {
  background-color: var(--theme-dark) !important;
  background-image: url("/static/v5%20templates/original%20images/back_usIndicators_dark.png") !important;
  background-image: image-set(url("/static/v5%20templates/original%20images/back_usIndicators_dark.webp") type("image/webp"),url("/static/v5%20templates/original%20images/back_usIndicators_dark.png") type("image/png")) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}
html[data-theme="dark"] .v5-auth {
  background-color: var(--theme-dark) !important;
  background-image: url("/static/v5%20templates/original%20images/login_dark.png") !important;
  background-image: image-set(url("/static/v5%20templates/original%20images/login_dark.webp") type("image/webp"),url("/static/v5%20templates/original%20images/login_dark.png") type("image/png")) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}
html[data-theme="dark"] .v5-app .ap-bg {
  background-color: var(--theme-dark) !important;
  background-image: url("/static/v5%20templates/original%20images/back_dark.png") !important;
  background-image: image-set(url("/static/v5%20templates/original%20images/back_dark.webp") type("image/webp"),url("/static/v5%20templates/original%20images/back_dark.png") type("image/png")) !important;
  background-position: center top !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}

/* Cream/white ink titles from the supplied reference. */
html[data-theme="dark"] :is(
  .ink-text,
  .preview-title,
  .ink-title,
  .ap-title,
  .results-title,
  .index-title,
  .education-title,
  .profile-title,
  .workspace-title,
  .legal-title,
  .a-h1
) {
  color: transparent !important;
  background-color: var(--theme-cream) !important;
  background-image: url("/static/dashboard/v5/assets/paper-texture.png"), linear-gradient(var(--theme-cream), var(--theme-cream)) !important;
  background-image: image-set(url("/static/dashboard/v5/assets/paper-texture.webp") type("image/webp"),url("/static/dashboard/v5/assets/paper-texture.png") type("image/png")), linear-gradient(var(--theme-cream), var(--theme-cream)) !important;
  background-position: 0 0, center !important;
  background-repeat: repeat, no-repeat !important;
  background-size: 64px 64px, 100% 100% !important;
  background-clip: text !important;
  -webkit-background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
}
html[data-theme="dark"] :is(
  .ink-text,
  .preview-title,
  .ink-title,
  .ap-title,
  .results-title,
  .index-title,
  .education-title,
  .profile-title,
  .workspace-title,
  .legal-title,
  .a-h1
) .period,
html[data-theme="dark"] .a-dot {
  color: var(--gold) !important;
  -webkit-text-fill-color: var(--gold) !important;
}

html[data-theme="dark"] :is(
  .section-title,
  .detail-title,
  .reading-card h3,
  .topic h3,
  .article h3,
  .account h3,
  .pw-h2,
  .nt-title,
  .recent-title
) { color: var(--theme-cream) !important; }

/* Shared navigation and hairlines. */
html[data-theme="dark"] :is(.ap-header, .topbar) {
  color: var(--theme-cream) !important;
  background: rgba(4, 20, 33, .84) !important;
  border-color: rgba(243, 234, 216, .32) !important;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}
html[data-theme="dark"] :is(.ap-logo, .section-nav a, .index-nav a, .results-nav a, .education-nav a, .profile-nav a, .workspace-site-nav a, .legal-nav a, .a-brand) {
  color: var(--theme-cream) !important;
}
html[data-theme="dark"] .ap-menu {
  color: var(--theme-cream) !important;
  background-color: var(--theme-dark) !important;
  background-image: url("/static/v5%20templates/original%20images/back_dark.png") !important;
  background-image: image-set(url("/static/v5%20templates/original%20images/back_dark.webp") type("image/webp"),url("/static/v5%20templates/original%20images/back_dark.png") type("image/png")) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}
html[data-theme="dark"] .ap-menu__list a { color: var(--theme-cream) !important; border-color: rgba(243, 234, 216, .22) !important; }
html[data-theme="dark"] :is(.preview-rule, .ap-rule) { background: var(--theme-cream) !important; opacity: .48; }
html[data-theme="dark"] :is(.results-subtitle, .index-subtitle, .education-subtitle, .profile-subtitle, .workspace-subtitle, .section-copy) {
  color: var(--cream-dim) !important;
  border-color: rgba(243, 234, 216, .36) !important;
}
html[data-theme="dark"] :is(.eyebrow, .ap-eyebrow, .section-kicker, .section-count, .portal-kicker, .legal-eyebrow, .p-eyebrow) { color: var(--gold) !important; }

/* Paper cards become etched dark-glass cards. */
html[data-theme="dark"] :is(
  .feed-card,
  .result-board,
  .index-panel,
  .education-card,
  .paper-card,
  .kpis,
  .table-card,
  .history-panel,
  .lean-card,
  .how-card,
  .zone,
  .trade-summary,
  .trades-card,
  .membership-card,
  .access-card,
  .control-card,
  .workspace-link,
  .pw-panel,
  .pw-stat,
  .mini-card,
  .giveaway,
  .quick-link,
  .nt-card,
  .wl-list,
  .wl-coin-card,
  .reading-card,
  .topic,
  .article,
  .account,
  .portal,
  .index-backtest,
  .navcard,
  .alert-index,
  .detail,
  .batch-card,
  .market-stat-card,
  .macro-kpis,
  .market-cycle-dialog,
  .ap-panel,
  .legal-paper
) {
  color: var(--cream-dim) !important;
  background-color: rgba(4, 20, 33, .76) !important;
  background-image: none !important;
  border-color: rgba(243, 234, 216, .28) !important;
  box-shadow: none !important;
}
html[data-theme="dark"] :is(.results-detail, .index-detail, .education-content, .profile-detail, .workspace-body) {
  color: var(--cream-dim) !important;
  background-color: rgba(4, 20, 33, .34) !important;
  background-image: none !important;
  border-color: rgba(243, 234, 216, .24) !important;
}
html[data-theme="dark"] :is(.market-marquee, .results-market-marquee, .index-market-marquee) {
  color: var(--cream-dim) !important;
  background: rgba(4, 20, 33, .88) !important;
  border-color: rgba(243, 234, 216, .24) !important;
}
html[data-theme="dark"] :is(.site-footer, .footer, .results-footer, .index-footer, .education-footer, .profile-footer, .workspace-footer, .legal-footer) {
  color: var(--cream-dim) !important;
  background: #020e18 !important;
  border-color: rgba(243, 234, 216, .24) !important;
}
html[data-theme="dark"] .v5-home .menu-overlay {
  color: var(--theme-cream) !important;
  background-color: var(--theme-dark) !important;
  background-image: url("/static/v5%20templates/original%20images/back_dark.png") !important;
  background-image: image-set(url("/static/v5%20templates/original%20images/back_dark.webp") type("image/webp"),url("/static/v5%20templates/original%20images/back_dark.png") type("image/png")) !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: cover !important;
}
html[data-theme="dark"] .v5-home .menu-item { color: var(--theme-cream) !important; border-color: rgba(243, 234, 216, .23) !important; }
html[data-theme="dark"] .v5-home :is(.feed-base, .feed-foot span:first-child, .result-board h3 span, .result-row > span:first-child, .result-row small, .index-note) {
  color: rgba(229, 217, 197, .72) !important;
}
html[data-theme="dark"] :is(.feed-card, .result-board, .index-panel, .education-card, .paper-card, .table-card, .history-panel, .trades-card, .pw-panel, .legal-paper) * {
  border-color: rgba(243, 234, 216, .22);
}

html[data-theme="dark"] :is(table, th, td, .current-strip, .current-item, .kpi, .result-row, .board-row, .release-card) {
  color: var(--cream-dim);
  border-color: rgba(243, 234, 216, .24) !important;
}
html[data-theme="dark"] :is(thead, .table-head, .paper-card-head, .board-head, .result-board-head) {
  color: var(--theme-cream) !important;
  background: rgba(13, 45, 73, .60) !important;
  border-color: rgba(243, 234, 216, .28) !important;
}
html[data-theme="dark"] tr:hover,
html[data-theme="dark"] tr:target { background: rgba(225, 173, 40, .12) !important; }

html[data-theme="dark"] :is(input, textarea, select, .pw-input, .a-input, .multi-trigger) {
  color: var(--theme-cream) !important;
  background-color: rgba(2, 14, 24, .72) !important;
  border-color: rgba(243, 234, 216, .28) !important;
}
html[data-theme="dark"] :is(input, textarea)::placeholder { color: #929aa0 !important; }
html[data-theme="dark"] option { color: var(--theme-cream); background: #071a2a; }

html[data-theme="dark"] :is(.primary-btn, .pw-btn, .a-cta) {
  color: #061725 !important;
  background: var(--theme-cream) !important;
  border-color: var(--theme-cream) !important;
}
html[data-theme="dark"] .button-link {
  color: #061725 !important;
  background: rgba(225, 173, 40, .88) !important;
  border-color: var(--gold) !important;
}
html[data-theme="dark"] :is(.secondary, .text-btn, .p-linkbtn, .a-gbtn, .pager__btn, .ix-range, .range-button, .wl-tab, .nt-tab) {
  color: var(--theme-cream) !important;
  background: rgba(4, 20, 33, .62) !important;
  border-color: rgba(243, 234, 216, .36) !important;
}
html[data-theme="dark"] :is(.ix-range.active, .range-button.active, .rtab.active, .wl-tab.active, .nt-tab.active) {
  color: #061725 !important;
  background: var(--gold) !important;
  border-color: var(--gold) !important;
}
html[data-theme="dark"] :is(.rtab, .results-tabs a, .results-tabs button) { color: var(--theme-cream) !important; }
html[data-theme="dark"] :is(.rtab.active, .results-tabs a.active, .results-tabs button.active) { color: #061725 !important; }

/* Keep the signature cobalt plates blue with clean cream ink. */
html[data-theme="dark"] .blue-ink {
  --navy: var(--theme-cream);
  color: var(--theme-cream) !important;
  border-color: rgba(243, 234, 216, .42) !important;
}
html[data-theme="dark"] :is(.index-gauge, .sentiment-plate, .inflation-plate, .performance) {
  color: var(--theme-cream) !important;
}

/* Existing light artwork is replaced by the dark backgrounds above. */
html[data-theme="dark"] .v5-feed :is(.exact-overview-art, .exact-market-art, .exact-building-art) { display: none !important; }
html[data-theme="dark"] .v5-feed .takeaway > p {
  color: var(--cream-dim) !important;
  background: rgba(4, 20, 33, .84) !important;
  box-shadow: 0 0 18px 7px rgba(4, 20, 33, .84) !important;
}
html[data-theme="dark"] .v5-feed .report-back {
  color: var(--theme-cream) !important;
  background: rgba(4, 20, 33, .78) !important;
  border-color: rgba(243, 234, 216, .48) !important;
}
html[data-theme="dark"] .v5-feed :is(.market-stats-head small, .market-card-note, .market-period) { color: rgba(229, 217, 197, .72) !important; }
html[data-theme="dark"] .v5-feed .market-period.active { color: #061725 !important; }
html[data-theme="dark"] :is(.metric-info-button, .market-cycle-close) {
  color: var(--theme-cream) !important;
  -webkit-text-fill-color: var(--theme-cream) !important;
  background: rgba(4, 20, 33, .84) !important;
  border-color: var(--gold) !important;
}
html[data-theme="dark"] .market-cycle-now { color: #061725 !important; }
html[data-theme="dark"] .v5-home .hero-metrics { background: transparent !important; }
html[data-theme="dark"] .v5-home .hero-metric,
html[data-theme="dark"] .v5-home .hero-metric + .hero-metric { border-color: rgba(243, 234, 216, .34) !important; }
html[data-theme="dark"] .v5-auth .a-card {
  color: var(--cream-dim) !important;
  background: rgba(4, 20, 33, .80) !important;
  border-color: rgba(243, 234, 216, .38) !important;
}
html[data-theme="dark"] .v5-auth :is(.a-field > span, .a-lead, .a-alt, .a-legal, .a-consent) { color: var(--cream-dim) !important; }
html[data-theme="dark"] .v5-auth :is(.a-link a, .a-alt a, .a-legal a, .a-consent a) { color: var(--gold) !important; }
html[data-theme="dark"] .v5-auth .a-gbtn { color: var(--theme-cream) !important; }

@media (max-width: 760px) {
  .theme-toggle { min-width: 42px; width: 42px; padding: 0; }
  .theme-toggle__text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .theme-toggle--home { top: 17px; right: 67px; }
  .v5-auth .theme-toggle { top: 18px; right: 18px; }
  .v5-feed .section-nav .theme-toggle { width: 32px; min-width: 32px; height: 30px; }
}

@media (prefers-reduced-motion: reduce) {
  .theme-toggle { transition: none; }
}
