:root {
	--transition: all 0.2s ease-out;
	interpolate-size: allow-keywords;
}

.upper-case {
	text-transform: uppercase;
}

html {
	width: 100vw;
	height: 100vh;
}

body {
	margin: 0;
	padding: 0;
	font-size: 12pt;
	font-family: roboto;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	min-height: 100%;
	background-color: var(--background-color);
	color: var(--text-color);
	height: 100%;
}
body.dark-theme {
	color-scheme: dark;
	--main-color: rgb(56 79 187); /* Accent blue - softer, less harsh */
	--main-color-tinted: #44638f;
	--secondary-color: #13161a; /* Panel background - better contrast from main bg */
	--text-color: #ffffffbb; /* Main text - improved readability */
	--background-color: #0d1117; /* Page background - true dark theme standard */
	--border-color: #30363d; /* Subtle border - more visible */
	--third-color: #ffffffad; /* Muted secondary text - better contrast */
	--footer-background: var(--background-color);
	--footer-color: var(--text-color);
	--header-background-color: var(--panel-background-color);
	--disabled-color: #5a6169;
	--error-color: #f85149; /* More visible error color */
	--panel-color-border: var(--border-color);
	--header-color-border: var(--border-color);
	--print-color: #ff7b00;

	--nav-button-icon-color: var(--text-color);
	--saturn-icon-color: var(--text-color);
	--richtable-alternating-background-color: #161b22;
	--richtable-border-color: var(--border-color);
	--richtable-paging-buttons-border-color: var(--border-color);
	--richtable-paging-buttons-background-color: var(--background-color);
	--richtable-auto-filter-color: var(--main-color);
	--richtable-header-background-color: var(--secondary-color);
	--richtable-header-background-color-hover: #30363d;
	--richtable-header-border-color: var(--border-color);
	--richtable-header-border-color-autofilter: #21262d;
	--richtable-header-border-color-background: var(--background-color);
	--richtable-header-text-color: var(--text-color);
	--richtable-checkbox-color: rgba(139, 148, 158, 0.3);
	--richtable-header-sort-color: #f0f6fc;
	--richtable-header-shadow: var(--black-20percent);
	--richtable-header-search-icon-color: #8b949e;
	--richtable-incomplete-amount-color: #0d1117;
	--richtable-row-color-hover: #21262d;
	--file-display-panel-background-color: var(--background-color);
	--file-display-background-color: #161b22;
	--file-display-color-border: var(--secondary-color);
	--switchbutton-color: var(--main-color-tinted);
	--switchbutton-active-color: var(--main-color);
	--switchbutton-switcher-color: var(--background-color);
	--success-color: #269435; /* GitHub-style success green */
	--success-color-light: #238636;
	--accept-color: var(--main-color);
	--accept-color-hover: #388bfd;
	--panel-background-color: var(--secondary-color);
	--panel-color-text: var(--text-color);
	--input-background-color: #21262d;
	--input-border-color: #30363d;
	--input-background-color-disabled: #161b22;
	--button-color: var(--text-color);
	--button-shadow: rgba(0, 0, 0, 0.5);
	--button-clear-background-color: var(--background-color);
	--button-clear-color: var(--main-color);
	--button-clear-color-disabled: #484f58;
	--button-dropdown-list-background-color: var(--secondary-color);
	--button-color-border-disabled: var(--secondary-color);
	--sidemenu-color-border: var(--border-color);
	--sidemenu-color-border-bottom: var(--border-color);
	--sidemenu-background-color: var(--secondary-color);
	--nav-background-color: var(--background-color);
	--nav-color-border: var(--border-color);
	--nav-link-color-hover: var(--background-color);
	--input-background-color: #21262d;
	--input-border-color: #30363d;
	--input-component-label-color: var(--main-color);
	--input-component-background-color: var(--text-color);
	--input-component-saturn-icon-background-color: var(--secondary-color);
	--input-background-color-disabled: #161b22;
	--input-multiselect-dropdown-background-color: var(--background-color);
	--input-multiselect-dropdown-color-border-top: var(--border-color);
	--select-background-color-disabled: var(--input-background-color-disabled);
	--select-color-disabled: var(--disabled-color);
	--dropdown-container-background-color: var(--secondary-color);
	--dropdown-container-color-border: var(--border-color);
	--dropdown-container-color-border: var(--text-color);
	--collapseitem-coveragegrid-background-color: var(--secondary-color);
	--sidemenu-wizard-button-background-color: var(--secondary-color);
	--sidemenu-wizard-button-color-border-right: rgba(139, 148, 158, 0.6);
	--panel-background-color: var(--secondary-color);
	--panel-color-text: var(--text-color);
	--panelcustomerlive-livescreencontainer-background-color: var(--secondary-color);
	--panelbuyersorder-grid-color-border: var(--border-color);
	--panelbuyersorder-grid-background-color: var(--file-display-background-color);
	--panelbuyersorder-grid-text-color: var(--text-color);
	--fimenu-signalr-notes-background-color: var(--background-color);
	--fimenubasic-column-background-color: #1f2328;
	--fimenubasic-title-color: var(--text-color);
	--modal-background-color: var(--background-color);
	--card-background-color: var(--secondary-color);
	--tabmenu-background-color-close-button: var(--background-color);
	--tabmenu-color-border: var(--border-color);
	--tabmenu-background-color-hover: var(--secondary-color);
	--tabmenu-color-hover: var(--text-color);
	--sidemenu-wizard-color-border: var(--border-color);
	--pill-info-color: var(--main-color);
	--pill-success-color: var(--success-color);
	--pill-warning-color: var(--print-color);
	--pill-error-color: var(--error-color);

	--pill-text-success-color: var(--success-color);
	--pill-text-warning-color: var(--print-color);
	--pill-text-danger-color: var(--error-color);
	--pill-text-info-color: var(--text-color);

	--callout-info-text-color: #6ea8fe;
	--callout-success-text-color: ##75b798;
	--callout-warning-text-color: #ffda6a;
	--callout-error-text-color: #ea868f;

	--callout-info-background-color: #031633;
	--callout-success-background-color: #051b11;
	--callout-warning-background-color: #332701;
	--callout-error-background-color: #2c0b0e;

	--callout-info-border-color: #084298;
	--callout-success-border-color: #0f5132;
	--callout-warning-border-color: #997404;
	--callout-error-border-color: #842029;
}

