:root {
  --fd-primary: #1F7A8C;
  --fd-primary-dark: #155A66;
  --fd-primary-soft: #D9EEF2;

  --fd-text: #1F2933;
  --fd-text-muted: #5B6670;
  --fd-border: #D5DCE1;

  --fd-bg: #F5F7F8;
  --fd-surface: #FFFFFF;

  --fd-warning: #D97706;
  --fd-success: #2C7A4B;
}

[data-md-color-scheme="default"] {
  --md-primary-fg-color: var(--fd-primary);
  --md-primary-fg-color--light: var(--fd-primary-soft);
  --md-primary-fg-color--dark: var(--fd-primary-dark);

  --md-accent-fg-color: var(--fd-primary);

  --md-default-fg-color: var(--fd-text);
  --md-default-fg-color--light: var(--fd-text-muted);
  --md-default-bg-color: var(--fd-bg);

  --md-typeset-a-color: var(--fd-primary);
}

html, body {
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

.md-main,
.md-content,
.md-container {
  background: var(--fd-bg);
}

.md-header {
  background: var(--fd-surface);
  color: var(--fd-text);
  box-shadow: none;
  border-bottom: 1px solid var(--fd-border);
}

.md-header__title,
.md-header__topic,
.md-tabs__link,
.md-nav__title,
.md-nav__link {
  color: var(--fd-text);
}

.md-search__form {
  background: var(--fd-surface);
  border: 1px solid var(--fd-border);
  box-shadow: none;
}

.md-search__input {
  font-family: inherit;
}

.md-sidebar__inner {
  border-right: 1px solid rgba(213, 220, 225, 0.55);
}

.md-typeset {
  color: var(--fd-text);
}

.md-typeset h1,
.md-typeset h2,
.md-typeset h3 {
  letter-spacing: 0.01em;
  color: var(--fd-text);
}

.md-typeset .admonition,
.md-typeset details {
  background: var(--fd-surface);
  border: 1px solid var(--fd-border);
  border-radius: 12px;
  box-shadow: none;
}

.md-typeset table:not([class]) {
  background: var(--fd-surface);
  border: 1px solid var(--fd-border);
  border-radius: 12px;
  overflow: hidden;
}

.md-typeset table:not([class]) th {
  background: #eef4f5;
}

.md-typeset .md-button {
  border-radius: 10px;
  font-family: inherit;
}

.md-typeset .md-button--primary {
  background-color: var(--fd-primary);
  border-color: var(--fd-primary);
}

.md-typeset .md-button--primary:hover {
  background-color: var(--fd-primary-dark);
  border-color: var(--fd-primary-dark);
}

.md-typeset code,
.highlight pre {
  border-radius: 10px;
}

.md-footer {
  background: var(--fd-surface);
  border-top: 1px solid var(--fd-border);
}