:root {
	color-scheme : light;
	--color-primary : #3eaed9;
	--color-secondary : #e8e8e8;
	--color-info : #03626e;
	--color-success : #9dcc66;
	--color-warning : #fecf58;
	--color-danger : #b21a28;
	--color-primary-contrast : white;
	--color-secondary-contrast : black;
	--color-info-contrast : white;
	--color-success-contrast : white;
	--color-warning-contrast : black;
	--color-danger-contrast : white;
	--color-active-green : #A7C08AFF;
	--color-inactive-red : #B22222FF;
	--color-gray-base : #e0e2e4;
	--color-font : black;
	--color-font-light : #606060;
	--color-font-lightest : #9c9c9c;
	--color-hover : rgba(224, 226, 228, 0.5);
	--color-hover-dark : rgba(224, 226, 228, 0.75);
	--color-card : white;
	--menu-color : #171719;
	--menu-highlight-color : #2b2a2d;
	--menu-select-color : #2f2f33;
	--menu-font-color : white;
	--et-color-background : #f7f8fa;
	--color-background : rgb(249, 249, 250);
	--color-hover-on-white : var(--color-gray-300);
	--color-hover-on-gray : var(--color-gray-400);
	--color-pane : var(--color-gray-200);
	--color-active : var(--color-gray-500);
	--border-gray-small : 1px solid var(--color-gray-400);
	--border-small-light : 1px solid var(--color-gray-300);
	--border-small-dark : 1px solid var(--color-gray-500);
	--font : 100% 'Mona Sans', system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", "Noto Sans", "Liberation Sans", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	--space-icon : 1.4rem;
	--et-scrollbar-width : 0.4rem;
	--et-breakpoint-xs : 0;
	--et-breakpoint-sm : 576px;
	--et-breakpoint-md : 768px;
	--et-breakpoint-lg : 992px;
	--et-breakpoint-xl : 1200px;
	--et-breakpoint-xxl : 1400px;
	--space-0 : 0px;
	--space-50 : clamp(1px, 0.15vw, 3px);
	--space-100 : clamp(3px, 0.3vw, 5px);
	--space-200 : clamp(4px, 0.5vw, 8px);
	--space-300 : clamp(6px, 0.75vw, 10px);
	--space-400 : clamp(12px, 1.5vw, 16px);
	--space-500 : clamp(16px, 2vw, 24px);
	--space-600 : clamp(24px, 3vw, 32px);
	--space-700 : clamp(32px, 4vw, 48px);
	--space-800 : clamp(48px, 6vw, 64px);
	--space-900 : clamp(64px, 8vw, 96px);
	--space-none : var(--space-0);
	--space-xs : var(--space-50);
	--space-sm : var(--space-100);
	--space-md : var(--space-200);
	--space-lg : var(--space-300);
	--space-lgr : var(--space-400);
	--space-xl : var(--space-500);
	--space-xxl : var(--space-600);
	--space-xxxl : var(--space-700);
	--space-xxxxl : var(--space-800);
	--space-xxxxxl : var(--space-900);
	--font-size-50 : clamp(0.50rem, 0.6vw, 0.575rem);
	--font-size-100 : clamp(0.60rem, 0.8vw, 0.675rem);
	--font-size-200 : clamp(0.7rem, 1.05vw, 0.75rem);
	--font-size-300 : clamp(0.8rem, 1.25vw, 0.85rem);
	--font-size-400 : clamp(0.9rem, 1.5vw, 1rem);
	--font-size-500 : clamp(1rem, 1.6vw, 1.2rem);
	--font-size-600 : clamp(1.25rem, 2vw, 1.75rem);
	--font-size-700 : clamp(1.5rem, 2.5vw, 2rem);
	--font-size-800 : clamp(1.75rem, 3vw, 2.5rem);
	--font-size-900 : clamp(2rem, 3.5vw, 3rem);
	--line-height-sm : 1.2;
	--line-height-md : 1.4;
	--line-height-lg : 1.5;
	--color-primary-dark : color-mix(in srgb, var(--color-primary), black 25%);
	--color-secondary-dark : color-mix(in srgb, var(--color-secondary), black 15%);
	--color-info-dark : color-mix(in srgb, var(--color-info), black 25%);
	--color-success-dark : color-mix(in srgb, var(--color-success), black 25%);
	--color-warning-dark : color-mix(in srgb, var(--color-warning), black 45%);
	--color-danger-dark : color-mix(in srgb, var(--color-danger), black 15%);
	--color-primary-light : color-mix(in srgb, var(--color-primary), white 25%);
	--color-secondary-light : color-mix(in srgb, var(--color-secondary), white 25%);
	--color-info-light : color-mix(in srgb, var(--color-info), white 25%);
	--color-success-light : color-mix(in srgb, var(--color-success), white 25%);
	--color-warning-light : color-mix(in srgb, var(--color-warning), white 25%);
	--color-danger-light : color-mix(in srgb, var(--color-danger), white 25%);
	--color-primary-bleach : color-mix(in srgb, var(--color-primary-light), transparent 75%);
	--color-secondary-bleach : color-mix(in srgb, var(--color-secondary-light), transparent 75%);
	--color-info-bleach : color-mix(in srgb, var(--color-info-light), transparent 75%);
	--color-success-bleach : color-mix(in srgb, var(--color-success-light), transparent 75%);
	--color-warning-bleach : color-mix(in srgb, var(--color-warning-light), transparent 55%);
	--color-danger-bleach : color-mix(in srgb, var(--color-danger-light), transparent 75%);
	--color-gray-100 : color-mix(in srgb, var(--color-gray-base), white 75%);
	--color-gray-200 : color-mix(in srgb, var(--color-gray-base), white 65%);
	--color-gray-300 : color-mix(in srgb, var(--color-gray-base), white 50%);
	--color-gray-400 : color-mix(in srgb, var(--color-gray-base), white 25%);
	--color-gray-500 : var(--color-gray-base);
	--color-gray-600 : color-mix(in srgb, var(--color-gray-base), black 50%);
	--color-gray-700 : color-mix(in srgb, var(--color-gray-base), black 70%);
	--color-gray-800 : color-mix(in srgb, var(--color-gray-base), black 78%);
	--color-gray-900 : color-mix(in srgb, var(--color-gray-base), black 85%);
	--box-shadow : 0 4px 6px rgba(0, 0, 0, 0.2);
	--box-shadow-sm : 0 1px 2px rgba(0, 0, 0, 0.15);
	--box-shadow-lg : 0 10px 20px rgba(0, 0, 0, 0.25);
	--box-shadow-inset : inset -1px -1px 2px       rgba(0, 0, 0, 0.075);
	--radius-0 : 0px;
	--radius-100 : clamp(2px, 0.2vw, 4px);
	--radius-200 : clamp(4px, 0.3vw, 6px);
	--radius-300 : clamp(6px, 0.5vw, 8px);
	--radius-400 : clamp(8px, 0.75vw, 12px);
	--radius-500 : clamp(12px, 1vw, 16px);
	--radius-600 : clamp(16px, 1.5vw, 24px);
	--radius-700 : clamp(24px, 2vw, 32px);
	--radius-800 : clamp(32px, 3vw, 48px);
	--radius-900 : 9999px;
}

