/* ============================================================ Sistema de temas. O tema e escolhido por [data-theme] no : - (sem atributo) -> Escuro (padrao) - data-theme="claro-azul" -> Claro, detalhes em azul - data-theme="claro-lilas" -> Claro, detalhes em lilas As cores usam canais RGB (--accent-rgb, --bg-rgb...) para que os rgba() do CSS sigam o tema (ex.: rgba(var(--accent-rgb), .12)). ============================================================ */ :root { /* estrutura */ --bg: #0d1117; --bg-rgb: 13, 17, 23; --surface: #161b22; --card: #1c2230; --border: #2a3347; /* accent principal */ --accent: #3dd9b3; --accent-rgb: 61, 217, 179; --accent-strong: #2ec9a2; --accent-soft: rgba(var(--accent-rgb), 0.12); --on-accent: #0d1117; /* texto sobre botao/chip com fundo accent */ /* accent secundario */ --accent2: #7b5ea7; --accent2-rgb: 123, 94, 167; --accent2-text: #a78bfa; /* semanticos */ --gold: #e8c84a; --danger: #ee5555; --warn: #f5a623; --blue: #60a5fa; /* texto */ --txt: #e6edf3; --txt-muted: #768390; /* efeitos e layout */ --shadow: 0 4px 24px rgba(0, 0, 0, 0.4); --radius: 12px; --font-h: "DM Serif Display", Georgia, serif; --font-b: "DM Sans", Arial, sans-serif; --sidebar: 232px; --topbar: 58px; } /* Claro - detalhes em azul */ :root[data-theme="claro-azul"] { --bg: #eef2f8; --bg-rgb: 238, 242, 248; --surface: #ffffff; --card: #ffffff; --border: #d7e0ee; --accent: #2563eb; --accent-rgb: 37, 99, 235; --accent-strong: #1d4ed8; --on-accent: #ffffff; --accent2: #7c3aed; --accent2-rgb: 124, 58, 237; --accent2-text: #6d28d9; --gold: #b7791f; --danger: #dc2626; --warn: #d97706; --blue: #2563eb; --txt: #16233a; --txt-muted: #5b6b82; --shadow: 0 6px 22px rgba(37, 99, 235, 0.12); } /* Claro - detalhes em lilas */ :root[data-theme="claro-lilas"] { --bg: #f7f4fc; --bg-rgb: 247, 244, 252; --surface: #ffffff; --card: #ffffff; --border: #e8e0f4; --accent: #7c3aed; --accent-rgb: 124, 58, 237; --accent-strong: #6d28d9; --on-accent: #ffffff; --accent2: #c026d3; --accent2-rgb: 192, 38, 211; --accent2-text: #a21caf; --gold: #b7791f; --danger: #dc2626; --warn: #d97706; --blue: #6366f1; --txt: #241b33; --txt-muted: #6b6478; --shadow: 0 6px 22px rgba(124, 58, 237, 0.14); }