/* 
height of items: 							40 px			DENIED:  	Cognitively inefficiency for application
all icons size: 							24 px			DENIED:		Cognitively inefficiency for application
font: Lato Regular, size: 					14px			DONE

item CLOSED state:
- Icon color:  								015C7D			DONE		-- a darkish blue
- text color:  								B3BCBD			DONE		-- a bit gray

item OPENED state:
- Icon color:  								0FB5E8			DONE		-- a lighter blue
- text color:  								E3E4E5			DONE		-- near white
- item frame BG COLOR: 						23282E			DONE		-- except on top level folders
- item frame border rounding radius: 		4px				DONE

item HOVER state:
- Icon color:  								0FB5E8
- text color:  								0FB5E8
- item frame BG COLOR: 						23282E
- item frame border rounding radius: 		4px



Side menu bg gradient color: 				111F25 to 0E1010

Search field:
height: 									44 px
search icon size: 							24x24 px
font: Lato Regular, size: 					14px
frame border rounding radius: 				4px
field frame border(stroke) color: 			292F36, size:1px
 */



:root{
	--content_width:			1000px;				/* 1300 for PlaneMaker */
	--content-padding-left:		100px;				/* 50 for PlaneMaker */
	--content_padding-right:	100px;				/* 50 for PlaneMaker */
	--nav_text_color:  			#B1B3B3;
	--nav_column_width: 		230px;
	--top_bar_height: 			80px;
	--laminar_blue:				rgba(82.4, 180.6, 231.8, 1);
	--laminar_gray:				#B1B3B3;
	--lato_font_height:			14px;
	--md_hdg_toc_height:		12px;
	--glyph_icon_size:			20px;
	--closed_text_color:		#B3BCBD;
	--closed_icon_color:		#015C7D;
	--open_text_color:			#E3E4E5;
	--open_icon_color:			#0FB5E8;
	--item_bg_color:			#5A6274;
	--selected_bg_color:		#494B57;
}

html{
	scroll-behavior: smooth;
}


body {
	background: linear-gradient(to bottom, #192A39, #060D10);
    background-attachment: fixed; /* Ensure the gradient stays fixed when scrolling */
    min-height: 100vh; /* Ensure the body always covers at least the viewport height */
}


@font-face {
  font-family: "Lato";
  src: url('../fonts/Lato-Regular.ttf');
}

@font-face {
    font-family: 'Glyphicons Halflings';
    src: url('../fonts/glyphicons-halflings-regular.eot');
    src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'),
         url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'),
         url('../fonts/glyphicons-halflings-regular.woff') format('woff'),
         url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'),
         url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/* 
NOTE:  For FontAwesome, the base Windmill theme have CSS files for that already and that
will be included in the mkdocs build, so no need to define @font-face here.
 */

/* =====================================================================================================================
												TOP NAV BAR
======================================================================================================================*/

.navbar {
  background-color: black;
  box-shadow: 0 4px 5px rgba(0,0,0,.24), 0 3px 8px rgba(0,0,0,.05);
  border-bottom: 1px solid gray;
  border-radius: 0px;
  margin-bottom: 0px;
  height: var(--top_bar_height);
  z-index: 2;
}

.wm-top-page {
  overflow: hidden;
}


.wm-page-content {
  background: white;
  width: var(--content_width);
  max-width: 1100px;				/* var(--content_width);  for PlaneMaker */
  position: relative;
  float: left;
  padding-left:  var(--content-padding-left);
  padding-right: var(--content_padding-right);
}

.wm-page-top-frame { display: none; }
.wm-top-page > .wm-page-top-frame { display: block; }
.wm-top-page > .wm-page-content { display: none; }

.wm-top-brand {
  display: inline-block;
  float: left;
  overflow: visible;
  width: 0px;
  height: 50px;
  color: #fff;
  font-size: 18px;
  white-space: nowrap;
  text-decoration: none;
}

.wm-top-link, .wm-top-link:hover, .wm-top-link:active, .wm-top-link:visited, .wm-top-link:focus {
  color: #fff;
  text-decoration: none;
}

.wm-vcenter:before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-left: -0.25em;
}

.wm-vcentered {
  display: inline-block;
  vertical-align: middle;
}

.wm-top-logo {
	position: absolute;
	margin: 0px 15px;
	left: 25px;
	top: 20px;
	vertical-align: middle;
	width: 160px;
  	max-height: 100%;
}

.wm-top-title {
  font-family: Lato;
  font-size: 1.2em;
  position: absolute;
  left: 250px;
  display: inline-block;
  line-height: 25px;;
  color: var(--laminar_blue);
}


.wm-top-version {
  border: 1px solid #ddd;
  border-radius: 5px;
  padding: 2px 8px;
  color: #ddd;
  font-size: 8pt;
  white-space: pre;
}

.pull-right {
	float: left!important;
}

.wm-top-tool {
  position: relative;
  left: 400px;
  height: 44px;
  white-space: nowrap;
  margin-left: 20px;
}

.wm-top-tool-expanded {
  position: absolute;
  right: 0px;
  padding: inherit;
  width: 100%;
  background-color: #546e7a;
}

.wm-top-search {
  width: 300px;
}

#wm-toc-button {
  margin-right: 1rem;
  margin-left: 0.5rem;
}

