$primary: (
    'white': hsl(0deg 0% 100% / 100%),
    'grey-20': hsl(220deg 20% 97% / 100%),
    'grey-40': hsl(180deg 6% 90% / 100%),
    'grey-50': hsl(210deg 10% 79% / 100%),
    'grey-60': hsl(212deg 7% 59% / 100%),
    'grey-80': hsl(212deg 7% 41% / 100%),
    'grey-100': hsl(240deg 1% 16% / 100%),
    'black': hsl(0deg 0% 0% / 100%),
    'navy-blue-10': hsl(238deg 100% 97% / 100%),
    'navy-blue-20': hsl(238deg 91% 92% / 100%),
    'navy-blue-30': hsl(238deg 71% 81% / 100%),
    'navy-blue-40': hsl(240deg 54% 69% / 100%),
    'navy-blue-50': hsl(240deg 38% 58% / 100%),
    'navy-blue-60': hsl(240deg 29% 45% / 100%),
    'navy-blue-70': hsl(240deg 28% 34% / 100%),
    'navy-blue-80': hsl(240deg 26% 27% / 100%),
    'navy-blue-90': hsl(240deg 29% 21% / 100%),
    'navy-blue-100': hsl(231deg 41% 16% / 100%),
    'digital-blue-10': hsl(210deg 100% 95% / 100%),
    'digital-blue-20': hsl(209deg 100% 89% / 100%),
    'digital-blue-40': hsl(209deg 99% 61% / 100%),
    'digital-blue-60': hsl(214deg 85% 50% / 100%),
    'digital-blue-80': hsl(218deg 74% 39% / 100%),
    'digital-blue-100': hsl(218deg 90% 23% / 100%),
    'pomegranate-red-10': hsl(4deg 100% 97% / 100%),
    'pomegranate-red-20': hsl(5deg 100% 91% / 100%),
    'pomegranate-red-30': hsl(5deg 75% 82% / 100%),
    'pomegranate-red-40': hsl(5deg 77% 70% / 100%),
    'pomegranate-red-50': hsl(5deg 85% 61% / 100%),
    'pomegranate-red-60': hsl(5deg 75% 52% / 100%),
    'pomegranate-red-70': hsl(5deg 83% 44% / 100%),
    'pomegranate-red-80': hsl(5deg 90% 33% / 100%),
    'pomegranate-red-90': hsl(5deg 85% 27% / 100%),
    'pomegranate-red-100': hsl(5deg 94% 19% / 100%),
    'cerulean-blue-10': hsl(199deg 100% 95% / 100%),
    'cerulean-blue-20': hsl(199deg 100% 88% / 100%),
    'cerulean-blue-30': hsl(199deg 100% 76% / 100%),
    'cerulean-blue-40': hsl(199deg 100% 64% / 100%),
    'cerulean-blue-50': hsl(199deg 100% 50% / 100%),
    'cerulean-blue-60': hsl(199deg 98% 46% / 100%),
    'cerulean-blue-70': hsl(199deg 97% 39% / 100%),
    'cerulean-blue-80': hsl(199deg 98% 33% / 100%),
    'cerulean-blue-90': hsl(199deg 100% 22% / 100%),
    'cerulean-blue-100': hsl(200deg 100% 14% / 100%),
    'turbo-yellow-10': hsl(55deg 100% 93% / 100%),
    'turbo-yellow-20': hsl(53deg 100% 86% / 100%),
    'turbo-yellow-30': hsl(53deg 100% 72% / 100%),
    'turbo-yellow-40': hsl(53deg 100% 50% / 100%),
    'turbo-yellow-50': hsl(49deg 91% 56% / 100%),
    'turbo-yellow-60': hsl(49deg 91% 48% / 100%),
    'turbo-yellow-70': hsl(47deg 97% 45% / 100%),
    'turbo-yellow-80': hsl(47deg 97% 38% / 100%),
    'turbo-yellow-90': hsl(47deg 98% 26% / 100%),
    'turbo-yellow-100': hsl(47deg 80% 16% / 100%),
    'bright-turquoise-10': hsl(172deg 100% 96% / 100%),
    'bright-turquoise-20': hsl(171deg 97% 88% / 100%),
    'bright-turquoise-30': hsl(172deg 94% 65% / 100%),
    'bright-turquoise-40': hsl(172deg 84% 52% / 100%),
    'bright-turquoise-50': hsl(172deg 82% 47% / 100%),
    'bright-turquoise-60': hsl(172deg 83% 43% / 100%),
    'bright-turquoise-70': hsl(172deg 88% 35% / 100%),
    'bright-turquoise-80': hsl(172deg 90% 28% / 100%),
    'bright-turquoise-90': hsl(172deg 90% 20% / 100%),
    'bright-turquoise-100': hsl(172deg 90% 12% / 100%),
);
$secondary: (
    'grape-purple-10': hsl(293deg 25% 94% / 100%),
    'grape-purple-20': hsl(279deg 48% 83% / 100%),
    'grape-purple-30': hsl(278deg 57% 68% / 100%),
    'grape-purple-40': hsl(279deg 47% 54% / 100%),
    'grape-purple-50': hsl(279deg 54% 40% / 100%),
    'grape-purple-60': hsl(278deg 56% 31% / 100%),
    'grape-purple-70': hsl(278deg 53% 24% / 100%),
    'grape-purple-80': hsl(278deg 75% 19% / 100%),
    'grape-purple-90': hsl(279deg 80% 14% / 100%),
    'grape-purple-100': hsl(279deg 86% 7% / 100%),
    'rain-forest-green-10': hsl(168deg 50% 91% / 100%),
    'rain-forest-green-20': hsl(170deg 47% 79% / 100%),
    'rain-forest-green-30': hsl(170deg 49% 65% / 100%),
    'rain-forest-green-40': hsl(168deg 54% 44% / 100%),
    'rain-forest-green-50': hsl(168deg 68% 32% / 100%),
    'rain-forest-green-60': hsl(168deg 100% 19% / 100%),
    'rain-forest-green-70': hsl(168deg 91% 17% / 100%),
    'rain-forest-green-80': hsl(168deg 88% 13% / 100%),
    'rain-forest-green-90': hsl(169deg 92% 10% / 100%),
    'rain-forest-green-100': hsl(169deg 94% 7% / 100%),
    'governor-bay-blue-10': hsl(235deg 100% 97% / 100%),
    'governor-bay-blue-20': hsl(231deg 63% 88% / 100%),
    'governor-bay-blue-30': hsl(230deg 77% 78% / 100%),
    'governor-bay-blue-40': hsl(230deg 65% 64% / 100%),
    'governor-bay-blue-50': hsl(230deg 62% 56% / 100%),
    'governor-bay-blue-60': hsl(230deg 60% 45% / 100%),
    'governor-bay-blue-70': hsl(230deg 63% 38% / 100%),
    'governor-bay-blue-80': hsl(230deg 69% 32% / 100%),
    'governor-bay-blue-90': hsl(230deg 74% 24% / 100%),
    'governor-bay-blue-100': hsl(229deg 80% 14% / 100%),
    'sienna-orange-10': hsl(15deg 100% 96% / 100%),
    'sienna-orange-20': hsl(15deg 100% 87% / 100%),
    'sienna-orange-30': hsl(15deg 98% 77% / 100%),
    'sienna-orange-40': hsl(15deg 99% 71% / 100%),
    'sienna-orange-50': hsl(15deg 82% 60% / 100%),
    'sienna-orange-60': hsl(15deg 73% 55% / 100%),
    'sienna-orange-70': hsl(15deg 67% 45% / 100%),
    'sienna-orange-80': hsl(15deg 73% 34% / 100%),
    'sienna-orange-90': hsl(15deg 79% 23% / 100%),
    'sienna-orange-100': hsl(15deg 83% 17% / 100%),
);
$semantic: (
    'success-10': hsl(152deg 87% 91% / 100%),
    'success-60': hsl(141deg 80% 35% / 100%),
    'success-100': hsl(146deg 100% 15% / 100%),
    'shadow-on-light': hsl(180deg 6% 90% / 100%),
    'shadow-on-neutral': hsl(0deg 0% 56% / 100%),
    'shadow-on-dark': hsl(231deg 41% 16% / 100%),
);
$partners: (
    'salesforce-blue': #009ddc,
);
$deprecated: (
    'deprecated-white': #f1f3f4,
    'deprecated-light-grey': #e6ecf0,
    'deprecated-medium-grey': #bcc3ca,
    'deprecated-dark-medium-grey': #7a7d81,
    'deprecated-dark-grey': #373737,
    'deprecated-stratos': #08080e,
    'deprecated-grey-1': #f7f8f9,
    'deprecated-grey-2': #eff3f7,
    'deprecated-grey-3': #e4eaed,
    'deprecated-grey-4': #cfd9e0,
    'deprecated-heather': #b5c4cf,
    'deprecated-nepal': #94a9bf,
    'deprecated-bali-hai': #8097aa,
    'deprecated-lynch': #5d7289,
    'deprecated-grey-9': #4e5f71,
    'deprecated-amber': #fbba06,
    'deprecated-school-bus-yellow': #ffdf00,
    'deprecated-orange-1': #ffbc86,
    'deprecated-orange': #f58020,
    'deprecated-coveo-orange': #f58020,
    'deprecated-tango': #e56613,
    'deprecated-milano-red': #d02b08,
    'deprecated-red': #ce3f00,
    'deprecated-green': #009830,
    'deprecated-caribbean-green': #05c3a2,
    'deprecated-frosted-mint': #d3fff8,
    'deprecated-observatory': #028f7b,
    'deprecated-turquoise': #26e8cc,
    'deprecated-anakiwa': #4ed6ff,
    'deprecated-blue-1': #cde7ff,
    'deprecated-blue-2': #8fc9ff,
    'deprecated-dodger-blue': #3ca0ff,
    'deprecated-azure': #0d80ef,
    'deprecated-science-blue': #0061c0,
    'deprecated-coveo-blue': #004990,
    'deprecated-blue-7': #00305c,
    'deprecated-blue-8': #00284b,
    'deprecated-light-blue': #296896,
    'deprecated-blue-purple-2': #354667,
    'deprecated-blue-purple-3': #2d385e,
    'deprecated-purple-blue': #1e2541,
    'deprecated-medium-blue': #1d4f76,
    'deprecated-dark-blue': #263e55,
    'deprecated-oxford-blue': #313a45,
);

