@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap);

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: 'Almarai', Arial, sans-serif;
}

:root {
	--sidebar-color: #ffffff;
	--text-color: #333333;
	--icon-color: #4b4b4b;
	--favorite-icon-color: #afafaf;
	--reports-background: #afafaf;
	--hover-color: #8CC3F5;
	--button-color: #0597FD;
	--tools-list-background: rgba(247, 247, 247, 0.75);
	--tran-03: all 0.3s ease-out;
	--tran-05: all 0.5s ease-out;
	--top-panel-height: 31px;
	--sidebar-header-height: 32px;
	--tools-panel-top: calc(var(--top-panel-height) + var(--sidebar-header-height));
	--icon-size: 24px;
	--icon-size_x15: calc(var(--icon-size) * 1.5);
	--panel-width-closed: calc(var(--icon-size_x15) + 4px);
	--panel-width-opened: 280px;
	--open-menu-icon: url('data:image/svg+xml;charset=utf-8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M4.58594 6.66803C4.58594 6.25382 4.92172 5.91803 5.33594 5.91803H18.6699C19.0842 5.91803 19.4199 6.25382 19.4199 6.66803C19.4199 7.08224 19.0842 7.41803 18.6699 7.41803H5.33594C4.92172 7.41803 4.58594 7.08224 4.58594 6.66803ZM4.58594 12C4.58594 11.5858 4.92172 11.25 5.33594 11.25H18.6699C19.0842 11.25 19.4199 11.5858 19.4199 12C19.4199 12.4142 19.0842 12.75 18.6699 12.75H5.33594C4.92172 12.75 4.58594 12.4142 4.58594 12ZM4.58594 17.332C4.58594 16.9178 4.92172 16.582 5.33594 16.582H18.6699C19.0842 16.582 19.4199 16.9178 19.4199 17.332C19.4199 17.7462 19.0842 18.082 18.6699 18.082H5.33594C4.92172 18.082 4.58594 17.7462 4.58594 17.332Z"/></svg>');
	--close-menu-icon: url('data:image/svg+xml;charset=utf-8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M6.13368 6.11572C6.42655 5.8228 6.90142 5.82275 7.19434 6.11562L11.9971 10.9174L16.7998 6.11562C17.0927 5.82275 17.5676 5.8228 17.8604 6.11572C18.1533 6.40864 18.1533 6.88351 17.8603 7.17638L13.0578 11.978L17.8603 16.7796C18.1533 17.0725 18.1533 17.5474 17.8604 17.8403C17.5676 18.1332 17.0927 18.1332 16.7998 17.8404L11.9971 13.0386L7.19434 17.8404C6.90142 18.1332 6.42655 18.1332 6.13368 17.8403C5.84082 17.5474 5.84086 17.0725 6.13378 16.7796L10.9363 11.978L6.13378 7.17638C5.84086 6.88351 5.84082 6.40864 6.13368 6.11572Z"/></svg>');
	--favorite-icon: url('data:image/svg+xml;charset=utf-8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M11.9998 5.71065L10.4477 8.81707C10.0913 9.5304 9.40744 10.0163 8.62646 10.1284L5.19529 10.6208L7.6667 13.0004C8.23959 13.552 8.50563 14.3526 8.36874 15.1415L7.78195 18.523L10.881 16.9134C11.5825 16.5491 12.4187 16.5491 13.1201 16.9136L16.2177 18.5229L15.6309 15.1415C15.494 14.3526 15.76 13.552 16.3329 13.0004L18.8043 10.6208L15.3732 10.1284C14.5922 10.0163 13.9083 9.5304 13.5519 8.81706L11.9998 5.71065ZM11.1744 4.00668L9.10587 8.14662C8.9719 8.41476 8.71294 8.6006 8.41338 8.64359L3.78811 9.30737C3.03461 9.41586 2.73263 10.3316 3.27877 10.8578L6.6263 14.0809C6.84304 14.2896 6.94197 14.5903 6.89083 14.885L6.10111 19.436C5.9719 20.177 6.76044 20.7442 7.43461 20.3937L11.5724 18.2446C11.8404 18.1054 12.1606 18.1054 12.4285 18.2446L16.5648 20.3935C17.2379 20.7436 18.0274 20.1787 17.8985 19.436L17.1088 14.885C17.0577 14.5903 17.1566 14.2896 17.3733 14.0809L20.7211 10.8576C21.267 10.3322 20.9664 9.41606 20.2118 9.3074L15.5863 8.64359C15.2867 8.6006 15.0277 8.41476 14.8938 8.14662L12.825 4.00628C12.4883 3.33185 11.513 3.3305 11.1744 4.00668ZM19.681 9.77674L19.6807 9.77703L19.681 9.77674Z"/></svg>');
	--favorite-icon-checked: url('data:image/svg+xml;charset=utf-8,<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M11.1744 4.00667L9.10587 8.14661C8.9719 8.41475 8.71294 8.60059 8.41338 8.64358L3.78811 9.30736C3.03461 9.41585 2.73263 10.3316 3.27877 10.8577L6.6263 14.0809C6.84304 14.2896 6.94197 14.5903 6.89083 14.885L6.10111 19.436C5.9719 20.177 6.76044 20.7442 7.43461 20.3937L11.5724 18.2446C11.8404 18.1054 12.1606 18.1054 12.4285 18.2446L16.5648 20.3935C17.2379 20.7435 18.0274 20.1787 17.8985 19.436L17.1088 14.885C17.0577 14.5903 17.1566 14.2896 17.3733 14.0809L20.7211 10.8576C21.267 10.3322 20.9664 9.41605 20.2118 9.30739L15.5863 8.64358C15.2867 8.60059 15.0277 8.41475 14.8938 8.14661L12.825 4.00627C12.4883 3.33184 11.513 3.33049 11.1744 4.00667Z"/></svg>');
	--arrow-icon: url('data:image/svg+xml;charset=utf-8,<svg viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M13.1206 4.19972C13.3647 4.4438 13.3647 4.83953 13.1206 5.0836L8.2042 10L13.1206 14.9164C13.3647 15.1605 13.3647 15.5562 13.1206 15.8003C12.8765 16.0443 12.4808 16.0443 12.2367 15.8003L6.87837 10.4419C6.76116 10.3247 6.69531 10.1658 6.69531 10C6.69531 9.83424 6.76116 9.67526 6.87837 9.55805L12.2367 4.19972C12.4808 3.95564 12.8765 3.95564 13.1206 4.19972Z"/></svg>');
	--open-url-icon: url('data:image/svg+xml;charset=utf-8,<svg viewBox="0 0 13 13" xmlns="http://www.w3.org/2000/svg"><path d="M0 10.8333V2.16667C0 1.59203 0.228437 1.04109 0.634766 0.634766C1.04109 0.228437 1.59203 0 2.16667 0H5.05556C5.45443 0 5.77778 0.32335 5.77778 0.722222C5.77778 1.12109 5.45443 1.44444 5.05556 1.44444H2.16667C1.97512 1.44444 1.79148 1.52059 1.65603 1.65603C1.52059 1.79148 1.44444 1.97512 1.44444 2.16667V10.8333L1.44797 10.9046C1.46436 11.07 1.53749 11.2254 1.65603 11.344C1.79148 11.4794 1.97512 11.5556 2.16667 11.5556H10.8333C11.0249 11.5556 11.2085 11.4794 11.344 11.344C11.4794 11.2085 11.5556 11.0249 11.5556 10.8333V7.94444C11.5556 7.54557 11.8789 7.22222 12.2778 7.22222C12.6766 7.22222 13 7.54557 13 7.94444V10.8333C13 11.408 12.7716 11.9589 12.3652 12.3652C11.9589 12.7716 11.408 13 10.8333 13H2.16667C1.59203 13 1.04109 12.7716 0.634766 12.3652C0.228437 11.9589 0 11.408 0 10.8333ZM13 4.33333C13 4.73221 12.6766 5.05556 12.2778 5.05556C11.8789 5.05556 11.5556 4.73221 11.5556 4.33333V2.46571L7.01063 7.01063C6.72859 7.29268 6.27141 7.29268 5.98937 7.01063C5.70732 6.72859 5.70732 6.27141 5.98937 5.98937L10.5343 1.44444H8.66667C8.26779 1.44444 7.94444 1.12109 7.94444 0.722222C7.94444 0.32335 8.26779 0 8.66667 0H12.2778C12.6766 0 13 0.32335 13 0.722222V4.33333Z"/></svg>')
}