body.dark-theme #employeeSignature,
body.dark-theme #employeeInitials {
	/* Refer to https://codepen.io/sosuke/pen/Pjoqqp to generate a filter to change from black to a desired color. */
	filter: invert(100%) sepia(0%) saturate(7497%) hue-rotate(338deg) brightness(102%) contrast(104%);
}

body.dark-theme .IsBusyScreenComponent-container img,
body.dark-theme .loading-saturn-anim img {
	-webkit-filter: invert(100%);
	filter: invert(100%);
}

body.dark-theme textarea {
	background-color: var(--background-color);
}

body.saturn-theme {
	--nav-button-icon-color: var(--main-color);
	color-scheme: dark;
	--main-color: #f79e44;
	--main-color-tinted: #fdc389;
	--secondary-color: #4d2600;
	--text-color: #ffffcc;
	--background-color: #221a0f;
	--border-color: var(--text-color);
	--third-color: var(--main-color);
	--header-background-color: #1c150c;
	--footer-background: var(--background-color);
	--footer-color: var(--text-color);
	--disabled-color: #9c9c9c;
	--print-color: #f7cb45;
	--richtable-alternating-background-color: #1c150c;
	--richtable-border-color: var(--border-color);
	--richtable-paging-buttons-border-color: var(--border-color);
	--richtable-paging-buttons-background-color: var(--background-color);
	--richtable-auto-filter-color: var(--main-color);
	--richtable-header-background-color: #361b00;
	--richtable-header-background-color-hover: #4e4e4e;
	--richtable-header-border-color: var(--border-color);
	--richtable-header-border-color-autofilter: #40311c;
	--richtable-header-border-color-background: var(--background-color);
	--richtable-header-text-color: var(--text-color);
	--richtable-checkbox-color: rgba(220, 220, 220, 0.3);
	--richtable-header-sort-color: #d2d2d2;
	--richtable-header-shadow: var(--black-20percent);
	--richtable-header-search-icon-color: #c1c1c1;
	--richtable-incomplete-amount-color: black;
	--richtable-row-color-hover: #362918;
	--file-display-panel-background-color: var(--background-color);
	--file-display-background-color: var(--richtable-alternating-background-color);
	--file-display-color-border: var(--secondary-color);
	--switchbutton-color: var(--secondary-color);
	--switchbutton-active-color: var(--main-color);
	--switchbutton-switcher-color: var(--background-color);
	--success-color-light: green;
	--accept-color: var(--main-color);
	--accept-color-hover: #f68c23;
	--e-sign-color: var(--border-color);
	--e-sign-background-color: var(--background-color);
	--saturn-icon-color: var(--main-color);
	--button-color: var(--text-color);
	--button-shadow: rgba(38, 45, 52, 0.5);
	--button-clear-background-color: var(--background-color);
	--button-clear-color: var(--main-color);
	--button-clear-color-disabled: #5c5c5c;
	--button-dropdown-list-background-color: var(--secondary-color);
	--button-color-border-disabled: var(--secondary-color);
	--link-color-hover: #b37232;
	--sidemenu-color-border: var(--border-color);
	--sidemenu-color-border-bottom: var(--border-color);
	--sidemenu-background-color: #1c150c;
	--nav-background-color: var(--background-color);
	--nav-color-border: var(--border-color);
	--nav-link-color-hover: var(--background-color);
	--input-background-color: #f7c59f;
	--input-border-color: none;
	--input-component-label-color: var(--main-color);
	--input-component-background-color: var(--main-color);
	--input-component-saturn-icon-background-color: var(--secondary-color);
	--input-background-color-disabled: rgba(118, 118, 118, 0.3);
	--input-multiselect-dropdown-background-color: var(--background-color);
	--input-multiselect-dropdown-color-border-top: var(--border-color);
	--select-background-color-disabled: var(--input-background-color-disabled);
	--select-color-disabled: var(--disabled-color);
	--dropdown-container-background-color: var(--secondary-color);
	--dropdown-container-color: var(--text-color);
	--dropdown-container-color-border: var(--border-color);
	--dropdown-container-color-border: var(--text-color);
	--collapseitem-coveragegrid-background-color: var(--secondary-color);
	--sidemenu-wizard-button-background-color: var(--secondary-color);
	--sidemenu-wizard-button-color-border-right: rgba(220, 220, 220, 0.6);
	--panel-background-color: var(--background-color);
	--panel-color-text: var(--text-color);
	--panelcustomerlive-livescreencontainer-background-color: var(--secondary-color);
	--panelbuyersorder-grid-color-border: var(--border-color);
	--panelbuyersorder-grid-background-color: var(--file-display-background-color);
	--fimenu-signalr-notes-background-color: var(--background-color);
	--fimenubasic-column-background-color: purple;
	--fimenubasic-title-color: var(--text-color);
	--modal-background-color: var(--background-color);
	--card-background-color: var(--secondary-color);
	--tabmenu-background-color-close-button: var(--background-color);
	--tabmenu-color-border: var(--border-color);
	--tabmenu-background-color-hover: var(--secondary-color);
	--tabmenu-color-hover: var(--text-color);
	--keyvalueeditor-input-background-color-disabled: var(--input-background-color-disabled);
	--keyvalueeditor-input-color-border-disabled: var(--input-border-color);

	--callout-info-text-color: #055160;
	--callout-success-text-color: #155826;
	--callout-warning-text-color: #664d03;
	--callout-error-text-color: #58151c;

	--callout-info-background-color: #cff4fc;
	--callout-success-background-color: #e9f8d7;
	--callout-warning-background-color: #fff3cd;
	--callout-error-background-color: #f8d7da;

	--callout-info-border-color: #9eeaf9;
	--callout-success-border-color: #aef1b9;
	--callout-warning-border-color: #ffe69c;
	--callout-error-border-color: #f1aeb5;
}

body.saturn-theme textarea {
	background-color: var(--background-color);
}

