/* ---------------------------------------------------------------------- */
/* --- POTREE STYLING OVERHAUL: MODERN, DARK, AND HIGH-CONTRAST THEME --- */
/* ---------------------------------------------------------------------- */

/* Redefinition of the color palette for a modern, high-contrast dark theme */
:root{
	/* Original Palette Base */
	--color-base-dark: 		#1E2830; 	/* Main Background Darker */
	--color-base-light: 	#283540; 	/* Panel Background */
	--color-secondary: 		#3D4A57; 	/* Hover/Sub-Panel Background */
	
	/* New Accent Color (Vibrant Cyan) */
	--color-accent: 		#00BFFF; 	/* Deep Sky Blue for highlights/actions */
	--color-accent-hover: 	#33CFFF;
	
	/* Backgrounds */
	--bg-color:				var(--color-base-dark);
	--bg-panel:				var(--color-base-light);
	--bg-dark-color:		#151C22; 	/* Ultra Dark for Headings */
	--bg-hover-color:		var(--color-secondary);
	
	/* Fonts */
	--font-family-base:		'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
	--font-color-primary:	#E0E0E0;
	--font-color-secondary:	#B0B0B0;
	
	/* Borders & Shadows */
	--border-color:			rgba(255, 255, 255, 0.1); /* Subtle white border */
	--shadow-lift:			0 8px 16px rgba(0, 0, 0, 0.4); /* Floating effect */
	--shadow-subtle:		0 2px 4px rgba(0, 0, 0, 0.2);
	
	/* Measurement Details - Updated to use new palette */
	--measurement-detail-node-bg-light:		var(--color-secondary);
	--measurement-detail-node-bg-dark:		var(--color-base-light);
	--measurement-detail-area-bg-color:		rgba(0, 191, 255, 0.1); /* Light accent background */
}

/* Base Body and Main Container */
body{ 
	margin: 	0; 
	padding: 	0;
	position:	absolute;
	width: 		100%;
	height: 	100%;
	overflow:	hidden;
	font-family: var(--font-family-base);
}

#potree_sidebar_container{
	position:	absolute;
	z-index:	100; /* Increased z-index for sidebar */
	width:		350px;
	height:		100%;
	overflow-y:	auto;
	font-size:	90%;
	border-right:	none; /* Remove harsh border */
	box-shadow: var(--shadow-lift); /* Add modern shadow */
	background-color:	var(--bg-color);
}

#sidebar_root{
	color:				var(--font-color-primary);
	font-family:		var(--font-family-base);
	font-size:			1em;
	padding: 10px; /* Add some overall padding */
}

/* Links and Interactivity */
#potree_sidebar_container a{
	color: 			var(--color-accent); /* Use accent color for links */
	transition: color 0.2s ease-in-out;
}

a:hover, a:visited, a:link, a:active{
	color: 				var(--color-accent-hover);
	text-decoration: 	none;
}

/* Panel Styling (Core UI Component) */
.potree-panel {
	border: 		1px solid var(--border-color); /* Subtle border */
	border-radius: 	0.6rem; /* More rounded corners */
	margin-bottom: 12px;
	padding: 		0;
	background-color: var(--bg-panel);
	box-shadow: var(--shadow-subtle);
	overflow: hidden;
}

.potree-panel-heading{
	background-color: var(--bg-dark-color);
	color: var(--font-color-primary);
	font-weight: 600;
	padding: 8px 15px;
	border-bottom: 1px solid var(--border-color);
}

/* Messaging */
.potree_message{
	width: 500px;
	background-color: var(--bg-panel);
	padding: 10px;
	margin: 8px;
	border-radius: 8px;
	color: var(--font-color-primary);
	font-family: var(--font-family-base);
	opacity: 0.95;
	border: none;
	box-shadow: var(--shadow-subtle);
	display: flex;
	overflow: auto;
	backdrop-filter: blur(5px); /* Add a subtle blur effect */
	background-color: rgba(40, 53, 64, 0.9);
}

.potree_message_error{
	background-color: #E53E3E; /* Red for errors */
	color: white;
	font-weight: bold;
}

/* Potree Render Area */
#potree_render_area{
	position: 	absolute;
	top: 		0px;
	bottom: 	0px;
	left: 		0px;
	right: 		0px;
	overflow: 	hidden;
	z-index: 	1;
	/* Smooth transition for sidebar open/close */
	-webkit-transition: left .5s cubic-bezier(0.25, 0.46, 0.45, 0.94); 
	transition: left .5s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* Quick Buttons and Toggles */
.potree_menu_toggle, #potree_map_toggle{
	float:			left;
	background:		var(--bg-panel);
	border: 1px solid var(--border-color);
	border-radius: 50%;
	width:			3em;
	height:			3em;
	z-index:		10001;
	cursor: 		pointer;
	margin:			8px;
	box-shadow: var(--shadow-subtle);
	transition: background-color 0.2s, transform 0.2s;
}

.potree_menu_toggle:hover, #potree_map_toggle:hover{
	background-color: var(--bg-hover-color);
	transform: scale(1.05);
}

