.csn-tree,
.csn-tree * {
	list-style: none;
}

		/* 
		# File */
		.csn-tree-file-item {
			margin-top: .25rem;

		}

		.csn-tree-file-item .csn-file-folder-icon-name-wrapper.disabled {
			opacity: .25;
			border-width: 0 !important;
			cursor:default;
		}

			.csn-tree-file-item.disabled .csn-file-folder-icon-name-wrapper {
				cursor:default;
			}

			/* This is also used on folders as well. Places in the same relative level */
			.csn-tree .csn-file-folder-icon-name-wrapper {
				padding-top: 3px;
    				padding-left: 6px;

				cursor: pointer;
				border-radius: 3px;
			}

			.csn-tree .csn-file-folder-icon-name-wrapper:hover {
				background-color: var(--csn-transparent-black-0003);
			}

				.csn-tree .csn-file-icon {

					color: #666666;
					display: inline;
				}

				.csn-tree-file-name-text {

					color: #333333;
					margin-left: 0.5rem;
					display: inline;

				}

		/* 
		# Folder */
		.csn-tree-folder-item {
			margin-top: .25rem;

		}


		.csn-tree-folder-item .csn-file-folder-icon-name-wrapper.disabled {
			opacity: .25;
			cursor:default;
		}

			.csn-tree-folder-item.disabled .csn-file-folder-icon-name-wrapper {
				cursor:default;
			}

				.csn-tree .csn-folder-icon {

					color: #609bf9;
					display: inline;
					
				}

				.csn-tree-folder-name-text {
					color: #333333;
					margin-left: 0.5rem;
					display: inline;
				}


			/*
			## State modifiers - Defaults */

			/* Clicked on */
			.csn-tree-folder-item {
				

			}
				.csn-tree .csn-file-folder-icon-name-wrapper.node-active {
					border-style: solid;
					border-width: 1px;

					border-color: var(--csn-transparent-dodger-blue-0100);
					background-color: var(--csn-transparent-dodger-blue-0003);
				}

				/* Files and folders that are related to the file or folder that was clicked on. */
				.csn-tree .csn-file-folder-icon-name-wrapper.csn-file-folder-item-related-to-clicked-on {
					border-style: solid;
					border-width: 1px;

					border-color: var(--csn-transparent-dodger-blue-0030);
				}


					.csn-tree .csn-folder-icon {

						
						
					}

					.csn-tree-folder-name-text {
						
					}








/* 
# Risk level modifiers */
	
	/* Critical */
	.csn-tree .csn-file-folder-icon-name-wrapper.rr-1 .csn-tree-file-name-text {
		color: var(--csn-transparent-monza-0100);
	}

	.csn-tree .csn-file-folder-icon-name-wrapper.node-active.rr-1 {
		border-color: var(--csn-transparent-monza-0100);

		background-color: var(--csn-transparent-monza-0003);
	}

	.csn-tree .csn-file-folder-icon-name-wrapper.csn-file-folder-item-related-to-clicked-on.rr-1 {
		border-color: var(--csn-transparent-monza-0030);
		
	}


	/* Potential */
	.csn-tree .csn-file-folder-icon-name-wrapper.rr-2 .csn-tree-file-name-text {
		color: var(--csn-transparent-flush-orange-0100);
	}

	.csn-tree .csn-file-folder-icon-name-wrapper.node-active.rr-2 {
		border-color: var(--csn-transparent-flush-orange-0100);
		background-color: var(--csn-transparent-flush-orange-0003);
	}

	.csn-tree .csn-file-folder-icon-name-wrapper.csn-file-folder-item-related-to-clicked-on.rr-2 {
		border-color: var(--csn-transparent-flush-orange-0030);
	}


	/* Low Risk */
	.csn-tree .csn-file-folder-icon-name-wrapper.rr-3 .csn-tree-file-name-text {
		color: var(--csn-transparent-supernova-0100);
	}

	.csn-tree .csn-file-folder-icon-name-wrapper.node-active.rr-3 {
		border-color: var(--csn-transparent-supernova-0100);
		background-color: var(--csn-transparent-supernova-0003);
	}

	.csn-tree .csn-file-folder-icon-name-wrapper.csn-file-folder-item-related-to-clicked-on.rr-3 {
		border-color: var(--csn-transparent-supernova-0030);
	}


	/* Topic and Semantic */
	.rm-ai .csn-tree .csn-file-folder-icon-name-wrapper.rr-2 .csn-tree-file-name-text {
		color: var(--csn-transparent-electric-violet-0100);
	}

	.rm-ai .csn-tree .csn-file-folder-icon-name-wrapper.node-active.rr-2 {
		border-color: var(--csn-transparent-electric-violet-0100);
		background-color: var(--csn-transparent-electric-violet-0003);
	}

	.rm-ai .csn-tree .csn-file-folder-icon-name-wrapper.csn-file-folder-item-related-to-clicked-on.rr-2 {
		border-color: var(--csn-transparent-electric-violet-0030);
	}

	
/* 
# File and folder icons done via ::before - Good when you can't control the creation of the html. */

.csn-file-icon--before:before {
	content: "";
	display: inline-block;
	width: 16px;
	height: 16px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='currentColor' color='%23666666' aria-label='File' aria-hidden='true' height='16' viewBox='0 0 16 16' version='1.1' width='16' data-view-component='true' style='vertical-align: baseline;'%3E%3Cpath d='M2 1.75C2 .784 2.784 0 3.75 0h6.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16h-9.5A1.75 1.75 0 0 1 2 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h9.5a.25.25 0 0 0 .25-.25V6h-2.75A1.75 1.75 0 0 1 9 4.25V1.5Zm6.75.062V4.25c0 .138.112.25.25.25h2.688l-.011-.013-2.914-2.914-.013-.011Z'%3E%3C/path%3E%3C/svg%3E");
	background-repeat: no-repeat;
	position: relative;
	left: -12px;
	top: 1px;
	color: #666666;
}

.csn-folder-icon--before {
	color: #609bf9;
}
.csn-folder-icon--before:before {
	content: "";
	display: inline-block;
	width: 16px;
	height: 16px;

	/* <svg aria-hidden="true" focusable="false" role="img" class="octicon octicon-file-directory-fill" viewBox="0 0 16 16" width="16" height="16" fill="currentColor" style="vertical-align: baseline;"><path d="M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z"></path></svg> */
	
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' aria-hidden='true' color='%23609bf9' focusable='false' role='img' class='octicon octicon-file-directory-fill' viewBox='0 0 16 16' width='16' height='16' fill='currentColor' style='vertical-align: baseline;'%3E%3Cpath d='M1.75 1A1.75 1.75 0 0 0 0 2.75v10.5C0 14.216.784 15 1.75 15h12.5A1.75 1.75 0 0 0 16 13.25v-8.5A1.75 1.75 0 0 0 14.25 3H7.5a.25.25 0 0 1-.2-.1l-.9-1.2C6.07 1.26 5.55 1 5 1H1.75Z'%3E%3C/path%3E%3C/svg%3E");
	background-repeat: no-repeat;
	position: relative;
	left: -12px;
	top: 1px;
	
}