/* =====================================================================================================================
												SIDE NAV TOC
======================================================================================================================*/



.wm-toc-pane {
  font-family: Lato;
  position: absolute;
  top: 0px;
  padding-top: calc(var(--top_bar_height) + 20px);
  height: 100%;
  min-width:	var(--nav_column_width);
  max-width: 300px;
  width: auto;
  z-index: 1;
  background: linear-gradient(to bottom, #192A39, #060D10);
  background-attachment: fixed; /* Ensure the gradient stays fixed when scrolling */
  min-height: 100vh; /* Ensure the body always covers at least the viewport height */
  border-right: 1px solid #e0e0e0;
  overflow: auto;
  margin-left: 4px;
  padding-left: 0px;
  padding-right: 1rem;
  padding-bottom: 2rem;
  transition: margin-left 0.3s;
}

/* 
.wm-page-toc.wm-toc-li-nested.collapse.in {
	border-radius: 10px;
	transition: width 0.3s, height 0.1s;
	width: 300px;
}

.wm-page-toc.wm-toc-li-nested.collapsing {
	border-radius: 10px;
	width: 200px;
	transition: width 0.1s;
}
 */

.wm-content-pane {
  position: absolute;
  top: 0px;
  padding-top: var(--top_bar_height);
  height: 100%;
  width: 100%;
  z-index: 0;
  padding-left: var(--nav_column_width);
  transition: padding-left 0.3s;
  /* required for iPhone to scroll the contained iframe */
  -webkit-overflow-scrolling: touch;
}

.wm-toc-pane.wm-toc-dropdown {
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  margin-left: 0;
  height: auto;
  box-shadow: 2px 3px 4px 0 grey;
}

/*----------------------------------------------------------------------------------------------------------------------
--												FIRST LEVEL PROPERTIES
----------------------------------------------------------------------------------------------------------------------*/
/* CLOSED FOLDER icon */
.wm-toc-opener > .wm-toc-text::before {
  font-family:  'FontAwesome';
  color: #015C7D;
  content: "\f105 \00a0 \f114 \FE0E";
  margin-right: 23px;
  display: inline-block;
  vertical-align: middle;
  font-size: var(--glyph_icon_size);
}

/* The Closed folder icon highlighting on hover */
.wm-toc-opener > .wm-toc-text:hover::before {
  font-family:  'FontAwesome';
  color: var(--open_icon_color);
  content: "\f105 \00a0 \f114 \FE0E";
  margin-right: 23px;
  display: inline-block;
  vertical-align: middle;
  font-size: var(--glyph_icon_size);
}

/* OPEN Folder Icon */
.wm-toc-opener.wm-toc-open > .wm-toc-text::before {
  font-size: 12px;
  color:  #0FB5E8;
  content: "\f107 \00a0 \f07c \FE0E";
  margin-right: 29px;
  margin-left: -5px;
  vertical-align: middle;
  font-size: var(--glyph_icon_size);
}

/* this is the Nav panel Default Text Color */
.wm-toc-text {
  display: block;
  cursor: pointer;
  font-size: var(--lato_font_height);
  color:	var(--closed_text_color);
  padding: 10px 0px;
}

.wm-toc-text:hover {
  display: block;
  cursor: pointer;
  font-size: var(--lato_font_height);
  color:	var(--open_text_color);
  padding: 10px 0px;
  margin-left: 1px

}


.wm-toc-repo {
  margin-top: -15px;
  margin-bottom: 5px;
  padding-bottom: 5px;
  border-bottom: 1px solid #e0e0e0;
}

.wm-toc-hidden > .wm-toc-pane {
  margin-left: -300px;
}

.wm-toc-hidden > .wm-content-pane {
  padding-left: 0px;
}

.wm-small-show {
  display: none;
}

#wm-search-form {
  width: 100%;
}
#wm-search-show {
  display: none;
}

