/*
The default theme is dark.
SCSS variables (`$black`) are not affected by scripts. (Inside code blocks, ...)
CSS variables (`var(--black)`) are affected by scripts. (Everywhere else.)
*/


$black: #000000;
$black-compl: #ffffff;
$black-trans: #00000060;
$black-compl-trans: #ffffff60;

$dark: #404040;
$dark-compl: #bfbfbf;
$dark-trans: #40404060;
$dark-compl-trans: #bfbfbf60;

$gray: #808080;
$gray-compl: #7f7f7f;
$gray-trans: #80808060;
$gray-compl-trans: #7f7f7f60;

$lightgray: #c0c0c0;
$lightgray-compl: #3f3f3f;
$lightgray-trans: #c0c0c060;
$lightgray-compl-trans: #3f3f3f60;

$white: #ffffff;
$white-compl: #000000;
$white-trans: #ffffff60;
$white-compl-trans: #00000060;

$red: #c02020;
$red-compl: #3fdfdf;
$red-trans: #c0202060;
$red-compl-trans: #3fdfdf60;

$green: #20c020;
$green-compl: #df3fdf;
$green-trans: #20c02060;
$green-compl-trans: #df3fdf60;

$slateblue: #4040c0;
$slateblue-compl: #bfbf3f;
$slateblue-trans: #4040c060;
$slateblue-compl-trans: #bfbf3f60;

$blue: #2020c0;
$blue-compl: #dfdf3f;
$blue-trans: #2020c060;
$blue-compl-trans: #dfdf3f60;

$aqua: #40c0ff;
$aqua-compl: #bf3f00;
$aqua-trans: #40c0ff60;
$aqua-compl-trans: #bf3f0060;

$emerald: #40c040;
$emerald-compl: #bf3fbf;
$emerald-trans: #40c04060;
$emerald-compl-trans: #bf3fbf60;

$turquoise: #40ffc0;
$turquoise-compl: #bf003f;
$turquoise-trans: #40ffc060;
$turquoise-compl-trans: #bf003f60;

$seagreen: #20c0c0;
$seagreen-compl: #df3f3f;
$seagreen-trans: #20c0c060;
$seagreen-compl-trans: #df3f3f60;

$violet: #c040ff;
$violet-compl: #3fbf00;
$violet-trans: #c040ff60;
$violet-compl-trans: #3fbf0060;

$pink: #ff40c0;
$pink-compl: #00bf3f;
$pink-trans: #ff40c060;
$pink-compl-trans: #00bf3f60;

$grassgreen: #c0ff40;
$grassgreen-compl: #3f00bf;
$grassgreen-trans: #c0ff4060;
$grassgreen-compl-trans: #3f00bf60;

$gold: #ffc040;
$gold-compl: #003fbf;
$gold-trans: #ffc04060;
$gold-compl-trans: #003fbf60;

$brown: #c08020;
$brown-compl: #3f7fdf;
$brown-trans: #c0802060;
$brown-compl-trans: #3f7fdf60;


:root {
    
    --black: #000000;
    --black-compl: #ffffff;
    --black-trans: #00000060;
    --black-compl-trans: #ffffff60;
    
    --dark: #404040;
    --dark-compl: #bfbfbf;
    --dark-trans: #40404060;
    --dark-compl-trans: #bfbfbf60;
    
    --gray: #808080;
    --gray-compl: #7f7f7f;
    --gray-trans: #80808060;
    --gray-compl-trans: #7f7f7f60;
    
    --lightgray: #c0c0c0;
    --lightgray-compl: #3f3f3f;
    --lightgray-trans: #c0c0c060;
    --lightgray-compl-trans: #3f3f3f60;
    
    --white: #ffffff;
    --white-compl: #000000;
    --white-trans: #ffffff60;
    --white-compl-trans: #00000060;
    
    --red: #c02020;
    --red-compl: #3fdfdf;
    --red-trans: #c0202060;
    --red-compl-trans: #3fdfdf60;
    
    --green: #20c020;
    --green-compl: #df3fdf;
    --green-trans: #20c02060;
    --green-compl-trans: #df3fdf60;
    
    --slateblue: #4040c0;
    --slateblue-compl: #bfbf3f;
    --slateblue-trans: #4040c060;
    --slateblue-compl-trans: #bfbf3f60;
    
    --blue: #2020c0;
    --blue-compl: #dfdf3f;
    --blue-trans: #2020c060;
    --blue-compl-trans: #dfdf3f60;
    
    --aqua: #40c0ff;
    --aqua-compl: #bf3f00;
    --aqua-trans: #40c0ff60;
    --aqua-compl-trans: #bf3f0060;
    
    --emerald: #40c040;
    --emerald-compl: #bf3fbf;
    --emerald-trans: #40c04060;
    --emerald-compl-trans: #bf3fbf60;
    
    --turquoise: #40ffc0;
    --turquoise-compl: #bf003f;
    --turquoise-trans: #40ffc060;
    --turquoise-compl-trans: #bf003f60;
    
    --seagreen: #20c0c0;
    --seagreen-compl: #df3f3f;
    --seagreen-trans: #20c0c060;
    --seagreen-compl-trans: #df3f3f60;
    
    --violet: #c040ff;
    --violet-compl: #3fbf00;
    --violet-trans: #c040ff60;
    --violet-compl-trans: #3fbf0060;
    
    --pink: #ff40c0;
    --pink-compl: #00bf3f;
    --pink-trans: #ff40c060;
    --pink-compl-trans: #00bf3f60;
    
    --grassgreen: #c0ff40;
    --grassgreen-compl: #3f00bf;
    --grassgreen-trans: #c0ff4060;
    --grassgreen-compl-trans: #3f00bf60;
    
    --gold: #ffc040;
    --gold-compl: #003fbf;
    --gold-trans: #ffc04060;
    --gold-compl-trans: #003fbf60;
    
    --brown: #c08020;
    --brown-compl: #3f7fdf;
    --brown-trans: #c0802060;
    --brown-compl-trans: #3f7fdf60;
    
}