/* Congruo — Design Tokens
   Use sempre estas variáveis. Nunca escreva valores hex diretamente nos arquivos. */

:root {
    /* Fundos */
    --color-bg:               #0f172a;
    --color-surface:          #1e293b;
    --color-surface-hover:    #253347;
    --color-surface-selected: #1a1d45;

    /* Bordas */
    --color-border:           #334155;
    --color-border-hover:     #475569;

    /* Accent — índigo */
    --color-accent:           #6366f1;
    --color-accent-dark:      #4f46e5;
    --color-accent-light:     #a5b4fc;
    --color-accent-bg:        rgba(99, 102, 241, 0.12);
    --color-accent-border:    rgba(99, 102, 241, 0.25);
    --color-accent-glow-sm:   rgba(99, 102, 241, 0.30);
    --color-accent-glow-md:   rgba(99, 102, 241, 0.35);
    --color-accent-glow-lg:   rgba(99, 102, 241, 0.50);

    /* Texto */
    --color-text:             #f8fafc;
    --color-text-muted:       #94a3b8;

    /* Sucesso — verde */
    --color-success:          #22c55e;
    --color-success-bg:       rgba(34, 197, 94, 0.10);
    --color-success-border:   rgba(34, 197, 94, 0.25);

    /* WhatsApp — verde de marca, só pro botão de compartilhar */
    --color-whatsapp:         #25d366;
    --color-whatsapp-dark:    #1da851;
}