@media (max-width: 600px) {
  .wm-small-hide {
    display: none;
  }
  .wm-small-show {
    display: block;
  }
  .wm-small-left {
    float: left !important;
  }
  #wm-search-show {
    display: block;
    margin-left: 1rem;
  }
  .wm-top-tool-expanded #wm-search-show {
    display: none;
  }
  .wm-top-search {
    display: none;
  }
  .wm-top-tool-expanded .wm-top-search {
    display: table;
    width: 100%;
    padding: 0px;
  }

  .wm-top-page {
    overflow: visible;
  }
  
  .wm-top-container {
    /* This prevents horizontal overflow, but cuts off search results on bigger
     * screens, so included in small-screen section */
    overflow-x: hidden;
  }
  
  .wm-toc-pane {
    display: none;
  }
  
  .wm-content-pane {
    padding-left: 0px;
    overflow: visible;
  }
}

/*----------------------------------------------------------------------------------------------------------------------
--												TOC TREE ENTRIES
----------------------------------------------------------------------------------------------------------------------*/
/* Global TOC settings.  may be overriden below */
.wm-toctree {
  list-style-type: none;
  line-height: 10px;
  padding-left: 0px;
}

.wm-toctree a, .wm-toctree a:visited, .wm-toctree a:hover, .wm-toctree a:focus {
  text-decoration: none;
  outline: none;
  color: var(--nav_text_color);
}


div.container-fluid.wm-top-container{
	margin-top: 15px;
}



/* this is the padding for the markdown document titles */
.wm-toc-lev1 > .wm-toc-text { padding-left: 10px; }
.wm-toc-lev2 > .wm-toc-text { padding-left: 25px; }
.wm-toc-lev3 > .wm-toc-text { padding-left: 40px; }
.wm-toc-lev4 > .wm-toc-text { padding-left: 55px; }
.wm-toc-lev5 > .wm-toc-text { padding-left: 70px; }
.wm-toc-lev6 > .wm-toc-text { padding-left: 85px; }


/* This is the padding for the markdown heading li */
.wm-toc-lev1 + .wm-page-toc { margin-left: 14px; }
.wm-toc-lev2 + .wm-page-toc { margin-left: 29px; }
.wm-toc-lev3 + .wm-page-toc { margin-left: 44px; }
.wm-toc-lev4 + .wm-page-toc { margin-left: 59px; }
.wm-toc-lev5 + .wm-page-toc { margin-left: 74px; }
.wm-toc-lev6 + .wm-page-toc { margin-left: 89px; }


/* symbol before markdown headings */
a.wm-article-link.wm-page-toc-text::before{
	content: "•";	
	margin-right: 8px;
}

/* no clue what this does */
.wm-toc-li-nested {
  padding: 0px;
  margin: 0px;
}


/* This is the color of the Text to the right of an 'active / open folder'*/
.wm-toc-opener.wm-toc-open > .wm-toc-text{
	color: var(--open_text_color);
/* 	background-color: var(--selected_bg_color); */
	border-radius: 4px;
}

/*----------------------------------------------------------------------------------------------------------------------
--												UNSELECTED MARKDOWN
----------------------------------------------------------------------------------------------------------------------*/
/* Document Icon */
a.wm-article-link.wm-toc-text::before{
	font-family: 'FontAwesome';
	content: "\f0f6 \FE0E";
	font-size: var(--glyph_icon_size);
	color: var(--closed_icon_color);
	margin-right: 12px;	
}