html,
body {
	width: 100%;
	height: 100%;
	accent-color: var(--hover-color);
}

.panel > .top-panel > svg.sdms-logo {
	max-height: 100%;
	min-width: 24px;
	width: 24px;
	margin: 0 5px;
}

iframe {
	border: 0;
	display: block;
	width: 100% !important;
	height: 100% !important;
}

.tools-lists-area {
	position: absolute;
	right: 0;
	bottom: 0;
	top: 0;
	left: var(--panel-width-opened);
	transition: left 0.5s ease-out;
	animation: panel-hide 0.2s ease-out;
	animation-fill-mode: forwards;
	pointer-events: none;
}

.panel.close .tools-lists-area {
	left: var(--panel-width-closed);
}

.tools-lists-area.opened {
	pointer-events: auto;
	animation: panel-view 0.2s ease-out;
}

.tools-lists-area.toolGrabbing {
	visibility: visible !important;
	pointer-events: all;
}


.tools-lists {
	grid-template-columns: repeat(auto-fill, minmax(280px, max-content));
	grid-template-rows: repeat(auto-fill, minmax(max-content, 270px));
	margin-top: var(--tools-panel-top);
	background-color: var(--tools-list-background);
	-webkit-backdrop-filter: blur(2px);
	backdrop-filter: blur(2px);
	height: calc(100% - var(--tools-panel-top));
	width: 100%;
	display: grid;
	gap: 16px;
	padding: 16px;
	color: var(--text-color);
	overflow: auto;
	justify-content: center;
}

