﻿.xs-menu-root, .xs-menu-root ul {
	list-style-type: none
}

	.xs-menu-root ul, .xs-menu-root input {
		display: none;
	}

		.xs-menu-root input:checked:not(:disabled) ~ ul {
			display: block;
		}

		.xs-menu-root input:checked:not(:disabled) ~ .xs-menu-item-label > .xs-menu-item-marker:not(.empty)::after {
			content: var(--xs-icon-collapse-tree-content, "keyboard_arrow_down");
		}

	.xs-menu-root li {
		margin-left: -16px;
	}

@media (max-width: 767.98px) {
	.xs-menu-root li {
		padding-top: 1rem;
	}
}

.xs-menu-item-label {
	display: flex;
	align-items: center;
}

	.xs-menu-item-label:hover {
		background-color: #F4F4E8;
		cursor: pointer;
	}

	.xs-menu-item-label > .xs-menu-item-icon {
		margin-right: 0.2rem;
	}

.xs-menu-item-marker {
	color: #1b1e21;
}

.xs-menu-item-marker,
.xs-menu-item-icon {
	font-size: 24px;
	line-height: 24px;
}

	.xs-menu-item-marker:not(.empty)::after {
		content: var(--xs-icon-expand-tree-content, "keyboard_arrow_right");
	}

	.xs-menu-item-marker.empty {
		width: 24px;
		height: 24px;
	}

.xs-menu-item-icon {
	width: 24px;
	height: 24px;
}

	.xs-menu-item-icon:not([tipo-pgm]):not([custom-icon]):not(.custom-icon) {
    color: var(--xs-icon-node-tree-content-color, rgb(222, 193, 78));
	}

		.xs-menu-item-icon:not([tipo-pgm]):not([custom-icon]):not(.custom-icon)::after {
			content: var(--xs-icon-node-tree-content, "folder_open");
		}

	.xs-menu-item-icon[tipo-pgm="1"][action="modif"]:not([custom-icon]):not(.custom-icon) {
		color: #D2B300;
	}

		.xs-menu-item-icon[tipo-pgm="1"][action="modif"]:not([custom-icon]):not(.custom-icon)::after {
			content: var(--xs-icon-edit-content, "edit");
		}

	.xs-menu-item-icon[tipo-pgm="1"][action="alta"]:not([custom-icon]):not(.custom-icon) {
		color: #41AC22;
	}

		.xs-menu-item-icon[tipo-pgm="1"][action="alta"]:not([custom-icon]):not(.custom-icon)::after {
			content: var(--xs-icon-add-content, "add");
		}

	.xs-menu-item-icon[tipo-pgm="1"][action="baja"]:not([custom-icon]):not(.custom-icon) {
		color: #ed0000
	}

		.xs-menu-item-icon[tipo-pgm="1"][action="baja"]:not([custom-icon]):not(.custom-icon)::after {
			content: var(--xs-icon-delete-content, "delete_forever");
		}

	.xs-menu-item-icon[tipo-pgm="1"][action="ro"]:not([custom-icon]):not(.custom-icon),
	.xs-menu-item-icon[tipo-pgm="2"]:not([custom-icon]):not(.custom-icon) {
		color: #74B8F5;
	}

		.xs-menu-item-icon[tipo-pgm="1"][action="ro"]:not([custom-icon]):not(.custom-icon)::after,
		.xs-menu-item-icon[tipo-pgm="2"]:not([custom-icon]):not(.custom-icon)::after {
			content: var(--xs-icon-search-content, "search");
		}

	.xs-menu-item-icon[tipo-pgm="3"]:not([custom-icon]):not(.custom-icon) {
		color: #3AAEBE;
	}

		.xs-menu-item-icon[tipo-pgm="3"]:not([custom-icon]):not(.custom-icon)::after {
			content: var(--xs-icon-report-content, "description");
		}

	.xs-menu-item-icon[tipo-pgm="4"]:not([custom-icon]):not(.custom-icon),
	.xs-menu-item-icon[tipo-pgm="5"]:not([custom-icon]):not(.custom-icon),
	.xs-menu-item-icon[tipo-pgm="6"]:not([custom-icon]):not(.custom-icon),
	.xs-menu-item-icon[tipo-pgm="7"]:not([custom-icon]):not(.custom-icon),
	.xs-menu-item-icon[tipo-pgm="8"]:not([custom-icon]):not(.custom-icon) {
		color: #A0A6AD;
	}

		.xs-menu-item-icon[tipo-pgm="4"]:not([custom-icon]):not(.custom-icon)::after,
		.xs-menu-item-icon[tipo-pgm="5"]:not([custom-icon]):not(.custom-icon)::after,
		.xs-menu-item-icon[tipo-pgm="6"]:not([custom-icon]):not(.custom-icon)::after,
		.xs-menu-item-icon[tipo-pgm="7"]:not([custom-icon]):not(.custom-icon)::after,
		.xs-menu-item-icon[tipo-pgm="8"]:not([custom-icon]):not(.custom-icon)::after {
			content: var(--xs-icon-settings-content, "settings");
		}