/*----------------------------------------------------------------------------------------------------------------------
--												SELECTED MARKDOWN FILES
----------------------------------------------------------------------------------------------------------------------*/
/* This is the document ICON style for the SELECTED markdown file  style*/
.wm-toc-li.wm-current a::before{
  font-family:  'FontAwesome';
  font-size: var(--glyph_icon_size);
  color: var(--open_icon_color);
  content: "\f0f6 \FE0E";
}



/* these are the markdown heading links in blue */
a.wm-article-link.wm-page-toc-text{
	color: var(--laminar_blue);
	font-size: var(--md_hdg_toc_height);
	padding: 5px  10px;
	margin-left: 10px;
	text-indent: -13px;
	line-height: 1.3em;
	margin-bottom: -0.5em;
}

/*----------------------------------------------------------------------------------------------------------------------
--											TOC MARKDOWN HOVER PROPERTIES
----------------------------------------------------------------------------------------------------------------------*/
/* Markdown Document ICON */
a.wm-article-link.wm-toc-text:hover::before{
	font-family: 'FontAwesome';
	content: "\f0f6 \FE0E";
	color: var(--open_icon_color);
	margin-right: 12px;	
}

/* Markdown line items BACKGROUND on hover */
a.wm-article-link.wm-toc-text:hover{
  color: white;
  background-color: var(--selected_bg_color);
  border-radius: 5px
}

/* CURRENT selected Markdown Document CONTAINER style */
.wm-toc-li.wm-current{
     background-color: var(--selected_bg_color);
  	border-radius: 5px
}

.wm-toc-li.wm-current, .wm-toc-li.wm-current:hover {
  	border-radius: 5px
}

/* CURRENT selected Markdown Document CONTAINER style on hover */
.wm-toc-li:hover {
   background-color: transparent;
  	border-radius: 5px
/*   border-radius: 5px; */
/*   border: 1px solid white; */
}


/*----------------------------------------------------------------------------------------------------------------------
--												
----------------------------------------------------------------------------------------------------------------------*/


/* this is the "overall box" for the markdown headings (blue) are contained in */
.wm-toc-li-nested.wm-page-toc {
  border-left: 1px dashed var(--laminar_blue);
}


a.wm-article-link.wm-page-toc-text:hover{
	color: white;
/* 	font-size: var(--lato_font_height); */
	padding-left: 12px;
	background: transparent;
}


/* This is the right 'open' arrow to the right of 2nd level links */
.wm-page-toc-opener > .wm-toc-text::before {
	font-family: 'FontAwesome';
	color: var(--laminar_blue);
	margin-right: 8px;
	content: "\f0f6 \FE0E";
}


.wm-page-toc-opener > .wm-toc-text::after {
  font-family: 'FontAwesome';
  content: "\f053";
  display: inline-block;
  float: right;
  vertical-align: middle;
  font-size: 10px;
  padding-right: 5px;
}

.wm-page-toc-opener.wm-page-toc-open > .wm-toc-text::after {
  font-family: 'FontAwesome';
  content: "\f078";
  font-size: 10px;
}

.btn:focus, .btn:active:focus, .btn.active:focus, .btn.focus, .btn:active.focus, .btn.active.focus {
  outline: none;
}

.btn-default:focus, .btn-default.focus {
  color: #333;
  background-color: #fff;
  border-color: #ccc;
}

.btn-default.greybtn {
  color: #888;
}

.wm-article-nav-buttons {
  margin: 1rem 0;
}

.wm-page-content img {
  max-width: 100%;
  display: inline-block;
  padding: 0px;
  line-height: 1.428571429;
  background-color: #fff;
  border: 0px solid #ddd;
  border-radius: 0px;
  margin: 0px
}

.wm-page-content a {
  color: #2fa4e7;
}

.wm-article-nav {
  display: inline-block;
  max-width: 48%;
  white-space: nowrap;
  color: #546e7a;
  text-align: right;
}

.wm-article-nav > .btn-link {
  display: block;
  padding-left: 0.5rem;
  padding-right: 0.5rem;
  overflow: hidden;
  text-overflow: ellipsis;
}

