/* ============================================================ UX-DS-1 — "Day mode" (opt-in light theme) Palette: Exec Functions design system (exec-platform/app/globals.css, light mode). Activated by adding class `day-mode` to (see /static/js/daymode.js — localStorage key `ns_theme_mode`). Default remains the dark "Night" theme defined in index.html :root. `body.day-mode` outranks both the base `:root` block and tenant theme.css `:root` overrides, so all tenants inherit day mode. ============================================================ */ body.day-mode { /* Backgrounds — EF light */ --bg: #f8f5fb; /* EF --background: pale purple-white */ --surface: #ffffff; /* EF --surface */ --surface1: #ffffff; /* used by drawers/modals (defined per-tenant on dark) */ --surface2: #f2ebf8; /* EF --surface-raised / brand-purple-pale */ --surface2-hover: #e9ddf4; --hover: #e9ddf4; --border: #d9c8ea; /* EF --brand-purple-border */ /* Accent — EF brand purple (reads well on light) */ --accent: #4e196f; /* EF --brand-purple */ --accent2: #6b2f96; /* readable mid-purple for emphasis text on light */ --accent-deep: #3d1358; /* EF --brand-purple-hover */ /* Status colours — darker variants that read on white */ --green: #059669; --yellow: #b45309; --orange: #c2410c; --red: #dc2626; /* Text */ --text: #1a0d26; /* EF --foreground: near-black plum */ --fg: #1a0d26; --muted: #66557a; /* EF --muted darkened for AA contrast on #f8f5fb */ } /* ------------------------------------------------------------ Targeted fixes for hardcoded dark-theme literals that CSS variables can't reach. `body.day-mode` + !important outranks tenant theme.css !important rules and inline styles. ------------------------------------------------------------ */ /* Row hover was rgba(255,255,255,.02) — invisible on white */ body.day-mode tr:hover td { background: rgba(78,25,111,.05) !important; } /* Dropdown option hover was rgba(255,255,255,.04) */ body.day-mode .col-filter-item:hover { background: rgba(78,25,111,.06) !important; } /* Indigo-tinted actives, re-tinted to EF purple on light */ body.day-mode .msg.result-active .msg-bubble { background: rgba(78,25,111,.07) !important; } body.day-mode tr.enriching-row td { background: rgba(78,25,111,.05) !important; } body.day-mode .enriched-pill { background: rgba(78,25,111,.12) !important; } body.day-mode .enriched-pill:hover { background: rgba(78,25,111,.20) !important; } body.day-mode .preview-notice { background: rgba(78,25,111,.08) !important; } /* Hardcoded light status text (#f87171 / #fbbf24) unreadable on light */ body.day-mode .usage-warn-banner.critical { color: #dc2626 !important; border-color: rgba(220,38,38,.4) !important; } body.day-mode .eng-high { color: #dc2626 !important; } body.day-mode .eng-medium { color: #b45309 !important; } /* "Exec Functions" header link: inline #a89bc2 lavender, too pale on light */ body.day-mode .logo a[href*="execfunctions"] { color: #66557a !important; } /* Soften heavy dark-theme drop shadows on light surfaces */ body.day-mode .export-menu, body.day-mode .col-filter-dropdown, body.day-mode .threshold-popover { box-shadow: 0 6px 24px rgba(26,13,38,.15) !important; } body.day-mode .google-btn { border-color: #d9c8ea; } body.day-mode .google-btn:hover { box-shadow: 0 2px 8px rgba(26,13,38,.12); } /* Modal dimmer: slightly lighter veil on light theme */ body.day-mode .upload-overlay, body.day-mode .zero-overlay, body.day-mode .admin-overlay, body.day-mode .settings-overlay { background: rgba(26,13,38,.45); } /* Export split-button divider was rgba(255,255,255,.25) on accent — still fine on the dark purple accent, but nudge for consistency */ body.day-mode .export-split .export-main { border-right-color: rgba(255,255,255,.35) !important; }