body.saturn-theme #employeeSignature,
body.saturn-theme #employeeInitials {
	filter: invert(82%) sepia(19%) saturate(5551%) hue-rotate(328deg) brightness(102%) contrast(94%);
}

body.saturn-theme .IsBusyScreenComponent-container img,
body.saturn-theme .loading-saturn-anim img {
	filter: invert(89%) sepia(22%) saturate(5980%) hue-rotate(325deg) brightness(97%) contrast(99%);
}
body.solarized-light {
	/* Solarized Palette */
	--solarized-base03: #002b36;
	--solarized-base02: #073642;
	--solarized-base01: #586e75;
	--solarized-base00: #657b83;
	--solarized-base0: #839496;
	--solarized-base1: #93a1a1;
	--solarized-base2: #eee8d5;
	--solarized-base3: #fdf6e3;
	--solarized-yellow: #b58900;
	--solarized-orange: #cb4b16;
	--solarized-red: #dc322f;
	--solarized-magenta: #d33682;
	--solarized-violet: #6c71c4;
	--solarized-blue: #268bd2;
	--solarized-cyan: #2aa198;
	--solarized-green: #859900;

	--nav-button-icon-color: var(--main-color);
	color-scheme: light;
	--main-color: #586e75;
	--main-color-tinted: #8aa7b1;
	--secondary-color: #eee8d5;
	--success-color: #859900;
	--error-color: #dc322f;
	--print-color: #b58900;
	--text-color: #657b83;
	--background-color: #fdf6e3;
	--border-color: #eee8d5;
	--third-color: var(--main-color);
	--header-background-color: #eee8d5;
	--footer-background: var(--background-color);
	--footer-color: var(--text-color);
	--disabled-color: #6d6d6d;
	--richtable-alternating-background-color: #eee8d5;
	--richtable-border-color: var(--border-color);
	--richtable-paging-buttons-border-color: var(--border-color);
	--richtable-paging-buttons-background-color: var(--background-color);
	--richtable-auto-filter-color: var(--main-color);
	--richtable-header-background-color: #e4ddc7;
	--richtable-header-background-color-hover: #97a97c;
	--richtable-header-border-color: var(--border-color);
	--richtable-header-border-color-autofilter: var(--border-color);
	--richtable-header-border-color-background: var(--background-color);
	--richtable-header-text-color: var(--text-color);
	--richtable-checkbox-color: rgba(220, 220, 220, 0.3);
	--richtable-header-sort-color: #d2d2d2;
	--richtable-header-shadow: var(--black-20percent);
	--richtable-header-search-icon-color: #c1c1c1;
	--richtable-incomplete-amount-color: black;
	--richtable-row-color-hover: #b9b5a5;
	--file-display-panel-background-color: var(--background-color);
	--file-display-background-color: var(--richtable-alternating-background-color);
	--file-display-color-border: var(--secondary-color);
	--switchbutton-color: var(--secondary-color);
	--switchbutton-active-color: var(--main-color);
	--switchbutton-switcher-color: var(--background-color);
	--success-color-light: #ade9a0;
	--e-sign-color: var(--border-color);
	--e-sign-background-color: var(--background-color);
	--saturn-icon-color: var(--main-color);
	--button-color: var(--background-color);
	--button-shadow: rgba(38, 45, 52, 0.5);
	--button-clear-background-color: var(--background-color);
	--button-clear-color: var(--main-color);
	--button-clear-color-disabled: #b7b7b7;
	--button-dropdown-list-background-color: var(--secondary-color);
	--button-color-border-disabled: var(--secondary-color);
	--link-color-hover: #384724;
	--sidemenu-color-border: var(--border-color);
	--sidemenu-color-border-bottom: var(--border-color);
	--sidemenu-background-color: #eee8d5;
	--nav-background-color: var(--background-color);
	--nav-color-border: var(--border-color);
	--nav-link-color-hover: var(--background-color);
	--input-background-color: #f7c59f;
	--input-border-color: none;
	--input-component-label-color: var(--main-color);
	--input-component-background-color: var(--main-color);
	--input-component-saturn-icon-background-color: var(--secondary-color);
	--input-background-color-disabled: rgba(118, 118, 118, 0.3);
	--input-multiselect-dropdown-background-color: var(--background-color);
	--input-multiselect-dropdown-color-border-top: var(--border-color);
	--select-background-color-disabled: var(--input-background-color-disabled);
	--select-color-disabled: var(--disabled-color);
	--dropdown-container-background-color: var(--secondary-color);
	--dropdown-container-color: var(--text-color);
	--dropdown-container-color-border: var(--border-color);
	--dropdown-container-color-border: var(--text-color);
	--collapseitem-coveragegrid-background-color: var(--secondary-color);
	--sidemenu-wizard-button-background-color: var(--secondary-color);
	--sidemenu-wizard-button-color-border-right: rgba(220, 220, 220, 0.6);
	--panel-background-color: var(--background-color);
	--panel-color-text: var(--text-color);
	--panelcustomerlive-livescreencontainer-background-color: var(--secondary-color);
	--panelbuyersorder-grid-color-border: var(--border-color);
	--panelbuyersorder-grid-background-color: var(--file-display-background-color);
	--fimenu-signalr-notes-background-color: var(--background-color);
	--fimenubasic-column-background-color: #aed1ff;
	--fimenubasic-title-color: var(--text-color);
	--modal-background-color: var(--background-color);
	--card-background-color: var(--secondary-color);
	--tabmenu-background-color-close-button: var(--background-color);
	--tabmenu-color-border: var(--border-color);
	--tabmenu-background-color-hover: var(--secondary-color);
	--tabmenu-color-hover: var(--text-color);
	--keyvalueeditor-input-background-color-disabled: var(--input-background-color-disabled);
	--keyvalueeditor-input-color-border-disabled: var(--input-border-color);
	--pill-info-color: var(--main-color);
	--pill-success-color: var(--success-color);
	--pill-warning-color: var(--print-color);
	--pill-error-color: var(--error-color);
	--callout-info-text-color: var(--solarized-cyan);
	--callout-success-text-color: var(--solarized-green);
	--callout-warning-text-color: var(--solarized-yellow);
	--callout-error-text-color: var(--solarized-red);
	--callout-info-background-color: var(--solarized-base2);
	--callout-success-background-color: var(--solarized-base2);
	--callout-warning-background-color: var(--solarized-base2);
	--callout-error-background-color: var(--solarized-base2);
	--callout-info-border-color: var(--solarized-blue);
	--callout-success-border-color: var(--solarized-green);
	--callout-warning-border-color: var(--solarized-yellow);
	--callout-error-border-color: var(--solarized-red);
}

