/* -- Global: Text Font and Typeface -- */
/* @import url('https://rsms.me/inter/inter-ui.css');*/
/* @import url('https://fonts.googleapis.com/css2?family=Azeret+Mono&display=swap'); */
/* @import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap'); */

/*

Colors:
- Core Background: #F5F6FA
- Text
	- Body: #2C3A47
	- Note: #888888
- Interactable
	- Primary: #4B7BEC
	- Tinted Background: #ecf1fd
	- Tinted Lines/Separator: #acc2f6
- Emphasis
	- Positive Sentiment: #6ab04c
		Something that we want to show as "positive" in the UI.
	- Negative Sentiment: #eb4d4b
		Something that we want to show as "negative" in the UI.
	- Negative Sentiment Shade: #F8C5C5
		Used for shading of items with negative sentiment.
	- Primary: #9381FF
	- Element Differentiation Passive: #f4f2ff
		A light shading applied to repeated elements to make them more easily differentiated, such as alternating table row backgrounds.
	- Element Differentiation Active: #e9e6ff
- Backgrounds
	- Dark: #EBECF0
		Used for headers that use backgrounds, such as the navigation bar and the table header row.
	- Light: #F5F5F5
		Used for light shading applied to many UI elements.
	- Content Sections: #FFFFFF
		Used for sections of content. Should provide extreme readability, as it's where most content is shown.
- Separators/lines
	- Neutral: #D3D4D8
		Used when items need to be bordered or separated, as with input box outline or with cell borders in tables.
*/

html,
textarea,
input,
select,
select option,
input,
textarea {
	font-family: 'Roboto', sans-serif;
	font-size: 14px;
}
@supports (ont-variation-settings: normal) {
	html {
		font-family: 'Roboto', sans-serif;
	}
}

.mono,
.data_link,
.money_amount,
.reconciliation_hierarchy .category .category_information .code,
.category_inline .code,
.prefixed_item_identifier span,
.code_display,
.text.code {
	font-family: 'Roboto', sans-serif;
}

/* -- Global: Sizing -- */
* {
	box-sizing: border-box;
	-webkit-user-select: none;
	user-select: none;
}
html,
body {
	margin: 0;
}

/* -- Global Font Size -- */
html,
.split > .column,
.select .option,
.table .row > .column,
input,
.data_grid .row .cell,
.modification_panel .item,
.tiles .tile,
.table .row .cell {
	font-size: 14px;
	line-height: 1.25em;
}

/* -- Global: Color -- */
html,
a,
input,
.button.subtle,
.icon.dark {
	color: #2c3a47;
	text-decoration: none;
}
.section a.text_link,
a.text:hover {
	cursor: pointer;
	color: rgba(75, 123, 236,1.0);
}

/* Natural List Elements */
ul {
	margin: 0;
	list-style-position: outside;
	list-style-type: square;
	padding-left: 40px;
}
li {
	padding-bottom: 5px;
}
li:last-child {
	padding-bottom: 0px;
}

/* -- Master Page Frame (`App.jsx`) --*/
body {
	background: #f5f6fa;
	/*f5f6fa*/
	overflow-y: hidden;
}
#core {
	width: 100%;
	min-width: 200px;
	margin: 0;
	padding: 20px;
}
#nav {
	-webkit-user-select: none;
	user-select: none;
	height: 50px;
	position: fixed;
	width: 100%;
	left: 0px;
	top: 0px;
	border-bottom: 1px solid rgba(0,0,0,0.1);
	display: flex;
	background: rgba(0,0,0,0.04);
	gap: 60px;
	padding: 0px 20px;
	flex-direction: row;
}
#nav #logo {
	font-size: 1.5em;
	color: #2c3a47;
	text-transform: lowercase;
	font-weight: 800;
	vertical-align: middle;
	line-height: 50px;
	height: 50px;
	display: inline-block;	
}

#nav #logo > img {
	width: 200px !important;
	vertical-align: middle;
}

#nav,
#nav a {
	color: #2c3a47;
}
#nav .nav_links {
	display: inline-block;
	height: 50px;
	line-height: 50px;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 20px;
}
#nav .nav_links a {
	display: inline-block;
	height: 30px;
	line-height: 30px;
	font-weight: bold;
	padding: 0px 8px;
	display: flex;
	flex-direction: row;
	cursor: pointer;
	gap: 8px;
	background: rgba(75, 123, 236, 0.0);
	border-radius: 5px;
	transition: all 100ms;
	transform: scale(1.00);
	border: 1px solid rgba(75, 123, 236, 0.0);
}
#nav .nav_links a .icon {
	font-size: 1.25em;
}
#nav .nav_links a .icon,
#nav .nav_links a .text {
	display: inline-block;
	height: 28px;
	line-height: 28px;
}
#nav .nav_links a:hover {
	color: rgba(75, 123, 236,1.0);
}
#nav .nav_links a.active {
	color: rgba(75, 123, 236,1.0);
	background: rgba(75, 123, 236, 0.1);
	border: 1px solid rgba(75, 123, 236, 0.2);
}
#nav .nav_links a:active {
	transform: scale(0.95);
}

#menu {
	-webkit-user-select: none;
	user-select: auto;
	height: 40px;
	position: fixed;
	width: 100%;
	left: 0px;
	top: 51px;
	border-bottom: 1px solid rgba(0,0,0,0.1);
	display: flex;
	background: white;
	gap: 60px;
	padding: 0px 20px;
	flex-direction: row;
	align-items: center;
}
#menu #logo {
	font-size: 1.5em;
	color: #2c3a47;
	text-transform: lowercase;
	font-weight: 800;
	vertical-align: middle;
	line-height: 50px;
	height: 50px;
	display: inline-block;	
}

#menu #logo > img {
	width: 200px !important;
	vertical-align: middle;
}

#menu,
#menu a {
	color: #2c3a47;
}
#menu .menu_links {
	display: inline-block;
	height: 50px;
	line-height: 50px;
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 20px;
}
#menu .menu_links a {
	display: inline-block;
	height: 30px;
	line-height: 30px;
	font-weight: bold;
	padding: 0px 8px;
	display: flex;
	flex-direction: row;
	cursor: pointer;
	gap: 8px;
	background: rgba(75, 123, 236, 0.0);
	border-radius: 5px;
	transition: all 100ms;
	transform: scale(1.00);
	border: 1px solid rgba(75, 123, 236, 0.0);
}
#menu .menu_links a .icon {
	font-size: 1.25em;
}
#menu .menu_links a .icon,
#menu .menu_links a .text {
	display: inline-block;
	height: 28px;
	line-height: 28px;
}
#menu .menu_links a:hover {
	color: rgba(75, 123, 236,1.0);
}
#menu .menu_links a.active {
	color: rgba(75, 123, 236,1.0);
	background: rgba(75, 123, 236, 0.1);
	border: 1px solid rgba(75, 123, 236, 0.2);
}
#menu .menu_links a:active {
	transform: scale(0.95);
}
#menu .breadcrumb {
  display: flex;
  flex-direction: row;
  gap: 8px;
  font-size: 0.95em;
}

