/* Site chrome for the abuse.ch API documentation site. The design tokens
   (colors, fonts, header palette) come from theme.css, which reuses the same
   class names as the previous hosted site so the look carries over 1:1. */

body {
  margin: 0;
  background: var(--scalar-background-1, #fff);
  color: var(--scalar-color-1, #1b1b1b);
  font-family: var(--scalar-font, 'DM Sans', sans-serif);
}

/* Header — palette comes from the .t-doc__header variables in theme.css. */
.t-doc__header {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--scalar-header-background-1);
  border-bottom: 2px solid var(--scalar-header-border-color);
}

.header-content {
  display: flex;
  align-items: center;
  height: 50px;
  padding: 0 12px;
  gap: 24px;
}

.header-item-logo {
  display: flex;
  align-items: center;
}

.header-item-logo .logo {
  height: 22px;
  display: block;
}

.header-nav {
  display: flex;
  align-items: center;
  gap: 20px;
}

.header-item-link {
  color: var(--scalar-header-color-2);
  text-decoration: none;
  font-size: 14px;
}

.header-item-link.header-item-active {
  color: var(--scalar-header-color-1);
  font-weight: 600;
}

/* Content pages (guide, changelog) */
.page {
  max-width: 760px;
  margin: 0 auto;
  padding: 48px 24px 64px;
  line-height: 1.6;
  font-size: 15px;
}

.page h1 {
  font-size: 28px;
  margin: 0 0 6px;
}

.page .page-subtitle {
  color: var(--scalar-color-2);
  margin: 0 0 32px;
}

.page h2 {
  font-size: 18px;
  margin: 32px 0 8px;
  padding-top: 16px;
  border-top: 1px solid var(--scalar-border-color);
}

.page ul {
  padding-left: 22px;
}

.page li {
  margin: 6px 0;
}

.page a {
  color: var(--scalar-color-accent);
}

.page code {
  font-family: var(--scalar-font-code, monospace);
  font-size: 13px;
  background: var(--scalar-background-2);
  border: 1px solid var(--scalar-border-color);
  border-radius: 3px;
  padding: 1px 4px;
}

/* The API reference page fills the viewport below the header; the Scalar
   component manages its own layout inside. */
.reference {
  min-height: calc(100vh - 52px);
}

/* Hide the site footer on the reference page — the component provides its own
   scroll context and the previous site showed the footer below the fold. */