/***********************************************************************
 * Dropdown search results
 ***********************************************************************/
#mkdocs-search-results.dropdown-menu {
  width: 40rem;
  overflow-y: auto;
  overflow-x: hidden;
  white-space: normal;
  max-height: calc(100vh - 60px);
  max-width: 90vw;
}

#mkdocs-search-results {
  font-family: "Helvetica Neue",Helvetica,Arial,sans-serif,FontAwesome;
}

.search-link {
  font-size: 1.2rem;
}

.search-title {
  font-weight: bold;
  color: #337ab7;
  padding-right: 1rem;
}

.search-text {
  color: #666;
  overflow: hidden;
  text-overflow: ellipsis;
}

.search-text > b {
  color: #000;
}

.wm-search-page {
  list-style: none;
  padding: 5px 0;
}

.wm-search-page > li {
  padding: 1rem 0;
  border-bottom: 1px solid #ccc;
}

.wm-search-page .search-link {
  font-size: inherit;
}

.wm-search-page .search-link:hover, .wm-search-page .search-link:active {
  text-decoration: none;
}

.wm-search-page .search-link:hover .search-title {
  text-decoration: underline;
}



/***********************************************************************
 * The rest is taken from base.css from mkdocs.
 ***********************************************************************/

.source-links {
  float: right;
}

h1 {
    color: #444;
    font-weight: 400;
    font-size: 42px;
    margin-left: -20px;
}

h2, h3, h4, h5, h6 {
    color: #444;
    font-weight: 300;
    margin-left: -15px;
}

hr {
    border-top: 1px solid #aaa;
}

.wm-page-content ol{
	margin-bottom: 40px;
}

.wm-page-content ul{
	margin-bottom: 40px;
}

p {
	margin: 0 0 20px;
}

pre, .rst-content tt {
    max-width: 100%;
    background: #E3E3E3;
    border: solid 1px #e1e4e5;
    color: #333;
    overflow-x: auto;
}

code.code-large, .rst-content tt.code-large {
    font-size: 90%;
}

code {
    padding: 1px 5px;
    background: #E9E9E9;
    border: solid 1px #e1e4e5;
    color: #D04941;
    white-space: pre-wrap;
    word-wrap: break-word;
}

pre code {
    background: transparent;
    border: none;
    white-space: pre;
    word-wrap: normal;
    font-family: monospace,serif;
    font-size: 12px;
}

a code {
    color: #2FA4E7;
}

a:hover code, a:focus code {
    color: #157AB5;
}

footer {
	width: var(--content_width);
    margin-bottom: 7px;
    margin-left: 0px;
    text-align: left;
    font-weight: 200;
    font-size: smaller;
    border-top: 1px solid;
}

.modal-dialog {
    margin-top: 60px;
}

.headerlink {
    font-size: 14px;
    display: none;
    padding-left: .5em;
}

h1:hover .headerlink, h2:hover .headerlink, h3:hover .headerlink, h4:hover .headerlink, h5:hover .headerlink, h6:hover .headerlink{
    display:inline-block;
}

/*----------------------------------------------------------------------------------------------------------------------
--												ADMONITION GLOBAL
----------------------------------------------------------------------------------------------------------------------*/

.admonition {
    text-align: left;
    border-radius: 10px;
    overflow: hidden; 
    width: 90%;
    margin: 30px auto; 
    padding:  0px 15px 8px 25px;
}

.admonition-paragraph {
/* 	display: flex; */
	padding-left: 20px;
	text-indent: -30px;
}

.admonition-title {
    padding: 3px 20px;
    margin: 0px -30px 15px -30px;
}

.admonition-paragraph:before {
	font-family:	'FontAwesome';
	content:	"\f0a4";
	font-size: 1.2em;
	margin-right: 8px;	
}


/*----------------------------------------------------------------------------------------------------------------------
--												ADMONITION NOTE
----------------------------------------------------------------------------------------------------------------------*/

div.admonition.note .admonition-title {
	color: #3880B5;
    font-weight: bold;
    text-align: left;
    background: #A0D3EB;   
    border-bottom: 1px solid #3880B5;
}