.tools-lists > div {
	background-color: var(--sidebar-color);
	border-radius: 12px;
	padding: 2px 2px 10px 2px;
	box-shadow: 0px 1px 2px 0px rgba(0, 0, 0, 0.1);
}

.tools-lists > div > div.list-title {
	display: grid;
	align-items: center;
	grid-template-columns: 38px auto;
	gap: 5px;
	padding: 4px 10px;
}

.tools-lists > div > div.list-title > svg {
	color: var(--icon-color);
	height: 38px;
	width: 38px;
}

.tools-lists > div > div.list-title > span {
	font-weight: 600;
	font-size: 16px;
}

.tools-lists > div > div.tools {
	overflow-y: auto;
	max-height: calc(100% - 46px);
	padding: 0px 8px;
}

.tools-lists > div > div.tools > ul {
	display: grid;
	grid-auto-columns: 100%;
	justify-content: center;
	gap: 7px;
	list-style-type: none;
	font-size: 15px;
}

.tools-lists > div > div.tools > ul > li {
	display: flex;
	justify-content: space-between;
	align-items: center;
	min-height: var(--icon-size);
}

.tools-lists > div > div.tools > ul > li > a {
	text-decoration: none;
	cursor: pointer;
	color: var(--text-color);
}

.tools-lists > div > div.tools > ul > li#allReports > a {
	color: var(--hover-color);
}

.tools-lists > div > div.tools > ul > li > div.favorite-icon {
	min-width: var(--icon-size);
	min-height: var(--icon-size);
	cursor: pointer;
	background-color: var(--favorite-icon-color);
}

.tools-lists > div > div.tools > ul > li > div.favorite-icon.checked {
	-webkit-mask-image: var(--favorite-icon-checked);
	mask-image: var(--favorite-icon-checked);
}

.tools-lists > div > div.tools > ul > li > div.favorite-icon,
.tools-lists > div > div.tools > ul > li > div.favorite-icon.checked:hover {
	-webkit-mask-image: var(--favorite-icon);
	mask-image: var(--favorite-icon);
}

.tools-lists > div > div.tools > ul > li > div.favorite-icon:hover,
.tools-lists > div > div.tools > ul > li > div.favorite-icon.checked {
	background-color: var(--hover-color);
}

.tools-lists > div > div.tools > ul > li > div.favorite-icon:active {
	transform: scale(0.9);
}

