:root{
	--color-0: 			rgba( 25, 40, 44, 1);
	--color-1: 			#666;
    --color-2:			white;
	--color-3: 			rgba( 45,109,130, 1);
	--color-4: 			rgba( 16,143,185, 1);
	--bg-color:			#7A8184;
	--bg-color-2:		#7A8184;
	--bg-light-color:	rgba( 48, 61, 65, 1);
	--bg-dark-color:	rgba( 24, 31, 33, 1);
	--bg-hover-color:	var(--color-2);
	--font-color-3:		#ae141b;
	--font-color-2:		#aaa;
	--font-color:		white;
	--border-color:		black;
	--measurement-detail-node-bg-light:		var(--color-1);
	--measurement-detail-node-bg-dark:		var(--color-2);
	--measurement-detail-area-bg-color:		#eee;
}

#potree_sidebar_container a {
	color: var(--font-color);
}

#potree_languages {
	color: var(--font-color);
}

#sidebar_header {
	height: 100px;
	background-color:#982d32;
	box-shadow: #6b1f23 2px 2px 2px 2px;
}

.ui-state-default {
	background-color: var(--color-2) !important;
	color: var(--font-color-2) !important;
}

.ui-state-active {
	color: var(--font-color-3) !important;
}

.accordion {
	background: var(--bg-color-2) !important;
}

.accordion > h3 {
	background-color: white !important;
	color: #ae141b;
	text-shadow: none;
	border: 1px solid #ccc;
	margin-top: 1px;
}

.button-icon
{
	background-color: #383838;
	/*padding: 5px;*/
	margin: 0 5px 0 0;
	border-radius: 5px;
	width: 32px !important;
	height: 32px !important;
	cursor: pointer;
}
.button-icon:hover
{
	background-color: #982d32;
}

.inputfile {
	width: 0.1px;
	height: 0.1px;
	opacity: 0;
	overflow: hidden;
	position: absolute;
	z-index: -1;
}

.inputfile + label {
    /*
	font-size: 1.25em;
    font-weight: 700;
    color: var(--font-color-3);
    background-color: white;
	padding: 2px 10px 2px 10px;
	box-shadow: black 1px 1px 1px 1px;
    */
	display: inline-block;
	cursor: pointer;
}

.small-icon {
	width: 14px !important;
	height: 14px !important;
	padding: 4px;
}

.medium-icon {
	width: 20px !important;
	height: 20px !important;
	padding: 6px;
}

.name_change_table {
	width:100%;
	padding-left:15px;
}

.commandLabel {
	text-align: center;
	width:49%;
	display: inline-block;
	margin: 0px;
}

.commandLabel:hover {
    color: #982d32 !important;
}

.copy-icon {
	width: 25px !important;
	height: 25px !important;
}

.sidebar_banner {
	height: 100px;
	width: 300px;
	position: absolute;
	right: -300px;
	background-color: var(--bg-color);
	z-index: -1;
	box-shadow: black 0px 2px 2px 0px;
}

#potree_description {
	color: white;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	letter-spacing: 2px;
}

/* Quickbar */
#quickbar {
	position: absolute;
	bottom: 10px;
	right: 10px;
	z-index: 1;
	display: flex;
	flex-direction: column;
	row-gap: 16px;
}

.quickbar-buttons-container {
	display: flex;
	align-items: end;
	column-gap: 30px;
}

#move_speed_container_quickbar {
	font-family: sans-serif;
	color: #ddd;
	font-size: 0.8em;
	padding: 4px;
}

#sldMoveSpeedQuickbar .ui-slider-handle { cursor: pointer !important; }

.toolbar-links, .navigation-links {
	display: inline-block;
}

#quickbar .toolbar-links .button-icon:hover {
	background-color: #383838;
}

#config_presets_action {
	display: flex;
	gap: 8px;

	& > input {
		flex: 1;
	}
}

#config_presets_list {
	padding-top: 4px;
}

.config_preset_item {
	padding: 4px 0;
	cursor: pointer;
}

/* Slider UI */

.slider-ui {
	position: absolute;
	bottom: 10px;
	left: 10px;
	display: flex;
	flex-wrap: wrap;
	max-width: 320px;
	column-gap: 20px;
	row-gap: 16px;
	z-index: 1;
}

.slider-container {
	display: flex;
	position: relative;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	padding: 12px;
}

.flex-strech {
	flex: 1;
}

.vertical {
	flex-direction: column;
	padding: 12px 8px;
	width: fit-content;
}

.slider-ui-button-container {
	display: flex;
	align-items: center;
	padding: 12px;
	align-self: end;
	column-gap: 18px;
	height: fit-content;
	justify-content: space-between;
}

.slider-ui-buttons {
	display: flex;
	flex-flow: row nowrap;
	gap: 8px;
}

.slider-ui-button {
}

.slider-lock-button {
	padding: 0;
	display: flex;
}

.slider-lock-button-vertical {
	margin-bottom: 6px;
}

.slider-lock-button-horizontal {
	margin-left: 6px;
}

.slider-ui-button > .button-icon, .slider-lock-button > .button-icon {
	margin: 0 !important;
}

.slider-ui-button > .button-icon:hover, .slider-lock-button > .button-icon:hover {
	background-color: #383838;
}

.slider-lock-button-active > .button-icon {
	background-color: #982d32;
}

.slider-lock-button-active > .button-icon:hover {
	background-color: #982d32;
}

.slider-ui-checkbox {
	display: flex;
	flex-direction: column;
	color: white;
}

.slider-ui-background {
	border-radius: 5px;
	background-color: #38383875;
}

.slider-ui-label {
	font-family: sans-serif;
	color: #ddd;
	font-size: 0.8em;
	min-width: 40px;
	text-align: center;
}

#slider-visibility-toggle {
	position: absolute;
	bottom: 10px;
	left: 10px;
	z-index: 1;
	display: none;
}

.coordinates_table_container table td {
	font-size: 0.9em;
	overflow:hidden;
	max-width: 25px;
}

#sldHeight {
	background-color: #383838 !important;
	z-index: 10;
	height: 200px;
}

#sldLength, #sldWidth {
	background-color: #383838 !important;
	z-index: 10;
	width: 200px;
}

.slider-container .ui-slider-handle { background: #982d32 !important; cursor: pointer !important; }
.slider-container .ui-slider { margin: 0 !important;}
.slider-handle-value {
	display: flex;
	justify-content: center;
	position: absolute;
	left: 40px;
	top: -4px;
	width: 60px;
	padding: 4px;
}

.slider-handle-value span {
	font-family: sans-serif;
	color: #ddd;
	font-size: 0.8em;
}

/*Utils*/
.cursor-pointer {
	cursor: pointer;
}