#logo {
	width: 80px;
	height: 80px;
}

#show_psw_label {
	color: hsl(210, 17%, 44%);
}

.it-header-center-wrapper {
	z-index: 1000;
}

.no-height {
	height: unset;
}

.all-screen-height {
	height: 100vh;
}

.form-check [type=checkbox]:checked+label::after {
	background-color: var(--color-shadow-dark);
	border-color: var(--color-shadow-dark);
}

.notification {
	position: fixed;
	z-index: 99999;
}

.danger-card {
	background-color: var(--danger-zone-bg-color);
	color: var(--color-white);
}

.danger-card .modal-content,
.danger-card .modal-content .modal-body{
	background-color: var(--danger-zone-bg-color);
	color: var(--color-white);
}

.it-header-center-wrapper {
	background-color: var(--color-shadow-dark);
	box-shadow: 0 4px 8px -2px black;
	position: sticky;
}

.it-header-center-wrapper .link-list .list-item,
.danger-card .modal-content .modal-body label{
	color: var(--color-white);
}

.it-header-center-wrapper .link-list .list-item:hover:not(.btn, .list-item.active) {
	text-decoration: underline;
	transition: all .1s;
}

.it-header-center-wrapper .link-list .list-item.active{
	font-weight: bold;
	border-bottom: 2px solid;
}

li .list-item.mobile {
	color: var(--link-color) !important;
	font-weight: bold;
	font-size: 1.25rem;
	margin: 16px 0;
}

.btn.close-menu {
	border-radius: 50%;
	background-color: var(--button-color) !important;
}

.divider {
	color: var(--color-shadow-dark);
}

.modal-content {
	border-radius: 16px;
}

i.success {
	color: var(--color-shadow-dark);
}

i.error {
	color: var(--error-color);
}

i.info {
	color: var(--info-color);
}

i.warning {
	color: var(--warning-color);
}

.round-btn {
	padding: 12px;
	border-radius: 50%;
}

.round-btn-xs {
	padding: 6px;
	border-radius: 50%;
}

.btn-custom {
	background-color: var(--button-color);
	color: var(--color-white);
}

.btn-custom:hover {
	background-color: var(--button-color-hover);
	color: var(--color-white);
}

.btn-custom:active {
	background-color: var(--color-gray-dark);
	color: var(--color-green-dark);
}

.btn-custom:focus {
	background-color: var(--color-shadow-dark);
	color: var(--color-white);
}

.btn-custom[disabled]{
	border: 1px solid var(--color-shadow-dark);
}

.btn-custom[disabled] i{
	color: var(--color-shadow-dark);
}


.btn-custom i {
	color: var(--color-white);
}

.edit-icon, .delete-icon {
	color: var(--color-gradient-deep);
}

.edit-icon:hover, .delete-icon:hover {
	color: var(--color-green-dark);
}

.tree-icon {
	color: var(--color-gradient-deep);
}

.tree-icon:hover {
	color: var(--color-green-dark);
}

.custom-link {
	color: var(--link-color);
}

.custom-link:hover {
	color: var(--link-color-hover);
	transition: all .2s;
}

#loader-wrapper {
	height: 100vh;
}

#loading_in_progress {
	display: flex;
	justify-content: center;
	flex-direction: column;
	height: 50%;
	align-items: center;
}

.font {
	font-family: var(--bs-body-font-family);
}

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

.numInput.cur-year {
	color: var(--main-text-color) !important;
}

.modal-dialog {
	max-width: 50vw;
}

.loader {
	height: 100px;
	aspect-ratio: 1;
	border-radius: 50%;
	animation: l11 2s infinite;
}
@keyframes l11 {
	0%   {background: conic-gradient(var(--color-green-base) 0     ,#0000 0)}
	12.5%{background: conic-gradient(var(--color-green-base) 45deg ,#0000 46deg)}
	25%  {background: conic-gradient(var(--color-green-base) 90deg ,#0000 91deg)}
	37.5%{background: conic-gradient(var(--color-green-base) 135deg,#0000 136deg)}
	50%  {background: conic-gradient(var(--color-green-base) 180deg,#0000 181deg)}
	62.5%{background: conic-gradient(var(--color-green-base) 225deg,#0000 226deg)}
	75%  {background: conic-gradient(var(--color-green-base) 270deg,#0000 271deg)}
	87.5%{background: conic-gradient(var(--color-green-base) 315deg,#0000 316deg)}
	100% {background: conic-gradient(var(--color-green-base) 360deg,#0000 360deg)}
}

.wrapper {
	min-height: calc(100vh - 80px)
}

/* Bootstrap Header size change */
@media (min-width: 992px) {
	.wrapper {
		min-height: calc(100vh - 120px)
	}
}

@media (max-width: 768px) {
	.modal-dialog {
		max-width: 100vw;
	}
}