[data-md-color-scheme="strulab"] {
  --md-primary-fg-color: #181818;
  --md-primary-bg-color: #cccccc;
  --md-footer-fg-color: hsla(0, 0%, 100%, 1);
  --md-footer-bg-color--dark:  #181818 ;
}

.md-header {
  box-shadow: none !important; /* Removes the shadow */
}

.md-footer {
  background-color: #181818 !important; /* Ensure solid color */
}

body {
  background-color: #181818; /* Light gray */
  font: 12px Roboto;
}

.md-header__topic {
  margin-left: -20px
}

.md-typeset {
  color: #cccccc;
  font: 12px Roboto;
  line-height: 1.5;
  h1 { color: #cccccc; font-size: 24px; }
  h2 { color: #cccccc; font-size: 22px; }
  h3 { color: #cccccc; font-size: 20px; }
  h4 { color: #cccccc; font-size: 18px; }
  h5 { color: #cccccc; font-size: 18px; }
  h6 { color: #cccccc; font-size: 18px; }
  a {color: #cccccc}
  a:focus {color: #ffffff;}
  a:hover {color: #ffffff;}
}

.md-grid {
  max-width: 1300px; 
}

.md-content a {
    color: #cccccc !important;
}
.md-content a:hover {
    color: #ffffff !important;
}

.md-nav {
  color: #cccccc !important;
  font: 16px Roboto;
  background-color: #181818 !important;
}

.md-nav__link {
    color: #cccccc !important;
    font: 15px Roboto;
}

.md-nav__link:hover {
  color: #ffffff !important;
  font: 15px Roboto Medium
}

.md-nav__link--active {
    color: #ffffff !important;
    font: 15px Roboto Medium;
}

.md-footer {
  font: 10px Roboto Medium;
}

.md-footer__title .md-ellipsis {
  font: 15px Roboto Medium;
}

.md-feedback__title {
  font: 12px Roboto Medium;
}

.md-icon svg {
  fill: #cccccc;
}

.md-icon svg:hover {
  fill: #ffffff;
}

.md-nav__title {
  background-color: #181818 !important;
  box-shadow: none !important; /* Removes the shadow */
  color: #cccccc !important;
  font: 17px Roboto Medium;
}

.md-copyright__highlight {
 font: 11px Roboto;
}

.md-consent__inner {
  background-color: #181818 !important;
 }

 .md-button md-button--primary {
  color: #cccccc !important;
  border-radius: 5px !important;
  border: 0px solid #cccccc !important;
  font: 12px Roboto !important;
  background-color: #0078D4 !important;
 }

 .md-button md-button--primary:hover {
  color:#ffffff !important;
  border-radius: 5px !important;
  border: 0px solid #cccccc !important;
  font: 12px Roboto !important;
  background-color: #0166B4 !important;
 }

 .md-button {
  color: #cccccc !important;
  border-radius: 5px !important;
  border: 0px solid #cccccc !important;
  font: 12px Roboto !important;
  background-color: #0078D4 !important;
 }

 .md-button:hover {
  color:#ffffff !important;
  border-radius: 5px !important;
  border: 0px solid #cccccc !important;
  font: 12px Roboto !important;
  background-color: #0166B4 !important;
 }


ul li {
  color: #cccccc;           /* Bullet and text color */
  font-size: 12px;          /* List item font size */
  margin-bottom: 1em;     /* Space between items */
}

/* Change bullet color and size */
ul li::marker {
  color: #cccccc;           /* Bullet color */
  font-size: 1.0em;         /* Bullet size */
}

/* Change font and size for block equations */
.katex-display {
  font-size: 11px;      /* Change to your desired size */
  font-family: 'Roboto', Arial, sans-serif;
  color: #cccccc;
}

/* Change font and size for inline equations */
.katex {
  font-size: 11px;      /* Change to your desired size */
  font-family: 'Roboto', Arial, sans-serif;
  color: #cccccc;
}

.katex .tag {
  font-size: 12px;      /* Change to your desired size */
  font-family: Roboto; /* Or any font you prefer */
  color: #cccccc;       /* Optional: change color */
}