/* Claw Society brand overrides for MkDocs Material */

/* Fonts — match landing page */
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600;700&family=Space+Grotesk:wght@300;400;500;600;700&display=swap');

:root {
  /* Primary brand color */
  --md-primary-fg-color: #2563eb;
  --md-primary-fg-color--light: #3b82f6;
  --md-primary-fg-color--dark: #1d4ed8;
  --md-primary-bg-color: #ffffff;

  /* Accent */
  --md-accent-fg-color: #2563eb;
  --md-accent-fg-color--transparent: rgba(37, 99, 235, 0.1);
  --md-accent-bg-color: #eff4ff;

  /* Typography */
  --md-text-font: 'Space Grotesk', -apple-system, BlinkMacSystemFont, sans-serif;
  --md-code-font: 'JetBrains Mono', 'Fira Code', 'SF Mono', monospace;

  /* Default (light) scheme overrides */
  --md-default-bg-color: #fafafa;
  --md-default-fg-color: #111118;
  --md-default-fg-color--light: #52525b;
  --md-default-fg-color--lighter: #a0a0ab;
}

/* Dark scheme overrides */
[data-md-color-scheme="slate"] {
  --md-default-bg-color: #1a1a2e;
  --md-default-fg-color: #e4e8f1;
  --md-default-fg-color--light: #8891a8;
}

/* Code blocks — terminal style */
.md-typeset code,
.md-typeset pre > code {
  font-size: 0.82rem;
}

.md-typeset pre {
  background: #1a1a2e;
  border-radius: 8px;
}

.md-typeset pre > code {
  color: #e2e8f0;
}

/* Header styling */
.md-header {
  background: #ffffff;
  color: #111118;
  border-bottom: 1px solid #e2e4e9;
  box-shadow: none;
}

[data-md-color-scheme="slate"] .md-header {
  background: #1a1a2e;
  color: #e4e8f1;
  border-bottom: 1px solid #2d3348;
}

.md-header__title {
  font-family: var(--md-code-font);
  font-weight: 600;
}

/* Navigation tabs */
.md-tabs {
  background: #ffffff;
  border-bottom: 1px solid #e2e4e9;
}

[data-md-color-scheme="slate"] .md-tabs {
  background: #1a1a2e;
  border-bottom: 1px solid #2d3348;
}

/* Subtle dot grid background on content */
.md-content {
  background-image: radial-gradient(circle, #e2e4e9 1px, transparent 1px);
  background-size: 24px 24px;
  background-position: 12px 12px;
}

[data-md-color-scheme="slate"] .md-content {
  background-image: radial-gradient(circle, #2d3348 1px, transparent 1px);
}

/* Admonitions — use brand blue for info */
.md-typeset .admonition.note,
.md-typeset details.note {
  border-color: #2563eb;
}

/* Links */
.md-typeset a {
  color: #2563eb;
}

.md-typeset a:hover {
  color: #1d4ed8;
}