:root {
    /* Default background color of <body />...etc */
    --background: #fff;

    /* Primary colors for <Button /> */
    --primary: #9a6ce5;
    --primary-text: #fff;

    --header: #610fe6;

    /* Secondary colors for <Button /> */
    --secondary: #0a2a4d;
    
    /* Button Types */
    --button-secondary: #5e7682; /* Ajustado para um cinza azulado mais equilibrado */
    --button-success: #598f32; /* Ajustado para um verde mais vibrante */
    --button-warning: #ffbb00; /* Amarelo quente e mais legível */
    --button-help: #8639ac; /* Roxo levemente mais suave */
    --button-info: #1791cf; /* Azul mais claro e vivo */
    --button-danger: #db2424; /* Vermelho forte, mas não excessivamente saturado */

    /* Used for destructive actions */
    --destructive: #ff0000; // red-500 #FF0000;

    /* Nomes das cores basedo no figma deles */
    --neutral-gray-100: #f5f5f5;
    --neutral-gray-200: #f8f8f8;
    --neutral-gray-300: #D3D3D3;
    --neutral-gray-400: #a6a6a6;
    --neutral-gray-600: #3d3d3d;
    --neutral-gray-800: #242424;
    
    --indigo-500: #6461ff;

    --blue-500: #1876f2;

    --green-500: #53ac2a;

    --yellow: #feba01;

    // REVER NOMES DPS

    --bg-card-background: #f1f1f1;
    --blue-secundary: #1876f2;
}

html[data-theme="dark"] {
    /* Default background color of <body />...etc */
    --background: #424957; /* - Um tom escuro próximo do preto, mas confortável para leitura */

    /* Primary colors for <Button /> */
    --primary: #b593ec; /* - Um tom mais vibrante para contraste no dark theme */
    --primary-text: #fff;

    --header: #610fe6;
    
    /* Secondary colors for <Button /> */
    --secondary: #124f91; /* - Um azul escuro que harmoniza com o fundo e mantém contraste */

    --button-secondary: #7e919a; /* Tom levemente mais claro para contraste */
    --button-success: #68b234; /* Verde mais brilhante */
    --button-warning: #ffc933; /* Amarelo mais claro para melhor visibilidade */
    --button-help: #a347d1; /* Roxo mais vibrante no escuro */
    --button-info: #2badee; /* Azul mais brilhante para melhor contraste */
    --button-danger: #eb4747; /* Vermelho mais intenso para se destacar */

    /* Used for destructive actions */
    --destructive: #ff3333; /* - Um vermelho mais brilhante para melhor visibilidade */

    /* Nomes das cores baseados no figma deles */
    --neutral-gray-100: #373d49; /* - Um cinza escuro para textos secundários */
    --neutral-gray-200: #373d49; /* - Um cinza escuro para textos secundários */
    --neutral-gray-300: #4d5566; /* - Um tom médio para bordas e separadores */
    --neutral-gray-400: #6e7a91; /* - Um cinza levemente mais claro */
    --neutral-gray-600: #a8afbd;
    --neutral-gray-800: #c5cad3; /* - Um tom bem claro para contraste com fundo escuro */

    --blue-500: #4893f4; /* - Azul mais claro para manter destaque */

    --yellow: #fec11b; /* - Um amarelo mais quente, mas sem perder legibilidade */

    /* Cores de fundo para cartões */
    --bg-card-background: #21242c; /* - Um fundo levemente mais claro que o body para destacar os cards */

    --blue-secundary: #4893f4; /* - Igual ao blue-500 para coerência */
}