@import "tailwindcss";
@import "fumadocs-twoslash/twoslash.css";
/*
 * Brand tokens via relative monorepo path. Turbopack's CSS pipeline does
 * not honour the package `exports` map for CSS imports the way Vite does,
 * so the bare specifier (`@zeno/ui/styles/tokens.css`) breaks `next dev`
 * even with the workspace dep declared. The dashboard works only because
 * it ships under Vite. Resolve the file directly until Turbopack catches
 * up.
 */
@import "../../../../packages/ui/src/styles/tokens.css";
@import "fumadocs-ui/css/neutral.css";
@import "fumadocs-ui/css/preset.css";

/*
 * Brand tokens flow from `packages/ui/src/styles/tokens.css` (the canonical
 * Imperial Terminal palette derived from /DESIGN.md). The Fumadocs UI
 * library reads `--color-fd-*` variables; this layer binds Zeno's brand
 * tokens onto them so every Fumadocs surface inherits the dashboard /
 * landing palette without further work.
 *
 * Dark-only by upstream design. The site never serves the light palette —
 * matches https://zeno-agent.dev. No theme switcher, no flash.
 */

:root,
.dark {
  --color-fd-background: var(--color-canvas);
  --color-fd-foreground: var(--color-text-primary);
  --color-fd-muted: var(--color-panel);
  --color-fd-muted-foreground: var(--color-text-secondary);
  --color-fd-card: var(--color-panel);
  --color-fd-card-foreground: var(--color-text-primary);
  --color-fd-popover: var(--color-panel-2);
  --color-fd-popover-foreground: var(--color-text-primary);
  --color-fd-border: var(--color-border-subtle);
  --color-fd-secondary: var(--color-panel-2);
  --color-fd-secondary-foreground: var(--color-text-primary);
  --color-fd-accent: var(--color-panel-2);
  --color-fd-accent-foreground: var(--color-text-primary);
  /* Primary + ring follow the foreground so Fumadocs' tints never paint
     gold. Imperial gold is reserved for the dashboard's affirmative
     actions and brand mark. */
  --color-fd-primary: var(--color-text-primary);
  --color-fd-primary-foreground: var(--color-text-ink);
  --color-fd-ring: var(--color-text-primary);
}

/* Same neutral fix that was needed before — Fumadocs's neutral.css raises
   `--color-fd-muted-foreground` to a brighter grey inside the sidebars,
   which conflicts with the brand muted token. Re-pin both. */
.dark #nd-sidebar,
.dark #nd-sidebar-mobile {
  --color-fd-muted-foreground: var(--color-text-secondary);
}

/* Active sidebar / TOC items: neutral accent, never gold. */
#nd-sidebar a[data-active='true'],
#nd-sidebar-mobile a[data-active='true'] {
  background-color: var(--color-fd-accent);
  color: var(--color-fd-foreground);
}

#nd-toc a[data-active='true'] {
  color: var(--color-fd-foreground);
  border-color: var(--color-fd-foreground);
}

html {
  scrollbar-gutter: stable;
}

html > body[data-scroll-locked] {
  margin-right: 0px !important;
  --removed-body-scroll-bar-size: 0px !important;
}

/* Callout palette — info / error / success bind to Imperial status tokens.
   Fumadocs Callout resolves accent via `--callout-color: var(--color-fd-${type})`
   inline on the container; no ID specificity gymnastics needed.

   `warn` deliberately untouched: Imperial gold is reserved for affirmative
   actions per /DESIGN.md and the comment at the top of this file. Fumadocs's
   default amber stands for warn (the Callout component aliases warn → warning
   internally, so the lookup is `--color-fd-warning` which we never bind). */
:root,
.dark {
  --color-fd-info: var(--color-status-info);
  --color-fd-success: var(--color-status-active);
  --color-fd-error: var(--color-status-failed);
}

/* Selection mirrors the landing site (gold on dark ink). */
::selection {
  background: var(--color-gold);
  color: var(--color-text-ink);
}