.icon-bar{
	height: 3px !important;
	border: none;
	background-color: var(--font-color-primary);
	border-radius: 1.5px;
	margin: 5px 0;
	transition: background-color 0.2s;
}

/* Accordion Styling (jQuery UI Overrides) */
.accordion > h3{
	background-color: var(--bg-dark-color) !important;
	background: none;
	border:		none; /* Remove inner border */
	border-radius: 0.5rem;
	color:		var(--font-color-primary);
	cursor:		pointer;
	margin:		4px 0 4px 0;
	padding:	8px 15px 8px 15px;
	box-shadow:	var(--shadow-subtle);
	text-shadow:	none;
	font-size:	1em;
	font-weight: 600;
	transition: background-color 0.2s, filter 0.2s;
}

.accordion > h3:hover{
	background-color: var(--color-secondary) !important;
	filter: none;
}

.accordion-content{
	padding: 8px 15px !important;
	border: none !important;
}

/* Slider Overrides (jQuery UI) */
.ui-slider {
	margin-top: 8px;
	margin-bottom: 12px;
	background-color: 	var(--border-color) !important; /* Track background */
	border: 			none;
	border-radius: 		5px;
	height: 6px;
}

.ui-slider-range{
	background: var(--color-accent) !important; /* Range color */
}

.ui-slider-handle{
	border: 			2px solid var(--bg-panel) !important;
	background: 		var(--color-accent) !important; /* Handle color */
	border-radius: 		50% !important;
	width: 				16px !important;
	height: 			16px !important;
	top: 				-5px !important;
	margin-left: 		-8px !important;
	box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
	transition: background-color 0.2s;
}

.ui-slider-handle:hover{
	background: var(--color-accent-hover) !important;
}


/* JSTree Overrides */
.jstree-default .jstree-clicked{
	background-color: var(--color-secondary) !important; /* Selected item */
	box-shadow: inset 3px 0 0 var(--color-accent); /* Accent bar on the left */
	color: var(--font-color-primary) !important;
}

.jstree-default .jstree-hovered{
	background-color: var(--color-secondary) !important;
	border-radius: 4px;
}

.jstree-anchor{
	width: 100% !important;
	padding: 4px 5px !important;
	transition: background-color 0.1s;
}

/* Input Fields and Buttons */
.ui-spinner-input, .input-grid-cell > input{
	color: var(--color-base-dark);
	background-color: #FAFAFA;
	border: 1px solid var(--border-color);
	border-radius: 4px;
	padding: 4px 8px;
}

.ui-state-default{
	background: var(--bg-panel) !important;
	border: 1px solid var(--border-color);
	color: var(--font-color-primary);
	border-radius: 4px;
	padding: 6px 10px;
	transition: background-color 0.2s;
}

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

.ui-state-active{
	background: var(--color-accent) !important;
	color: var(--bg-dark-color) !important;
	font-weight: bold;
}

/* Text Icons */
.text-icon{
	opacity:	0.7;
	height:		24px;
	transition: opacity 0.2s, filter 0.2s;
}

.text-icon:hover{
	opacity:	1.0;
	filter: drop-shadow(0 0 3px var(--color-accent));
}

/* Scrollbar Styling for Webkit (Chrome, Safari) */
::-webkit-scrollbar {
	width: 8px;
	background-color: var(--bg-color);
}

::-webkit-scrollbar-track {
	background-color: var(--bg-color);
}

::-webkit-scrollbar-thumb {
	background-color: var(--color-secondary);
	border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
	background-color: var(--color-accent);
}

/* Annotations - Make them pop more */
.annotation-titlebar{
	background-color:	var(--color-accent);
	color:			var(--bg-dark-color);
	border-radius:	1em;
	border:			2px solid rgba(255, 255, 255, 0.9);
	font-weight:	700;
	padding:		2px 12px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5);
	transition: transform 0.2s;
}

.annotation-titlebar:hover{
	transform: scale(1.1);
}

.annotation-icon{
	filter:		none; /* Remove invert filter */
	opacity:	0.9;
	margin:		2px 2px;
}
/* Ensure profile window follows the new dark theme */
#profile_window{
	background-color:	var(--bg-panel);
	border-radius: 0.6em;
	box-shadow: var(--shadow-lift);
}

#profile_titlebar{
	background-color:	var(--bg-dark-color);
	color: var(--font-color-primary);
	text-shadow: none;
	font-weight: 700;
	border-top-left-radius: 0.6em;
	border-top-right-radius: 0.6em;
}

.profile-button:hover{
	background-color: var(--color-accent-hover);
}

/* Remove original color definitions that are now in :root */
.color-primary-0, .color-primary-1, .color-primary-2, .color-primary-3, .color-primary-4,
.rgba-primary-0, .rgba-primary-1, .rgba-primary-2, .rgba-primary-3, .rgba-primary-4 {
	/* These classes are retained but their color is now primarily defined by the general theme */
	color: inherit;
}