.reports-list-area {
	position: absolute;
	right: 0;
	left: 0;
	bottom: 0;
	top: 0;
	-webkit-backdrop-filter: blur(2px);
	backdrop-filter: blur(2px);
	animation: panel-hide 0.3s ease-out;
	animation-fill-mode: forwards;
	pointer-events: none;
	background-color: rgba(0, 0, 0, 0.3);
	z-index: 2;
}

.reports-list-area.opened {
	pointer-events: auto;
	animation: panel-view 0.3s ease-out;
}

.reports-list {
	margin: 4% auto;
	width: max-content;
	height: 84%;
	min-width: 280px;
	background-color: var(--sidebar-color);
	border-radius: 8px;
	box-shadow: 0px 0 5px 1px rgba(0, 0, 0, 0.5);
}

.reports-list > .title {
	padding: 12px 20px;
	align-items: center;
}

.reports-list > .title > span {
	font-weight: 600;
	font-size: 16px;
}

.reports-list > .reports-list-content {
	padding: 0px 10px 0 20px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	overflow-y: scroll;
	gap: 13px;
	height: calc(100% - 94px);
	color: var(--text-color);
	font-size: 15px;
}

.reports-list > .reports-list-content > div {
	display: flex;
	width: 100%;
	padding-right: 5px;
}

.reports-list > .reports-list-content > div > * {
	cursor: pointer;
}

.reports-list > .reports-list-content > div > input {
	width: 15px;
}

.reports-list > .reports-list-content > div > label {
	padding-left: 10px;
	padding-right: 30px;
	width: 100%;
}

.reports-list > .reports-list-content > div > div.openReport {
	-webkit-mask-image: var(--open-url-icon);
	mask-image: var(--open-url-icon);
	-webkit-mask-repeat: no-repeat;
	mask-repeat: no-repeat;
	background-color: var(--icon-color);
	height: 13px;
	width: 13px;
	margin-top: 3px;
	opacity: 0;
	visibility: hidden;
	transition: visibility 0s linear 0.2s, opacity 0.2s ease-out;
}

.reports-list > .reports-list-content > div:hover > div.openReport {
	opacity: 1;
	visibility: visible;
	transition: visibility 0s linear, opacity 0.2s ease-out 0.1s;
}

.reports-list > .reports-list-content > div > div.openReport:hover {
	background-color: var(--hover-color);
}

.reports-list > .command-panel {
	display: flex;
	justify-content: flex-end;
	align-items: baseline;
	gap: 10px;
	padding: 10px 20px;
}

.reports-list > .command-panel > button {
	border-radius: 6px;
	padding: 7px 23px;
	height: 32px;
	border: none;
	box-shadow: 0px 0 2px 0px rgba(0, 0, 0, 0.4);
	background-color: var(--sidebar-color);
	color: var(--text-color);
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
}

.reports-list > .command-panel > button:hover {
	background-image: linear-gradient(rgb(0 0 0/10%) 0 0);
	box-shadow: 0px 0 2px 0px rgba(0, 0, 0, 0.6);
}

.reports-list > .command-panel > button.submit {
	background-color: var(--button-color);
	color: white;
}

.main {
	width: 100%;
	height: 100%;
	display: grid;
	grid-template-columns: minmax(min-content, max-content) auto;
	grid-template-rows: 100%;
}

.sidebar {
	height: calc(100% - var(--top-panel-height));
	width: 100%;
	margin: 0;
	padding: 0;
	background: var(--sidebar-color);
	transition: var(--tran-05);
	z-index: 1;
	opacity: 1;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
	box-shadow: 1px 0 5px 0px rgba(0, 0, 0, 0.5);
	clip-path: inset(0px -300px 0px 0px);
}

.sidebar.webClientStarted {
	visibility: visible;
	animation: panel-view 1s;
}

.sidebar:not(.webClientStarted) {
	opacity: 0;
}

@keyframes panel-view {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
		visibility: visible;
	}
}

@keyframes panel-hide {
	from {
		opacity: 1;
	}

	to {
		opacity: 0;
		visibility: hidden;
	}
}