#menu .breadcrumb a {
  text-decoration: none;
  color: #2c3a47;
  font-weight: 600;
}

#menu .breadcrumb a::after {
  content: ">";
  margin: 0 8px;
  color: #aaa;
}

#menu .breadcrumb a:last-child::after {
  content: "";
}

#menu .menu-button {
  padding: 6px 12px;
  background-color: #4b7bec;
  color: white;
  border: none;
  border-radius: 4px;
  font-weight: bold;
  cursor: pointer;
  transition: background-color 0.2s ease;
}

#menu .menu-button:hover {
  background-color: #3867d6;
}

#menu .menu-drawer {
  top: 90px;
}


.notification-badge {
	transition: all 450ms cubic-bezier(0.23, 1, 0.32, 1) 0ms;
    display: inline-block;
    position: absolute;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    color: rgb(255, 255, 255);
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    background-color: rgb(212, 19, 13);
    border-radius: 10px;
    top: -8px;
    right: -8px;
    transform: scale(1, 1);
}

#content {
  position: fixed;
  width: 100%;
  height: calc(100% - 90px);
  left: 0;
  top: 90px;
  padding: 25px;
  overflow-y: auto;
}

#footer {
  position: fixed;
  display: inline-block;
  left: 5px;
  bottom: 5px;
  pointer-events: none;
  padding: 0px;
}

.fixed_width {
    margin: 0px auto;
    max-width: 100%;
}
.fixed_width.no_center {
	margin: 0px;
}
.fixed_width[data-width="xlarge"]{
    width: 1500px;
}
.fixed_width[data-width="large"]{
    width: 1200px;
}
.fixed_width[data-width="medium"]{
    width: 900px;
}
.fixed_width[data-width="small"]{
    width: 600px;
}
.fixed_width[data-width="micro"]{
    width: 300px;
}

/* -- Global: Container Boxes (Sections) -- */
.section,
.data_grid,
.tiles .tiles,
.box,
.tooltip {
	padding: 20px;
	background: #fff;
	border: 1px solid rgba(0,0,0,0.1);
	border-radius: 15px;
	box-shadow: 0px 1px 5px 0px rgba(0,0,0,0.05);
	transition: all 100ms;
}
.section.flexible {
	display: inline-block;
}

/* Section */
.section {
	position: relative;
}
.section.outline {
	border: 1px solid rgba(0,0,0,0.1);
	padding: 20px;
	border-radius: 5px;
	box-shadow: none;
}
.section .spinner {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	border-radius: 5px;
	background: #FFFFFF;
}
.section .spinner .loading_text {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	animation-name: LoadingTextPulse;
	animation-duration: 500ms;
	animation-timing-function: ease-in-out;
	animation-delay: 0;
	animation-iteration-count: infinite;
	animation-direction: alternate;
	animation-fill-mode: forwards;
	animation-play-state: running;
}
@keyframes LoadingTextPulse {
	0% {
		color: inherit;
		transform: translate(-50%, -50%) scale(1.0);
	}
	100% {
		color: #4B7BEC;
		transform: translate(-50%, -50%) scale(1.05);
	}
}

/* Attribute Value Selector */
.attribute_value_selector {
	height: 30px;
	line-height: 30px;
	display: inline-block;
	position: relative;
	border-radius: 3px;
}
.attribute_value_selector[data-attribute_selected="true"]{
	background: rgb(156, 136, 255);
}
.attribute_value_selector div {
	display: inline-block;
}
.attribute_value_selector .attribute_dropdown {
	width: 200px;
}
.attribute_value_selector .attribute {
	background-color: rgba(0,0,0,0.1);
	padding: 0px 5px;
	border-top-left-radius: 3px;
	color: #ffffff;
	border-bottom-left-radius: 3px;
	border-right: 1px solid rgba(0,0,0,0.1);
}
.attribute_value_selector .attribute_value {
	color: #ffffff;
	padding: 0px 5px;
	cursor: pointer;
}
.attribute_value_selector .input_attribute_value {
	width: 100px;
}
.attribute_value_selector .input_attribute_value input {
	padding: 0px 5px;
	width: 100%;
	color: #ffffff;
}
.attribute_value_selector .attribute_value_suggestions {
    position: absolute;
    top: 50%;
    padding: 1px;
    width: 200px;
    left: calc(100% + 5px);
    transform: scale(0.99) translateX(-5px) translateY(-50%);
    pointer-events: none;
    opacity: 0;
    box-shadow: 0px 1px 10px 0px rgba(0,0,0,0.4);
    background: #fff;
    border-radius: 5px;
    transition: all 100ms;
}
.attribute_value_selector .attribute_value_suggestions .start_search_msg {
	padding: 10px;
}
.attribute_value_selector .attribute_value_suggestions[data-visible="true"] {
	opacity: 1;
	pointer-events: auto;
	transform: scale(1.00) translateX(0px) translateY(-50%);
}
.attribute_value_selector .attribute_value_suggestions a {
	display: block;
	padding: 0px 10px;
    cursor: pointer;
    border-radius: 4px;
    transition: all 100ms;

}
.attribute_value_selector .attribute_value_suggestions a:hover {
	background: rgba(75, 123, 236,1.0);
	color: #ffffff;
}
.attribute_value_selector .delete {
	position: absolute;
	display: block;
	right: -8px;
	top: -8px;
	height: 20px;
	width: 20px;
	text-align: center;
	line-height: 20px;
	background: #2c3a47;
	color: #fff;
	border-radius: 50%;
	font-size: 0.8em;
	opacity: 0;
	transform: scale(0.80);
	pointer-events: none;
	transition: all 100ms;
	box-shadow: none;
	z-index: 4;
	cursor: pointer;
}
.attribute_value_selector:hover .delete {
    pointer-events: auto;
    transform: scale(1.0);
    opacity: 1;
    box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.3);
    z-index: 5;
}
.attribute_value_selector:hover .delete:hover {
	transform: scale(1.2);
}

/* Reconciliation Table */
.rec_table .attribute_value .split .column {
	vertical-align: top;
}
.rec_table .expansion {
	padding-left: 20px;
	border-left: 1px solid rgba(0,0,0,0.1);
}
.rec_table .expansion .start_expansion {
	cursor: pointer;
}
.rec_table .expansion .start_expansion img {
	height: 14px;
	line-height: 18px;
	display: inline-block;
	margin-right: 5px;
	vertical-align: middle;
}
.rec_table .expansion[data-expansion_method="TRANSACTIONS"]{
	border-left: 1px solid #2c3a47;
}