.admonition.note { /* csslint allow: adjoining-classes */
    color: #3a87ad;
    background-color: #d9edf7;
    /* padding:  0px 15px 10px 25px; */
    border: 2px solid #5289AC;
}

.admonition.note .admonition-title:before { /* csslint allow: adjoining-classes */
	font-weight: normal;
    font-family:  'FontAwesome';
    content:  '\f044 \00a0 \00a0';
}

/*----------------------------------------------------------------------------------------------------------------------
--												ADMONITION WARNING
----------------------------------------------------------------------------------------------------------------------*/

div.admonition.warning .admonition-title {
    font-weight: bold;
    text-align: left;
    background: #EEBB7B;
    color: #C77C17;
    border-bottom: 1px solid #C77C17;
}

.admonition.warning .admonition-title:before { /* csslint allow: adjoining-classes */
	font-weight: normal;
    font-family:  'FontAwesome';
    content:  '\f06a \00a0 \00a0';
}


.admonition.warning { /* csslint allow: adjoining-classes */
    color: #C77C17;
    background-color: #ECDED0;
/*     padding:  0px 15px 15px 25px; */
    border: 2px solid #DA974E;
}

/*----------------------------------------------------------------------------------------------------------------------
--												ADMONITION DANGER
----------------------------------------------------------------------------------------------------------------------*/
div.admonition.danger .admonition-title {
    font-weight: bold;
    text-align: left;
    background: #EA9493;
    color: white;
    border-bottom: 2px solid #EA8182;
}

.admonition.danger .admonition-title:before { /* csslint allow: adjoining-classes */
	font-weight: normal;
    font-family:  'FontAwesome';
    content:  '\f071 \00a0 \00a0';
}

.admonition.danger { /* csslint allow: adjoining-classes */
    color: #BA656A;
    background-color: #FBDBDF;
/*     padding:  0px 15px 15px 25px; */
    border: 2px solid #EA8182;
}

/*----------------------------------------------------------------------------------------------------------------------
--												ADMONITION TIP
----------------------------------------------------------------------------------------------------------------------*/

div.admonition.tip .admonition-title {
	color: green;
    font-weight: bold;
    text-align: left;
    background: #B5F4BC;   
    border-bottom: 1px solid green;
}

.admonition.tip { /* csslint allow: adjoining-classes */
    color: #438C44;
    background-color: #ECFEF3;
    /* padding:  0px 15px 10px 25px; */
    border: 2px solid green;
}

.admonition.tip .admonition-title:before { /* csslint allow: adjoining-classes */
	font-weight: normal;
    font-family:  'FontAwesome';
    content:  '\f12a \00a0 \00a0';
}

.table {
	width: auto; /* Let the table width be determined by its contents */
    table-layout: auto; /* Use automatic table layout to adjust column widths based on cell content */
    border-collapse: collapse; /* Ensure borders collapse (optional) */
    white-space:  pre-wrap;
}

.table td {
	padding-left: 20px;
}

th 	{
	background:lightgray;
	}
	
.table tbody tr td {
	padding:  5px 20px;
	vertical-align: middle;
}

/*  The search box section */
 input#mkdocs-search-query.form-control{
 	border: 1px solid #808080;
 	border-bottom-left-radius: 8px;
 	border-top-left-radius: 8px;
 	background: black;
 	height: 35px;
 	color: white;
 }
 
/*  the magnifying glass section */
 button#wm-search-go.btn.btn-default{
 	border: 1px solid #808080;
	border-bottom-right-radius: 10px;
	border-top-right-radius: 10px;;
	background: var(--laminar_blue);
	color: white;
	height: 35px;
	width: 70px;
 }
 
.dropdown-menu-right{
	margin-left: -230px;
	margin-top: 30px;
	right: unset;
	left: unset;
}

.tooltip-box img{
	background-color: black;
	margin: 5px!important;
	border: 1px solid white;
}

ul {
	padding-inline-start: 20px;
}

p a.glightbox{
	border-radius: 3px;
	border: 1px solid;
	padding: 0px 5px 0px 5px;
}

/*  This is to make mathjax equations just a bit bigger font */
.MJX-TEX{
	font-size: 120%;
	}
