/** * Webzoe EAD Suite — Design System compartilhado. * * Fonte única de verdade para tipografia, botões, cards, alerts, badges e * formulários de TODOS os módulos (Dashboard, Lesson, App-web, etc.). * * As cores/raio vêm de CSS custom properties injetadas pelo Core * (Design\Design_Tokens) a partir das configurações da empresa. Este arquivo * define apenas fallbacks e a aparência dos componentes. * * Namespace de classe: .wzead-* | escopo raiz: .wzead */ .wzead { /* Fallbacks (sobrescritos pelos tokens injetados). */ --wzead-primary: #6D28D9; --wzead-secondary: #F3E8FF; --wzead-accent: #22C55E; --wzead-button: #6D28D9; --wzead-button-text: #FFFFFF; --wzead-sidebar: #111827; --wzead-sidebar-active: #6D28D9; --wzead-background: #F9FAFB; --wzead-card: #FFFFFF; --wzead-text: #1F2937; --wzead-muted: #6B7280; --wzead-border: rgba(17, 24, 39, .08); --wzead-radius: 18px; --wzead-radius-sm: 12px; --wzead-shadow: 0 6px 24px rgba(17, 24, 39, .08); --wzead-danger: #EF4444; --wzead-warning: #F59E0B; --wzead-success: #22C55E; --wzead-info: #3B82F6; --wzead-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; color: var(--wzead-text); font-family: var(--wzead-font); line-height: 1.5; box-sizing: border-box; } .wzead *, .wzead *::before, .wzead *::after { box-sizing: border-box; } /* ---------- Tema escuro ---------- */ /* * Preferência de CADA ALUNO (não é config de marca/admin — essa continua em * Identidade Visual, no Core). Ativado via atributo `data-theme="dark"` no * , alternado pelo botão .wzead-theme-toggle (assets/js/theme-toggle.js) * e lembrado no navegador (localStorage). * * Seletor descendente (não ".wzead[data-theme]") de propósito: o atributo * fica no , mas a classe .wzead/.wzead-app pode estar em qualquer * elemento abaixo dele (no Lesson é o ; no Dashboard, uma

) — o * seletor abaixo cobre os dois casos sem precisar saber qual é. * * As cores de marca (primary/accent/button/sidebar) NÃO mudam entre os temas * — identidade visual é a mesma; só o que é "chrome" da interface (fundo, * card, texto, borda) se adapta. */ html[data-theme="dark"] .wzead, html[data-theme="dark"] .wzead-app { --wzead-background: #0F1115; --wzead-card: #1A1D24; --wzead-text: #E8E9EC; --wzead-muted: #9AA0AC; --wzead-border: rgba(255, 255, 255, .08); --wzead-secondary: rgba(109, 40, 217, .22); --wzead-shadow: 0 6px 24px rgba(0, 0, 0, .35); } /* * Botão de alternar tema (ícone sol/lua). * * Especificidade extra (.wzead button.wzead-theme-toggle, não só a classe * sozinha) de propósito: confirmado em produção que o Kit Global do * Elementor injeta uma regra `.elementor-kit-XXX button { background-color: * var(--e-global-color-accent); font-size: ...; line-height: ...; }` que * mira QUALQUER