/* * Theme variables. * * Two independent concepts (see docs/ARCHITECTURE.md ยง9): * - Light/dark mode: user-level, controlled by [data-theme] on . * - Tenant brand color: applied as an inline CSS custom-property * override from tenants.theme_settings, starting Phase 1. This * file only defines the light/dark system, which every tenant * theme layers on top of. */ :root { --color-bg: #ffffff; --color-surface: #f7f7f8; --color-border: #e2e2e5; --color-text-primary: #18181b; --color-text-secondary: #6b7280; --color-accent: #4f46e5; --color-accent-contrast: #ffffff; --color-error: #dc2626; --color-error-bg: #fef2f2; --radius-md: 10px; --radius-lg: 16px; --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.06); --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.08); --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; } [data-theme="dark"] { --color-bg: #0f0f12; --color-surface: #1a1a1e; --color-border: #2a2a2f; --color-text-primary: #f4f4f5; --color-text-secondary: #a1a1aa; --color-accent: #818cf8; --color-accent-contrast: #0f0f12; --color-error: #f87171; --color-error-bg: #2a1414; --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4); --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.5); }