/* ══════════════════════════════════════════════════════════ NEURAL MAISTRO — SHARED LIGHT MODE Activated via: Persisted via: localStorage.neural-theme = 'light' ══════════════════════════════════════════════════════════ */ /* ── CSS-Variable overrides ───────────────────────────────── */ html.light-mode { --neon: #b01060; --neon-glow: rgba(176,16,96,0.35); --neon-dim: rgba(0,100,50,0.18); --neon-green: #007a40; --neon-blue: #005fa3; --neon-purple: #6600aa; --neon-orange: #b05000; --neon-pink: #b00040; --neon-cyan: #007a90; --bg: #f5f7f5; --bg-black: #f5f7f5; --panel: rgba(255,255,255,0.98); --panel-bg: rgba(255,255,255,0.98); --border-glow: rgba(0,100,50,0.18); --user-bubble: rgba(0,120,60,0.07); --ai-bubble: rgba(238,248,242,0.9); } /* ── Body ─────────────────────────────────────────────────── */ html.light-mode body { background: #f0f5f1 !important; color: #1a2820 !important; } html.light-mode body::before { background-image: linear-gradient(rgba(0,100,50,0.05) 1px, transparent 1px), linear-gradient(90deg, rgba(0,100,50,0.05) 1px, transparent 1px) !important; } /* ── Scanline — hide in light mode ────────────────────────── */ html.light-mode .scanline { opacity: 0 !important; pointer-events: none; } /* ── Panels & sidebar ──────────────────────────────────────── */ html.light-mode aside, html.light-mode .glass, html.light-mode .glass-panel { background: rgba(255,255,255,0.98) !important; border-color: rgba(0,100,50,0.15) !important; } /* ── Header / topbars ──────────────────────────────────────── */ html.light-mode header, html.light-mode .header-inner, html.light-mode .tab-bar { background: rgba(240,245,241,0.98) !important; border-color: rgba(0,100,50,0.15) !important; color: #1a2820 !important; } /* Inline-style dark bg override (topbars that use rgba) */ html.light-mode [style*="background:rgba(10,6,0"], html.light-mode [style*="background:rgba(2,10,5"], html.light-mode [style*="background:rgba(10,0,8"], html.light-mode [style*="background:rgba(20,0,12"], html.light-mode [style*="background:rgba(6,20,12"], html.light-mode [style*="background: rgba(2,10,5"], html.light-mode [style*="background: rgba(10,6,0"], html.light-mode [style*="background: rgba(6,20,12"] { background: rgba(240,245,241,0.97) !important; } /* ── Tailwind text overrides ───────────────────────────────── */ html.light-mode .text-white { color: #1a2820 !important; } html.light-mode .text-gray-100 { color: #1a2820 !important; } html.light-mode .text-gray-200 { color: #2a3828 !important; } html.light-mode .text-gray-300 { color: #3a4838 !important; } html.light-mode .text-gray-400 { color: #5a6858 !important; } html.light-mode .text-gray-500 { color: #6a786a !important; } html.light-mode .text-gray-600 { color: #5a6858 !important; } /* ── Inputs, selects, textareas ────────────────────────────── */ html.light-mode input, html.light-mode select, html.light-mode textarea { background: #ffffff !important; border-color: rgba(0,100,50,0.25) !important; color: #1a2820 !important; } html.light-mode input::placeholder, html.light-mode textarea::placeholder { color: #9aaa9a !important; } html.light-mode select option { background: #ffffff; color: #1a2820; } html.light-mode input:focus, html.light-mode select:focus, html.light-mode textarea:focus { border-color: #007a40 !important; box-shadow: 0 0 8px rgba(0,120,60,0.18) !important; } /* ── Tab buttons (universal) ───────────────────────────────── */ html.light-mode .tab-btn { color: rgba(26,40,32,0.55) !important; border-color: rgba(0,100,50,0.2) !important; background: transparent !important; text-shadow: none !important; box-shadow: none !important; } html.light-mode .tab-btn:hover { background: rgba(0,100,50,0.07) !important; color: #1a2820 !important; } html.light-mode .tab-btn.active { color: #007a40 !important; border-color: #007a40 !important; background: rgba(0,120,60,0.09) !important; text-shadow: none !important; box-shadow: none !important; } html.light-mode .tab-btn.tab-source.active { color: #6600aa !important; border-color: #6600aa !important; background: rgba(100,0,170,0.07) !important; } html.light-mode .tab-btn.tab-crawl.active { color: #005fa3 !important; border-color: #005fa3 !important; background: rgba(0,95,163,0.07) !important; } /* ── Glow text — remove glow in light mode ─────────────────── */ html.light-mode .glow, html.light-mode .glow-green, html.light-mode .glow-blue, html.light-mode .glow-purple, html.light-mode .glow-text { text-shadow: none !important; } /* ── Nav items ─────────────────────────────────────────────── */ html.light-mode .nav-item:hover { background: rgba(0,100,50,0.08) !important; border-left-color: #007a40 !important; } html.light-mode .nav-item.active { background: rgba(0,100,50,0.1) !important; border-left-color: #007a40 !important; } /* ── Module cards (index.html) ─────────────────────────────── */ html.light-mode .module-card { background: rgba(255,255,255,0.92) !important; border-color: rgba(0,100,50,0.18) !important; } html.light-mode .module-card:hover { background: rgba(255,255,255,1) !important; border-color: rgba(0,120,60,0.45) !important; } /* ── Chat bubbles ──────────────────────────────────────────── */ html.light-mode .msg-user, html.light-mode .user-message { background: rgba(0,120,60,0.07) !important; border-color: rgba(0,120,60,0.14) !important; } html.light-mode .msg-ai, html.light-mode .ai-message { background: rgba(238,248,242,0.85) !important; border-color: rgba(0,100,50,0.1) !important; } /* ── Code blocks ───────────────────────────────────────────── */ html.light-mode pre, html.light-mode code { background: #eef3ee !important; color: #1a2820 !important; } /* ── SEARCH: result & synthesis boxes ──────────────────────── */ html.light-mode .synthesis-box { background: #eef5f0 !important; border-color: rgba(0,100,50,0.2) !important; } html.light-mode .synthesis-label, html.light-mode .synthesis-text { color: #1a2820 !important; } html.light-mode .result-card, html.light-mode .result-item, html.light-mode .result-link-row { background: #ffffff !important; border-color: rgba(0,100,50,0.14) !important; } html.light-mode .success-bar { background: rgba(0,120,60,0.08) !important; color: #007a40 !important; border-color: rgba(0,120,60,0.2) !important; } html.light-mode .error-box { background: rgba(180,0,0,0.06) !important; } html.light-mode .latency-badge { background: rgba(0,100,50,0.1) !important; color: #007a40 !important; border-color: rgba(0,100,50,0.2) !important; } /* ── EMBEDDINGS ────────────────────────────────────────────── */ html.light-mode .badge { background: rgba(0,100,50,0.07) !important; border-color: rgba(0,100,50,0.18) !important; color: #007a40 !important; } html.light-mode .search-result { background: rgba(0,100,50,0.03) !important; border-color: rgba(0,100,50,0.12) !important; } html.light-mode .search-result:hover { background: rgba(0,100,50,0.07) !important; border-color: rgba(0,100,50,0.3) !important; } html.light-mode .sim-bar-track { background: rgba(0,100,50,0.1) !important; } html.light-mode .doc-item { background: rgba(0,100,50,0.03) !important; border-color: rgba(0,100,50,0.1) !important; } /* ── Scrollbars ────────────────────────────────────────────── */ html.light-mode ::-webkit-scrollbar-thumb { background: rgba(0,100,50,0.28) !important; } html.light-mode ::-webkit-scrollbar-track { background: rgba(0,0,0,0.04) !important; } /* ══════════════════════════════════════════════════════════ THEME TOGGLE BUTTON ══════════════════════════════════════════════════════════ */ #theme-toggle { background: transparent; border: 1px solid rgba(0,255,136,0.3); color: rgba(0,255,136,0.75); border-radius: 8px; padding: 5px 9px; cursor: pointer; font-size: 0.95rem; line-height: 1; transition: all 0.2s; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; } #theme-toggle:hover { background: rgba(0,255,136,0.1); color: #00ff88; border-color: rgba(0,255,136,0.55); } html.light-mode #theme-toggle { border-color: rgba(0,100,50,0.35); color: #007a40; background: rgba(255,255,255,0.7); } html.light-mode #theme-toggle:hover { background: rgba(0,100,50,0.1); } /* ══════════════════════════════════════════════════════════ SEARCH-NEURAL — targeted text & box fixes ══════════════════════════════════════════════════════════ */ html.light-mode .result-title { color: #005fa3 !important; text-shadow: none !important; } html.light-mode .result-url { color: #5a7a6a !important; } html.light-mode .result-desc { color: #2a3a30 !important; } html.light-mode .crawl-btn { background: rgba(100,0,170,0.07) !important; border-color: rgba(100,0,170,0.3) !important; color: #6600aa !important; } html.light-mode .crawl-btn:hover { background: rgba(100,0,170,0.13) !important; color: #5500aa !important; } html.light-mode .crawl-result { background: rgba(100,0,170,0.04) !important; border-color: rgba(100,0,170,0.15) !important; } html.light-mode .crawl-result-label { color: #6600aa !important; } html.light-mode .crawl-result-text { color: #2a3a30 !important; } html.light-mode .related-box { background: rgba(240,247,242,0.9) !important; border-color: rgba(0,100,50,0.15) !important; } html.light-mode .related-q { color: #005fa3 !important; border-color: rgba(0,95,163,0.2) !important; background: rgba(0,95,163,0.05) !important; } html.light-mode .related-q:hover { background: rgba(0,95,163,0.1) !important; } /* ══════════════════════════════════════════════════════════ CHAT-NEURAL — msg-content + input area fixes ══════════════════════════════════════════════════════════ */ /* Hardcoded light colors in msg-content (CSS rules, not inline) */ html.light-mode .msg-content { color: #1a2820 !important; } html.light-mode .msg-content strong { color: #1a4030 !important; } html.light-mode .msg-content em { color: #1a3540 !important; } html.light-mode .msg-content a { color: #005fa3 !important; } html.light-mode .msg-content h1, html.light-mode .msg-content h2, html.light-mode .msg-content h3 { color: #007a40 !important; } html.light-mode .msg-content th { background: rgba(0,100,50,0.07) !important; color: #007a40 !important; } html.light-mode .msg-content td, html.light-mode .msg-content th { border-color: rgba(0,100,50,0.18) !important; } html.light-mode .msg-content blockquote { border-left-color: #007a40 !important; } html.light-mode .msg-content code:not(.hljs) { color: #007a40 !important; background: #eef3ee !important; border-color: rgba(0,100,50,0.2) !important; } html.light-mode .msg-content pre { background: #eef3ee !important; border-color: rgba(0,100,50,0.15) !important; } /* Input area (class-based bg) */ html.light-mode #input-area { background: rgba(240,245,241,0.97) !important; border-top-color: rgba(0,100,50,0.15) !important; } html.light-mode #user-input { background: #ffffff !important; color: #1a2820 !important; border-color: rgba(0,100,50,0.25) !important; } /* Msg labels */ html.light-mode .msg-ai .msg-label { color: #005fa3 !important; } html.light-mode .msg-user .msg-label { color: #007a40 !important; } /* btn-icon (template buttons: Erkläre, Code, etc.) */ html.light-mode .btn-icon { background: rgba(0,100,50,0.07) !important; border-color: rgba(0,100,50,0.2) !important; color: #2a4a30 !important; } html.light-mode .btn-icon:hover { background: rgba(0,100,50,0.14) !important; color: #1a3020 !important; } /* ══════════════════════════════════════════════════════════ SEARCH OUTREACH TAB — light mode ══════════════════════════════════════════════════════════ */ html.light-mode .contact-section { background: rgba(255,107,53,.04) !important; border-color: rgba(255,107,53,.2) !important; } html.light-mode .contact-section-header { color: #cc4400 !important; } html.light-mode .contact-count { background: rgba(255,107,53,.12) !important; color: #cc4400 !important; } html.light-mode .outreach-copy-all { background: rgba(255,107,53,.08) !important; border-color: rgba(255,107,53,.3) !important; color: #cc4400 !important; } html.light-mode .outreach-copy-all:hover { background: rgba(255,107,53,.18) !important; } html.light-mode .contact-chip { background: rgba(255,107,53,.06) !important; border-color: rgba(255,107,53,.2) !important; color: #7a2a00 !important; } html.light-mode .contact-chip:hover { background: rgba(255,107,53,.16) !important; border-color: rgba(255,107,53,.5) !important; color: #4a1000 !important; } html.light-mode .contact-chip a { color: inherit !important; } html.light-mode .chip-fb { color: #1a4a99 !important; background: rgba(24,119,242,.06) !important; border-color: rgba(24,119,242,.25) !important; } html.light-mode .chip-ig { color: #8b1a40 !important; background: rgba(225,48,108,.06) !important; border-color: rgba(225,48,108,.25) !important; } html.light-mode .chip-li { color: #0a4a7a !important; background: rgba(10,102,194,.06) !important; border-color: rgba(10,102,194,.25) !important; } html.light-mode .chip-tw { color: #1a5a8a !important; background: rgba(29,161,242,.06) !important; border-color: rgba(29,161,242,.25) !important; } html.light-mode .chip-yt { color: #990000 !important; background: rgba(255,0,0,.06) !important; border-color: rgba(255,0,0,.25) !important; } html.light-mode .chip-tt { color: #2a5a60 !important; background: rgba(105,201,208,.06) !important; border-color: rgba(105,201,208,.25) !important; } html.light-mode .chip-wa { color: #1a6a30 !important; background: rgba(37,211,102,.06) !important; border-color: rgba(37,211,102,.25) !important; } html.light-mode .chip-tg { color: #1a5a7a !important; background: rgba(41,182,246,.06) !important; border-color: rgba(41,182,246,.25) !important; } html.light-mode .chip-pi { color: #880020 !important; background: rgba(230,0,35,.06) !important; border-color: rgba(230,0,35,.25) !important; } html.light-mode .chip-xi { color: #0a3a6a !important; background: rgba(6,90,160,.06) !important; border-color: rgba(6,90,160,.25) !important; } html.light-mode .chip-other { color: #4a4a4a !important; background: rgba(120,120,120,.05) !important; border-color: rgba(120,120,120,.2) !important; } html.light-mode .social-group-label { color: rgba(30,40,30,.4) !important; } html.light-mode .no-contacts { color: rgba(180,80,0,.55) !important; }