.sidebar header {
	position: relative;
	height: var(--sidebar-header-height);
	display: flex;
	flex-direction: row;
	justify-content: space-between;
}

.sidebar header a span.nav-text {
	font-size: 18px;
	font-weight: 600;
}

.sidebar > header > a > div {
	height: var(--sidebar-header-height);
	width: var(--icon-size_x15);
	padding: 4px 6px;
}

.sidebar > header > a .menu-icon {
	background-color: var(--icon-color);
	-webkit-mask-image: var(--open-menu-icon);
	mask-image: var(--open-menu-icon);
	width: var(--icon-size);
	height: var(--icon-size);
}

.sidebar > header > a.close .menu-icon {
	-webkit-mask-image: var(--close-menu-icon);
	mask-image: var(--close-menu-icon);
}

.sidebar > header a:hover .menu-icon {
	background-color: var(--hover-color);
}

.panel {
	width: var(--panel-width-opened);
	transition: width 0.5s ease-out;
	height: 100%;
	visibility: hidden;
	z-index: 999;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-o-user-select: none;
	user-select: none;
}

.panel.close {
	width: var(--panel-width-closed);
}

.nav-link {
	min-height: var(--icon-size_x15);
}

.tooltip {
	position: fixed;
	font-size: 10pt;
	background-color: var(--hover-color);
	color: var(--sidebar-color);
	border-radius: 10px;
	padding: 4px 6px;
	text-align: center;
	z-index: 999;
	transition: opacity 0.2s ease-out;
}

.tooltip.hidden {
	opacity: 0;
	visibility: hidden;
}

.tooltip::before {
	content: '';
	position: absolute;
	top: 5px;
	left: -5px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 7px 7px 7px 0;
	border-color: transparent var(--hover-color) transparent transparent;
}

.panel.close .sidebar .menu > ul > li:not(.sortable-ghost) > a:hover > .nav-text {
	transition-duration: 0s;
	transition-behavior: normal;

	@starting-style {
		opacity: 0.7;
	}
}

.panel.close .sidebar .menu > ul > li > a:hover > span::before {
	content: '';
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 9px 9px 0 0;
	border-color: var(--hover-color) transparent transparent transparent;
	position: absolute;
	top: 7px;
	left: -3px;
	transform: rotate(-45deg);
}

.sidebar .bottom-content {
	overflow: hidden;
}

.sidebar .menu > ul > li > a > div > svg,
.sidebar .bottom-content a > div > svg {
	width: 24px;
	height: 24px;
}

.sidebar a > div > svg {
	fill: currentColor;
	color: var(--icon-color);
	vertical-align: middle;
}

.sidebar a:hover > div > svg,
.sidebar .nav-link.opened > a > div > svg,
.sidebar .nav-link.opened > a > span.nav-text,
.sidebar a:hover .nav-text,
.sidebar a:hover .sub-nav-text,
.sidebar .menu .nav-link.sub-menu.open > a > div > svg,
.sidebar .menu .nav-link.sub-menu.open > a .nav-text,
.sidebar .menu .nav-link.sub-menu.open > a::after,
.panel .sidebar .menu > ul > .nav-link.sub-menu > a:hover::after,
.tools-lists > div > div.tools > ul > li > a:hover {
	color: var(--hover-color);
}

.panel > .sidebar .menu > ul > .nav-link.sub-menu > a::before {
	content: '';
	background-color: var(--icon-color);
	-webkit-mask-image: var(--arrow-icon);
	mask-image: var(--arrow-icon);
	transform: rotate(270deg);
	transition: all 0.5s ease-out;
	position: absolute;
	left: calc(var(--panel-width-opened) - 20px);
	top: 10px;
	width: 16px;
	height: 16px;
}

.panel > .sidebar .menu > ul > .nav-link.sub-menu.open > a::before,
.panel > .sidebar .menu > ul > .nav-link.sub-menu > a:hover::before {
	background-color: var(--hover-color);
}

.panel.close .sidebar .menu > ul > .nav-link.sub-menu.open > a::before {
	transform: rotate(180deg);
}

.panel:not(.close) .sidebar .menu > ul > .nav-link.sub-menu.open > a::before {
	transform: rotate(450deg);
}