a.text {
	transition: all 100ms;
}


/* Configuration Items */
.configuration_item .mod_indicator {
	pointer-events: none;
	display: none;
}
.configuration_item .mod_indicator .text {
	background: rgba(0,0,0,0.05);
	height: 15px;
	padding: 0px 5px;
	line-height: 15px;
	display: inline-block;
	border-radius: 10px;
}
.configuration_item .mod_indicator[data-modified="true"] {
	display: block;
}

/* Reports Items */
.report_item .mod_indicator {
	visibility: none;
	display: none;
}
.report_item .mod_indicator .text {
	background: rgba(0,0,0,0.05);
	box-sizing: 15px;
	padding: 0px 5px;
	line-height: 15px;
	display: inline-block;
	border-radius: 10px;
}
.report_item .mod_indicator[data-modified="true"] {
	display: block;
}

.pre {
    display: block;
    padding: 10px 30px;
    margin: 0;
    overflow: auto;
}

.section:first-child,
.form_item:first-child,
.split:first-child,
.data_grid:first-child,
.info_panel:first-child,
.title:first-child {
	margin-top: 0;
}

.info_panel .item div {
   display: inline-block;
}
.info_panel .item .label {
	margin-right: 10px;
	vertical-align: top;
	/* font-size: 0; */
	/* opacity: 0.8; */
	/* text-transform:  uppercase; */
	/* font-weight: 800; */
}
.info_panel .item .label:after {
	content: ":";
}


/* Item Link */
.item_link {
	background-color:#f5f6fa;
	font-size: small;
	font-weight: bold;
	color: rgba(75, 123, 236, 1.0);
	display: inline-block;
	cursor: pointer;
}
.item_link span:nth-child(1){
	opacity: 0.5;
}

/* -- Spacer -- */
/* Standard spacer size */
.spacer {
	margin-top: 20px;
}
/* Thin spacer, 0.5x standard spacer size */
.spacer.thin {
	margin-top: 10px;
}
/* Standard spacer with visual line separator */
.spacer.line {
	margin-top: 20px;
	border-top: 1px solid rgba(0,0,0,0.1);
	margin-bottom: 20px;
}
/* Wide spacer, 3x standard spacer size */
.spacer.wide {
	margin-top: 60px;
}


/* -- Table -- */
.table {
	border: 1px solid rgba(0,0,0,0.1);
	border-radius: 5px;
}
.table.section {
	padding: 0;
}
.table {
	display: flex;
	flex-direction: column;
}
.table .row {
	min-height: 34px;
	line-height: 30px;
	display: flex;
	flex-direction: row;
	border-bottom: 1px solid rgba(0,0,0,0.1);
}
.table .row.alt_bg {
	background: #f4f2ff;
}
.table .row:hover {
	background: #e9e6ff;
}
.table .row:last-child {
	border-bottom: none;
}
.table .row.header {
	font-weight: 500;
	text-align: center;
	border-bottom: 1px solid rgba(0,0,0,0.1);
	background: rgba(0,0,0,0.05);
	border-top-right-radius: 3px;
	border-top-left-radius: 3px;
}
.table .row.header .sort_icon {
	display: inline-block;
	color: #888888;
	margin-left: 3px;
	font-size: 10px;
}
.table .row.header .sort_icon.sorted {
	color: #4B7BEC;
	font-size: 20px;
}
.table .row.header > .cell {
	white-space: nowrap;
	justify-content: center;
}
.table .row > .cell {
	display: inline-block;
	border-right: 1px solid rgba(0,0,0,0.1);
	padding: 6px;
	min-width: 0;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
}
.table .row > .cell.clickable {
	cursor: pointer;
}
.table .row > .cell:last-child {
	border-right: none;
}
.table .no_results_message {
	padding: 20px;
}


/* -- Tiles -- */
.tiles {
	text-align: center;
	/* padding: 0px 5px; */
	width: calc(100% + 10px);
	left: -5px;
	top: -5px;
	position: relative;
}
.tiles .tile_wrapper {
	width: calc(100% / 3);
	display: inline-block;
	padding: 5px;
}
.tiles .tile_wrapper .tile {
	height: 200px;
}
.tiles .tile img.icon {
	width: 30px;
	height: 30px;
	margin: 0px auto;
	display: block;
}
.tiles .tile_wrapper a:hover .tile {
	border: 1px solid rgba(75, 123, 236,1.0);
	box-shadow: 0px 0px 4px 0px rgba(75, 123, 236, 0.2);
}

/* Controls */
.control {
	display: inline-block;
	outline: none;
	transition: all 100ms;
}
.control.inline,
.button.inline {
	display: inline-block;
	margin-right: 5px;
	margin-top: 0;
	vertical-align: top;
}
.control.subtle {
    height: 1.25em;
    line-height: 1em;
    border: none;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    outline: none;
    padding-bottom: 3px;
}
.control.text,
.control.dropdown {
	height: 30px;
	line-height: 30px;
	padding: 0px 5px;
}
.control.text,
.control.code,
.control.dropdown,
.control.paragraph {
	width: 100%;
}
.control.text,
.control.dropdown,
.control.code,
.control.paragraph {
	border: 1px solid #D3D4D8;
	background: #F5F5F5;
	box-shadow: none;
	padding: 2px 5px;
	border-radius: 3px;
}
.control.dropdown {
	cursor: pointer;
}
.control:active,
.control:focus {
	border-color: #4B7BEC;
	box-shadow: 0px 0px 0px 2px #acc2f6;
	background: #ffffff;
}
.control.text.invalid,
.control.dropdown.invalid,
.control.code.invalid,
.control.paragraph.invalid {
	border: 1px solid rgba(235, 77, 75, 1.0);
}
.control.invalid:active,
.control.invalid:focus {
	border-color: rgba(235, 77, 75, 1.0);
	box-shadow: 0px 0px 0px 2px #F8C5C5;
}
.control.text.multiline {
	line-height: 1.25em;
	padding: 2px 5px;
	height: 100px;
	word-break: keep-all;
	white-space: pre;
	-moz-tab-size: 2;
	tab-size: 2;
}
.control.text {
	-webkit-user-select: text;
	user-select: text;
}
.checkbox_wrapper {
	height: 30px;
	line-height: 30px;
}
.checkbox_wrapper .control.checkbox,
.checkbox_wrapper .label {
    display: inline-block;
}
.checkbox_wrapper .control.checkbox {
	margin-right: 5px;
	margin-left: 0;
}

/* -- Labeled Item **/
.labeled_item > .label {
	font-weight: 500;
	margin-bottom: 5px;
}

