/* IDE Hack <style src="text/css"> */

/* Fix navbar icon size */
.mainmenu span::before {
	font-size: 16px;
}

/* Fix navbar width */
.side-nav-vert {
	position: fixed;
	width: 100%;
}

.id-container {
	margin-top: 53px;
}

/* Fix home boards */
.opened-dash-board-wrap {
	.box-flex-container {
		gap: 25px;

		.box-flex-item {
			margin: 0;

			.box-flex-item-with-margin {
				height: 100%;

				.info-box {
					margin-bottom: 0;
					height: 100%;

					.info-box-icon {
						display: flex;
						justify-content: center;
						align-items: center;
						font-size: 2.2rem;
						height: 100%;
					}
				}
			}
		}
	}
}

/* Fix drawer */
.side-nav {
	border: 0;
	background: none;
	transition: transform 200ms ease allow-discrete;
}

#id-left {
	border-right: 1px solid #ECECEC;
	border-bottom: 1px solid #ECECEC;
	border-radius: 0 0 15px 0;
	background: var(--colorbackvmenu1);
	position: relative;
}

/* Drawer toggle */
html.fixnatif-nav-hidden {
	.side-nav {
		display: none;
		transform: translateX(-100%);
		opacity: 0;
	}

	#id-right {
		display: block;
		width: 100%;
	}

	.fixnatif-nav-toggle {
		position: fixed;
		top: 60px;
		left: 8px;

		span {
			transform: rotate(180deg);
		}
	}
}

@starting-style {
	html.fixnatif-nav-anim:not(.fixnatif-nav-hidden) .side-nav {
		transform: translateX(-100%);
		opacity: 0;
	}
}

.fixnatif-nav-toggle {
	position: absolute;
	top: 8px;
	right: -36px;
	z-index: 1001;
	width: 26px;
	height: 26px;
	padding: 0;
	border: 1px solid #ECECEC;
	border-radius: 50%;
	background: var(--colorbackvmenu1);
	color: var(--colortextbackvmenu);
	cursor: pointer;
}

/* Top menu selected/hover: bar under icon instead of core up arrow */
ul.tmenu li.tmenu::after,
ul.tmenu li.tmenusel::after {
	content: "";
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 60%;
	height: 3px;
	border: 0;
	border-radius: 3px 3px 0 0;
	background: var(--colortextbackhmenu);
	transform: translateX(-50%) scaleX(0);
	transition: transform 150ms ease;
}

ul.tmenu li.tmenusel::after,
ul.tmenu li.tmenu:hover::after {
	transform: translateX(-50%) scaleX(1);
}

ul.tmenu li.tmenu:hover:not(.tmenusel)::after {
	opacity: 0.6;
}

/* Top menu hover */
.fixnatif-menu-preview {
	position: fixed;
	top: var(--fixnatif-menu-top);
	left: min(var(--fixnatif-menu-left), 100vw - 280px);
	z-index: 1002;
	width: fit-content;
	max-height: calc(70vh - 70px);
	overflow-y: auto;
	padding: 4px;
	border: 1px solid #ECECEC;
	border-radius: 0 0 10px 10px;
	background: var(--colorbackvmenu1);
	box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);

	&[hidden] {
		display: none;
	}

	.vmenu div.blockvmenuend {
		margin-bottom: 0;
		padding: 0 0 2px;
	}

	/* No separator after the last block */
	.vmenu div.blockvmenulast {
		border-bottom: 0;
	}

	.vmenu div.blockvmenuend:last-child {
		display: none;
	}
}

/* Fix module builder more tabs */
.tabs #moretabs #moretabsList {
	max-height: 50vh;
	overflow-y: scroll;
}

/* Notification styles */
.jnotify-container {
	margin-top: 54px;

	.jnotify-notification {
		--jnotify-text-color: #000000;
		--jnotify-error-color: #cf4b3e;
		--jnotify-warning-color: #e0a800;
		--jnotify-success-color: #25a580;

		.jnotify-message {
			font-size: 0.95em;
			color: var(--jnotify-text-color) !important;
			display: flex;
			align-items: center;
			gap: 0.6rem;

			&::before {
				font-family: 'Font Awesome 5 Free';
				font-weight: 900;
				font-size: 1.2rem;
			}
		}

		.jnotify-background {
			opacity: 1 !important;
			border-left-style: solid;
			border-left-width: 4px;
		}

		.jnotify-close {
			color: var(--jnotify-text-color) !important;
			opacity: 0.5;
		}

		&.jnotify-notification-error {
			.jnotify-background {
				background-color: #ffd2d2 !important;
				border-color: var(--jnotify-error-color);
			}

			.jnotify-message::before {
				content: '\f057';
				color: var(--jnotify-error-color);
			}
		}

		&.jnotify-notification-warning {
			.jnotify-background {
				background-color: #fff2c9 !important;
				border-color: var(--jnotify-warning-color);
			}

			.jnotify-message::before {
				content: '\f071';
				color: var(--jnotify-warning-color);
			}
		}

		&.jnotify-notification-3000 {
			.jnotify-background {
				background-color: #d4f3e4;
				border-color: var(--jnotify-success-color);
			}

			.jnotify-message::before {
				content: '\f058';
				color: var(--jnotify-success-color);
			}
		}
	}
}