@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
    /* TODO: Look into dark secondary, Will probs need to be some kinda grey */
    /* TODO: Looks into adding text colours and sub-text colours */

    /* Nexi Colours
        Black - 24, 24, 24 (#181818) - Pantone 'Neutral Black C'
        Red - 235, 49, 46 (#EB312E) - Pantone '1788C'
        Grey - 228, 228, 228 (#E4E4E4)
        Darker Grey - 210, 210, 210 (#D2D2D2)
        Green - 54, 234, 123 (#36EA7B)
        Cyan - 54, 233, 234 (#36E9EA)
        Purple - 166, 37, 234 (#A625EA)
        Orange - 241, 124, 37 (#F17C25)
    */
    :root {
        --color-nexi-primary: 255 255 255;
        --color-nexi-secondary: 24, 24, 24;
        --color-nexi-red: 235, 49, 46;
        --color-nexi-grey: 228, 228, 228;
        --color-nexi-darker-grey: 210, 210, 210;
        --color-nexi-green: 54, 234, 123;
        --color-nexi-cyan: 247 147 34;
        --color-nexi-purple: 166, 37, 234;
        --color-nexi-orange: 241, 124, 37;
    }

    :root[class~="dark"] {
        --color-nexi-primary: 24, 24, 24;
        --color-nexi-secondary: 255, 255, 255;
        --color-nexi-red: 235, 49, 46;
        --color-nexi-grey: 228, 228, 228;
        --color-nexi-darker-grey: 210, 210, 210;
        --color-nexi-green: 54, 234, 123;
        --color-nexi-cyan: 247 147 34;
        --color-nexi-purple: 166, 37, 234;
        --color-nexi-orange: 241, 124, 37;
    }
}