/* -- Button -- */
.button {
	cursor: pointer;
	display: inline-block;
	font-size: 0.8em;
	font-weight: 700;
	position: relative;
	-webkit-user-select: text;
	user-select: none;
	text-align: center;
	overflow: hidden;
	transition: all 100ms;
}

.button.rect,
.button.rect_light {
	padding: 0px 10px;
	text-transform: uppercase;
	border-radius: 15px;
	height: 30px;
	line-height: 30px;
}
.button.rect {
	background: rgba(75, 123, 236,1.0);
	color: rgba(255, 255, 255, 1.0);
	box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.3);
}
.button.rect_light {
	color: rgba(75, 123, 236,1.0);
	background: rgba(255, 255, 255, 1.0);
	box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.3);
}
.button.rect_dark {
	background: rgba(107, 138, 241, 0.926);
}
.button.rect_light:hover {
	background: rgba(226, 56, 56, 0.2);
}
.button.rect_dark:hover {
	background: rgba(22, 43, 93, 0.999);
}
.button.text {
	background: none;
}
.button.text.inline {
	padding: 0;
	display: inline-block;
	line-height: inherit;
	height: auto;
}
.right .button {
	margin-left: 10px;
	margin-right: 0;
}
.button.rect img {
	display: inline-block;
	height: 16px;
	pointer-events: none;
	position: absolute;
	top: calc(50% - 8px);
	left: calc(50% - 8px);
	transform-origin: center;
}
.button.rect:hover {
	background: #389dff;
}
.button.rect:active {
	background: rgba(75, 123, 236,1.0);
	box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.3) inset;
}
.button.subtle {
	background: rgba(0,0,0,0.00);
	box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.3) inset;
}
.button.disabled {
	color: #66696d53;
	border-radius: 15px;
	opacity: 5;
	background: rgba(0,0,0,0.04);
	box-shadow: none;
	cursor: not-allowed;
	pointer-events: none;
	padding: 0px 10px;
	text-transform: uppercase;
	border-radius: 15px;
	height: 30px;
	line-height: 30px;
}
.button.disabled:hover {
	background: rgba(0,0,0,0.06);
}
.button.disabled img {
	display: inline-block;
	height: 16px;
	pointer-events: none;
	position: absolute;
	top: calc(50% - 8px);
	left: calc(50% - 8px);
	transform-origin: center;
}

.button.full {
	display: block;
	margin-right: 0;
	width: 100%;
}

.button.small {
	font-size: 12px;
}

.button.medium {
	font-size: 17px;
}

.button.large {
	font-size: 24px;
}

.button.processing img {
	animation: SpinnerRotate 750ms normal infinite linear;
}
.button.complete .label,
.button.processing .label {
	color: rgba(255, 255, 255, 0.4);
}


/* -- Error Message -- */
.error_message {
	color:#eb4d4b;
	text-align: center;
	margin-top: 20px;
}

/* -- Img -- */
img.full {
	width: 100%;
}


/* -- Split --*/
.split {
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: stretch;
	gap: 20px;
}
.split .split_item {
	flex-grow: 1;
	min-width: 0;
}
.split.fixed_height .split_item {
	align-items: stretch;
}
.split.fixed_height .split_item .section {
	height: 100%;
	overflow-y: auto;
}

/* -- Money Amount -- */
.money_amount {
	display: inline-block;
	-webkit-user-select: text;
	user-select: text;
}
.money_amount[data-sentiment="negative"],
.visual_percent[data-sentiment="negative"],
.money_amount.negative {
	color: #eb4d4b;
}
.money_amount[data-sentiment="positive"],
.visual_percent[data-sentiment="positive"],
.money_amount.positive {
	color: #6ab04c;
}


/* -- Visual Date -- */
.visual_date {
	background: transparent;
    display: inline-block;
    cursor: pointer;
	-webkit-user-select: none;
    user-select: none;
    transition: all 100ms;
	color: var(--color);
}
.visual_date:hover {
    opacity: 0.5;
}


/* -- Link Grid -- */
.link_grid {
	display: flex;
	gap: 20px;
	flex-wrap: wrap;
}
.link_grid a {
	background-color: rgba(0,0,0,0.05);
	flex-grow: 1;
	flex-basis: 150px;
	padding: 10px;
	border-radius: 5px;
	background: rgba(0,0,0,0.04);
	transition: all 100ms;
	transform: scale(1.00);
	border: 1px solid rgba(75, 123, 236, 0.0);
}
.link_grid a:hover,
.link_grid a:hover .icon {
	color: rgba(75, 123, 236, 1.0);
}
.link_grid a:hover {
	background: #ecf1fd;
	border: 1px solid rgba(75, 123, 236, 1.0);
}
.link_grid a:active {
	transform: scale(0.95);
}
.link_grid a .icon {
	width: 100%;
	font-size: 28px;
	text-align: center;
	line-height: 28px;
}
#nav .nav_links a:hover {
	color: rgba(75, 123, 236,1.0);
}
#nav .nav_links a.active {
	color: rgba(75, 123, 236,1.0);
	background: rgba(75, 123, 236, 0.1);
	border: 1px solid rgba(75, 123, 236, 0.2);
}

/* -- Icon -- */
.icon.white {
	color: #ffffff;
}


/* -- Split Layout -- */
.split_layout {
	display: flex;
	height: 100%;
	gap: 20px;
	align-items: stretch;
}
/* Minor gap sizing also applies to all of the layout's child split layouts as well */
.split_layout.minor_gap_size,
.split_layout.minor_gap_size .split_layout {
	gap: 10px;
}
.split_layout.none_gap_size,
.split_layout.none_gap_size .split_layout {
	gap: 0px;
}
.split_layout.horizontal {
	flex-direction: row;
}
.split_layout.vertical {
	flex-direction: column;
}
.split_layout > .cell {
	flex-shrink: 0;
	flex-basis: 0;
	flex-grow: 0;
	min-height: 0;
	max-height: 100%;
}
.split_layout > .cell.divider {
	border-top: 1px solid rgba(0, 0, 0, 0.1);
}
.split_layout > .cell > .inner_cell {
	height: 100%;
	width: 100%;
}
.split_layout > .cell > .inner_cell.scrolled {
	overflow-y: auto;
}
.split_layout > .cell.organic_size {
	flex-basis: auto;
}