:root[data-et_theme = "light"] {
	--menu-color : white;
	--menu-highlight-color : #f0f1f1;
	--menu-select-color : #e8e8e8;
	--menu-font-color : black;
}

:root[data-et_theme = "dark"] {
	color-scheme : dark;
	--color-background : #18181a;
	--color-card : var(--menu-color);
	--color-font : #dfdfdf;
	--color-font-light : #989898;
	--color-hover : rgba(224, 226, 228, 0.1);
	--color-hover-dark : rgba(224, 226, 228, 0.25);
	--et-color-background : var(--menu-color);
	--border-small-dark : 1px solid var(--color-gray-700);
	--border-small-light : 1px solid #3a3a3c;
	--color-secondary : var(--color-gray-700);
	--color-secondary-contrast : var(--color-gray-200);
}

:root[data-et_theme = "dark"] * {
	color-scheme : dark;
}

:root, [data-et-theme=light] {
	--color-primary : #347b3d;
	--color-info : #03626e;
	--color-success : #6fa133;
	--color-danger : #b21a28;
	--color-warning : #ebc649;
}

body {
	color : var(--color-font);
	font-size : var(--font-size-300);
	font-weight : 400;
}

header {
	padding : var(--space-100);
}

main {
	overflow-y : auto;
	padding : var(--space-400) var(--space-300) var(--space-200);
	gap : var(--space-200);
}

