/* MAIN TIMELINE */
 .midknight-purple-n-blueG .vis-timeline {
  /* font-size: 12pt;
  font-family:  'comic sans'; 
  color: white;
  border: none; */
  border: 3px solid rgb(255, 0, 0);
  clip-path: polygon(.6% 0%, 99.4% 0, 100% 0%, 100% 100%, 98% 100%, 0% 100%, 0 98.2%, 0 1.8%);
  /*clip-path: polygon(2% 0, 98% 0, 100% 5%, 100% 95%, 98% 100%, 2% 100%, 0 95%, 0 5%);
  /* background-color: rgb(71,72,77); */
  /* background-color: rgb(47,49,47); */

}

.midknight-purple-n-blueG .rotateang { 
  box-shadow: 0 0 0 0.2px rgb(255, 0, 0);
  background-color: rgb(255, 0, 0);
  
}




.midknight-purple-n-blueG  .lcdrightframe{
  background-color: rgb(255, 0, 0);
  

}

.midknight-purple-n-blueG  .lcdleftframe{
  background-color: rgb(255, 0, 0);
  

}


.midknight-purple-n-blueG .vis-panel.vis-center {
  border: none;
  /* margin-left: 1vw; */
  border-top: 4px solid white;
  /* border-radius: 1vw; */
}


/* TOP BAR TEXT */
/* CURVE THIS ONE */
.midknight-purple-n-blueG .vis-panel.vis-vertical {
  /* background-color: rgb(71,72,77); */
  /* -webkit-clip-path: polygon(2% 0, 98% 0, 100% 5%, 100% 95%, 98% 100%, 2% 100%, 0 95%, 0 5%);
  clip-path: polygon(2% 0, 98% 0, 100% 5%, 100% 95%, 98% 100%, 2% 100%, 0 95%, 0 5%); */
}

.midknight-purple-n-blueG .vis-top.vis-top{
  border: none;
  /* padding-left: 20px;  */
  /* padding-bottom: 10px; */
}























/* Date time Grid Text */

/* Major time-axis labels styling:
   - These labels (typically displaying larger units like the year) remain bright white.
   - Bold font weight is applied for emphasis.
*/
.midknight-purple-n-blueG .vis-time-axis .vis-major {
  color: white;             /* White text color */
  font-weight: bold;        /* Bold for prominence */
  padding: 3px;
  overflow: hidden;
  box-sizing: border-box;
  white-space: nowrap;

}

/* Minor time-axis labels styling:
   - These labels (typically displaying smaller units like the month or day) are styled with a lighter grey.
   - The normal font weight gives them a less bold appearance.
   - A transition is added for smooth color changes (if any occur).
*/
.midknight-purple-n-blueG .vis-time-axis .vis-minor {
  color: #797979;           /* Light grey color; adjust the hex code for desired shade */
  font-weight: normal;      /* Normal font weight for a softer appearance */
  transition: color 0.3s ease;  /* Optional smooth transition for color changes */
}









.midknight-purple-n-blueG .vis-time-axis{
  /* border-bottom: 3px solid white; */
}
.midknight-purple-n-blueG .vis-major {
  font-weight: 900;
}
.midknight-purple-n-blueG .vis-minor{
  font-weight: 500;

}


/*SIDE BAR FOR GROUPS*/
/* Curve THIS ONE */
.vis-panel.vis-left{
  border-top: none;
  border-top: 4px solid white;

  /* -webkit-clip-path: polygon(10% 0, 90% 0, 100% 3%, 100% 97%, 90% 100%, 10% 100%, 0 97%, 0 3%);
  clip-path: polygon(10% 0, 90% 0, 100% 3%, 100% 97%, 90% 100%, 10% 100%, 0 97%, 0 3%);   */
}

.midknight-purple-n-blueG .vis-labelset {
  /* background: rgb(71,72,77);  */
  background-color: rgb(48, 47, 49);
  border: none;
  border-right: 3px solid rgb(79, 153, 255);
  font-weight: 900;
}
.midknight-purple-n-blueG .vis-label{
  border: none;
}
.midknight-purple-n-blueG .vis-inner{
  border: none;
  color: white;  
}





.midknight-purple-n-blueG .vis-foreground .vis-group {
  border: none;
  /* A fainter white line using 20% opacity */
  border-bottom: 2px solid rgba(255, 255, 255, 0.2);
  transition: border-color 0.9s ease;
}


/* Fade out the border completely when hovering */
  /*.midknight-purple-n-blueG .vis-foreground .vis-group:hover {
  
  border-bottom-color: rgba(255, 255, 255, 0);
} */



.midknight-purple-n-blueG .vis-time-axis .vis-grid.vis-odd {
  background: rgb(71,72,110);
  border-width: 1px;
  border-color: rgb(255, 79, 79);


}
.midknight-purple-n-blueG .vis-time-axis .vis-grid.vis-even {
  background: rgb(47, 49, 46);
  border-width: 1px;
  border-color: rgb(255, 79, 79);
  
}
.midknight-purple-n-blueG .vis-time-axis .vis-grid.vis-minor {
  border-width: 1px;
  border-color: rgb(255, 79, 79);
}

.midknight-purple-n-blueG .vis-time-axis .vis-grid.vis-major {
  border-width: 1px;
  border-color: rgb(255, 79, 79);
}