.panel.close .sidebar .menu > ul > .nav-link.sub-menu > a::before {
	top: 12px;
	left: 26px;
	width: 12px;
	height: 12px;
}

.panel.close .sidebar .menu > ul > .nav-link.sub-menu > .sub-menu-list {
	display: block !important;
	width: 260px;
	max-height: 600px;
	margin: 3px;
	border: 1px solid var(--reports-background);
	border-radius: 0px 6px 6px 0px;
	background-color: var(--sidebar-color);
	overflow-y: auto;
	padding: 10px 5px;
}

.panel:not(.close) .sidebar .menu > ul > .nav-link.sub-menu > .sub-menu-list {
	padding: 5px 2px 5px 36px;
}

.panel .sidebar .menu > ul > .nav-link.sub-menu > .sub-menu-list > ul > li.nav-link {
	min-height: auto;
}

.panel .sidebar .menu > ul > .nav-link.sub-menu > .sub-menu-list > ul > li.nav-link > a > span.nav-text {
	min-width: auto;
	max-width: auto;
}

.panel.close .sidebar .menu > ul > .nav-link.sub-menu > .sub-menu-list .nav-text {
	opacity: 1;
}

.panel:not(.close) .sidebar .menu > ul > .nav-link.sub-menu > .sub-menu-list {
	visibility: visible !important;
	position: static !important;
	transform: translate(0, 0) !important;
}

.top-panel {
	width: 100%;
	height: var(--top-panel-height);
	background-color: #fff;
	border-bottom: 1px solid rgba(0, 0, 0, 0.3);
	font-size: 18px;
	color: var(--text-color);
	display: flex;
	justify-content: left;
	align-items: center;
}

.top-panel > img {
	padding: 0 5px;
	height: 24px;
}

.menu-links {
	display: flex;
	justify-content: center;
	flex-direction: column;
	gap: 3px;
}

.sidebar li {
	list-style: none;
	position: relative;
}

.sidebar .nav-text,
.sidebar .sub-nav-text {
	font-size: 11pt;
	font-weight: 500;
	min-width: calc(var(--panel-width-opened) - 45px);
	max-width: calc(var(--panel-width-opened) - 45px);
	color: var(--text-color);
}

.panel.close > .sidebar > .menu-bar > .menu > .menu-links > li > a > .nav-text,
.panel.close > .sidebar > header > a > .nav-text,
.panel.close > .sidebar > .menu-bar > .bottom-content .nav-text {
	display: none;
	opacity: 0;
}

.panel > .sidebar > .menu-bar > .menu > .menu-links > li > a > .nav-text,
.panel.close > .sidebar > .menu-bar > .menu > .menu-links > li.open > .sub-menu-list > ul > li > a > .nav-text,
.panel > .sidebar > header > a > .nav-text,
.panel > .sidebar > .menu-bar > .bottom-content .nav-text {
	transition-duration: 0.5s;
	transition-behavior: allow-discrete;
	transition-property: opacity, display;
	display: block;
	opacity: 1;
	padding-right: 15px;

	@starting-style {
		opacity: 0;
	}
}

.panel > .sidebar .menu > ul.menu-links > li[data-badge]::after {
	content: attr(data-badge);
	position: absolute;
	top: 9px;
	right: 1px;
	background: linear-gradient(135deg,#5bc8f9,#5bc8f9);
	color: white;
	border-radius: 8px;
	padding: 2px 4px;
	font-weight: bold;
	font-size: 12px;
	line-height: 1;
	pointer-events: none;
	transition-property: top, padding, font-size;
	transition-duration: 0.3s, 0.3s, 0.3s;
	transition-timing-function: ease-out, ease-out, ease-out;
	min-width: 12px;
	text-align: center;
	border: solid 2px white;
}

.panel.close > .sidebar .menu > ul.menu-links > li[data-badge]::after {
	top: 20px;
	padding: 1px 2px;
	font-size: 11px;
}

.sidebar header a,
.sidebar li a,
.sidebar .bottom-content a {
	list-style: none;
	background-color: transparent;
	display: flex;
	align-items: center;
	border-radius: 6px;
	text-decoration: none;
	cursor: pointer;
	position: relative;
}

.panel .sidebar .menu > ul > .nav-link.sub-menu ul {
	transition: max-height 0.5s ease-out;
	display: flex;
	flex-direction: column;
	gap: 15px;
}

ul#reportsList > li > a > div,
div.menu-bar > div.menu > ul > li > a > div,
div.menu-bar > div.bottom-content a > div {
	height: var(--icon-size_x15);
	min-width: var(--icon-size_x15);
	line-height: 36px;
	text-align: center;
}

#reports:has(#reportsList:empty) {
	display: none;
}

