/* ===================================================================================
   BABUBA THEME - dark-first, warm-black, single lime accent. GENERATED by
   ops/gen-theme.py - do not hand-edit the token block; edit the ramps there and re-run.

   Loaded AFTER the bundle stylesheet, and deliberately UNLAYERED: Tailwind ships its
   tokens inside @layer theme, and unlayered declarations outrank layered ones regardless
   of source order. So these values win without !important anywhere.
   =================================================================================== */
html.dark {
  --color-amber-100: #2A2009;
  --color-amber-200: #3A2C0C;
  --color-amber-300: #F7BC5C;
  --color-amber-400: #F6B043;
  --color-amber-50: #1F1808;
  --color-amber-500: #F5A623;
  --color-amber-600: #F5A623;
  --color-amber-700: #E0911A;
  --color-amber-800: #B87414;
  --color-amber-900: #8A570F;
  --color-amber-950: #4A2E08;
  --color-blue-100: #16161A;
  --color-blue-200: #26262B;
  --color-blue-300: #33333A;
  --color-blue-400: #8A8A93;
  --color-blue-50: #0E0E10;
  --color-blue-500: #A2A2AA;
  --color-blue-600: #BDBDB6;
  --color-blue-700: #D4D4CD;
  --color-blue-800: #E8E8E2;
  --color-cyan-600: #BDBDB6;
  --color-cyan-700: #D4D4CD;
  --color-emerald-100: #10241B;
  --color-emerald-200: #153122;
  --color-emerald-300: #4FC79B;
  --color-emerald-400: #2AB483;
  --color-emerald-50: #0C1A15;
  --color-emerald-500: #0F9D6C;
  --color-emerald-600: #0F9D6C;
  --color-emerald-700: #0C835A;
  --color-emerald-800: #0A6A49;
  --color-emerald-900: #085238;
  --color-emerald-950: #04301F;
  --color-gray-100: #16161A;
  --color-gray-200: #26262B;
  --color-gray-300: #33333A;
  --color-gray-400: #8A8A93;
  --color-gray-50: #0E0E10;
  --color-gray-500: #A2A2AA;
  --color-gray-600: #BDBDB6;
  --color-gray-700: #D4D4CD;
  --color-gray-800: #E8E8E2;
  --color-gray-900: #F2F2EE;
  --color-green-100: #10241B;
  --color-green-200: #153122;
  --color-green-300: #4FC79B;
  --color-green-400: #2AB483;
  --color-green-50: #0C1A15;
  --color-green-500: #0F9D6C;
  --color-green-600: #0F9D6C;
  --color-green-700: #0C835A;
  --color-indigo-100: #1D2612;
  --color-indigo-200: #2A3719;
  --color-indigo-300: #DCF89B;
  --color-indigo-400: #D3F573;
  --color-indigo-50: #151A0E;
  --color-indigo-500: #C9F24B;
  --color-indigo-600: #C9F24B;
  --color-indigo-700: #B8E336;
  --color-indigo-800: #9BC72B;
  --color-indigo-900: #7EA321;
  --color-indigo-950: #4F6715;
  --color-neutral-100: #16161A;
  --color-neutral-200: #26262B;
  --color-neutral-300: #33333A;
  --color-neutral-400: #8A8A93;
  --color-neutral-50: #0E0E10;
  --color-neutral-500: #A2A2AA;
  --color-neutral-600: #BDBDB6;
  --color-neutral-700: #D4D4CD;
  --color-neutral-800: #E8E8E2;
  --color-neutral-900: #F2F2EE;
  --color-neutral-950: #FAFAF6;
  --color-orange-100: #2A2009;
  --color-orange-200: #3A2C0C;
  --color-orange-400: #F6B043;
  --color-orange-50: #1F1808;
  --color-orange-500: #F5A623;
  --color-orange-700: #E0911A;
  --color-pink-200: #26262B;
  --color-pink-50: #0E0E10;
  --color-pink-700: #D4D4CD;
  --color-purple-100: #16161A;
  --color-purple-200: #26262B;
  --color-purple-400: #8A8A93;
  --color-purple-50: #0E0E10;
  --color-purple-500: #A2A2AA;
  --color-purple-600: #BDBDB6;
  --color-purple-700: #D4D4CD;
  --color-purple-800: #E8E8E2;
  --color-red-100: #2A1618;
  --color-red-200: #3A1D20;
  --color-red-300: #F08A8D;
  --color-red-400: #EE6A6E;
  --color-red-50: #1F1213;
  --color-red-500: #E5484D;
  --color-red-600: #D93A3F;
  --color-red-700: #BE3035;
  --color-red-800: #9C272B;
  --color-red-900: #7A1F22;
  --color-red-950: #421012;
  --color-rose-100: #2A1618;
  --color-rose-200: #3A1D20;
  --color-rose-300: #F08A8D;
  --color-rose-400: #EE6A6E;
  --color-rose-50: #1F1213;
  --color-rose-500: #E5484D;
  --color-rose-600: #D93A3F;
  --color-rose-700: #BE3035;
  --color-rose-800: #9C272B;
  --color-rose-900: #7A1F22;
  --color-rose-950: #421012;
  --color-sky-100: #16161A;
  --color-sky-200: #26262B;
  --color-sky-300: #33333A;
  --color-sky-400: #8A8A93;
  --color-sky-50: #0E0E10;
  --color-sky-500: #A2A2AA;
  --color-sky-600: #BDBDB6;
  --color-sky-700: #D4D4CD;
  --color-sky-800: #E8E8E2;
  --color-sky-900: #F2F2EE;
  --color-sky-950: #FAFAF6;
  --color-slate-100: #1A1A1E;
  --color-slate-200: #222227;
  --color-slate-300: #D4D4CD;
  --color-slate-400: #A2A2AA;
  --color-slate-50: #141417;
  --color-slate-500: #8A8A93;
  --color-slate-600: #6E6E76;
  --color-slate-700: #26262B;
  --color-slate-800: #1E1E22;
  --color-slate-900: #0A0A0B;
  --color-slate-950: #060607;
  --color-teal-100: #10241B;
  --color-teal-200: #153122;
  --color-teal-50: #0C1A15;
  --color-teal-600: #0F9D6C;
  --color-teal-700: #0C835A;
  --color-violet-100: #16161A;
  --color-violet-200: #26262B;
  --color-violet-400: #8A8A93;
  --color-violet-50: #0E0E10;
  --color-violet-500: #A2A2AA;
  --color-violet-600: #BDBDB6;
  --color-violet-700: #D4D4CD;
  --color-violet-950: #FAFAF6;
  --color-yellow-100: #2A2009;
  --color-yellow-200: #3A2C0C;
  --color-yellow-300: #F7BC5C;
  --color-yellow-400: #F6B043;
  --color-yellow-50: #1F1808;
  --color-yellow-500: #F5A623;
  --color-yellow-600: #F5A623;
  --color-yellow-700: #E0911A;
  --color-white: #E8E8E2;
  --color-black: #0A0A0B;
  --font-sans: "Segoe UI", -apple-system, BlinkMacSystemFont, "SF Pro Text", Roboto,
               "Helvetica Neue", Arial, sans-serif;
  --bb-ink: #0A0A0B; --bb-panel: #1E1E22; --bb-lime: #C9F24B;
  --bb-text: #E8E8E2; --bb-amber: #F5A623; --bb-green: #0F9D6C;
  --bb-muted: #8A8A93; --bb-line: #26262B;
}