@function toRGB($color) {
    @return red($color) green($color) blue($color);
}

@mixin spreadPalette($palette) {
    @each $name, $color in $palette {
        --#{$name}: #{$color};
        --#{$name}-rgb: #{toRGB($color)};
    }
}

:root {
    @include spreadPalette($primary);
    @include spreadPalette($secondary);
    @include spreadPalette($semantic);
    @include spreadPalette($partners);
    @include spreadPalette($deprecated);

    // semantic derivates
    --info-10: var(--navy-blue-10);
    --info-10-rgb: var(--navy-blue-10-rgb);
    --info-60: var(--navy-blue-60);
    --info-60-rgb: var(--navy-blue-60-rgb);
    --info-100: var(--navy-blue-100);
    --info-100-rgb: var(--navy-blue-100-rgb);
    --warning-10: var(--turbo-yellow-10);
    --warning-10-rgb: var(--turbo-yellow-10-rgb);
    --warning-70: var(--turbo-yellow-70);
    --warning-70-rgb: var(--turbo-yellow-70-rgb);
    --warning-90: var(--turbo-yellow-90);
    --warning-90-rgb: var(--turbo-yellow-90-rgb);
    --critical-10: var(--pomegranate-red-10);
    --critical-10-rgb: var(--pomegranate-red-10-rgb);
    --critical-70: var(--pomegranate-red-70);
    --critical-70-rgb: var(--pomegranate-red-70-rgb);
    --critical-100: var(--pomegranate-red-100);
    --critical-100-rgb: var(--pomegranate-red-100-rgb);

    // gradient
    --gradient: linear-gradient(75.28deg, #fadf4a 10.4%, #f9463a 34.36%, #08b7ea 62.79%, #03dec8 85.12%);
    --gradient-header: linear-gradient(270deg, var(--grape-purple-70) 0, var(--navy-blue-80) 65%);
}