svg {
	stroke : var(--color-font);
}

.SidePanel {
	background-color : var(--color-card);
}

p {
	font-size : var(--font-size-200);
	opacity : 0.65;
}

h1, h2, h3, h4, h5, h6 {
	display : flex;
	align-items : center;
	gap : var(--space-100);
}

h1 {
	font-size : var(--font-size-500);
	font-weight : 600;
}

main > h1 {
	padding-bottom : var(--space-400);
}

h2 {
	font-size : var(--font-size-400);
	font-weight : 500;
}

h3 {
	font-size : var(--font-size-300);
	font-weight : 500;
}

h4 {
	font-size : var(--font-size-200);
	font-weight : 500;
}

h5 {
	font-size : var(--font-size-100);
	font-weight : 500;
}

b {
	font-weight : 550;
}

.Card {
	background-color : var(--color-card);
	border-radius : var(--radius-200);
	border : var(--border-small-light);
	box-shadow : var(--box-shadow-sm);
	padding : var(--space-300);
}

.permStar {
	height : var(--font-size-300) !important;
	fill : mediumpurple;
	stroke : darkblue !important;
}

.userRole {
	color : var(--color-info-light);
	font-weight : 500;
	font-size : var(--font-size-200);
}

.bigIcon {
	stroke : black;
	height : 3rem;
	width : auto;
}

.sickYellow {
	background-color : var(--color-warning);
}

.unAuthorizedRed {
	background-color : var(--color-danger);
}

.errorText {
	color : var(--color-danger);
}

.grayBack {
	background-color : rgb(232, 232, 232);
	background-size : 4px 4px;
	background-image : repeating-linear-gradient(45deg, #cdcaca 0, #cdcaca 0.4px, #e8e8e8 0, #e8e8e8 50%);
}

.inActive {
	opacity : 0.5;
}

.nowrap {
	white-space : nowrap;
	flex-wrap : nowrap;
}

.ellipseText {
	white-space : nowrap;
	overflow : hidden;
	text-overflow : ellipsis;
}

.disabled {
	opacity : 0.5;
	pointer-events : none;
}

.right {
	margin-left : auto !important;
	margin-right : 0 !important;
}

.numCell {
	font-family : 'Consolas', 'Roboto Mono', 'Courier New', monospace;
}

.vertSep {
	border-right : var(--border-small-dark);
	margin-right : var(--space-200);
	margin-left : var(--space-200);
	width : 2px;
	height : 100%;
}

* {
	margin : 0;
	padding : 0;
	-webkit-box-sizing : border-box;
	-moz-box-sizing : border-box;
	box-sizing : border-box;
}

html {
	font-size : 100% !important;
}

header, main, section, article, aside, nav, footer {
	display : block;
}

html, body {
	height : 100%;
	width : 100%;
	overflow : hidden;
	font : var(--font);
	background-color : var(--color-background);
}

.unselectable, th, label, img, h1, h2, h3, h4, h5, button {
	-moz-user-select : none;
	-khtml-user-select : none;
	-webkit-user-select : none;
	-ms-user-select : none;
	user-select : none;
}

input::-webkit-inner-spin-button,
input::-webkit-outer-spin-button {
	-webkit-appearance : none;
	margin : 0;
}

::-webkit-scrollbar {
	width : var(--et-scrollbar-width);
	height : var(--et-scrollbar-width);
	right : var(--et-scrollbar-width);
}

::-webkit-scrollbar-track {
	background : transparent;
}

::-webkit-scrollbar-thumb {
	background : #949393;
	opacity : 0.1;
	border-radius : 1rem;
}

::-webkit-scrollbar-thumb:hover {
	opacity : 1;
}

.upper {
	text-transform : uppercase;
}

.left {
	margin-right : auto !important;
	margin-left : 0 !important;
}

.rightAlign {
	text-align : right;
}

.visible {
	visibility : visible !important;
}

.invisible, .hidden {
	visibility : hidden !important;
}

.collapse {
	display : none !important;
}

@media (max-width: 767px) {
html {
	font-size : 120% !important;
}


}

@media (max-width: 768px) {
::-webkit-scrollbar {
	display : none;
}

* {
	scrollbar-width : none;
}


}