/* BASE - warm black, never pure black; warm off-white, never pure white */
html.dark,
html.dark body {
  background: var(--bb-ink);
  color: var(--bb-text);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
}

/* LIME TRAP: 4 accent-fill class tokens, 76 of them paired with text-white.
   On #C9F24B white text is ~1.3:1. Force ink, and let descendants inherit it. */
html.dark [class~="bg-indigo-500"],html.dark [class~="bg-indigo-600"],html.dark [class~="hover:bg-indigo-600"],html.dark [class~="hover:bg-indigo-700"] { color: var(--bb-ink); }
html.dark [class~="bg-indigo-500"] *,html.dark [class~="bg-indigo-600"] *,html.dark [class~="hover:bg-indigo-600"] *,html.dark [class~="hover:bg-indigo-700"] * { color: inherit; }
html.dark [class~="bg-indigo-500"],html.dark [class~="bg-indigo-600"],html.dark [class~="hover:bg-indigo-600"],html.dark [class~="hover:bg-indigo-700"]:hover { color: var(--bb-ink); }

/* bg-white is a SURFACE in a light-first app, so in dark-first it becomes a lifted panel.
   (--color-white itself stays warm off-white because text-white must stay readable.) */
html.dark [class~="bg-white"] { background-color: var(--bb-panel); }

/* FLAT - no gradients, no shadows, rounded cards */
html.dark *, html.dark *::before, html.dark *::after { box-shadow: none !important; }
html.dark [class*="bg-gradient"], html.dark [class*="from-"], html.dark [class*="via-"],
html.dark [class*="to-"] { background-image: none !important; }
html.dark [class*="shadow"] { box-shadow: none !important; filter: none !important; }
html.dark [class*="backdrop-blur"] { backdrop-filter: blur(6px); }
html.dark [class*="rounded-2xl"], html.dark [class*="rounded-xl"] { border-radius: 14px; }
html.dark [class*="rounded-lg"] { border-radius: 10px; }

/* SIDEBAR - icon-led, flat, lime for the active item only */
html.dark aside, html.dark nav[class*="sidebar"], html.dark [class*="w-64"], html.dark [class*="w-56"] {
  border-right: 1px solid var(--bb-line);
  background: #1E1E22;
}
html.dark [aria-current="page"], html.dark [class*="bg-lime-"], html.dark [class*="bg-indigo-6"] { border-radius: 10px; }