div.menu-bar > div.bottom-content a > div.toggle > div.arrow-icon {
	background-color: var(--icon-color);
	-webkit-mask-image: var(--arrow-icon);
	mask-image: var(--arrow-icon);
	width: var(--icon-size);
	height: var(--icon-size);
	display: inline-block;
	vertical-align: middle;
}

div.menu-bar > div.bottom-content a:hover > div.toggle > div.arrow-icon {
	background-color: var(--hover-color);
}

.panel div.menu-bar > div.bottom-content a > div.toggle {
	transition: var(--tran-03);
}

.panel.close div.menu-bar > div.bottom-content a > div.toggle {
	transform: rotate(180deg);
}

.sidebar > .menu-bar {
	height: calc(100% - var(--sidebar-header-height));
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.menu-bar > .bottom-content > hr {
	border: 0;
	border-top: 1px solid var(--icon-color);
	margin: 0 9px 0 5px;
}

.sidebar > .menu-bar > .menu {
	display: flex;
	flex-direction: column;
	gap: 3px;
	margin-top: 0;
	overflow-y: auto;
	overflow-x: hidden;
	flex: 1;
}

@-moz-document url-prefix() {
	.tools-lists,
	.tools-lists > div > div.tools,
	.sidebar .menu,
	.reports-list-area > .reports-list > .reports-list-content,
	.panel.close .sidebar .menu > ul > .nav-link.sub-menu > .sub-menu-list {
		scrollbar-width: none;
	}
}

.tools-lists::-webkit-scrollbar,
.tools-lists > div > div.tools::-webkit-scrollbar,
.sidebar .menu::-webkit-scrollbar,
.reports-list-area > .reports-list > .reports-list-content::-webkit-scrollbar,
.panel.close .sidebar .menu > ul > .nav-link.sub-menu > .sub-menu-list::-webkit-scrollbar {
	width: 4px;
	height: 4px;
}

.tools-lists::-webkit-scrollbar *,
.tools-lists > div > div.tools::-webkit-scrollbar *,
.sidebar .menu::-webkit-scrollbar *,
.reports-list-area > .reports-list > .reports-list-content::-webkit-scrollbar *,
.panel.close .sidebar .menu > ul > .nav-link.sub-menu > .sub-menu-list::-webkit-scrollbar * {
	background: transparent;
}

.tools-lists::-webkit-scrollbar-thumb,
.tools-lists > div > div.tools::-webkit-scrollbar-thumb,
.sidebar .menu::-webkit-scrollbar-thumb,
.reports-list-area > .reports-list > .reports-list-content::-webkit-scrollbar-thumb,
.panel.close .sidebar .menu > ul > .nav-link.sub-menu > .sub-menu-list::-webkit-scrollbar-thumb {
	border-radius: 4px;
}

.tools-lists::-webkit-scrollbar-thumb,
.tools-lists > div > div.tools::-webkit-scrollbar-thumb,
.sidebar .menu:hover::-webkit-scrollbar-thumb,
.reports-list-area > .reports-list > .reports-list-content::-webkit-scrollbar-thumb,
.panel.close .sidebar .menu > ul > .nav-link.sub-menu > .sub-menu-list::-webkit-scrollbar-thumb {
	background: var(--icon-color);
}

.sortable-drag {
	opacity: 1 !important;
}

.sortable-ghost {
	opacity: 0 !important;
}

.sortable-ghost a > div > svg,
.sortable-ghost .nav-text {
	color: var(--hover-color) !important;
}

.grabbing * {
	cursor: -webkit-grabbing;
	cursor: -moz-grabbing;
	cursor: grabbing !important;
}