/* Onramp Brand Colors */
:root {
  /* Brand palette */
  --onramp-brand-25: #cfe4db;
  --onramp-brand-50: #bbd6ca;
  --onramp-brand-100: #a6c8b8;
  --onramp-brand-200: #8bb9a7;
  --onramp-brand-300: #6faa95;
  --onramp-brand-400: #4b8e73;
  --onramp-brand-500: #175c45;
  --onramp-brand-600: #144e3c;
  --onramp-brand-700: #104234;
  --onramp-brand-900: #0a2b22;
  --onramp-dark: #040d08;

  /* Material theme overrides */
  --md-primary-fg-color: #175c45;
  --md-primary-fg-color--light: #4b8e73;
  --md-primary-fg-color--dark: #104234;
  --md-accent-fg-color: #6faa95;
  --md-accent-fg-color--transparent: #6faa9533;

  /* Typography */
  --md-text-font: "Inter", sans-serif;
  --md-code-font: "JetBrains Mono", monospace;
}

/* Dark mode overrides */
[data-md-color-scheme="onramp-dark"] {
  --md-default-bg-color: #040d08;
  --md-default-fg-color: #e0e0e0;
  --md-default-fg-color--light: #bdbdbd;
  --md-default-fg-color--lighter: #9e9e9e;
  --md-default-fg-color--lightest: #616161;
  --md-primary-fg-color: #0a2b22;
  --md-primary-fg-color--light: #144e3c;
  --md-primary-fg-color--dark: #040d08;
  --md-primary-bg-color: #e0e0e0;
  --md-primary-bg-color--light: #bdbdbd;
  --md-accent-fg-color: #6faa95;
  --md-typeset-a-color: #8bb9a7;
  --md-typeset-color: #e0e0e0;
  --md-code-bg-color: #0a2b22;
  --md-code-fg-color: #cfe4db;
  --md-code-hl-color: #6faa9533;
  --md-nav-item-color: #e0e0e0;
  --md-footer-bg-color: #040d08;
  --md-footer-fg-color: #bdbdbd;
  --md-footer-fg-color--light: #9e9e9e;
  --md-footer-fg-color--lighter: #616161;
  --md-typeset-table-color: #ffffff1f;
  --md-admonition-bg-color: #0a2b22;
  --md-admonition-fg-color: #e0e0e0;
  color-scheme: dark;
}

/* Font import */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap");

/* Nav logo sizing */
.md-header__button.md-logo img,
.md-header__button.md-logo svg {
  height: 1.5rem;
  width: auto;
}

/* Smooth link transitions */
.md-typeset a {
  transition: color 0.15s ease;
}

/* Accent colored admonitions for tips */
.md-typeset .admonition.tip,
.md-typeset details.tip {
  border-color: var(--onramp-brand-400);
}

.md-typeset .tip > .admonition-title,
.md-typeset .tip > summary {
  background-color: var(--onramp-brand-400) 1a;
}