/* SCROLLBARS - low-gloss, matching the shell */
html.dark ::-webkit-scrollbar { width: 10px; height: 10px; }
html.dark ::-webkit-scrollbar-track { background: transparent; }
html.dark ::-webkit-scrollbar-thumb { background: #2E2E34; border-radius: 10px; }
html.dark ::-webkit-scrollbar-thumb:hover { background: #3A3A42; }

/* SELECTION */
html.dark ::selection { background: #C9F24B; color: var(--bb-ink); }
html.dark *:focus-visible { outline: 2px solid #C9F24B; outline-offset: 2px; border-radius: 6px; }

/* ===================================================================================
   BABUBA CONTROL-PANEL CONTROL TOKENS  (--ba-*)
   Appended 2026-09-29. Hand-patched components (Broker Accounts and any future one)
   must colour themselves from THESE, never from the theme's --color-* ramp: that ramp
   is remapped per theme, so a literal or a var(--color-*) can be right in dark and
   invisible in light. These carry an explicit value for BOTH themes, which is the only
   way one inline style can be correct in two modes.

   Light values are dark-on-cream. Dark values are the warm-black palette.
   =================================================================================== */
:root {
  --ba-fg:       #18181b;   /* button + body text on a transparent surface */
  --ba-dim:      #52525b;   /* secondary / clear button */
  --ba-border:   #c4c4cc;   /* button hairline, visible on cream */
  --ba-code:     #3f6212;   /* the 6-digit TOTP code - dark olive, reads on cream */
  --ba-code-bg:  #f1f1ec;   /* the code block's own surface */
  --ba-green:    #047857;   /* solid buttons - emerald-700 for white-text contrast */
  --ba-blue:     #0369a1;
  --ba-violet:   #6d28d9;
}
html.dark {
  --ba-fg:       #E8E8E2;
  --ba-dim:      #C4C4CC;
  --ba-border:   #52525b;
  --ba-code:     #C9F24B;   /* lime - the house accent */
  --ba-code-bg:  #15170e;   /* opaque olive-black - a translucent tint makes the code un-measurable */
  --ba-green:    #047857;   /* emerald-700, not 600: #059669 is only 3.77:1 with white */
  --ba-blue:     #0369a1;
  --ba-violet:   #6d28d9;
}

/* -----------------------------------------------------------------------------------
   PLACEHOLDER + DANGER TEXT  (appended 2026-09-29)
   The bundle ships no ::placeholder rule, so the browser default applied: a light grey
   that measured 2.60:1 on cream. And red "Retry"/danger surfaces pair a rose text token
   with a rose fill, which in dark mode measured 1.98:1 (light rose on rose).
   ----------------------------------------------------------------------------------- */
:root { --ba-placeholder: #6b7280; --ba-on-danger: #ffffff; }
html.dark { --ba-placeholder: #8b8b93; --ba-on-danger: #ffffff; }

input::placeholder, textarea::placeholder { color: var(--ba-placeholder); opacity: 1; }

/* any element that FILLS with a red/rose/danger background must carry readable ink */
[class~="bg-rose-500"], [class~="bg-rose-600"], [class~="bg-red-500"],
[class~="bg-red-600"], [class~="bg-rose-700"], [class~="bg-red-700"] {
  color: var(--ba-on-danger) !important;
}
[class~="bg-rose-500"] *, [class~="bg-rose-600"] *, [class~="bg-red-500"] *,
[class~="bg-red-600"] *, [class~="bg-rose-700"] *, [class~="bg-red-700"] * {
  color: inherit !important;
}

/* -----------------------------------------------------------------------------------
   MUTED TEXT + SOLID DANGER FILLS  (appended 2026-09-29)
   1. `text-gray-400` is the panel's muted token (the "Search… Ctrl K" trigger and
      dozens of hints). On cream it measured 2.60:1. Darkened for LIGHT ONLY - the
      dark theme already pairs it with dark:text-slate-500.
   2. A rose-on-rose pair (text-rose-300 on bg-rose-500) measured 1.98:1 in dark:
      text and fill were the same hue. Any SOLID red/rose fill now carries white ink.
      The :not([class*="/"]) guard skips translucent tints, where white would be wrong.
   ----------------------------------------------------------------------------------- */
html:not(.dark) [class~="text-gray-400"] { color: #5b6169; }
html:not(.dark) [class~="text-gray-500"] { color: #4b5563; }

[class*="bg-rose-"]:not([class*="/"]),
[class*="bg-red-"]:not([class*="/"]) { color: #ffffff !important; }
[class*="bg-rose-"]:not([class*="/"]) *,
[class*="bg-red-"]:not([class*="/"]) * { color: inherit !important; }