/*
 * Sipp Documentation theme — dark, aligned to the Sipp design language.
 *
 * This file is owned by the landing site and injected near </head> by the
 * docs build (scripts/build-docs.mjs) so it loads after mdBook's built-in
 * stylesheets and wins. Palette overrides are scoped to mdBook's `navy`
 * theme, which the docs build promotes to the default. The stock
 * light/rust/coal/ayu themes stay available from the theme menu.
 */

:root {
  /* Brand flavors */
  --sipp-pulp: #ff689a;
  --sipp-citrus: #ffb46e;
  --sipp-matcha: #9fe6c1;
  --sipp-blueberry: #6a7bff;
  --sipp-cream: #fff3e6;

  /* Dark surfaces */
  --sipp-graphite: #16171a;
  --sipp-surface-1: #1f2126;
  --sipp-surface-2: #24262c;
  --sipp-stroke: #2c2f36;

  /* Text */
  --sipp-text: #f5f7fa;
  --sipp-text-dim: #a1a7b3;

  /* Code / link tokens */
  --sipp-link: #879cff;
  --sipp-keyword: #879cff;
  --sipp-success: #9fe6c1;
  --sipp-error: #ff688f;

  /* Geometry */
  --sipp-radius: 12px;
  --sipp-radius-sm: 8px;
  --sipp-radius-pill: 9999px;

  /* Type */
  --sipp-font-display: "Satoshi", "Inter", "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --sipp-font-body: "Inter", "Open Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --sipp-font-mono: "JetBrains Mono", "Source Code Pro", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
}

/* ── Palette: map Sipp dark onto mdBook's navy theme ─────────────── */
.navy {
  --bg: var(--sipp-graphite);
  --fg: var(--sipp-text);

  --sidebar-bg: #14151a;
  --sidebar-fg: var(--sipp-text-dim);
  --sidebar-non-existant: #565b66;
  --sidebar-active: var(--sipp-pulp);
  --sidebar-spacer: var(--sipp-stroke);
  --sidebar-header-border-color: var(--sipp-stroke);

  --scrollbar: #3a3f4a;

  --icons: var(--sipp-text-dim);
  --icons-hover: var(--sipp-text);

  --links: var(--sipp-link);

  --inline-code-color: var(--sipp-citrus);

  --theme-popup-bg: var(--sipp-surface-1);
  --theme-popup-border: var(--sipp-stroke);
  --theme-hover: var(--sipp-surface-2);

  --quote-bg: var(--sipp-surface-1);
  --quote-border: var(--sipp-stroke);

  --warning-border: var(--sipp-citrus);

  --table-border-color: var(--sipp-stroke);
  --table-header-bg: var(--sipp-surface-2);
  --table-alternate-bg: #1b1d22;

  --searchbar-border-color: var(--sipp-stroke);
  --searchbar-bg: var(--sipp-surface-1);
  --searchbar-fg: var(--sipp-text);
  --searchbar-shadow-color: #000000;
  --searchresults-header-fg: var(--sipp-text-dim);
  --searchresults-border-color: var(--sipp-stroke);
  --searchresults-li-bg: var(--sipp-surface-1);
  --search-mark-bg: rgba(255, 104, 154, 0.32);

  --color-scheme: dark;

  --copy-button-filter: invert(74%) sepia(8%) saturate(280%) hue-rotate(190deg) brightness(95%) contrast(88%);
  --copy-button-filter-hover: invert(58%) sepia(58%) saturate(2200%) hue-rotate(300deg) brightness(101%) contrast(101%);

  --footnote-highlight: var(--sipp-blueberry);
  --overlay-bg: rgba(10, 11, 14, 0.62);

  --blockquote-note-color: var(--sipp-blueberry);
  --blockquote-tip-color: var(--sipp-matcha);
  --blockquote-important-color: var(--sipp-keyword);
  --blockquote-warning-color: var(--sipp-citrus);
  --blockquote-caution-color: var(--sipp-error);
}

/* ── Typography ──────────────────────────────────────────────────── */
html {
  font-family: var(--sipp-font-body);
}

.content main h1,
.content main h2,
.content main h3,
.content main h4,
.content main h5,
.content main h6 {
  font-family: var(--sipp-font-display);
  font-weight: 700;
  letter-spacing: -0.02em;
}

.content main h1 {
  font-size: 2.6rem;
}

code,
pre,
kbd,
.hljs {
  font-family: var(--sipp-font-mono) !important;
}

