/*values in square brackets are filled in based on KeyName column in Style table*/

:root {
	--theme-color-primary: #4A90E2;
	--theme-color-secondary: #00A000;
	--app-header: [app-header];
	--clickable-default: [active];
	--clickable-alt: [active-alt];
	--clickable-cancel: [active-cancel];
	--background-popup: [background-popup];
	--border-popup: [border-popup];
	--status-on: [status-on];
	--status-pending: [status-pending];
	--status-new: [status-new];
	--status-notify: [status-notify];
	--status-canceled: [status-canceled];
	--status-closed: [status-canceled];
	--status-expired: [status-notify];
	--text: [text];
	--text-pale: [text-pale];
	--textbox: [textbox];
	--background-pale: [background-pale];
	--background-medium: [background-medium];
	--background: [background];
	--background-app: [background-app];
	--gradient: [gradient];
	--status-off: var(--clickable-default);
	--button-color: var(--clickable-default);
	--button-color-alt: var(--clickable-alt);
	--button-color-back: var(--status-pending);
	--button-color-cancel: var(--clickable-cancel);
	--checkbox21-color: var(--clickable-default);
	--checkbox21-label-color: var(--text);
	--checkbox21-disabled: var(--text-pale);
	--emphasis-color: [emphasis];
	--error-color: var(--status-notify);
	--notify-color: var(--status-notify);
	--notify-color-on: var(--status-on);
	--radio21-color: var(--text);
	--radio21-disabled: var(--text);
	--input-border: var(--text-pale);
	--focus-color: [focus];
	--focus-indicator: drop-shadow(0 0 2px [focus]);
	--tab-size: 2.35rem;
	--tab-size-list: 1.75rem;
	--tab-size-min: 60px;
	--tab-size-min-list: 24px;
	--box-padding: 0.75rem;
	--box-shadow-button: rgba(255,255,255,0.3) 0px 1px 0px 0px inset,rgba(255,255,255,0.2) 0px 16px 0px 0px inset,rgba(255,255,255,0.25) 0px 10px 20px 0px inset,rgba(0,0,0,0.3) 0px -15px 30px 0px inset;
	--box-shadow-normal: 0 1px 1px rgba(0, 0, 0, 0.25), 0 2px 8px rgba(0, 0, 0, 0.25), inset 0px 0px 0px 1px rgba(255, 255, 255, 0.1);
	--box-shadow-active: 0 1px 1px rgba(0, 0, 0, 0.25), 0 2px 8px rgba(0, 0, 0, 0.25), inset 0px 0px 0px 2px rgba([active-rgb],1);
	--box-shadow-complete: 0 1px 1px rgba(0, 0, 0, 0.25), 0 2px 8px rgba(0, 0, 0, 0.25), inset 0px 0px 0px 2px rgba([active-alt-rgb],1);
	--box-shadow-new: 0 1px 1px rgba(0, 0, 0, 0.25), 0 2px 8px rgba(0, 0, 0, 0.25), inset 0px 0px 0px 2px rgba([status-new-rgb],1);
	--box-shadow-notify: 0 1px 1px rgba(0, 0, 0, 0.25), 0 2px 8px rgba(0, 0, 0, 0.25), inset 0px 0px 0px 2px rgba([status-notify-rgb],1);
	--box-shadow-pending: 0 1px 1px rgba(0, 0, 0, 0.25), 0 2px 8px rgba(0, 0, 0, 0.25), inset 0px 0px 0px 2px rgba([status-pending-rgb],1);
	--box-shadow-edit: 0 0 6px 0 rgba([text-rgb],0.45) inset;
	--box-shadow-invalid: 0 0 6px 0 rgba([status-notify-rgb],0.45) inset;
}
