/*COPYRIGHT © 2026 AUTHOR-E BV. ALL RIGHTS RESERVED */
@import url(Variables.css);

@charset "UTF-8";
/* CSS Document Listmenu-tab*/
#hamburgerIcon {
  float: left;
  margin: 20px 0px 30px 30px;
  width: 25px;
  height: 25px;
  z-index: 1100;
  display: block;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  cursor: pointer;
}

.hamburgerIconOpen
{
  background-image: url(../Images/hamburgerIcon.png);
}

.hamburgerIconClose
{
  background-image: url(../Images/hamburgerIconClose.png);
}

/* Main tabs */

#Navigation1 {
  /* background-color: var(--white); */
    margin: auto;
    position: relative;
    /* width: 80%; */
    border-radius: 10px;
    height: fit-content;
    overflow-y: auto;
    max-height: calc(100vh - 150px);
    /* margin-top: 70px; */
    padding-right: 10px;
}

/* remove the arrow for the highest menu */
#Navigation1.Tree > .Node > .Display > .Toggle
{
  /* display: none;*/
} 

.Display {
  display: flex;
  margin-top: 5px;
	margin-bottom: 5px;
}
#Navigation1.Tree > .Node > .Children > .Node {
 
  padding-left: 15px;

}

#Navigation1.Tree > .Node > .Children > .Node:last-child {
  border-bottom-style: none;
}

#Navigation1.Tree > .Node > .Display:first-child {
  padding-top: 5px;
  padding-left: 20px;
}

/* #Navigation1 .Active a {
  color: #000000 !important;
}

#Navigation1 .Children .Active > .Display> .Title {
  color: #000000 !important;
} */

.Active > .Display > .Toggle {
  /* background-image: url(../Images/reddot.png);
  background-size: contain;
  background-repeat: no-repeat;
  margin-top: 7.5px; */
}

#Navigation1 a {
  text-decoration: none;
  display: inline;
  align-self: flex-start;
}

#Navigation1 .Children a {
  opacity: 1;
}

#Navigation1 .Children .Children a {
}

#Navigation1 .Children .Children .Children a {
  /* margin-left: 10px; */
}

.Tree .Toggle {
  cursor: pointer;
  min-width: 10px;
  height: 10px;
}

.Tree .Title {
  margin-left: 2px;
}

/* nieuw */

.Tree .Node.Node.Node.Leaf.Active > .Display {
  /*THIS IS THE STYLING FOR THE ACTIVE LIST IN THE NAVIGATION. PROGRESS BAR MAYBE?*/
}

.Tree .Node > .Display:hover {
}

.Tree .Node > .Display a {
}

.Tree .Node .Display {
}

.Tree .Node .Children .Display {
  min-height: 20px;
  /*background: #7F8C8D;*/
  margin-left: 15px;
}

.Tree .Node .Title 
{
	padding: 3px 0px;
}

.Tree .Node .Children .Children .Display {
  min-height: 15px;
  margin-left: 30px;
}
.Tree .Node .Children .Children .Children .Display {
  /* white-space: nowrap; */
}

.Tree .Container.Expanded > .Display > .Toggle {
  background-image: url(../Images/arrowDown.png);
  background-size: contain;
  /* width: 5px; */
  background-repeat: no-repeat;
  margin-top: 7px;
}

.Tree .Container.Collapsed > .Display > .Toggle {
  background-image: url(../Images/arrowRight.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 15px;
  margin-top: 8px;
}

.Tree .Container.Expanded.Active > .Display > .Toggle {
  background-image: url(../Images/arrowDown.png);
  width: 15px;
}

.Tree .Container.Collapsed.Active > .Display > .Toggle {
  background-image: url(../Images/arrowRight.png);
  width: 15px;
}

.Tree .Container.Expanded.Active > .Display > .Progressbar {
  background-image: none !important;
}

.Tree .Children {
  margin-left: 0px;
}

.Tree .Node .Children .Children .Children .Display {
  margin-left: 30px;
}

/*Progress bar*/

.pc {
  width: fit-content;
  margin-right: 5px;
}
.bg {
  border-radius: 50%;
  width: 12px;
  height: 12px;
  background: var(--textLabelSecondary);
}
/*overlay for the progressbar*/
.ol {
  border-radius: 50%;
  width: 8.8px;
  height: 8.8px;
  background: var(--white);
  position: absolute;
  margin-top: 1.8px;
  margin-left: 1.7px;
  display: none;
}

.Progressbar {
  margin-top: 0 !important;
  padding: 0 !important;
  background-image: none;
  height: 100% !important;
}

a.Toggle {
  min-width: 15px!important;
}

#Navigation1 > .Node > .Children > .Node > .Children > .Node> .Children > .Node> .Display{
  margin-left:50px;
}

#Navigation1 > .Node > .Children > .Node > .Children > .Node> .Children > .Node> .Children >.Node> .Display{
  margin-left:50px;
}