/* Calendar */
.calendar {
	width: 100%;
	height: 100%;
	width: 300px;
	border: 1px solid rgba(0,0,0,0.2);
	border-radius: 3px;
	display: flex;
	flex-direction: column;
}
.calendar .current_month,
.calendar .weekday_names,
.calendar .week {
	display: flex;
	width: 100%;
	flex-grow: 1;
}
.calendar .current_month .name {
	margin-right: 5px;
}
.calendar .current_month,
.calendar .day {
	text-align: center;
}
.calendar .day {
	width: calc(100% / 7);
}
.calendar .current_month {
	height: 30px;
	line-height: 30px;
}
.calendar .current_month .label {
	flex-grow: 1;
}
.calendar .current_month .increment,
.calendar .current_month .decrement {
	padding: 0px 10px;
	cursor: pointer;
}
.calendar .current_month .increment {
	text-align: right;
}
.calendar .current_month .decrement {
	text-align: left;
}
.calendar .week .day {
	padding: 3px;
}
.calendar .week .day .number {
	width: 100%;
	height: 100%;
	border-radius: 3px;
	border: 2px solid transparent;
}
.calendar .day {
	border-bottom: 1px solid rgba(0,0,0,0.2);
	border-right: 1px solid rgba(0,0,0,0.2);
}
.calendar .day:last-child,
.calendar .weekday_names .day {
	border-right: none;
}
.calendar .week:last-child .day {
	border-bottom: none;
}
.calendar .week:last-child .day:last-child {
	border-right: 1px solid rgba(0,0,0,0.2);
}
.calendar .week .day {
	cursor: pointer;
}
.calendar .day.positive,
.calendar .day.negative {
	font-weight: 700;
}
.calendar .day.positive .number {
	color: #fff;
	background: #6ab04c;
}
.calendar .day.negative .number {
	color: #fff;
	background: #eb4d4b;
}
.calendar .week .day:hover,
.calendar .week .day.selected {
	background: rgba(0,0,0,0.1);
	box-shadow: 0px 0px 0px 1px rgba(75, 123, 236, 1.0) inset;
}


/* -- Timeline -- */
.timeline {
	position: relative;
}
.timeline > div {
	position: relative;
	display: inline-block;
}
.timeline > div > .edge {
	height: 1px;
	border-top: 1px dashed rgba(0,0,0,0.1);
	width: 100%;
	left: -50%;
	position: relative;
}
.timeline > div[data-sentiment="positive"] > .edge {
	border-top: 1px solid #6ab04c;
}
.timeline > div:first-child > .edge {
	border-top: 1px solid transparent;
}
.timeline > div > .edge:after {
	content: "";
	position: absolute;
	display: block;
	right: -3px;
	top: -3px;
	height: 6px;
	width: 6px;
	border-radius: 3px;
	background: #eb4d4b;
}
.timeline > div > .edge_elapsed {
	position: absolute;
	transform: translateX(-50%);
	top: 5px;

}
.timeline > div[data-sentiment="positive"] > .edge:after {
	background: #6ab04c;
}
.timeline > div > .label,
.timeline > div > .date_wrapper {
	text-align: center;
}
.timeline > div > .label {
	margin-top: 10px;
}

.data_link {
	display: inline-block;
	border-bottom: 1px dashed rgba(0, 0, 0, 0.2);
	color: inherit;
	transition: all 100ms;
	cursor: pointer;
}
.data_link:hover,
.data_link:focus {
	border-bottom: 1px solid rgba(75, 123, 236, 1.0);
	color: rgba(75,  123, 236, 1.0);
}

/* Live Searcher */
.live_searcher .results {
	background: rgba(0,0,0,0.02);
	border-bottom-left-radius: 3px;
	border-bottom-right-radius: 3px;
	border: 1px solid rgba(0,0,0,0.2);
	border-top: 0;
	width: calc(100% - 10px);
	margin-left: 5px;
}
.live_searcher .results .result {
	padding: 5px;
	cursor: pointer;
	transition: all 100ms;
	border-radius: 3px;
}
.live_searcher .results .result:hover {
	font-weight: 700;
	color: rgba(75, 123, 236,1.0);
	background: #ffffff;
}

/* Inline list */
.inline_item_list {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 3px;
	flex-wrap: wrap;
}
.inline_item_list.vertical_align_top {
	align-items: flex-start;
}
.inline_item_list.justify_center {
	justify-content: center;
}
.inline_item_list.justify_right {
	justify-content: right;
}
.inline_item_list.justify_left {
	justify-content: left;
}
.inline_item_list.gap_size_major {
	gap: 20px;
}
.inline_item_list.gap_size_minor {
	gap: 10px;
}
.inline_item_list.gap_size_shim {
	gap: 3px;
}

div.inline {
	display: inline-block;
}

/* Suggestion Input */
.suggestion_input {
    position: relative;
}
.suggestion_input[data-suggestions_shown="true"] {
	z-index: 5;
}
.suggestion_input .suggestions {
	position: absolute;
	padding: 1px;
	width: calc(100% + 10px);
	left: -5px;
	top: -5px;
	z-index: -1;
	box-shadow: 0px 0px 20px -5px rgba(0,0,0,0.2);
	background: #fff;
	border-radius: 5px;
	transition: all 100ms;
	opacity: 0;
	pointer-events: none;
	transform: scale(0.95) translateY(-5px);
	padding: 40px 5px 5px 5px;
	transform: all 100ms;
}
.suggestion_input[data-suggestions_shown="true"] .suggestions {
	opacity: 1;
	pointer-events: auto;
	transform: scale(1.0) translateY(0px);
}
.suggestion_input .suggestions .suggestion .label {
	display: inline-block;
	padding: 0px 3px;
	line-height: 20px;
	border-radius: 3px;
	cursor: pointer;
    transition: all 100ms;
}
.suggestion_input .suggestions .suggestion .label:hover {
    background: rgba(75, 123, 236,1.0);
    color: #fff;
    font-weight: 600;
}


/* Environment Indicator */
#environment_indicator {
	pointer-events: none;
	position: fixed;
	display: block;
	right: 0px;
	top: 0px;
	z-index: 1;
	background: rgb(44, 58, 71, 0.4);
	color: #fff;
	font-weight: 600;
	font-size: 0.9em;
	padding: 0px 2px;
	line-height: 15px;
	height: 15px;
	border-bottom-left-radius: 3px;
	-webkit-user-select: text;
	user-select: text;
}


/* -- Traits -- */
.traits {
	overflow: auto;
	display: flex;
	flex-direction: column;
	border: 1px solid #888888;
	border-radius: 5px;
}
.traits > .trait {
	display: flex;
	flex-direction: row;
	border-bottom: 1px solid #888888;
}
.traits > .trait > div {
	padding: 6px;
}
.traits > .trait:first-child > .label {
	border-top-left-radius: 5px;
}
.traits > .trait:first-child > .content {
	border-top-right-radius: 5px;
}
.traits > .trait:last-child > .label {
	border-bottom-left-radius: 5px;
}
.traits > .trait:last-child > .content {
	border-bottom-right-radius: 5px;
}
.traits > .trait:last-child {
	border-bottom: none;
}
.traits > .trait > .label {
	background: #F5F5F5;
	padding: 6px;
	flex-basis: 150px;
	flex-grow: 0;
	flex-shrink: 0;
}
.traits > .trait > .content {
	flex-grow: 1;
	overflow: auto;
}


