/* ============================================================
   TurboPython docs -- "B" treatment on Material for MkDocs:
   soft-dark slate ground, serif body / sans headings, capped
   reading measure, warm accent, landing-page header.
   ============================================================ */

[data-md-color-scheme="slate"] {
  --md-hue: 222;
  --md-default-bg-color:         #1b1f29;   /* soft slate, not pure black */
  --md-default-fg-color:         #d7dde8;
  --md-default-fg-color--light:  #9fa9bd;
  --md-default-fg-color--lighter:#6b7689;
  --md-default-fg-color--lightest:#3a4150;
  --md-typeset-color:            #d7dde8;
  --md-typeset-a-color:          #ffa766;   /* warm link */
  --md-primary-fg-color:         #ff8a3d;
  --md-accent-fg-color:          #ffa766;
  --md-code-bg-color:            #141821;
  --md-code-fg-color:            #d7dde8;
}

/* Body in a serif for comfortable long-form reading; headings stay sans. */
.md-typeset {
  font-family: 'Charter','Bitstream Charter',Georgia,'Times New Roman',serif;
  font-size: .76rem;
  line-height: 1.7;
}
.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4,
.md-nav,
.md-header,
.md-tabs,
.md-footer,
.md-typeset .admonition-title {
  font-family: system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
}
.md-typeset h1 { font-size:1.7rem; font-weight:650; letter-spacing:-.02em; color:#f2f5fa; margin-bottom:.3em; }
.md-typeset h2 { font-size:1.3rem; letter-spacing:-.01em; margin-top:2em; }
.md-typeset h3 { font-size:1.05rem; }
.md-typeset h2, .md-typeset h3 { color:#eaeef5; }

/* Cap the reading column -- the single biggest readability lever. */
.md-content__inner { max-width: 44rem; margin-left:auto; margin-right:auto; }
.md-content__inner > :first-child { margin-top: 1.2rem; }

/* Material gives all of config.copyright the brighter --light tone. Let the
   sentence around the version recede to match "Made with ...", and keep only
   the version itself at the regular tone (hooks/version.py wraps it). */
.md-copyright__highlight {
  color: var(--md-footer-fg-color--lighter);
}
.md-copyright__highlight .tpy-version {
  color: var(--md-footer-fg-color--light);
}

/* The header version block (overrides/partials/header.html) carries no icon,
   so reclaim the room md-source reserves for one. padding-left is set
   unconditionally, while the -2rem pull-back that normally cancels it only
   applies via `.md-source__icon + .md-source__repository`; without this the
   text sits indented against empty space. Equal specificity to the theme's
   `[dir=ltr] .md-source__repository`, and extra.css loads last, so it wins. */
.md-header__source .md-source__repository {
  margin-left: 0;
  padding-left: 0;
  max-width: 100%;
}

/* Pre-release banner (the announce block in overrides/main.html): a quiet strip
   above the header. Sans, since .md-banner__inner carries .md-typeset. */
.md-banner {
  background-color: #141821;
  color: var(--md-default-fg-color--light);
  border-bottom: 1px solid #222a3a;
}
.md-banner .md-banner__inner {
  font-family: system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  font-size: .66rem;
  text-align: center;
  margin: .45rem auto;
}
.md-banner strong { color: #ffbf8a; font-weight: 600; }

/* Header to match the landing page: dark translucent + blur, no shadow. */
.md-header {
  background-color: rgba(12,15,23,.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  color: #e7ecf5;
  border-bottom: 1px solid #222a3a;
  box-shadow: none;
}
.md-tabs { background-color: transparent; border-bottom: 1px solid #222a3a; }

/* Wordmark: weight + tracking like the site's .logo. */
.md-header__topic:first-child .md-ellipsis {
  font-weight: 700; letter-spacing: -.02em; font-size: 1.05rem; color: #e7ecf5;
}
/* Logo (the gradient TPy mark) sits in Material's logo slot; give it the glow. */
.md-header__button.md-logo img { height: 1.5rem; width: auto; filter: drop-shadow(0 0 10px rgba(255,138,61,.35)); }

/* Inline code: warm, subtle. */
.md-typeset code {
  background: rgba(255,167,102,.1);
  color: #ffbf8a;
  border-radius: 4px;
  padding: .1em .4em;
}

/* Code blocks: rounded, bordered, calm. */
.md-typeset pre > code { border:1px solid #2a313f; border-radius:10px; }

/* Tables: Material renders these well below body size (.64rem); bring them up
   close to body so dense compatibility tables stay readable. */
.md-typeset table:not([class]) { font-size: .74rem; }

/* Compatibility page uses h4 for each library entry (h4 is used nowhere else):
   a hairline rule above each so the libraries read as distinct blocks. */
.md-typeset h4 {
  font-size: .95rem;
  margin-top: 1.7em;
  padding-top: 1.1em;
  border-top: 1px solid #2a313f;
}

/* Admonitions tuned to the warm accent. */
.md-typeset .admonition,
.md-typeset details {
  border-radius: 0 8px 8px 0;
  border-left-width: 3px;
  font-size: .82rem;
}

/* Links: subtle underline rather than full color blocks. */
.md-typeset a { text-decoration: none; }
.md-typeset a:hover { text-decoration: underline; }

/* External links (marked up manually with { target="_blank" rel="noopener" },
   see CLAUDE.md): a small open-in-new icon after the link text. */
.md-typeset a[target="_blank"]::after {
  content: "";
  display: inline-block;
  width: .6em;
  height: .6em;
  margin-left: .2em;
  vertical-align: -.02em;
  background-color: currentColor;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z'/%3E%3C/svg%3E") no-repeat center / contain;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 19H5V5h7V3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2v-7h-2v7zM14 3v2h3.59l-9.83 9.83 1.41 1.41L19 6.41V10h2V3h-7z'/%3E%3C/svg%3E") no-repeat center / contain;
}