body.solarized-light textarea {
	background-color: var(--background-color);
}

body.lucky-theme {
	--nav-button-icon-color: var(--main-color);
	color-scheme: light;
	--main-color: #606f49;
	--main-color-tinted: #8ca16b;
	--secondary-color: #b5c99a;
	/* --text-color: rgba(220, 220, 220, 0.87); */
	--text-color: var(--main-color);
	--background-color: #e9f5db;
	--border-color: #d4dec9;
	--third-color: var(--main-color);
	--footer-background: var(--background-color);
	--header-background-color: #d5ecbb;
	--footer-color: var(--text-color);
	--disabled-color: #6d6d6d;
	--richtable-alternating-background-color: #dcebca;
	--richtable-border-color: var(--border-color);
	--richtable-paging-buttons-border-color: var(--border-color);
	--richtable-paging-buttons-background-color: var(--background-color);
	--richtable-auto-filter-color: var(--main-color);
	--richtable-header-background-color: #a6b98b;
	--richtable-header-background-color-hover: #97a97c;
	--richtable-header-border-color: var(--border-color);
	--richtable-header-border-color-autofilter: var(--border-color);
	--richtable-header-border-color-background: var(--background-color);
	--richtable-header-text-color: var(--text-color);
	--richtable-checkbox-color: rgba(220, 220, 220, 0.3);
	--richtable-header-sort-color: #d2d2d2;
	--richtable-header-shadow: var(--black-20percent);
	--richtable-header-search-icon-color: #c1c1c1;
	--richtable-incomplete-amount-color: black;
	--richtable-row-color-hover: #a6b98b;
	--file-display-panel-background-color: var(--background-color);
	--file-display-background-color: var(--richtable-alternating-background-color);
	--file-display-color-border: var(--secondary-color);
	--switchbutton-color: var(--secondary-color);
	--switchbutton-active-color: var(--main-color);
	--switchbutton-switcher-color: var(--background-color);
	--success-color-light: #ade9a0;
	--accept-color: var(--main-color);
	--accept-color-hover: #485336;
	--e-sign-color: var(--border-color);
	--e-sign-background-color: var(--background-color);
	--saturn-icon-color: var(--main-color);
	--button-color: var(--background-color);
	--button-shadow: rgba(38, 45, 52, 0.5);
	--button-clear-background-color: var(--background-color);
	--button-clear-color: var(--main-color);
	--button-clear-color-disabled: #afafaf;
	--button-dropdown-list-background-color: var(--secondary-color);
	--button-color-border-disabled: var(--secondary-color);
	--link-color-hover: #384724;
	--sidemenu-color-border: var(--border-color);
	--sidemenu-color-border-bottom: var(--border-color);
	--sidemenu-background-color: #d5ecbb;
	--nav-background-color: var(--background-color);
	--nav-color-border: var(--border-color);
	--nav-link-color-hover: var(--background-color);
	--input-background-color: #f7c59f;
	--input-border-color: none;
	--input-component-label-color: var(--main-color);
	--input-component-background-color: var(--main-color);
	--input-component-saturn-icon-background-color: var(--secondary-color);
	--input-background-color-disabled: rgba(118, 118, 118, 0.3);
	--input-multiselect-dropdown-background-color: var(--background-color);
	--input-multiselect-dropdown-color-border-top: var(--border-color);
	--select-background-color-disabled: var(--input-background-color-disabled);
	--select-color-disabled: var(--disabled-color);
	--dropdown-container-background-color: var(--secondary-color);
	--dropdown-container-color: var(--text-color);
	--dropdown-container-color-border: var(--border-color);
	--dropdown-container-color-border: var(--text-color);
	--collapseitem-coveragegrid-background-color: var(--secondary-color);
	--sidemenu-wizard-button-background-color: var(--secondary-color);
	--sidemenu-wizard-button-color-border-right: rgba(220, 220, 220, 0.6);
	--panel-background-color: var(--background-color);
	--panel-color-text: var(--text-color);
	--panelcustomerlive-livescreencontainer-background-color: var(--secondary-color);
	--panelbuyersorder-grid-color-border: var(--border-color);
	--panelbuyersorder-grid-background-color: var(--file-display-background-color);
	--fimenu-signalr-notes-background-color: var(--background-color);
	--fimenubasic-column-background-color: #aed1ff;
	--fimenubasic-title-color: var(--text-color);
	--modal-background-color: var(--background-color);
	--card-background-color: var(--secondary-color);
	--tabmenu-background-color-close-button: var(--background-color);
	--tabmenu-color-border: var(--border-color);
	--tabmenu-background-color-hover: var(--secondary-color);
	--tabmenu-color-hover: var(--text-color);
	--keyvalueeditor-input-background-color-disabled: var(--input-background-color-disabled);
	--keyvalueeditor-input-color-border-disabled: var(--input-border-color);
	--pill-success-color: var(--success-color);
	--pill-info-color: var(--main-color);

	--callout-info-text-color: var(--main-color);
	--callout-success-text-color: var(--main-color);
	--callout-warning-text-color: var(--main-color);
	--callout-error-text-color: var(--main-color);

	--callout-info-background-color: var(--background-color);
	--callout-success-background-color: var(--background-color);
	--callout-warning-background-color: var(--background-color);
	--callout-error-background-color: var(--background-color);

	--callout-info-border-color: var(--text-color);
	--callout-success-border-color: var(--text-color);
	--callout-warning-border-color: var(--text-color);
	--callout-error-border-color: var(--text-color);
}

body.lucky-theme textarea {
	background-color: var(--background-color);
}

