/* CSS Tree menu styles */
.tree
{
	ol
	{
		padding: 0.3rem 0 0 2rem;
		width: 300px;
		width: $builder-right-panel-width + 15;
		font-size:12px;
		color:#555;

		li 
		{ 
			position: relative; 
			margin-left: -15px;
			margin-bottom: 0.1rem;
			list-style: none;
			color:#555;
			overflow:hidden;
			
			&:hover
			{
				color:#007bff;
			}
			
			&.active
			{
				//background-color:$primary;
				//color:#fff;
				> label > span, > a > span  
				{
					color:#007bff;
					//font-weight:600;
				}
			}
		}
		
		li.file
		{
			> label
			{
				background: url(../libs/builder/icons/file.svg) 12px 0px no-repeat;
				background-size:19px 18px;
				cursor: pointer;
				display: block;
				padding-left: 35px;
				margin:0px;
				font-size:12px;


				&:hover
				{
					color:$primary;
				}
			}
		}
		
		li.folder
		{
			> label
			{
				padding-left:38px;
			}
		}

		li input
		{
			position: absolute;
			left: 0;
			margin-left: 0;
			opacity: 0;
			z-index: 2;
			cursor: pointer;
			height: 1em;
			width: 1em;
			top: 0;
			
			 + ol
			{
				background: url(../img/toggle-small-expand.png) 40px 0 no-repeat;
				background: url(../libs/builder/icons/plus_round.svg) 40px 0px no-repeat;
				background: url(../libs/builder/icons/arrow-down.svg) 42px 2px no-repeat;
				background-size:10px 10px;
				
				margin: -1.1em 0 0 -44px; /* 15px */
				padding:0.7rem 0rem;
				height: 0em;
				
				> li { display: none; margin-left: -14px !important; padding-left: 1px; }
			}
		}
		
		li label
		{
			background: url(../libs/builder/icons/folder.svg) 15px 1px no-repeat;
			background-size:18px 18px;
			cursor: pointer;
			display: block;
			padding-left: 35px;
			margin:0px;
			font-size:12px;
		}

		li input:checked + ol
		{
			background: url(../img/toggle-small.png) 40px 5px no-repeat;
			background: url(../libs/builder/icons/minus_round.svg) 40px 5px no-repeat;
			background: url(../libs/builder/icons/arrow-right.svg) 54px 0px no-repeat;
			background-size:10px 10px;
			margin: -1.65em 0 0 -44px; /* 20px */
			margin: -1.1em 0 0 -55px; /* 20px */
			padding: 2.1em 0 0 80px;
			height: auto;

			> li { display: block; margin: 0 0 0.125em;  /* 2px */}
			> li:last-child { margin: 0 0 0.063em; /* 1px */ }
		}
	}
}