:root  > * {
  --md-primary-fg-color:  #187fd3fc;
  --md-accent-fg-color:   #54a8edfc;
  /*--md-primary-fg-color--light: #ECB7B7;
  --md-primary-fg-color--dark:  #90030C;*/
}

/* Hide sidebar only on large screens (Desktop) */
@media (min-width: 768px) {
  .md-sidebar {
    display: none;
    /* Hide sidebar on desktop */
  }

  /* Make the content area full width on desktop */
  .md-content {
    margin-left: 0;
    max-width: 100%;
  }
}

/* Ensure sidebar is visible and functional on mobile */
@media (max-width: 767px) {
  .md-sidebar {
    display: block;
    /* Ensure sidebar is visible on mobile */
    position: fixed;
    width: 75%;
    /* Set a width for the sidebar */
    max-width: 300px;
    /* Adjust the max width as needed */
    transform: translateX(-100%);
    transition: transform 0.3s ease;
  }

  /* When the mobile menu is open, show sidebar */
  .md-sidebar--open {
    transform: translateX(0);
  }
}

.md-sidebar--secondary {
    order: 0;
}
.md-typeset h1, .md-typeset h2 {
    font-weight: 500;
}

[data-md-color-scheme="default"] .md-typeset h1 {
  color: var(--md-primary-fg-color);
}

/* dark mode part */
[data-md-color-scheme="slate"] {
  --md-primary-fg-color: #206196fc; /* pick your favorite blue-ish or any color */
}

[data-md-color-scheme="slate"] .md-typeset h1 {
    color: #89b7dd; /* choose your dark-mode-friendly color */
}

.md-updated {
    padding: 0 10px 10px 0;
    color: var(--md-footer-fg-color--light);
    text-align: right
}

[data-md-color-scheme="default"] .md-updated {
    background-color: #161616; /* light mode background */
}

[data-md-color-scheme="slate"] .md-updated {
    background-color: #121317; /* dark mode background */
}