body.lucky-theme #employeeSignature,
body.lucky-theme #employeeInitials {
	filter: invert(42%) sepia(4%) saturate(2997%) hue-rotate(42deg) brightness(95%) contrast(90%);
}

body.dark-palette {
	/* Inversing shadows to stand out better in dark mode */
	--black-10percent: rgba(255, 255, 255, 0.1);
	--black-15percent: rgba(255, 255, 255, 0.15);
	--black-20percent: rgba(255, 255, 255, 0.2);
	--black-30percent: rgba(255, 255, 255, 0.3);
	--black-50percent: rgba(255, 255, 255, 0.5);
	--black-60percent: rgba(255, 255, 255, 0.6);
	--black-70percent: rgba(255, 255, 255, 0.7);
	--white-50percent: rgba(0, 0, 0, 0.5);
	--white-80percent: rgba(0, 0, 0, 0.8);
}

body.dark-palette button:not([class]),
body.dark-palette button[class='ignore-all-locks'],
body.dark-palette button[class='button'],
body.dark-palette button[class='button button-edit'],
body.dark-palette button[class='button-edit'],
body.dark-palette button[class='button-block'],
body.dark-palette button.button-accept,
body.dark-palette button.button-primary,
body.dark-palette button.button-load,
body.dark-palette button.button-inactive,
body.dark-palette button[class=''] {
	/* when buttons are *probably* using default styling (might not capture all cases) */
	color: var(--text-color);
}

body.dark-palette #editor .cm-gutters {
	background-color: var(--secondary-color);
}

body.dark-palette #editor .cm-tooltip-autocomplete {
	background-color: var(--background-color);
}

body.dark-palette #editor .cm-activeLine,
body.dark-palette #editor .cm-activeLineGutter {
	background-color: var(--black-10percent);
}

body.dark-palette .sidemenu-contents .deal-locked {
	color: var(--background-color);
}

body.dark-palette .fa-inverse {
	color: var(--background-color);
}

body.dark-palette .multi-select-dropdown-item:hover {
	background-color: var(--richtable-header-background-color-hover);
}

body.dark-palette select,
body.dark-palette input {
	border: 1px solid var(--border-color);
}

body.dark-palette select option {
	background-color: var(--background-color);
}

body.dark-palette .input-component:not(.dropdown),
body.dark-palette .input-component:not(.dropdown) .saturn-textbox {
	color: var(--text-color);
}

body.dark-palette .input-component .cdk {
	border-color: rgba(255, 255, 255, 0.23);
}

body.dark-palette .input-component .saturn-textbox .floatingLabel {
	border-color: var(--border-color);
}

body.dark-palette .input-component label.label-root,
body.dark-palette fieldset:disabled .input-component label.label-root {
	color: var(--disabled-color);
}

body.dark-palette .input-component-wrapper:disabled .input-component .saturn-textbox input,
body.dark-palette fieldset:disabled .input-component,
body.dark-palette input:disabled {
	color: var(--disabled-color);
}

body.dark-palette .vdpComponent .vdpInnerWrap {
	background: var(--background-color);
	border-color: var(--border-color);
}

body.dark-palette .vdpComponent .vdpHeader {
	background: var(--secondary-color);
}

body.dark-palette .panel-buyers-order,
body.dark-palette .panel-buyers-order .buyers-order-row {
	color: var(--panelbuyersorder-grid-text-color);
}

/* Syntax highlighting for code editor (vue-prism-editor): */
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
	color: #90a4ae;
}

.token.punctuation {
	color: #9e9e9e;
}

.namespace {
	opacity: 0.7;
}

.token.property,
.token.tag,
.token.boolean,
.token.number,
.token.constant,
.token.symbol,
.token.deleted {
	color: #e91e63;
}

.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
	color: #4caf50;
}

.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
	color: #bb8672;
}

.token.atrule,
.token.attr-value,
.token.keyword {
	color: #8295ff;
}

.token.function {
	color: #f44336;
}

.token.regex,
.token.important,
.token.variable {
	color: #ff9800;
}

.token.important,
.token.bold {
	font-weight: bold;
}

.token.italic {
	font-style: italic;
}

.token.entity {
	cursor: help;
}

body.flex-container {
	display: flex;
	flex-direction: column;
}

body .no-margin-grid {
	margin: 0px !important;
}

body .no-padding-grid {
	padding: 0px !important;
}

button {
	min-height: 35px;
	height: fit-content;
	width: 100%;
	padding: 5px 20px;
	cursor: pointer;
	font-family: sans-serif;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	background-color: var(--main-color);
	border: 1px solid var(--main-color);
	border-radius: var(--default-border-radius);
	transition: var(--transition);
	color: var(--button-color);
}

button.fit-width {
	width: fit-content !important;
	min-width: unset !important;
	padding: 0 10px;
}

button.fit-height {
	height: fit-content !important;
	min-height: unset !important;
	padding-top: 3px;
	padding-bottom: 3px;
}

button.no-wrap {
	text-wrap: nowrap !important;
}

button.inverse {
	background-color: var(--background-color);
	border: 1px solid var(--third-color);
	color: var(--third-color);
}

button.inverse:hover {
	background-color: var(--main-color-tinted);
	border: 1px solid var(--third-color);
	color: var(--third-color);
}

button:not(.no-shadow) {
	box-shadow: 2px 3px 4px 1px rgba(0, 0, 0, 0.25);
}

button:not(.no-shadow):hover {
	box-shadow: 2px 3px 4px 1px rgba(0, 0, 0, 0.35);
}

button:not(.no-shadow):active {
	box-shadow: inset 0 0 0 100vw var(--button-shadow-hover);
}

button:disabled {
	box-shadow: inset 0 0 0 100vw var(--button-shadow) !important;
	border: 1px solid var(--button-color-border-disabled) !important;
	cursor: no-drop !important;
}

button.inverse:disabled {
	background-color: var(--disabled-color);
}

button.button-icon-text > i {
	margin-right: 7px;
}

button.button-text-icon > i {
	margin-left: 7px;
}

button.button-block {
	width: 100%;
}

