@import url('https://fonts.googleapis.com/css2?family=Afacad:ital,wght@0,400..700;1,400..700&display=swap');
:root {
    --color-primary: #767676;
    --color-secondary: #CCCCCC;
    --color-medium: #D9D9D9;
    --color-light: #E6E6E6;
    --color-background: #ffffff;
    --color-navbar: linear-gradient(90deg, #EDEDED 0%, #E5E5E5 100%) ;
    --color-card: linear-gradient(90deg, #EDEDED 0%, #E5E5E5 100%);
    --color-font: 15 23 42;
    --color-muted: 71 85 105;
    --color-logo-bg: #998d92;
    --app-bg: gray;


    --login-wave-1: var(--color-light);
    --login-wave-2: var(--color-medium);
    --login-wave-3: var(--color-secondary);
    --login-wave-4: #BFBFBF;

    --Proteus: linear-gradient(109deg, #FFF1EA 0.68%, #FEE9DF 100%);
    --Proteus-hover:  linear-gradient(180deg, #D9560B 0%, #732E06 100%);
    --Proteus-border: rgba(217, 86, 11, 0.02);
    --Proteus-button: #CE4B00;

    --Aeris: linear-gradient(109deg, #FFFAEB 0.68%, #FFF7E0 100%);
    --Aeris-hover: linear-gradient(180deg, #E8B82A 0%, #732E06 100%);
    --Aeris-border: rgba(232, 184, 42, 0.02);
    --Aeris-button: #8E7118;

    --Flare: linear-gradient(109deg, #FDF5FF 0.68%, #FBEBFF 100%);
    --Flare-hover: linear-gradient(180deg, #540863 0%, #AB10C9 100%);
    --Flare-border: rgba(84, 8, 99, 0.01);
    --Flare-button: #540863;

    --Ignis: linear-gradient(109deg, #FFF6EB 0.68%, #FFF1E0 100%);
    --Ignis-hover:  linear-gradient(180deg, #F48E00 0%, #8E5300 100%);
    --Ignis-border: rgba(244, 142, 0, 0.02);
    --Ignis-button: #B2620C;

    --font-family: 'Afacad';
}