/* Parallax docs — restrained runtime / compiler tooling aesthetic */

:root {
  --plx-ink: #1a2332;
  --plx-muted: #5a6577;
  --plx-accent: #2f6fed;
  --plx-accent-soft: #e8eefc;
  --plx-border: #d8dee9;
  --plx-surface: #f7f8fb;
  --plx-code-bg: #f0f2f7;
}

html {
  font-feature-settings: "kern", "liga";
}

body {
  color: var(--plx-ink);
}

.sidebar {
  background: var(--plx-surface);
  border-right: 1px solid var(--plx-border);
}

.sidebar .sidebar-scrollbox {
  padding: 1rem 0.75rem 2rem;
}

.chapter li.chapter-item {
  margin: 0.15rem 0;
}

.chapter li.chapter-item a:hover {
  color: var(--plx-accent);
}

.chapter li.active > a {
  color: var(--plx-accent);
  font-weight: 600;
}

.content main {
  max-width: 48rem;
}

.content h1,
.content h2,
.content h3 {
  font-weight: 650;
  letter-spacing: -0.01em;
}

.content h1 {
  border-bottom: 1px solid var(--plx-border);
  padding-bottom: 0.4rem;
  margin-bottom: 1.25rem;
}

.content a {
  color: var(--plx-accent);
}

.content code {
  background: var(--plx-code-bg);
  border-radius: 3px;
  padding: 0.1em 0.35em;
  font-size: 0.9em;
}

.content pre {
  background: var(--plx-code-bg) !important;
  border: 1px solid var(--plx-border);
  border-radius: 6px;
}

.content table {
  width: 100%;
  border-collapse: collapse;
  margin: 1.25rem 0;
  font-size: 0.95rem;
}

.content table th {
  background: var(--plx-surface);
  text-align: left;
  font-weight: 600;
}

.content table th,
.content table td {
  border: 1px solid var(--plx-border);
  padding: 0.5rem 0.75rem;
}

.content blockquote {
  border-left: 3px solid var(--plx-accent);
  background: var(--plx-accent-soft);
  margin: 1.25rem 0;
  padding: 0.75rem 1rem;
  color: var(--plx-ink);
}

.content blockquote p {
  margin: 0;
}

.menu-title {
  font-weight: 700;
  letter-spacing: 0.02em;
}

.nav-chapters {
  color: var(--plx-muted);
}

.nav-chapters:hover {
  color: var(--plx-accent);
}

/* Landing callout */
.plx-hero {
  border: 1px solid var(--plx-border);
  background: linear-gradient(160deg, #f7f8fb 0%, #eef3fc 100%);
  border-radius: 8px;
  padding: 1.25rem 1.5rem;
  margin: 1rem 0 1.75rem;
}

.plx-hero p {
  margin: 0.35rem 0 0;
  color: var(--plx-muted);
}

.plx-hero strong {
  color: var(--plx-ink);
  font-size: 1.05rem;
}

/* Status pills in tables */
.plx-yes { color: #1b7a3d; font-weight: 600; }
.plx-no { color: #8a3b3b; font-weight: 600; }
.plx-partial { color: #8a6a1b; font-weight: 600; }

/* Mermaid diagrams */
.mermaid {
  margin: 1.5rem 0;
  text-align: center;
  background: var(--plx-surface);
  border: 1px solid var(--plx-border);
  border-radius: 8px;
  padding: 1rem;
  overflow-x: auto;
}

@media (prefers-color-scheme: dark) {
  .ayu,
  .navy,
  .coal {
    --plx-ink: #e6eaf2;
    --plx-muted: #a8b0c0;
    --plx-accent: #7aa2ff;
    --plx-accent-soft: #243044;
    --plx-border: #2f3b52;
    --plx-surface: #1b2436;
    --plx-code-bg: #151c2b;
  }
}