/* ============================================================
   CoreValue — study "light" theme for the interactive-models app
   The whole app shares one token vocabulary (--bg-deep, --bg-card,
   --text-1 …). Redefining those under :root[data-theme="light"]
   flips every embed view + models.css + profile.css at once.
   Default (no data-theme, or ="dark") keeps the existing dark look.
   ============================================================ */

:root[data-theme="light"] {
  /* Surfaces → light paper / white cards */
  --bg-deep:    #f6f7f8;
  --bg-card:    #ffffff;
  --bg-sidebar: #ffffff;
  --bg-input:   #f6f7f8;

  /* Borders → hairline */
  --border:        #e3e6e9;
  --border-active: rgba(2, 132, 199, 0.40);

  /* Ink text */
  --text-1: #1b2229;
  --text-2: #5c6773;
  --text-3: #8a97a5;

  /* profile.css defines this as #131a2e and .prod-card (the Business Segments
     tiles) paints with it. Left out of this block it stayed dark navy while
     everything around it went white. Recessed grey tile on a white card. */
  --bg-card-hover: #f6f7f8;

  /* Accents stay the same hue — they read fine on white.
     (Swap --purple → #0284c7 here if you want a blue-led app.) */
}

/* Kill the dark ambient background glow in light mode */
:root[data-theme="light"] body::before { opacity: 0; }

/* Plotly chart wells: let the white card show through */
:root[data-theme="light"] .js-plotly-plot,
:root[data-theme="light"] .plot-container { background: transparent; }

/* ── Financial statement tables ──────────────────────────────
   The statement tables hardcode dark hex (#0a0e1a, #111827,
   #1a1535 …) rather than tokens, so they stay dark when the rest
   of the app flips. Scoped to .table-wrapper so only these tables
   are affected. Used by embed_financial_analysis /
   embed_quarterly_analysis / embed_segment_analysis.
   ──────────────────────────────────────────────────────────── */

/* Year header row — --text-3 is too faint on a light band, step up */
:root[data-theme="light"] .table-wrapper th,
:root[data-theme="light"] .table-wrapper th:first-child {
  background: #eef1f5;
  color: var(--text-2);
}

/* Sticky line-item column — must stay opaque so rows don't
   show through when the table scrolls horizontally */
:root[data-theme="light"] .table-wrapper td:first-child {
  background: #ffffff;
  color: var(--text-1);
}

/* Section bands (REVENUE, GROSS PROFIT, NET INCOME …) */
:root[data-theme="light"] .table-wrapper tr.row-header td,
:root[data-theme="light"] .table-wrapper tr.row-header td:first-child {
  background: #e9eef7 !important;
}

/* The band label is --purple, which is washed out on a light band */
:root[data-theme="light"] .table-wrapper tr.row-header td:first-child {
  color: #5b21b6 !important;
}

/* Computed rows use --cyan; too pale on white */
:root[data-theme="light"] .table-wrapper tr.row-computed td,
:root[data-theme="light"] .table-wrapper tr.row-computed td:first-child {
  color: #0e7490 !important;
}

/* Row hover */
:root[data-theme="light"] .table-wrapper tr:hover td,
:root[data-theme="light"] .table-wrapper tr:hover td:first-child {
  background: #f1f6fb;
}

/* Keep the hover tint on section bands from washing them out */
:root[data-theme="light"] .table-wrapper tr.row-header:hover td,
:root[data-theme="light"] .table-wrapper tr.row-header:hover td:first-child {
  background: #e2e9f4 !important;
}

/* ── Company profile page ────────────────────────────────────
   profile.css builds its subtle surfaces out of rgba(255,255,255,.0x)
   washes and drops shadows at rgba(0,0,0,.4-.5). Both assume a dark
   backdrop: on white the washes vanish (panels lose their edge) and
   the shadows read as heavy grey smudges. Restated for light paper.
   Used by embed_company_profile / profile.
   ──────────────────────────────────────────────────────────── */

:root[data-theme="light"] .glass {
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04), 0 8px 24px rgba(16, 24, 40, .06);
}
:root[data-theme="light"] .prod-card:hover {
  box-shadow: 0 8px 24px rgba(16, 24, 40, .10);
  border-color: rgba(2, 132, 199, .35);
}

/* Recessed panels — the white-on-white washes */
:root[data-theme="light"] .ov-item {
  background: #f6f7f8;
  border-color: #e8ebee;
}
:root[data-theme="light"] .mgmt-card {
  background: #fbfcfd;
  border-color: #e8ebee;
}
:root[data-theme="light"] .btn-back,
:root[data-theme="light"] .unified-nav {
  background: #ffffff;
  border-color: #e3e6e9;
}
:root[data-theme="light"] .btn-back:hover {
  background: #f1f6fb;
  border-color: rgba(2, 132, 199, .35);
  color: var(--text-1);
}

/* .btn-nav:hover sets #f1f5f9 — near-white ink on a light background */
:root[data-theme="light"] .btn-nav:hover {
  background: #f1f6fb;
  color: var(--text-1);
}

/* Smooth the flip */
:root[data-theme="light"] body,
body { transition: background-color .25s ease, color .25s ease; }
