.code-content {
  .method {
    display: inline-block;
    padding: 4px 8px;
    font-size: 12px;
    font-weight: bold;
    color: #fff;
    background-color: black;
    border-radius: 12px;
    /* Rounded corners */
    text-align: center;
    vertical-align: middle;
    margin-bottom: 15px;
  }

  .post {
    background-color: #1c7d4d;
  }

  .get {
    background-color: #007bff;
  }

  .put {
    background-color: #d4a000;
  } 
}
.md-header__button.md-logo {
  margin: 0.2rem;
  padding: 0.2rem;
}

.md-header__button.md-logo img,
.md-header__button.md-logo svg {
  height: 35px;
}
.md-nav__item .md-nav__link--active, .md-nav__item .md-nav__link--active code{
  color: var(--md-accent-fg-color);
}

.logo-color{
  fill: white;
  color: white;
}

/* Light mode */
body[data-md-color-scheme="default"] .light-mode-img {
  display: block;
}

body[data-md-color-scheme="default"] .dark-mode-img {
  display: none;
}

/* Dark mode */
body[data-md-color-scheme="slate"] .light-mode-img {
  display: none;
}

body[data-md-color-scheme="slate"] .dark-mode-img {
  display: block;
}
/* Background + Navbar */
:root {
  --md-default-bg-color: #0d1224; /* Dark navy background */
  --md-primary-fg-color: #0d1224;

  /* Text */
  --md-default-fg-color: #ffffff; /* White text */
  --md-typeset-color: #d1d5db; /* Light gray text for paragraphs */

  /* Links + Accents */
  --md-accent-fg-color: #f97316; /* Orange accent */
  --md-link-color: #f97316; /* Blue links */
}