:root {
	/* System Colors (all in hsl) */
	--col_sys_red:				5,80%,48%;
	--col_sys_orange: 		23,84%,60%;
	--col_sys_yellow: 		42,90%,64%;
	--col_sys_green: 			129,93%,73%;
	--col_sys_turquoise:	156,94%,73%;
	--col_sys_blue: 			207,92%,66%;
	--col_sys_navy: 			224,91%,60%;
	--col_sys_purple: 		258,90%,60%;
	--col_sys_pink: 			323,80%,60%;
	--col_sys_rose: 			346,80%,68%;
	/* Grayscales (all in hsl) */
	--col_gs_black: 200,10%,4%;
	--col_gs_gray1: 200,10%,30%;
	--col_gs_gray2: 200,10%,42%;
	--col_gs_gray3: 200,10%,54%;
	--col_gs_gray4: 200,10%,66%;
	--col_gs_gray5: 200,10%,78%;
	--col_gs_gray6: 200,10%,90%;
	--col_gs_white: 200,10%,96%;
	/* Primary (all in hsl) */
	--col_pr_1: 5,80%,75%;
	--col_pr_2: 5,80%,65%;
	--col_pr_3: 5,80%,55%;
	--col_pr_4: 5,80%,45%;
	--col_pr_5: 5,80%,35%;
	/* Secondary (all in hsl) */
	--col_se_1: 188,98%,32%;
	--col_se_2: 188,98%,26%;
	--col_se_3: 188,98%,20%;
	--col_se_4: 188,98%,14%;
	--col_se_5: 188,98%,8%;
}
/*
	:: CARD(S)
*/
[data-gees="card"] {
	padding: 0.5em;
	border-radius: 0.625em;
}

/*
	:: INPUT_TEXT
*/
[data-gees="input_text"]:not(input) {
  border: 1px hsl(var(--col_se_5)) solid;
  color: hsl(var(--col_gs_gray1));
  background-color: hsla(var(--col_gs_black),0.5);
}
[data-gees="input_text"] input {
  color: hsl(var(--col_gs_white));
  opacity: 0.85;
}
[data-gees="input_text"] .placeholder {
  color: hsl(var(--col_gs_white));
	opacity: 0.85;
}
[data-gees="input_text"] input:-webkit-autofill,
[data-gees="input_text"] input:-webkit-autofill:hover,
[data-gees="input_text"] input:-webkit-autofill:focus {
    -webkit-text-fill-color: hsl(var(--col_gs_white)) !important;
    -webkit-box-shadow: none !important;
}

/*
	:: TEXTAREA
*/
[data-gees="textarea"] {
  color: hsl(var(--col_gs_gray1));
	background-color: hsla(var(--col_gs_black),0.5);
	border: 1px hsla(var(--col_gs_gray1),0.5) solid;
}
[data-gees="textarea"] textarea {
  color: hsl(var(--col_gs_gray5));
}
[data-gees="textarea"] .placeholder {
  opacity: 1;
  color: hsl(var(--col_gs_white));
}
/*
	:: DROPDOWN
*/
[data-gees="dropdown"]:not(select) {
	color: hsl(var(--col_gs_gray6));
	background-color: hsla(var(--col_gs_black),0.5);
	border: 1px hsla(var(--col_gs_gray1),0.5) solid;
}
[data-gees="dropdown"] .placeholder {
	color: hsl(var(--col_gs_white));
}
[data-gees="dropdown"] .optionsBox {
	border: 1px hsla(var(--col_gs_gray1),0.5) solid;
	background-color: hsl(var(--col_se_5));
}
/*
	:: INPUT-BLOCK
*/
[data-gees="input_block"] {
  color: hsl(var(--col_gs_white));
  background-color: hsla(var(--col_gs_black),0.5);
  border: 1px hsla(var(--col_gs_gray1),0.5) solid;
	-webkit-backdrop-filter: blur(20px);
	backdrop-filter: blur(20px);
}
/*
  :: BUTTON(S)
*/
[data-gees="button"][data-style="ghost"] {
  background-color: hsl(var(--col_se_5)) !important;
}
[data-gees="button"][data-style="link"] {
  color: hsl(var(--col_gs_gray4));
}
[data-gees="button"][data-style="link"] .icon {
  background-color: hsl(var(--col_gs_gray4));
}
/* MULTILIST */
[data-gees="multilist"] {
  border: 1px hsl(var(--col_se_3)) solid;
  color: hsl(var(--col_gs_white));
  background-color: hsl(var(--col_se_5));
}
[data-gees="multilist"] .searchArea input {
  background: hsl(var(--col_se_4));
}
[data-gees="multilist"] .options .core > div:not(:last-child) {
  border-bottom: 1px hsl(var(--col_se_3)) solid;
}
[data-gees="multilist"] .searchArea {
  border-bottom: 1px hsl(var(--col_se_3)) solid;
}
[data-gees~="multilist"] .options:not(.floating) {
    border-top: 1px hsl(var(--col_se_3)) solid;
}
/* Normal */
[data-gees~="multilist"] .searchArea input:-webkit-input-placeholder { color: red; !important; }
[data-gees~="multilist"] .searchArea input::-moz-placeholder { color: red; !important; }
[data-gees~="multilist"] .searchArea input::-ms-input-placeholder { color: red; !important; }
[data-gees~="multilist"] .searchArea input::placeholder { color: red; !important; }
/* Collapsed */
[data-gees~="multilist"] .searchArea input:-webkit-input-placeholder { color: hsla(var(--col_gs_gray2),1); !important; }
[data-gees~="multilist"] .searchArea input::-moz-placeholder { color: hsla(var(--col_gs_gray2),1); !important; }
[data-gees~="multilist"] .searchArea input::-ms-input-placeholder { color: hsla(var(--col_gs_gray2),1); !important; }
[data-gees~="multilist"] .searchArea input::placeholder { color: hsla(var(--col_gs_gray2),1); !important; }