button.button-accept,
button.button-primary {
	background-color: var(--main-color);
	border-color: var(--main-color);
}

button.button-success,
button.button-save {
	background-color: var(--success-color);
	border-color: var(--success-color);
}

button.button-load,
button.button-action,
button.button-inactive {
	background-color: var(--third-color);
	border-color: var(--third-color);
}

button.button-error,
button.button-unwind,
button.button-delete {
	background-color: var(--error-color);
	border-color: var(--error-color);
}

button.button-close {
	height: fit-content;
	width: fit-content;
	min-height: unset !important;
	min-width: unset !important;
	padding: 0.6em;
	border-radius: 50%;
	position: absolute;
	top: -11px;
	right: -11px;
	background: transparent !important;
	color: var(--third-color) !important;
	border: 3px solid;
	border-color: var(--third-color);
	transition: var(--transition);
}

button.button-close:hover {
	border-color: var(--error-color);
	color: var(--error-color) !important;
}

button.button-close i {
	font-size: 1em;
	font-weight: 800;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

button.button-info {
	background-color: var(--print-color);
	border-color: var(--print-color);
}

button.button-nothing {
	background-color: transparent;
}

button.button-nothing:hover {
	cursor: default;
	background-color: transparent;
	box-shadow: none;
}

button.button-nothing.button-nothing-green {
	color: green;
}

button.button-nothing.button-nothing-orange {
	color: orange;
}

button.button-nothing.button-nothing-red {
	color: red;
}

button.button-nothing.button-nothing-blue {
	color: blue;
	border: blue solid 1px;
}

button.button-link {
	width: fit-content;
	height: fit-content;
	padding: inherit;
	border: none;
	background-color: transparent;
	text-align: inherit;
	font-size: inherit;
	color: var(--main-color);
	text-decoration: underline;
	box-shadow: none;
}

button.button-link:hover {
	color: var(--main-color-tinted);
	box-shadow: none;
}

button.button-link:disabled {
	filter: grayscale(1);
	text-decoration: none;
	border: none !important;
}

button.button-span {
	width: fit-content;
	height: inherit;
	padding: inherit;
	border: none;
	background-color: transparent;
	box-shadow: none;
	color: inherit;
	font-size: inherit;
}

button.button-span:hover {
	box-shadow: none;
}

button.button-span:disabled {
	background-color: inherit;
	box-shadow: none !important;
	border: none !important;
}

.icon-color-green {
	color: green;
}

.icon-color-orange {
	color: orange;
}

.icon-color-red {
	color: red;
}

.icon-color-blue {
	color: blue;
}

.app-container:not(.development) button.dev {
	display: none;
}

.selectbuttons {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	justify-content: space-between;
	margin: 25px 25px 25px 25px;
	gap: 10px;
}

.clickable {
	cursor: pointer !important;
}

input,
select {
	border: 1px solid rgba(0, 0, 0, 0.23);
	border-radius: 4px;
	color: currentColor;
	font: inherit;
	box-sizing: border-box;
	letter-spacing: inherit;
	background: none;
	height: 100%;
	margin: 0;
	display: block;
	min-width: 0;
	width: 100%;
	-webkit-tap-highlight-color: transparent;
	transition: all 0.1s ease-out;
}

input {
	padding: 10px;
}

input::placeholder,
textarea::placeholder {
	color: var(--input-placeholder-color);
}

input:disabled,
textarea:disabled {
	background-color: var(--input-background-color-disabled);
	color: var(--disabled-color);
}

:focus-visible {
	outline: none;
}

select {
	padding: 10px;
	-webkit-tap-highlight-color: transparent;
	-webkit-appearance: none;
	-moz-appearance: none;
	cursor: pointer;
}

select:disabled {
	background-color: var(--select-background-color-disabled);
	color: var(--select-color-disabled);
	opacity: 1;
}

input:focus,
select:focus {
	border-color: var(--main-color);
}

a {
	color: var(--main-color);
}

a:hover {
	color: var(--main-color);
}

a.button-load {
	color: var(--load-color);
}

a.button-accept {
	color: var(--accept-color);
}

a.button-accept:hover {
	color: var(--accept-color-hover);
}

a.button-save {
	color: var(--success-color);
}

a.button-save:hover {
	color: var(--save-color-hover);
}

a.button-unwind {
	color: var(--error-color);
}

a.button-unwind:hover {
	color: var(--unwind-color-hover);
}

table.rich-table {
	width: 100%;
	border: 1px solid var(--richtable-border-color);
	border-spacing: 0;
	border-top: none;
}

table.rich-table tbody {
	text-transform: uppercase;
}

table.rich-table td,
table.rich-table th {
	padding-top: 8px;
	padding-bottom: 8px;
	padding-left: 10px;
	padding-right: 10px;
	border-top: 1px solid var(--input-border-color);
	border-bottom: 1px solid var(--input-border-color);
}

table.borderless-table {
	width: 100%;
	margin: 10px 0;
	border-spacing: 10px;
	border-collapse: collapse;
}

table.borderless-table tbody tr:nth-child(2n - 1) {
	background-color: var(--richtable-alternating-background-color);
}

table.borderless-table tbody tr:hover {
	background-color: var(--richtable-row-color-hover);
}

table.borderless-table tr td,
table.borderless-table tr th {
	padding: 10px;
}

table.borderless-table th {
	text-align: left;
}

body .panel {
	width: 100%;
}

.panel-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.panel-title {
	font-weight: bold;
	display: flex;
	align-items: center;
}

.full-width {
	width: 100%;
}

/* GRID SYSTEM */

.grid-1-column {
	grid-column: span 1;
}

.grid-2-column {
	grid-column: span 2;
}

.grid-3-column {
	grid-column: span 3;
}

.grid-4-column {
	grid-column: span 4;
}

.grid-5-column {
	grid-column: span 5;
}

.grid-6-column {
	grid-column: span 6;
}

.grid-7-column {
	grid-column: span 7;
}

.grid-8-column {
	grid-column: span 8;
}

.grid-9-column {
	grid-column: span 9;
}

.grid-10-column {
	grid-column: span 10;
}

.grid-11-column {
	grid-column: span 11;
}

.grid-12-column {
	grid-column: span 12;
}

.panel-checkbox {
	display: flex;
	align-items: center;
}

th.wide-column-500,
td.wide-column-500 {
	width: 500px;
}

th.wide-column-300,
td.wide-column-300 {
	width: 300px;
}

th.wide-column-400,
td.wide-column-400 {
	width: 400px;
}

th.wide-column-500,
td.wide-column-500 {
	width: 500px;
}

th.wide-column-100,
td.wide-column-100 {
	width: 100px;
}

th.wide-column-75,
td.wide-column-75 {
	width: 75px;
}

[class^='button-'] {
	border: 0;
	border-radius: 5px;
}

.selection-header {
	width: 650px !important;
	/*top: 50px;*/
	left: calc(100% + 15px);
}

.selection-header .button-container {
	display: flex;
	align-items: center;
}

.flex-side-by-side {
	display: flex;
	align-items: center;
}

.grid-title > * {
	margin-right: 30px;
}

.grid-title {
	display: flex;
	align-items: flex-start;
}

.grid-title-row {
	display: flex;
	flex-direction: column;
}

span.grid-title-label {
	color: var(--span-grid-title-label-color);
}

span.grid-title-value {
	font-weight: bold;
}

span.custominfo {
	display: flex;
	align-items: center;
	white-space: nowrap;
	font-weight: normal;
	font-size: smaller;
}

.collapse-item span[class^='displayprice'] {
	text-decoration: underline;
	cursor: pointer;
}

.collapse-item span.disabled[class^='displayprice'] {
	text-decoration: none;
	cursor: not-allowed;
}

.collapse-item .coverage-grid {
	background-color: var(--collapseitem-coveragegrid-background-color);
}

.grid-title-main {
	font-size: 30px;
	font-weight: bold;
}

.grid-title-main span {
	margin-right: 10px;
	font-size: 25px;
}

tr.rich-table-footer th.column-number,
.column-number {
	text-align: right;
}

.textarea-4 {
	height: 100px !important;
}

.textarea-5 {
	height: 200px !important;
}

.margin-left-5 {
	margin-left: 5px;
}

.fit-content {
	height: fit-content;
}

.accordion-transition-enter-active,
.accordion-transition-leave-active {
	opacity: 1;
	max-height: 200px;
	transition: all 0.2s linear;
}

.accordion-transition-enter,
.accordion-transition-leave-to {
	max-height: 0;
	opacity: 0;
	overflow: hidden;
}

.fade-in {
	animation: fadeIn ease 1s;
	-webkit-animation: fadeIn ease 1s;
	-moz-animation: fadeIn ease 1s;
	-o-animation: fadeIn ease 1s;
	-ms-animation: fadeIn ease 1s;
}

.fade-in-fast {
	animation: fadeIn ease 0.5s;
	-webkit-animation: fadeIn ease 0.5s;
	-moz-animation: fadeIn ease 0.5s;
	-o-animation: fadeIn ease 0.5s;
	-ms-animation: fadeIn ease 0.5s;
}

@keyframes fadeIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@-moz-keyframes fadeIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@-webkit-keyframes fadeIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@-o-keyframes fadeIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@-ms-keyframes fadeIn {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes fadeInRight {
	0% {
		opacity: 0;
		transform: translate3d(100%, 0, 0);
	}

	to {
		opacity: 1;
		transform: translateZ(0);
	}
}

@keyframes lightSpeedInLeft {
	0% {
		-webkit-transform: translate3d(-100%, 0, 0) skewX(30deg);
		transform: translate3d(-100%, 0, 0) skewX(30deg);
		opacity: 0;
	}

	60% {
		-webkit-transform: skewX(-20deg);
		transform: skewX(-20deg);
		opacity: 1;
	}

	80% {
		-webkit-transform: skewX(5deg);
		transform: skewX(5deg);
	}

	100% {
		-webkit-transform: translateZ(0);
		transform: translateZ(0);
	}
}

@keyframes expandable {
	from {
		transform: scaleY(0);
	}

	to {
		transform: scaleY(1);
	}
}

@keyframes blinking {
	0% {
		opacity: 1;
	}

	50% {
		opacity: 0.25;
	}

	100% {
		opacity: 1;
	}
}

.fade-out {
	animation: fadeout ease 1s;
	-webkit-animation: fadeout ease 1s;
	-moz-animation: fadeout ease 1s;
	-o-animation: fadeout ease 1s;
	-ms-animation: fadeout ease 1s;
}

.fade-out-fast {
	animation: fadeout ease 0.5s;
	-webkit-animation: fadeout ease 0.5s;
	-moz-animation: fadeout ease 0.5s;
	-o-animation: fadeout ease 0.5s;
	-ms-animation: fadeout ease 0.5s;
}

@keyframes fadeout {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

@-moz-keyframes fadeout {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

@-webkit-keyframes fadeout {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

@-o-keyframes fadeout {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

@-ms-keyframes fadeout {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
	}
}

.hint-click {
	animation: hintClick 1s ease infinite;
}

@keyframes hintClick {
	0% {
		box-shadow: unset;
	}

	50% {
		box-shadow: inset 0 0 0 100vw var(--button-shadow-hover);
	}

	100% {
		box-shadow: unset;
	}
}

.lds-ellipsis {
	display: inline-block;
	position: relative;
	width: 75px;
	height: 11px;
}

.lds-ellipsis div {
	position: absolute;
	top: 0;
	width: 9.5px;
	height: 9.5px;
	border-radius: 50%;
	background: var(--background-color);
	animation-timing-function: cubic-bezier(0, 1, 1, 0);
}

.lds-ellipsis div:nth-child(1) {
	left: 8px;
	animation: lds-ellipsis1 0.6s infinite;
}

.lds-ellipsis div:nth-child(2) {
	left: 8px;
	animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(3) {
	left: 32px;
	animation: lds-ellipsis2 0.6s infinite;
}

.lds-ellipsis div:nth-child(4) {
	left: 56px;
	animation: lds-ellipsis3 0.6s infinite;
}

@keyframes lds-ellipsis1 {
	0% {
		transform: scale(0);
	}

	100% {
		transform: scale(1);
	}
}

@keyframes lds-ellipsis3 {
	0% {
		transform: scale(1);
	}

	100% {
		transform: scale(0);
	}
}

@keyframes lds-ellipsis2 {
	0% {
		transform: translate(0, 0);
	}

	100% {
		transform: translate(24px, 0);
	}
}

@keyframes hintingError {
	0%,
	25%,
	75%,
	100% {
		color: #c11b1b;
	}

	50% {
		color: black;
	}
}

span.icon-pad-right {
	margin-right: 10px;
}

span.icon-pad-left {
	margin-left: 10px;
}

span.span-icon-text > i {
	margin-right: 7px;
}

button.pulsing {
	animation: pulsing 1s infinite;
}

.margin-bottom-5 {
	margin-bottom: 5px;
}

.unselectable {
	-webkit-user-select: none; /* Safari */
	-moz-user-select: none; /* Firefox */
	-ms-user-select: none; /* IE10+/Edge */
	user-select: none; /* Standard */
}

.change-pass {
	padding-top: 1em;
	display: flex;
	align-items: center;
}

@keyframes pulsing {
	0% {
		background-color: var(--pulsing-color);
	}

	100% {
	}
}

*::-webkit-scrollbar {
	width: 10px;
	height: 10px;
}

*::-webkit-scrollbar-track {
	box-shadow: inset 0 0 6px var(--black-50percent);
	background-color: var(--webkit-scrollbar-track);
}

*::-webkit-scrollbar-thumb {
	box-sizing: border-box;
	background-color: var(--main-color);
}

/* Placeholder */
.placeholder {
	background-color: var(--placeholder-color-ends);
	position: relative;
	overflow: hidden;
}

.placeholder::before {
	content: '';
	background-image: linear-gradient(to right, var(--placeholder-color-ends) 0%, var(--placeholder-color-middle) 50%, var(--placeholder-color-ends) 100%);
	position: absolute;
	transform: rotate(45deg);
	top: -150px;
	bottom: -150px;
	width: 300px;
	left: 10px;
	-webkit-animation-duration: 1.2s;
	-webkit-animation-fill-mode: forwards;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-name: placeHolderShimmer;
	-webkit-animation-timing-function: linear;
}

/* Loading Animation */
.loading-saturn-anim {
	display: flex;
	flex-grow: 1;
	justify-content: center;
	align-items: center;
	padding-top: 30px;
	padding-bottom: 30px;
	height: 300px;
}

.loading-saturn-anim img {
	opacity: 0.6;
	height: 139px;
}

@keyframes placeHolderShimmer {
	0% {
		left: -300px;
	}

	100% {
		left: calc(100% + 300px);
	}
}

.placeholder.placeholder-dealTearms {
	height: 200px;
}

.placeholder.placeholder-coverageTearms {
	height: 355px;
}

fieldset {
	margin: 0;
	padding: 0;
	border: none;
	height: 100%;
}

.hide {
	opacity: 0;
	transition: opacity 0.3s ease-in-out;
}

.hidden {
	display: none;
}

.app-container .vue-notification.success {
	background-color: var(--success-color);
	border-left-color: var(--success-color-border);
}

.divider {
	height: 2px;
	background-color: var(--main-color);
	margin: 30px 5px 40px;
}

.glow.active .skeleton .saturn {
	animation: 3.5s linear glowSuccess;
	animation-iteration-count: 1;
}

.glow.success .skeleton .saturn {
	animation: 3.5s linear glowSuccess;
	animation-iteration-count: 1;
}

.glow.error .skeleton .saturn {
	animation: 3.5s linear glowError;
	animation-iteration-count: 1;
}

.success-text {
	color: var(--success-color);
}
.warning-text {
	color: var(--pill-warning-color);
}
.error-text {
	color: var(--error-color);
}

@keyframes glowSuccess {
	0% {
		border-color: var(--success-color);
		box-shadow: 0px 0px 7px 1px var(--success-color);
		border-radius: 5px;
	}

	50% {
		border-color: var(--success-color);
		box-shadow: 0px 0px 7px 1px var(--success-color);
		border-radius: 5px;
	}

	100% {
		border-radius: 5px;
		border-color: inherit;
		box-shadow: none;
	}
}

@keyframes glowError {
	0% {
		border-color: var(--error-color);
		box-shadow: 0px 0px 7px 1px var(--error-color);
		border-radius: 5px;
	}

	50% {
		border-color: var(--error-color);
		box-shadow: 0px 0px 7px 1px var(--error-color);
		border-radius: 5px;
	}

	100% {
		border-radius: 5px;
		border-color: inherit;
		box-shadow: none;
	}
}

.flash .input-component {
	animation: 0.8s linear flash;
	animation-iteration-count: 1;
}

@keyframes flash {
	0% {
		border-color: var(--success-color);
		box-shadow: 0px 0px 2px 1px var(--success-color);
		border-radius: 5px;
	}

	50% {
		border-color: var(--success-color);
		box-shadow: 0px 0px 1px 1px var(--success-color);
		border-radius: 5px;
	}

	100% {
		border-radius: 5px;
		border-color: inherit;
		box-shadow: none;
	}
}

@keyframes fadeOutLeft {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
		transform: translate3d(-100%, 0, 0);
		display: none;
	}
}

@keyframes fadeOutRight {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
		transform: translate3d(100%, 0, 0);
		display: none;
	}
}

@keyframes fadeOutUp {
	0% {
		opacity: 1;
	}

	100% {
		opacity: 0;
		transform: translate3d(0, -100%, 0);
		display: none;
	}
}

@keyframes fadeInLeft {
	0% {
		opacity: 0;
		transform: translate3d(-25%, 0, 0);
	}

	25% {
		opacity: 0;
	}

	100% {
		opacity: 1;
		transform: translateZ(0);
	}
}

@keyframes fadeInRight {
	0% {
		opacity: 0;
		transform: translate3d(25%, 0, 0);
	}

	25% {
		opacity: 0;
	}

	100% {
		opacity: 1;
		transform: translateZ(0);
	}
}

@keyframes rotate {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}