$-colors: (
    accent-azure: #66adffd9,
    accent-blue: #4072e5,
    accent-blue10: #4072e54d,
    accent-blue30: #4072e573,
    accent-blue50: #4072e599,
    accent-gold: #cc9200d9,
    accent-green: #39bf68d9,
    accent-orange: #ff794cd9,
    accent-red: #db2c3ae5,
    accent-teal: #59adc4e5,
    accent-white: #fff,
    accent-wood-dark: #996b6f,
    accent-wood: #cc7a52e5,
    accent-yellow: #faa700cc,
    accent-highlight: #ffd40026,
    fill-primary: #ffffffe5,
    fill-secondary: #ffffff8c,
    fill-tertiary: #ffffff4d,
    fill-quarternary: #ffffff1f,
    fill-quinary: #ffffff0f,
    fill-senary: #ffffff08,
    color-background: #1e1e1e,
    color-background30: #1e1e1e4d,
    color-background50: #1e1e1e80,
    color-background70: #1e1e1eb2,
    color-border: #ffffff2e,
    color-border50: #ffffff17,
    color-button: #404040,
    color-control: #ccc,
    color-menu: #28282894,
    color-panedivider: #404040,
    color-sidepane: #303030,
    color-tabbar: #1e1e1e,
    color-toolbar: #272727,
    color-scrollbar: rgb(117, 117, 117),
    color-scrollbar-hover: rgb(158, 158, 158),
    color-scrollbar-background: transparent,
    color-stripe: #ffffff0d,
    tag-blue: #2ea8e5d9,
    tag-gray: #aaac,
    tag-green: #5fb236d9,
    tag-indigo: #576dd9,
    tag-magenta: #e56eeed9,
    tag-orange: #f19837cc,
    tag-plum: #a6507b,
    tag-purple: #a28ae5e5,
    tag-red: #ff6666e5,
    tag-teal: #009980,
    tag-yellow: #ffd400bf,
);

@media (prefers-color-scheme: dark) {
    :root {
        @include derive-colors($-colors);
    }
}
