

:root {
	color-scheme: light dark;
	--highlight-bg-color: #dadadb;
	--match-text-color: #fbfd88;
	--sidebar-bg-color: color(display-p3 0.933 0.933 0.933);
	--note-border-color: green;
	--path-color: #585858;
	--subnav-header-background: color(display-p3 0.116 0.321 0.471);
}

/* Below are dark mode variables. */
@media (prefers-color-scheme: dark) {
	:root {
		--highlight-bg-color: #555555;
		--match-text-color: #636702;
		--sidebar-bg-color: color(display-p3 0.264 0.26 0.26);
		--note-border-color: #007611;
		--path-color: #aaa7a7;
		--subnav-header-background: color(display-p3 0.063 0.19 0.283);
	}
}

* {
	margin: 0;
	padding: 0;
}

body {
	
	line-height: 150%;
	height: 100%;
	display: flex;
    flex-direction: column;
	min-height: 100vh; /* This is the important line */
}


main {
  background: var(--containerfluid-bg-color);
  color: var(--body-text-color);
  display: flex;
  flex: 1;
}


aside {
  width: 260px;
  min-width: 260px;
  background-color: var(--sidebar-bg-color);
  padding: 10px;
  order: 1; /* Move the aside to the left */
  height: 100vh; /* Full viewport height to cover the scrolling area */
  overflow: auto; /* Enable scrolling within the aside if content overflows */
  height: 100%;
  z-index: 10; /* Ensure it appears above other elements if necessary */
}

/* Style for nested lists */
.toc-list ul {
	display: none; /* Initially hide nested lists */
}

.toc-list {
  list-style-type: none; /* Remove default list-style-type (bullets) */
  /* padding-left: 8px; */
  transition: background 0.3s; /* Add a transition for a smoother effect */
  list-style: none;
}



/* Style for the line break (spacer) */
.toc-list.spacer {
	margin-top: 10px;
}

/* Style for selected items */
.toc-list.selected {
	font-weight: bold;
}

.toc-list.no-children {
	padding-left: 14px;
}

.toc-list.child {
	padding-left: 24px;
}

/* Style for the disclosure triangle (chevron) */
.disclosure-triangle {
	display: inline-block;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 6px 8px 6px 0;
	border-color: transparent darkgray transparent transparent;
	margin-right: 5px;
	transition: transform 0.3s ease; /* Add smooth transition */
	cursor: pointer;
}

/* Styles for the closed and open states of the disclosure triangle */
.disclosure-triangle.closed {
	transform: rotate(180deg);
}

.disclosure-triangle.open {
	transform: rotate(270deg);
}

/* Style for item title */
.item-title {
	/* Add your styles for item title */
	margin: 0; /* Reset margin to ensure alignment */
}

.selected {
	background-color: var(--highlight-bg-color);
	border-radius: 5px; /* Add rounded corners */
}

.match {
	background-color: var(--match-text-color);
}

.documentation-subnav-header {
	
	position: absolute;
	top: 0; /* Pin to the top of the parent */
	left: 0; /* Align to the left side of the parent */
	width: 100%;
	
	height: 44px;
	background: var(--igg-dark-blue);
}

.documentation-subnav-header h3 {
	color: #eee;
	font-weight: 200;
	font-size: large;
	position: absolute;
	padding-bottom: 10px;
	margin-left: 40px;
	margin-top: 13px;
}

/* Hamburger Button Style */
.sidebar-button {
	/* display: none; //Hidden by default, shown in media query */
	background-color: transparent !important; /* Force no background */
	border: none;  /* Remove borders */
	color: #fff; /* Set the color of the hamburger icon */
	font-size: 24px; /* Increase the size of the icon */
	position: absolute;
	/* padding: 10px; /* Add some space around the icon */ */
	cursor: pointer; /* Change mouse cursor on hover */
	outline: none;  /* Remove focus outline */
	box-shadow: none; /* Remove any box-shadow */
	margin-top: 10px;
	margin-left: 10px;
	
}

article {
  position: relative;
  flex: 1;
  padding: 20px;
  padding-top: 80px;
  order: 2;
  
}



/* body header {
	height: 100px;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	background: #324234;
	box-shadow: 0px 1px 5px rgba(0,0,0,0.25);
	z-index: 200;
	-webkit-transition: left 0.3s;
} */

header h1 {
	font-size: 46px;
	color: #fff;
	text-shadow: 0px -1px 2px rgba(0,0,0,0.25);
	text-align: center;
	margin: 20px 0 0 0;
	padding: 0;
}

header h2 {
	font-size: 20px;
	color: #fff;
	text-align: center;
	margin: 26px 0 0 0;
	padding: 0;
}

/* header nav {
	position: fixed;
	bottom: 0;
	left: -160px;
	width: 160px;
	height: 100%;
	background: #324234;
	box-shadow: 1px 0px 5px rgba(0,0,0,0.25);
	-webkit-transition: left 0.3s;
} */

/* header nav img {
	zoom: 50%;
	z-index: 300;
} */

#toc_contents {
	overflow-y: auto;
	margin-bottom: 20px;
	z-index: 100;
}

#toggle_toc {
	position: absolute;
	top: 54px;
	left: 172px;
	font-family: "Raleway", sans-serif;
	font-size: 22px;
	font-weight: bold;
	text-decoration: none;
	color: #fff;
	text-shadow: 0px -1px 2px rgba(0,0,0,0.25);
	cursor: pointer;
}

