/* Casap theme for docs.casaphq.com, from the brand guide at
   brands.together.agency/casap: Arizona Flare for headings, Kern for body,
   Aubergine and Blue 01 as the accents, Stone and Black as the neutrals.
   Fonts are self-hosted under assets/fonts once the web license is confirmed;
   until the files exist the fallbacks render. */

@font-face {
  font-family: "Kern";
  src: url("/fonts/KernStandard_Variable.woff2") format("woff2");
  font-weight: 300 700;
  font-display: swap;
}

@font-face {
  font-family: "Arizona Flare";
  src: url("/fonts/ABCArizonaFlareVariable.woff2") format("woff2");
  font-weight: 300 700;
  font-display: swap;
}

@font-face {
  font-family: "Monument Grotesk Mono";
  src: url("/fonts/ABCMonumentGroteskMono_Medium.woff2") format("woff2");
  font-weight: 500;
  font-display: swap;
}

:root {
  --scalar-font: "Kern", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --scalar-font-code: "Monument Grotesk Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  --scalar-radius: 6px;
  --scalar-radius-lg: 10px;
  --scalar-radius-xl: 14px;
}

/* Light: Stone surfaces, Black ink, Aubergine accent, Blue 01 washes. */
.light-mode {
  --scalar-color-1: #130c11;
  --scalar-color-2: #474045;
  --scalar-color-3: #827d81;
  --scalar-color-accent: #1f0315;
  --scalar-background-1: #fcfbfa;
  --scalar-background-2: #f9f7f5;
  --scalar-background-3: #f2efeb;
  --scalar-background-accent: #c1e3f266;
  --scalar-border-color: #e5e0d7;
  --scalar-sidebar-background-1: #fcfbfa;
  --scalar-sidebar-color-1: #130c11;
  --scalar-sidebar-color-2: #474045;
  --scalar-sidebar-color-active: #1f0315;
  --scalar-sidebar-item-active-background: #c1e3f299;
  --scalar-sidebar-item-hover-background: #f2efeb;
  --scalar-sidebar-border-color: #e5e0d7;
  --scalar-sidebar-search-background: #ffffff;
  --scalar-sidebar-search-border-color: #e5e0d7;
  --scalar-color-green: #516631;
  --scalar-color-red: #793f1f;
  --scalar-color-yellow: #664d1b;
  --scalar-color-blue: #4e9dc0;
  --scalar-color-orange: #793f1f;
  --scalar-color-purple: #1f0315;
}

/* Dark: Black surfaces, Stone ink, Blue 01 accent, tertiary tints for status. */
.dark-mode {
  --scalar-color-1: #f9f7f5;
  --scalar-color-2: #dbd4ca;
  --scalar-color-3: #827d81;
  --scalar-color-accent: #c1e3f2;
  --scalar-background-1: #130c11;
  --scalar-background-2: #1f191d;
  --scalar-background-3: #2b2529;
  --scalar-background-accent: #c1e3f21f;
  --scalar-border-color: #383236;
  --scalar-sidebar-background-1: #130c11;
  --scalar-sidebar-color-1: #f9f7f5;
  --scalar-sidebar-color-2: #dbd4ca;
  --scalar-sidebar-color-active: #c1e3f2;
  --scalar-sidebar-item-active-background: #c1e3f226;
  --scalar-sidebar-item-hover-background: #1f191d;
  --scalar-sidebar-border-color: #383236;
  --scalar-sidebar-search-background: #1f191d;
  --scalar-sidebar-search-border-color: #383236;
  --scalar-color-green: #c8d9ad;
  --scalar-color-red: #f2cfc2;
  --scalar-color-yellow: #e5d6b8;
  --scalar-color-blue: #c1e3f2;
  --scalar-color-orange: #f2cfc2;
  --scalar-color-purple: #4e9dc0;
}

/* Display type: page titles only, so the serif stays rare. */
h1 {
  font-family: "Arizona Flare", Georgia, "Times New Roman", serif;
  font-weight: 400;
  letter-spacing: -0.01em;
}

/* Sidebar: the lockup lines up with the item icons rather than the sidebar
   edge, and item labels read at body size. */
.t-doc__sidebar img.logo {
  margin: 16px 0 0 20px;
}

.t-doc__sidebar .font-sidebar {
  font-size: 16px;
  line-height: 1.25;
}

/* Motion: the sidebar's active marker eases rather than snaps. */
@media (prefers-reduced-motion: no-preference) {
  .light-mode a,
  .dark-mode a {
    transition: color 120ms ease;
  }
}