/*
XACTUS PURPLES
There are only two official purples allowed;
A light contrast color for content as necessary for legibility.
--slxDark: #5b068a; background color, button active/focus color
--slxMedium: #ad82c4; button hover color
--slxLight: white; contrast color

Replace colors based on context; there are too many variations.
Here is a rough guide using the known official greens:

#88b652 => slxDark
#aacc58 => slxMedium or slxDark
#bce261 => slxLight or slxMedium
#e9fbb5 => slxLight

Common pattern:
When most old colors are greens:
	- selectors with Up => --slxDark
	- selectors with Over => --slxMedium
	- selectors with Down => --slxDark

 When most colors are white and a very light green::after
	- keep the existing white (or replace with --slxLight
	- replace the very light green with --slxLight
	- use judgement and follow the up/over/down pattern

*/

:root {
	--slxPrimaryDark: #5b068a;
	--slxPrimaryMedium: #ae8bd7; /* => rgb(174, 139, 215) */
	--slxPrimaryMediumLight: rgba(174, 139, 215, .5);

	--slxAccentDark: #A2A2A2;
	--slxAccentMedium: #E4E7EA;
	--slxAccentLight: #F1F3F5;
	--slxAccentLightest: #fff;

	--slxTextDark: #000;
	--slxTextMedium: #555;
	--slxTextLight: #707070;
	--slxTextLighter: rgba(255, 255, 255, 0.66);
	--slxTextLightest: #fff;

	--slxTextWarningDark: #b3a33c;
	--slxTextWarningDarkMedium: #bbaa3e;
	--slxTextWarningMedium: #ccba43;
	--slxTextWarningMediumLight: #fff0b0;
	--slxTextWarningLight: #fffef2;
	--slxTextWarningLighter: #e6e5d8;
	--slxTextWarningLightest: #d2d1c2;

	--slxBrandedTextDark: var(--slxPrimaryDark);
	--slxBrandedTextMedium: var(--slxPrimaryMedium);

	--slxDefaultDark: #000;
	--slxDefaultMedium: #555;
	--slxDefaultLight: #fff;

	--slxTableHeader: #D7DCE0;
	--slxTableColDivider: #fff;
	--slxTableRowDark: #ECEEF0;
	--slxTableRowLight: #F1F3F5;
	--slxTableRowHover: rgba(174, 139, 215, 0.5);

	/* use for debugging */
	--unknown: red;
	--unclear: peru;
	--unclear1: pink;
	--unclear2: cornflowerblue;
}