/** * AsturMaker Design System v1 * Incremental layer sobre Dashmix/Bootstrap — sem alterar lógica. * Dark mode: tokens em [data-am-theme="dark"] (abaixo); correções dos * componentes do Dashmix/Bootstrap em astur-dark.css. */ :root { --am-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; --am-bg: #f8fafc; --am-surface: #ffffff; --am-surface-hover: #f1f5f9; --am-border: #e2e8f0; --am-border-strong: #cbd5e1; --am-text: #0f172a; --am-text-muted: #64748b; --am-text-subtle: #94a3b8; --am-primary: #2563eb; --am-primary-hover: #1d4ed8; --am-primary-soft: #eff6ff; --am-success: #059669; --am-success-soft: #ecfdf5; --am-warning: #d97706; --am-warning-soft: #fffbeb; --am-danger: #dc2626; --am-danger-soft: #fef2f2; --am-radius-sm: 8px; --am-radius: 12px; --am-radius-lg: 16px; --am-shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.05); --am-shadow: 0 4px 6px -1px rgba(15, 23, 42, 0.07), 0 2px 4px -2px rgba(15, 23, 42, 0.05); --am-shadow-lg: 0 10px 15px -3px rgba(15, 23, 42, 0.08), 0 4px 6px -4px rgba(15, 23, 42, 0.05); --am-space-1: 0.25rem; --am-space-2: 0.5rem; --am-space-3: 0.75rem; --am-space-4: 1rem; --am-space-5: 1.25rem; --am-space-6: 1.5rem; --am-space-8: 2rem; --am-transition: 150ms cubic-bezier(0.4, 0, 0.2, 1); } [data-am-theme="dark"] { --am-bg: #0b0f19; --am-surface: #111827; --am-surface-hover: #1f2937; --am-border: #1f2937; --am-border-strong: #374151; --am-text: #f1f5f9; --am-text-muted: #94a3b8; --am-text-subtle: #64748b; --am-primary: #3b82f6; --am-primary-hover: #60a5fa; --am-primary-soft: rgba(59, 130, 246, 0.16); --am-success: #10b981; --am-success-soft: rgba(16, 185, 129, 0.15); --am-warning: #f59e0b; --am-warning-soft: rgba(245, 158, 11, 0.15); /* faltava: sem ele o botão de apagar ficava com o rosa-claro do tema claro */ --am-danger: #f87171; --am-danger-soft: rgba(248, 113, 113, 0.14); --am-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.3); --am-shadow: 0 4px 6px rgba(0, 0, 0, 0.25); } /* O Dashmix pinta o #page-container, não o . Em tema escuro o body ficava claro por baixo e aparecia nas páginas curtas e durante o carregamento. Só definido no escuro, para não alterar o claro que já existe. */ :root[data-am-theme="dark"] body { background-color: var(--am-bg); }