/* CSS Tree menu styles */
.tree
{
	width:100%;

	ol
	{
		padding: 0.3rem 0 0 2rem;
		margin:0;
		//width: 300px;
		min-width: $builder-right-panel-width + 15;
		font-size:12px;
		font-weight:500;
		color:#555;

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


				&: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(../libs/builder/icons/arrow-right.svg) 5px .3rem no-repeat;
				background-size:10px 10px;
				margin: -1.8rem 0 0 0rem;
				padding: 2rem 0 0 2rem;
				height: 0;
				
				> li { display: none; margin-left: -14px !important; padding-left: 1px; }
			}
		}
		
		li label
		{
			background: url(../libs/builder/icons/folder.svg) 24px 1px no-repeat;
			background-size:24px 24px;
			cursor: pointer;
			display: block;
			padding-left: 56px;
			margin:0px;
			font-size:12px;
			font-weight:500;
			line-height:28px;
		}

		li input:checked + ol
		{
			background: url(../libs/builder/icons/arrow-down.svg) 5px .1rem no-repeat;
			background-size:10px 10px;
			margin: -1.8em 0 0 0rem;
			padding: 2rem 0 0 2rem;
			height: auto;

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