/* ============================================================================
 * DrNick widget · LIGHT THEME
 * ----------------------------------------------------------------------------
 * Parallel to the dark defaults. SAME variable names, different values — so a
 * theme switch is ONE attribute on the widget root:
 *
 *     <div class="dn-root" data-theme="light"> … </div>     // light
 *     <div class="dn-root">                    … </div>     // dark (default)
 *
 * No component rules are rewritten. This block re-declares the ONFA design-
 * system neutral tokens + the widget-local --dn-* tokens for a light surface.
 * The gold accent KEEPS its role and value (#efc243) for fills; gold used as
 * TEXT switches to the --gold-700 stop so it stays legible on white.
 *
 * Load order:  colors_and_type.css → components.css → widget.css → themes.css
 * ==========================================================================*/

/* Scoped to the widget root (NOT global) so an embedding host's own [data-theme]
 * elements are never re-skinned. The data-theme value is set by the JS adapter
 * (resolveTheme): standalone = internal toggle; embedded = follows ONFA body.dark-mode. */
.dn-root[data-theme="light"] {
  /* ── Surfaces (light "raised = whiter" ladder; panel floor is white) ───── */
  --bg:          #ffffff;   /* panel floor / conversation background */
  --bg-2:        #f4f2ec;
  --panel:       #f4f2ec;   /* chips, quick buttons, tool row, confirm base */
  --panel-2:     #f0eee7;   /* bot bubble, hover surface */
  --panel-3:     #e7e3d9;   /* pressed, icon backplate */
  --secondary:   rgba(20,18,10,0.05);
  --elevated:    #ffffff;   /* dialog / menu */

  /* ── Hairlines (dark ink at low alpha) ─────────────────────────────────── */
  --line:        rgba(20,18,10,0.10);
  --line-strong: rgba(20,18,10,0.16);
  --hairline:    rgba(20,18,10,0.06);

  /* ── Text (warm near-black ramp) ───────────────────────────────────────── */
  --fg-1:        #14130d;   /* primary */
  --fg-2:        #3c3a31;   /* body */
  --fg-3:        #6a675d;   /* secondary */
  --fg-4:        #918e85;   /* muted, mono labels */
  --fg-5:        #b7b4ab;   /* disabled */
  --text:        var(--fg-1);
  --text-soft:   var(--fg-2);
  --muted:       var(--fg-3);
  --muted-2:     var(--fg-4);

  /* ── Gold for light: fills keep #efc243; borders darken so they read ───── */
  --gold-soft:   rgba(239,194,67,0.18);
  --gold-line:   rgba(168,121,16,0.42);   /* gold-700 @ ~42% — visible on white */
  --gold-glow:   rgba(239,194,67,0.22);

  /* ── Status (slightly deepened for white-bg contrast) ──────────────────── */
  --pos:         #128a5e;
  --pos-soft:    rgba(18,138,94,0.12);
  --pos-line:    rgba(18,138,94,0.30);
  --neg:         #c42a3e;
  --neg-soft:    rgba(196,42,62,0.10);
  --neg-line:    rgba(196,42,62,0.28);
  --info:        #1f6fd6;
  --info-soft:   rgba(31,111,214,0.10);
  --info-line:   rgba(31,111,214,0.28);

  /* ── Elevation (soft, warm — no heavy black) ───────────────────────────── */
  --shadow-2:    0 8px 24px rgba(40,35,20,0.10);
  --shadow-3:    0 24px 70px rgba(40,35,20,0.18), inset 0 1px 0 rgba(255,255,255,0.6);
  --shadow-gold: 0 0 20px rgba(239, 194, 67,0.30);
  --shadow-gold-strong: 0 0 34px rgba(239, 194, 67,0.45);

  /* ── Widget-local tokens (light) ───────────────────────────────────────── */
  --dn-chrome:       rgba(255,255,255,0.82);
  --dn-panel-shadow: 0 26px 70px rgba(40,35,20,0.18);
  --dn-input-bg:     #f1efe9;
  --dn-user-bubble:  #e6e2d8;
  --dn-inset-bg:     #f3f1ea;
  --dn-file-bg:      #f3f1ea;
  --dn-pre-bg:       #f2f0e9;
  --dn-scroll:       rgba(20,18,10,0.20);
  --dn-grid-dot:     rgba(20,18,10,0.05);
  --dn-bloom-1:      rgba(239, 194, 67,0.12);
  --dn-bloom-2:      rgba(239, 194, 67,0.07);
  --dn-fab-img-a:    #efeae0;
  --dn-fab-img-b:    #ffffff;
  --dn-code-bg:      rgba(239, 194, 67,0.16);
  --dn-code-fg:      var(--gold-700);
  --dn-focus-ring:   rgba(239, 194, 67,0.24);
  --dn-gold-text:    var(--gold-700);   /* #a87910 — legible gold text on white */
}

/* The send button keeps a gold fill with near-black ink in BOTH themes — the
   single highest-contrast brand moment. (No override needed; documented here.) */