.xs-menu-item-text {
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.xs-menu-item-description {
	width: 500px;
	margin-left: auto;
}

#favoritos-container .xs-menu-item-description,
#recientes-container .xs-menu-item-description {
	display: none;
}

#favoritos-container ul,
#recientes-container ul {
	padding-left: 5px;
	padding-right: 5px;
}

#favoritos-container li,
#recientes-container li {
	margin: auto;
}

#favoritos-container .xs-menu-item-marker.empty,
#recientes-container .xs-menu-item-marker.empty {
	display: none;
}

@media (min-width:400px) {
	.sidebar-open {
		overflow: hidden;
	}

	#sidebar {
		overflow-y: scroll;
		bottom: 0%;
		top: 0%;
	}
}

@media (max-width:1000px) {
	#sidebar {
		max-width: 500px;
	}

	.xs-menu-item-description {
		display: none;
	}
}

@media (max-width: 767.98px) {
	#sidebar {
		overflow-x: scroll;
		text-overflow: unset;
		max-width: unset;
	}
}

#sidebar {
	position: absolute;
	top: 0;
	background-color: white;
	width: 100vw;
	left: -100vw;
	max-width: 1000px;
	min-width: 200px;
	z-index: 1100;
	transition: all 0.2s;
}

	#sidebar.active {
		left: 0;
	}

.overlay {
	position: fixed;
	left: 0;
	top: 0;
	width: 100vw;
	height: 100vh;
	z-index: 1090;
	display: none;
	background-color: rgba(0, 0, 0, 0.5);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}

#sidebar-header {
	display: flex;
	position: -webkit-sticky;
	position: static;
	left: 0;
	top: 0;
	width: 100%;
	margin-bottom: 5px;
	background-color: var(--xs-menu-sidebar-header-background-color, rgb(244, 244, 232));
}

	#sidebar-header #sidebar-close:hover {
		cursor: pointer;
	}

	#sidebar-header #sidebar-close-icon::before {
		content: var(--xs-icon-close-content, "close");
	}

	#sidebar-header #menu-reset:hover {
		cursor: pointer;
	}

	#sidebar-header #menu-reset-icon::before {
		content: var(--xs-icon-reset-content, "replay");
	}

	#sidebar-header #search-box #search-reset i::before {
		content: var(--xs-icon-clear-content, "clear");
	}

	#sidebar-header #search-box #search-icon i::before {
		content: var(--xs-icon-search-content, "search");
	}

	#sidebar-header #search-box {
		display: flex;
		flex-wrap: nowrap;
	}

		#sidebar-header #search-box > i {
			display: inline-flex;
			align-items: center;
		}

		#sidebar-header #search-box #search-reset {
			cursor: pointer;
		}

@media (min-width:768px) {
	#sidebar-header div.navbar-nav {
		height: 58px;
	}
}

@supports (backdrop-filter: saturate(180%) blur(5px)) {
	.overlay {
		background-color: rgba(0, 0, 0, 0.1);
		backdrop-filter: saturate(180%) blur(20px);
		-webkit-backdrop-filter: saturate(180%) blur(5px);
	}

	#sidebar-header {
		background-color: var(--xs-menu-sidebar-header-background-color-alpha, rgba(249, 249, 242, 0.1));
		backdrop-filter: saturate(180%) blur(20px);
		-webkit-backdrop-filter: saturate(180%) blur(5px);
	}
}

@supports (position: sticky) {
	#sidebar-header {
		position: sticky;
	}
}

.current-selection {
	background-color: var(--xs-current-selection-background-color, rgb(228, 237, 228));
}

.xs-spinner-border-sm {
	border-width: .15em;
	color: rgb(27, 30, 33);
	width: 12px;
	height: 12px;
	margin: 6px;
}

.menu-spinner-container {
	padding-left: 40px;
	margin-left: -16px;
}