/* -- Text -- */
/* Some text items are "one-line" display items, meaning we should use a 30px line height */
.text {
	-webkit-user-select: text;
	user-select: text;
}
.text.code {
	word-break: inherit;
	overflow: auto;
	display: inline-block;
	white-space: pre;
}
.text.bold {
	font-weight: bold;
}
.text.italic {
	font-style: italic;
}
.text.code.preserve_whitespace {
	white-space: pre;
	overflow: auto;
}
.text.large {
	font-size: 1.25em;
}
.text.strikethrough {
	text-decoration: line-through;
}
.text.title {
	font-size: 1.1em;
	margin-top: 0;
	font-weight: 700;
}
.text.header {
	padding-top: 30px;
	font-size: 1.5em;
	font-weight: 800;
	text-align: center;
	line-height: 1.5em;
}
.text.enum {
	display: inline-block;
	text-transform: uppercase;
	padding: 0px 3px;
	border-radius: 50px;
	font-size: 0.75em;
	line-height: 20px;
	margin-right: 2px;
	margin-bottom: 2px;
	height: 20px;
	font-weight: 700;
	white-space: nowrap;
	border: 1px solid #2c3a47;
}
.text.sentiment.positive {
	color: #6ab04c;
}
.text.sentiment.negative {
	color: #eb4d4b;
}
.text.sentiment.warning {
	color: rgba(237, 178, 0, 1.0);
}
.text.sentiment.informative {
	color: rgba(75, 123, 236, 1.0);
}
.text.enum.sentiment.positive {
	border-color: #6ab04c;
}
.text.enum.sentiment.negative {
	border-color: #eb4d4b;
}
.text.enum.sentiment.informative {
	border-color: rgba(75, 123, 236, 1.0);
}
.text.enum.wide_line {
	margin-top: 5px;
}
.text.note {
	color: rgba(0,0,0,0.6);
	font-size: 0.8em;
}
.text.meta {
	color: rgba(44,58,71, 0.6);
}
.text.attribute_value {
	display: inline-block;
	height: 20px;
	line-height: 20px;
	padding: 0px 3px;
	border-radius: 3px;
	background: rgba(75, 123, 236, 0.1);
}
.text.navigation {
	text-transform: uppercase;
	font-size: 0.75em;
	font-weight: 700;
	letter-spacing: 0.5px;
}
.text.navigation.inline {
	display: inline-block;
	height: auto;
	line-height: inherit;
}
.text.navigation.active {
	color: rgba(75, 123, 236, 1.0);
}
.text.navigation.active[data-value="3"] {
	color: #6ab04c;
}
.text.navigation .prefix_circle {
	display: inline-block;
	margin-right: 5px;
	height: 20px;
	line-height: 18px;
	width: 20px;
	text-align: center;
	background: none;
	border-radius: 50%;
	border: 2px solid rgb(44, 58, 71, 1.0);
}
.text.navigation.active .prefix_circle {
	color: #ffffff;
	background: rgba(75, 123, 236, 1.0);
	border: 2px solid rgba(75, 123, 236, 1.0);
}
.text.navigation.active .prefix_circle[data-value="3"] {
	color: #ffffff;
	background: #6ab04c;
	border: 2px solid #6ab04c;
}
.text.right {
	text-align: right;
}


/* Enum Selector*/
.enum_selector {
	border: 1px solid rgba(0,0,0,0.1);
	border-radius: 3px;
	height: 30px;
	display: inline-block;
	padding: 2px;
	-webkit-user-select: none;
	user-select: none;
	background: #EBECF0;
}
.enum_selector .option {
	display: inline-block;
	cursor: pointer;
	padding: 0px 10px;
	border-radius: 3px;
	font-size: 0.8em;
	font-weight: 700;
	text-transform: uppercase;
	height: 24px;
	line-height: 22px;
	border: 1px solid transparent;
	transition: all 100ms;
}
.enum_selector .option .emphasis_dot {
	display: inline-block;
	height: 8px;
	width: 8px;
	margin-left: 4px;
	border-radius: 50%;
}
.enum_selector .option .emphasis_dot.negative {
	background-color: #eb4d4b;
}
.enum_selector .option:hover,
.enum_selector .option.selected {
	color: #4B7BEC;
}
.enum_selector .option.selected {
	background: #ecf1fd;
	border: 1px solid #acc2f6;
}


/* -- Tooltip -- */
.tooltip_container {
	position: relative;
}
.tooltip {
	position: absolute;
	z-index: 10;
	top: -5px;
	pointer-events: none;
	transform: translateY(-100%);
	padding: 5px;
	background: #ffffff;
	border-radius: 5px;
	left: calc(50% - 150px);
	border: 2px solid #4B7BEC;
}


/* -- Attribute Display List -- */
.attribute_display_list {
	display: flex;
	flex-direction: row;
	flex-wrap: wrap;
	gap: 5px;
}
.attribute_display_list .attribute {
	/* TODO: from here on out, use these two colors instead of the rgba(0,0,0,0.05) sort of thing */
	background: #f5f6fa;
	border: 1px solid #e5e5e5;
	padding: 0px 5px;
	border-radius: 3px;
	display: inline-block;
	flex-grow: 0;
}
.attribute_display_list .attribute > div {
	display: block;
}
.attribute_display_list .attribute {
	height: 30px;
}
.attribute_display_list .attribute > .name {
	height: 13px;
	line-height: 13px;
}
.attribute_display_list .attribute > .value {
	height: 15px;
	line-height: 15px;
}


/* -- Modal -- */
.modal_background {
	position: fixed;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	background: rgba(0,0,0,0.2);
	pointer-events: auto;
	z-index: 5;
	display: flex;
}
.modal_background .modal {
	position: absolute;
	z-index: 6;
	box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.1);
	border-radius: 15px;
	background: #fff;
	padding: 20px;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: calc(100% - 20px);
	max-width: 1200px;
	max-height: calc(100% - 20px);
	pointer-events: auto;
	overflow-y: auto;
	overflow-x: clip;
	justify-content: center;
    align-items: center;
}
.modal_background .modal.modal-xxl {
	max-width: 1600px !important;
}
.modal_background .modal.modal-xl {
	max-width: 1200px !important;
}
.modal_background .modal.modal-lg {
	max-width: 900px !important;
}
.modal_background .modal.modal-md {
	max-width: 600px !important;
}
.modal_background .modal.modal-sm {
	max-width: 400px !important;
}
.modal_background .modal .close_button {
	position: absolute;
	width: 30px;
	height: 30px;
	right: 5px;
	top: 5px;
	padding: 10px;
	cursor: pointer;
	border-radius: 50%;
	transform: scale(1.0);
	transition: all 100ms;
}
.modal_background .modal .close_button img {
	height: 100%;
	width: 100%;
	vertical-align: top;
}
.modal_background .modal .close_button:hover {
	transform: scale(1.4);
	background: rgba(240, 3, 3, 0.1);
}
.modal_background .modal.active {
	transform: translate(-50%, -50%) scale(1);
}

