/** * theme.css — Variables de tema (fosc/clar) per al "xassís" de l'aplicació * * Abast (Fase 1): menu-bar, finestres (windows.css), estils globals (app.css) * i consola (console-output.css). NO afecta els panells "instrument" * (editor gràfic, vèrtebres, bessons físics), que mantenen sempre l'estil * fosc tipus quadre elèctric/PLC. * * El tema s'aplica amb l'atribut data-theme al : * document.documentElement.setAttribute('data-theme', 'dark' | 'light') * * Es llegeix/desa via ConfigManager.getTheme() / setTheme() (localStorage, * clau 'iotv-config'). Un petit script inline a index.html aplica l'atribut * abans de pintar la pàgina per evitar flaix del tema equivocat. */ :root, :root[data-theme="dark"] { --bg-body: #1e1e1e; --bg-panel: #2c3e50; /* menu-bar, finestres, taskbar, dropdown */ --bg-panel-alt: #34495e; /* header finestra, dropdown hover/vores, taskbar-button */ --bg-panel-alt-hover: #3d5266; /* header finestra activa, taskbar-button hover */ --bg-content: #1e1e1e; /* contingut de finestra */ --border-color: #34495e; --text-primary: #ecf0f1; --text-muted: #7f8c8d; --text-muted-2: #95a5a6; --accent: #3498db; --accent-hover: #2980b9; --accent-soft: rgba(52, 152, 219, 0.3); --success: #2ecc71; --danger: #e74c3c; --warning: #f1c40f; --scrollbar-track: #2c3e50; --scrollbar-track-alt: #1e1e1e; --scrollbar-thumb: #555555; --scrollbar-thumb-hover: #777777; --shadow-window: rgba(0, 0, 0, 0.4); --shadow-menu: rgba(0, 0, 0, 0.3); --overlay-bg: rgba(0, 0, 0, 0.7); /* Consola (paleta fosca estil VSCode) */ --console-bg: #1e1e1e; --console-header-bg: #2d2d30; --console-border: #3e3e42; --console-title: #cccccc; --console-text: #d4d4d4; --console-timestamp: #858585; --console-error: #f48771; --console-success: #89d185; --console-warn: #dcdcaa; --console-info: #4fc1ff; --console-debug: #858585; } :root[data-theme="light"] { --bg-body: #f4f6f8; --bg-panel: #ffffff; --bg-panel-alt: #e8ecf0; --bg-panel-alt-hover: #dde3e9; --bg-content: #ffffff; --border-color: #d5dbe1; --text-primary: #1c2733; --text-muted: #6b7785; --text-muted-2: #8a95a1; --accent: #2176c7; --accent-hover: #1a5da3; --accent-soft: rgba(33, 118, 199, 0.2); --success: #1f9d55; --danger: #d93025; --warning: #b8860b; --scrollbar-track: #e8ecf0; --scrollbar-track-alt: #ffffff; --scrollbar-thumb: #c2c8ce; --scrollbar-thumb-hover: #a7afb7; --shadow-window: rgba(0, 0, 0, 0.15); --shadow-menu: rgba(0, 0, 0, 0.12); --overlay-bg: rgba(0, 0, 0, 0.4); /* Consola (paleta clara) */ --console-bg: #ffffff; --console-header-bg: #f3f3f3; --console-border: #dcdcdc; --console-title: #444444; --console-text: #1e1e1e; --console-timestamp: #8a8a8a; --console-error: #c0392b; --console-success: #1f9d55; --console-warn: #9a7d0a; --console-info: #1a6fb0; --console-debug: #8a8a8a; }