#toggle_toc:before { content: ">" }

/* body.nav_visible header { left: 80px }
body.nav_visible header nav { left: 0 }
body.nav_visible article { margin-left: 180px }
body.nav_visible #toggle_toc:before { content: "<" } */



p {
	padding: 5px 0;
	margin: 10px 0;
}

/* a {
	color: #007611;
	text-decoration: underline;
} */

article img {
	display: inline;
	zoom: 50%;
	vertical-align: middle;
}

article img.left {
	display: block;
	vertical-align: baseline;
	zoom: 50%;
	float: left;
	clear: left;
	padding: 5px 5px 5px 0;
	margin-right: 25px;
}

article img.right {
	display: block;
	vertical-align: baseline;
	zoom: 50%;
	float: right;
	clear: right;
	padding: 5px 0 5px 5px;
	margin-left: 25px;
}

article img.full-width {
	display: block;
	vertical-align: baseline;
	zoom: normal;
	width: 100%;
	max-width: 900px;
}

article img.med-width {
	display: block;
	vertical-align: baseline;
	zoom: normal;
	width: 50%;
	max-width: 900px;
}

article h1 {
	padding-bottom: 20px;
	padding-top: 20px;
	font-size: 3rem;
}

article h2 {
	padding-bottom: 20px;
	padding-top: 20px;
	font-size: 2.25rem;
}

/* article h3 {
	padding-bottom: 20px;
	padding-top: 20px;
} */


dt {
	/* color: #333; */
	font-weight: bold;
	font-size: 14px;
	padding: 5px;
	margin: 5px 0;
}

dd {
	font-size: 14px;
	padding: 5px;
	margin: 10px 0 10px 15px;
}

ul {
	/* list-style-image: url('images/bullet.gif'); */
	padding-left: 20px;
	
}

ol { 
	margin-left: 20px;
	padding-left: 0px;
 }

li>p { 
	padding: 0;
}

.no-bullets {
	list-style-type: none; /* Removes bullets */
	margin: 0; /* Optional: Adjusts default margin */
	
}

.small, body.splash .small {
	font-size: 10px;
	font-weight: normal;
	color: gray;
}

.green {
	color: #339900;
	font-weight: bold;
}

.lightgreen {
	color: #90cc70;
	font-weight: bold;
}

.red {
	color: #FF0000;
	font-weight: bold;
}

.yellow {
	color: #fbc200;
	font-weight: bold;
}

.orange {
	color: #ff8500;
	font-weight: bold;
}

.blue {
	color: #3f54e2;
	font-weight: bold;
}

.gray {
	font-weight: bold;
	color: #666666;
}

.path {
	font-family: Courier, monospace;
	font-style: italic;
	font-weight: normal;
	font-size: 108%;
	color: var(--path-color);
	padding-right: 2px;
}

.note {
	display: block;
	background: var(--containerfluid-bg-color) url('images/tip.gif') no-repeat 7px center;
	background-size: 64px;
	font-size: 13px;
	font-style: italic;
	line-height: 18px;
	padding: 7px 7px 7px 78px;
	min-height: 32px;
	border-top: 2px solid var(--note-border-color);
	border-bottom: 2px solid var(--note-border-color);
	clear: both;
}

table {
	margin: 0;
	padding: 0;
}

table p { line-height: 150%; }


/* Table of Contents */

#toc_contents ul { list-style-image: none; }

#toc_contents ul a {
	text-decoration: none;
	color: #fff;
}

#toc_contents ul li:hover>a, #toc_contents ul li.selected>a {
	font-weight: bold;
}

#toc_contents ul, #toc_contents ul li {
	list-style-type: none;
	list-style-image: none; 
	padding: 0;
	margin: 0 10px 2px 10px;
	line-height: normal;
}


#toc_contents ul li ul, #toc_contents ul li ul li {
	list-style-type: disc;
	list-style-image: none; 
	padding: 0;
	margin: 0 0 2px 8px;
	font-size: 12px;
	color: #fff;
	line-height: normal;
}

#toc_contents ul li ul {
	margin-top: 3px;
	margin-bottom: 3px;
}

#toc_contents ul li img { padding-right: 4px }
#toc_contents ul li ul { display: none }
#toc_contents ul li.selected ul { display: block }

/* New Features Page */

#new_features {
	list-style: none;
	padding: 0;
}

#new_features li {
	min-height: 42px;
	margin-bottom: 18px;
}

#new_features li img {
	position: absolute;
	height: 32px;
	width: 32px;
	padding-top: 2px;
	margin: 0;
}

#new_features li p {
	margin-left: 47px;
}

@media screen and (max-width: 768px) {
	/* Hamburger button shown */
	.sidebar-button {
		display: block;
	}

	/* Sidebar hidden */
	#table-of-contents {
		display: none; /* hidden by default */
		/* additional responsive styling */
	}
}

@media screen and (max-width:768px) {
			 /*allowing med-width images to be full width on iOS */
		  article img.med-width {
			 width: 100%;
	   }
}

@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; }
  body header { display: none }
  article { position: relative; padding: 0; height: 100% !important; }
  a, a:visited { text-decoration: underline; }
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; }
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
  .note { padding: 7px; border-top: 2px solid #999; border-bottom: 2px solid #999; }
}