/* ============================================================================ * /public/css/theme-dark.css * ---------------------------------------------------------------------------- * Canonical dark-theme variable overrides for the platform. * * Created during CSS Architecture Phase 1 (2026-05-10) by extracting the * `body.dark-theme, [data-theme-mode="dark"]` block (and the * `body.light-theme` alias placeholder) from /public/css/styles.css * verbatim — byte-identical for variable definitions. * * STATUS (Phase 1): Scaffolding only. NOT linked from any HTML yet. * The runtime still resolves dark-theme variables from styles.css. * * Selector strategy (preserved from styles.css): * - body.dark-theme (legacy class-based switch) * - [data-theme-mode="dark"] (canonical attribute-based switch, set * on by branding-preload.js) * * See: DOCUMENTS_CODETRUTH/04_PLATFORM/CSS-ARCHITECTURE/audit-2026-05-10.md * ============================================================================ */ /* Phase 9: Dark theme (tenant-customizable) */ [data-theme-mode="dark"] { /* Dark Background Colors */ --bg-primary: #0a1520; --bg-secondary: #132b44; --bg-tertiary: #1a2d3f; --bg-light: #1a2d3f; --card-bg: #0f1e2e; --bg-card: #0f1e2e; --bg-hero: linear-gradient(135deg, rgba(79, 70, 229, 0.10) 0%, rgba(124, 58, 237, 0.06) 100%); /* Dark Text Colors */ --text-primary: #c5c3c3; --text-secondary: #9c9b9b; /* Dark Accent Colors */ --accent: #67eaf8; --accent-hover: #40b9c5; --accent-rgb: 103, 234, 248; /* derived from #67eaf8 */ /* Dark Message Colors */ --user-msg: #084263; --assistant-msg: #1779a1; /* Dark Border Colors */ --border: #053f75; --border-color: rgba(255, 255, 255, 0.1); /* Dark Shadow */ --shadow-sm: 0 4px 14px rgba(0,0,0,.25); /* Surface variables previously only defined in theme-dark-brown.css (now deprecated). Consumers in /public/scalpi, /public/futures, etc. reference these directly — keep them in sync with the rest of the dark palette so deprecating the variant CSS doesn't leave them undefined. */ --sidebar-bg: #0a1520; /* same as --bg-primary */ --header-bg: #0a1520; /* same as --bg-primary */ --input-bg: #0f1e2e; /* same as --bg-secondary */ --selection-bg: var(--accent); --selection-text: #ffffff; /* Hover / muted text in dark theme. Modules (prop-trading, predictions, trades) reference these directly. `--text-muted` mirrors prop-trading's commented :root value; `--bg-hover` is one elevation above `--bg-card`. */ --text-muted: #6e7681; --bg-hover: #1f2937; /* Stronger border for emphasized dividers in dark theme. */ --border-strong: rgba(255, 255, 255, 0.16); /* Module palette (DARK theme). Brighter, more saturated than the light-theme equivalents in :root for legibility on dark surfaces. `--accent-dim` is computed from `--accent-rgb` (the tenant-overridable RGB tuple) so brand changes propagate automatically. */ --accent-dim: rgba(var(--accent-rgb), 0.05); --green: #3fb950; --green-dim: rgba(63, 185, 80, 0.15); --yellow: #d29922; --yellow-dim: rgba(210, 153, 34, 0.15); --orange: #f97316; --orange-dim: rgba(249, 115, 22, 0.15); --red: #f85149; --red-dim: rgba(248, 81, 73, 0.15); --purple: #a855f7; --purple-dim: rgba(168, 85, 247, 0.15); /* Secondary accent in dark theme (predictions venue badges, etc.). Slightly brighter than the light-theme equivalent for contrast. */ --accent-2: #7af804; } /* Phase 9: Alias for backward compatibility */ [data-theme-mode="light"] { /* Uses :root defaults (light theme) */ }