/* ========================================================================== THEME.CSS — Design Tokens (Identidade Visual) ========================================================================== Este arquivo contém EXCLUSIVAMENTE variáveis CSS (design tokens). Nenhuma regra de estilo, classe ou seletor de componente deve existir aqui. Cliente: Karina Pinheiro Liz — Terapeuta e Psicóloga Paleta extraída de assets/images/paleta_cores.png (ver ui_specification.md). Estes tokens são consumidos pelo bloco @theme em assets/css/input.css, que os expõe como utilitários oficiais do Tailwind (ex.: bg-primary-600, text-accent-400, bg-surface, font-primary). Nunca utilize estes tokens diretamente no HTML via classes arbitrárias (bg-[var(--brand-primary-600)]). ========================================================================== */ :root { /* --------------------------------------------------------------------- PRIMARY — Verde (equilíbrio, crescimento, renovação) --------------------------------------------------------------------- */ --brand-primary-50: #f0f5f2; --brand-primary-100: #dce9e0; --brand-primary-200: #c3dacd; --brand-primary-300: #a0c7b0; --brand-primary-400: #7fa88c; --brand-primary-500: #5c8f72; --brand-primary-600: #3e6b57; --brand-primary-700: #325746; --brand-primary-800: #294637; --brand-primary-900: #1e3529; --brand-primary-950: #16241d; /* --------------------------------------------------------------------- ACCENT — Rosa (afeto, empatia, acolhimento) --------------------------------------------------------------------- */ --brand-accent-50: #fdf4f6; --brand-accent-100: #fdedef; --brand-accent-200: #f6d6de; --brand-accent-300: #efc0cb; --brand-accent-400: #e7a7b3; --brand-accent-500: #dc8898; --brand-accent-600: #c96678; --brand-accent-700: #a94f60; --brand-accent-800: #833d4a; --brand-accent-900: #5e2c36; --brand-accent-950: #3a2a2d; /* --------------------------------------------------------------------- TIPOGRAFIA --------------------------------------------------------------------- */ --brand-font-primary: "Playfair Display", ui-serif, Georgia, serif; --brand-font-secondary: "Poppins", ui-sans-serif, system-ui, -apple-system, sans-serif; /* --------------------------------------------------------------------- SUPERFÍCIES SEMÂNTICAS (alternam no dark mode) --------------------------------------------------------------------- */ --brand-surface: #f7efe6; --brand-surface-alt: #fdedef; --brand-surface-alt-2: #dce9e0; --brand-foreground: #2e4a3d; --brand-muted: #4f6d5f; --brand-eyebrow: #c96678; } /* --------------------------------------------------------------------- DARK MODE Ativado pela classe "dark" na tag (ver assets/js/theme-toggle.js). Compatível com a estratégia darkMode: 'class' do Tailwind v4. --------------------------------------------------------------------- */ .dark { --brand-surface: #16241d; --brand-surface-alt: #1e3229; --brand-surface-alt-2: #22362b; --brand-foreground: #f7efe6; --brand-muted: #a0c7b0; --brand-eyebrow: #efc0cb; }