/* ── Layout flavor wash ──────────────────────────────────────────── */
.navy .page-wrapper {
  background-color: var(--bg);
  background-image:
    radial-gradient(80% 60% at 100% 0%, rgba(106, 123, 255, 0.1), transparent 60%),
    radial-gradient(70% 55% at 0% 0%, rgba(255, 104, 154, 0.08), transparent 58%);
  background-attachment: fixed;
}

/* ── Menu bar ────────────────────────────────────────────────────── */
.navy #mdbook-menu-bar {
  background-color: var(--sipp-surface-1);
  border-block-end: 1px solid var(--sipp-stroke);
}

.menu-title {
  font-family: var(--sipp-font-display);
  font-weight: 700;
  font-size: 1.8rem;
  letter-spacing: -0.01em;
}

/* Right buttons become a flex row so the Main Site pill aligns cleanly. */
.right-buttons {
  display: inline-flex;
  align-items: center;
  gap: 2px;
}

/* ── Back to main site button ────────────────────────────────────── */
.sipp-main-site-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-inline-end: 10px;
  padding: 6px 14px;
  border-radius: var(--sipp-radius-pill);
  border: 1px solid transparent;
  background: linear-gradient(135deg, var(--sipp-pulp) 0%, var(--sipp-citrus) 100%);
  color: #16171a !important;
  font-family: var(--sipp-font-mono);
  font-size: 1.2rem;
  font-weight: 700;
  line-height: 1;
  white-space: nowrap;
  text-decoration: none !important;
  transition: transform 0.15s ease, filter 0.15s ease, box-shadow 0.15s ease;
}

.sipp-main-site-link:hover {
  transform: translateY(-1px);
  filter: brightness(1.05);
  box-shadow: 0 6px 16px rgba(255, 104, 154, 0.28);
  text-decoration: none !important;
}

.sipp-main-site-link svg {
  width: 13px;
  height: 13px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
}

@media only screen and (max-width: 560px) {
  .sipp-main-site-link span {
    display: none;
  }

  .sipp-main-site-link {
    padding: 7px 9px;
  }
}

/* ── Sidebar ─────────────────────────────────────────────────────── */
.navy .sidebar {
  border-inline-end: 1px solid var(--sipp-stroke);
}

.sidebar .chapter li.chapter-item {
  line-height: 1.5;
  margin-block: 1px;
}

.sidebar .chapter li a {
  border-radius: var(--sipp-radius-sm);
  padding: 6px 10px;
}

.navy .sidebar .chapter li a:hover {
  background-color: var(--sipp-surface-2);
  color: var(--sipp-text);
}

.navy .sidebar .chapter li a.active {
  background-color: rgba(255, 104, 154, 0.14);
  color: var(--sipp-pulp);
  font-weight: 600;
}

.sidebar .chapter li.part-title {
  font-family: var(--sipp-font-mono);
  text-transform: uppercase;
  letter-spacing: 0.12em;
  font-size: 1.1rem;
}

/* ── Links ───────────────────────────────────────────────────────── */
.content a:link,
.content a:visited {
  color: var(--links);
  text-underline-offset: 3px;
}

/* ── Code ────────────────────────────────────────────────────────── */
.navy pre {
  border: 1px solid var(--sipp-stroke);
  border-radius: var(--sipp-radius);
}

.navy pre > code {
  background: var(--sipp-surface-1) !important;
  border-radius: var(--sipp-radius);
}

.navy :not(pre) > code {
  background: var(--sipp-surface-2);
  border: 1px solid var(--sipp-stroke);
  border-radius: var(--sipp-radius-sm);
  padding: 0.12em 0.4em;
  color: var(--sipp-citrus);
}

/* ── Tables ──────────────────────────────────────────────────────── */
.navy table {
  border: 1px solid var(--sipp-stroke);
  border-radius: var(--sipp-radius);
  overflow: hidden;
}

/* ── Quotes / admonitions ────────────────────────────────────────── */
.navy blockquote {
  border-radius: var(--sipp-radius);
  border-inline-start: 3px solid var(--sipp-pulp);
}

/* ── Search ──────────────────────────────────────────────────────── */
.navy #mdbook-searchbar {
  border-radius: var(--sipp-radius);
  border: 1px solid var(--sipp-stroke);
}

.navy .searchresults-outer {
  border-radius: var(--sipp-radius);
}