.alert_modal {
	position: absolute;
	z-index: 6;
	box-shadow: 0px 0px 40px 0px rgba(0,0,0,0.1);
	border-radius: 15px;
	background: #fff;
	padding: 20px;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	width: calc(100% - 20px);
	max-width: 600px;
	max-height: calc(100% - 20px);
	pointer-events: auto;
	overflow-y: auto;
	overflow-x: clip;
}
.alert_modal .close_button {
	position: absolute;
	width: 30px;
	height: 30px;
	right: 5px;
	top: 5px;
	padding: 10px;
	cursor: pointer;
	border-radius: 50%;
	transform: scale(1.0);
	transition: all 100ms;
}
.alert_modal .close_button img {
	height: 90%;
	width: 90%;
	vertical-align: top;
}
.alert_modal .close_button:hover {
	transform: scale(1.4);
	background: rgba(240, 3, 3, 0.1);
}
.alert_modal .alert_modal.active {
	transform: translate(-50%, -50%) scale(1);
}
.alert_modal button {
	margin-left: 80%;
	margin-right: 10%;
	padding: 5px 20px 5px 20px;
	background:  rgba(75, 123, 236, 0.8);
	color: #fff;
	border: 0;
	outline: none;
	font-size: 18px;
	border-radius: 25px;
	cursor: pointer;
	box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
}
.alert_modal h2 {
	color: rgba(0,0,0,0.1);
}
.alert_modal h2[data-value="ERROR"] {
	color: rgba(239, 17, 17, 0.77);
}
.alert_modal h2[data-value="SESSION"] {
	color: rgba(244, 168, 53, 0.835);
}

.success_modal {
	width: 400px;
	background: #fff;
	border-radius: 6px;
	border-width: 1px;
	border-style: outset;
	position: relative;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
	padding: 0 30px 30px;
	color: #333;
}
.success_modal img {
	width: 100px;
	margin-top: -50px;
	border-radius: 50%;
	background-color: #fff;
	box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}
.success_modal h2{
	font-size: 38px;
	font-weight: 500;
	margin: 30px 0 10px;
}
.success_modal button {
	width: 100%;
	margin-top: 50px;
	padding: 10px 0;
	background: #6fd649;
	color: #fff;
	border: 0;
	outline: none;
	font-size: 18px;
	border-radius: 25px;
	cursor: pointer;
	box-shadow: 0 5px 5px rgba(0, 0, 0, 0.2);
}

/* ErrorBoundaryPage Image*/
.error_page img {
	width: 10%;
	margin-top: -50px;
	border-radius: 50%;
	background-color: #fff;
	box-shadow: 0 2px 5px rgba(0,0,0,0.2);
}

/* Text styling */
.title {
    font-weight: 700;
    font-size: 1.25em;
    /*margin: 5px 0px;*/
}
.title .icon {
	height: 1.0em;
	margin-right: 10px;
    vertical-align: top;
}
.light {
    opacity: 0.5;
}    
.small {
	font-size: 0.8em;
}
.tiny {
	opacity: 0.5;
	font-size: 0.8em;
}
.chunky {
	font-size: 0.8em;
	opacity: 0.5;
	text-transform: uppercase;
	font-weight: 700;
}
.strong {
	font-weight: 700;
}
.inline {
	display: inline-block;
}
.centered {
	text-align: center;
}
.right {
	text-align: right;
}
.sentiment_coloring[data-sentiment="positive"] {
	color: #6ab04c;
}
.sentiment_coloring[data-sentiment="negative"] {
	color: #eb4d4b;
}
.sentiment_coloring[data-sentiment="warning"] {
	color: #f39c12;
}
.sentiment_coloring[data-sentiment="informative"] {
	color: rgba(75, 123, 236,1.0);
}
.wide_line {
	line-height: 30px;
	height: 30px;
}
.pointer {
	cursor: pointer;
}

/* Stack */
.stack > .stack_item,
.stack.major > .stack_item {
	margin-top: 20px;
}
.stack.minor > .stack_item {
	margin-top: 10px;
}
.stack.shim > .stack_item {
	margin-top: 3px;
}
.stack > .stack_item.first_item {
	margin-top: 0;
}

/* Icon */
.standalone_icon {
	height: 20px;
	line-height: 30px;
}

/* Breadcrumbs */
.breadcrumbs {
    text-transform: uppercase;
	font-size: 0.75em;
	font-weight: 700;
	height: 30px;
	line-height: 30px;
}
.breadcrumbs a,
.breadcrumbs .current,
.breadcrumbs img {
    display: inline-block;
    margin-right: 5px;
}
.breadcrumbs img {
	height: 10px;
}
.breadcrumbs a:hover {
	color: rgba(75, 123, 236,1.0);
}

/* Attribute Value */
.attribute_value_pair {
    background: #44bd32;
    border-radius: 3px;
    height: 30px;
    display: inline-block;
    line-height: 30px;
}
.attribute_value_pair .attribute,
.attribute_value_pair .value {
	padding: 0px 5px;
	display: inline-block;
	color: #fff;
}
.attribute_value_pair .attribute {
	background: rgba(0,0,0,0.1);
	border-bottom-left-radius: 3px;
	border-top-left-radius: 3px;
}

/* Enum */
.enum {
	display: inline-block;
	text-transform: uppercase;
	padding: 0px 3px;
	border-radius: 2px;
	font-size: 0.75em;
	line-height: 20px;
	height: 20px;
	/* letter-spacing: 1px; */
}
.enum[data-color="purple"] {
	border: 1px solid #9c88ff;
	color: #9c88ff;
    background: rgba(156, 136, 255, 0.1);
}
.enum[data-color="pink"] {
	border: 1px solid rgba(181, 52, 113,1.0);
	color: rgba(181, 52, 113,1.0);
	background: rgba(181, 52, 113, 0.1);
}
.enum[data-color="orange"]{
	border: 1px solid #f39c12;
	color: #f39c12;
	background: rgba(243, 156, 18, 0.1);
}
.enum[data-color="green"] {
	border: 1px solid rgba(68, 189, 50,1.0);
	color: rgba(68, 189, 50,1.0);
    background: rgba(68, 189, 50, 0.1);
}
.enum[data-color="blue"] {
	border: 1px solid rgba(72, 126, 176,1.0);
	color: rgba(72, 126, 176,1.0);
    background: rgba(72, 126, 176, 0.1);
}
.enum[data-color="red"] {
	border: 1px solid rgba(232, 65, 24,1.0);
	color: rgba(232, 65, 24,1.0);
    background: rgba(232, 65, 24, 0.1);
}

