@use "~thortful-core/scss/mixin/theme.mixin";

$theme: (

    'nhs-valentines-21__font--1': #0b8099,
    'nhs-mothers-day-21__bg--1': #0473b1,

    'thermometer__bg--1': #c4c4c4,
    'thermometer__bg--2': #0dddab,

    'content-voting__accent--1': #1597af,

    //TODO: should all be "secret-crush__..."
    'campaigns__bg--1': #fff3f6,
    'campaigns__bg--2': #ffe4e9,
    'campaigns__bg--3': #ffc1cd,
    'campaigns__bg--4': #fffce5,

    'campaigns__accent--1': #ff0000,
    'campaigns__accent--2': #000000,

    'campaigns__font--1': #8e8e93,

    'nhs-noticeboard__bg--1': #0473b1,
    'nhs-noticeboard__bg--2': #76c5f1,
    'nhs-noticeboard__bg--3': #dcf2ff,
    'nhs-noticeboard__bg--4': #0dddab,

    'dad-dancing__bg--1': #aec7d4,
    'dad-dancing__bg--2': #f5eeab,
    'dad-dancing__bg--3': #e8bc8c,
    'dad-dancing__bg--4': #b7cfd9,

    'dad-dancing__ring--0': #df7d53,
    'dad-dancing__ring--1': #e7e3be,
    'dad-dancing__ring--2': #3a2b1a,
    'dad-dancing__ring--3': #568da7

);

@mixin theme($property, $ref, $colour: 0) {
    @include theme.theme($property, $ref, $colour, $theme);
}

@mixin theme-darken($property, $ref, $amount) {
    @include theme($property, $ref, darken(map-get($theme, $ref), $amount));
}

@mixin background($colour) {
    @include theme('background', $colour);
}

@mixin color($colour) {
    @include theme('color', $colour);
}