.priority_number {
	display: inline-block;
	padding: 0px 8px;
	border: 1px solid rgba(0,0,0,0.1);
	height: 20px;
	line-height: 20px;
	border-radius: 10px;
}

.reconciliation_status .overall_status .text_status {
	margin-right: 10px;
	display: inline-block;
}
.reconciliation_status .overall_status .money_amount {
	display: inline-block;
}

/* Loading Spinner */
.loading_spinner {
	width: 100%;
	height: 40px;
	position: relative;
	border-radius: 5px;
	animation: LoadingSpinnerBounce 500ms alternate infinite ease-in-out;
}
.loading_spinner:after {
	content: "LOADING";
	color: rgba(0,0,0,0.1);
	font-weight: 700;
	letter-spacing: 2px;
	display: block;
	height: 40px;
	line-height: 40px;
	text-align: center;
}

/* Fade Appear Animations */
#popup_content,
.section,
.fade_appear,
.split_layout .cell.box,
.tooltip_container > .tooltip {
	animation: FadeAppear 200ms alternate 1 ease-in-out;
}

/* Initial Page Spinner */
#initial_page_spinner {
	position: fixed;
	height: 200px;
	width: 200px;
	left: calc(50%);
	top: calc(50%);
	transform: translateX(-50%) translateY(-50%);
}
#initial_page_spinner img {
	width: 60px;
	height: 60px;
	display: block;
	margin: 0px auto;
}

@keyframes LoadingSpinnerBounce {
	0% {
        background: rgba(0,0,0,0.02);
	}
	100% {
	    background: rgba(0,0,0,0.06);
	}
}

@keyframes FadeAppear {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

@keyframes SpinnerRotate {
	0% {
        transform: rotateZ(0turn);
	}
	100% {
		transform: rotateZ(1turn);
	}
}

/* MOBILE */
@media (max-width: 1000px) {
    
    /* Global font size */
    .split .column {
    	font-size: 14px;
	    line-height: 1.25em;
    }

    #header #logo {
    	text-align: center;
    	display: block;
    }

    #header #active_link_group {
    	display:none;
    }
    #header #pulldown {
    	max-height: 80vh;
    	overflow-y: scroll;
    }
    #header #pulldown .link_group {
    	width: calc(100% / 2);
    	margin-top: 20px;
    }
	#header #pulldown .link_group a {
        margin-top: 5px;
	}

	.split .column {
		display: block;
		width: 100% !important;
		padding: 0px;
		margin-top: 20px;
	}
	.split .column:first-child {
		margin-top: 0;
	}
}

/* SECTION - Added by Emi Iovan */
/* Scrollbar */
/* width */
::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

/* Track */
::-webkit-scrollbar-track {
	background: #f1f1f1; 
}

/* Handle */
::-webkit-scrollbar-thumb {
	background: #888; 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
	background: #555; 
}
/* End Scrollbar */

/* Buttons */
/* Default */
.button.text.default {
	color: rgba(44, 58, 71, 1.0);
}

.button.text.default:hover {
	color: rgba(75, 123, 236, 0.8);
}

.button.rect.default {
	background: rgba(142, 142, 142, 1.0);
}

.button.rect.default:hover {
	background: rgba(142, 142, 142, 0.8);
}
/* End Default */

/* Primary */
.button.text.primary {
	color: rgba(75, 123, 236, 1.0);
}

.button.text.primary:hover {
	color: rgba(75, 123, 236, 0.8);
}

.button.rect.primary {
	background: rgba(75, 123, 236, 1.0);
}

.button.rect.primary:hover {
	background: rgba(75, 123, 236, 0.8);
}
/* End Primary */

/* Neutral */
.button.text.neutral {
	color: rgba(0, 0, 0, 1.0);
}

.button.text.neutral:hover {
	color: rgba(0, 0, 0, 0.8);
}

.button.rect.neutral {
	background: rgba(0, 0, 0, 1.0);
}

.button.rect.neutral:hover {
	background: rgba(0, 0, 0, 0.8);
}
/* End Neutral */

/* Danger */
.button.text.danger {
	color: rgba(220, 53, 69, 1.0);
}

.button.text.danger:hover {
	color: rgba(220, 53, 69, 0.8);
}

.button.rect.danger {
	background: rgba(220, 53, 69, 1.0);
}

.button.rect.danger:hover {
	background: rgba(220, 53, 69, 0.8);
}
/* End Danger */

/* Warning */
.button.text.warning {
	color: rgb(237, 178, 0, 1.0);
}

.button.text.warning:hover {
	color: rgba(237, 178, 0, 0.8);
}

.button.rect.warning {
	background: rgba(237, 178, 0, 1.0);
}

.button.rect.warning:hover {
	background: rgba(237, 178, 0, 0.8);
}
/* End Warning */

/* Success */
.button.text.success {
	color: rgb(21, 115, 71, 1.0);
}

.button.text.success:hover {
	color: rgba(21, 115, 71, 0.8);
}

.button.rect.success {
	background: rgba(21, 115, 71, 1.0);
}

.button.rect.success:hover {
	background: rgba(21, 115, 71, 0.8);
}
/* End Success */
/* End Buttons */

/* Others */
.align-self-center {
	align-self: center;
}

.mui-tabs-custom {
	padding: 20px 0px 0px 0px !important;
}

.mui-pagination-custom li {
	padding-bottom: 5px !important;
}

.mui-pagination-custom-entries-per-page #select-entries-per-page {
    padding: 7px 14px !important;
}

.action-buttons-container {
	margin-top: 8px;
	margin-left: 8px;
	margin-right: 8px;
	display: flex;
  	gap: 5px;
  	align-items: center;
}

.action-buttons-container span.action-button {
	font-size: 17px;
}

.mui-icon-tab-button-custom {
	padding-top: 0px !important;
	padding-bottom: 0px !important;
	max-height: 48px !important;
	min-height: 48px !important;
}

.vertical-align-container {
	height: 100%;
    width: 100%;
    display: table;
	min-height: 100px;
}

.vertical-align-middle {
	vertical-align: middle;
}

.vertical-align-container .vertical-align-content {
	display: table-cell;
    height: 100%;
    vertical-align: middle;
    text-align: center;
}

.MuiChip-label {
	-webkit-user-select: text;
	user-select: text;
}

.form-check-label.active input {
    accent-color: rgba(21, 115, 71, 1.0);
}

.form-check-label.inactive input {
    accent-color: #eb4d4b;
}

.active-text {
    color: rgba(21, 115, 71, 1.0);
}

.inactive-text {
    color: #eb4d4b;
}

/* End Others */
/* END SECTION - Added by Emi Iovan */